/* =========================================
LOCATIONS
========================================= */
.locations { position: relative; padding: 88px 0 120px 0; background: var(--color-primary); }
.locations__bg { position: absolute; right: 0; bottom: -1px; width: 100%; height: 70px; content: ""; clip-path: polygon(100% 0%, 100% 100%, 0% 100%, 0% 100%); background: var(--color-white); }
.locations .section-title { margin-bottom: 78px; letter-spacing:0; }
.locations__content { display: grid; grid-template-columns: 0.66fr 1.34fr; gap: 100px; align-items: start; }
.locations__card { background: var(--color-white); border-radius: var(--radius-lg); padding: 30px; box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1); }
.locations__badges { display: flex; flex-direction: column; gap: 16px; margin-bottom: 30px; }
.locations__badge { display: flex; align-items: center; gap: 16px; font-weight: 500; color: #040423; font-size: 16px; }
.locations__badge-icon { flex-shrink: 0; width: 50px; height: 50px; border-radius: 50%; background: var(--color-primary); border: 1px solid rgba(0, 0, 0, 0.25); display: flex; align-items: center; justify-content: center; font-size: 21px; line-height: 1; font-weight: 900; }
.locations__badge-icon img { width: auto; height: 21px; }
.locations__finder-title { font-size: 21px; font-weight: 500; color: var(--color-black); margin-bottom: 8px; }
.locations__select { width: 100%; padding: 13px 20px; border-radius: var(--radius-pill); border: 1px solid rgba(0, 0, 0, 0.35); margin-bottom: 16px; background: var(--color-white); color: #212529; appearance: none; background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.5 3.75L6 8.25L10.5 3.75' stroke='%23343A40' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A"); background-repeat: no-repeat; background-position: right 12px center; background-size: 12px; cursor: pointer; }
.locations__view-all { width: 100%; }
.locations__map { width: 100%; }
.locations__map img,
.locations__map svg { width: 100%; height: auto; }

@media (max-width: 1199px) {
	.locations { padding: 60px 0; }
	.locations__content { gap: 40px; }
	.locations__map { max-width: 560px; margin-inline: auto; }
}

@media (max-width: 1023px) {
	.locations__content { grid-template-columns: 1fr; }
	.locations .section-title { margin-bottom: 20px; }
}

@media (max-width: 767px) {
	.locations__bg { display: none; }
	.locations__card { padding: 24px 20px; }
}
