/* ==========================================================================
   CTA / Locator Section
   ========================================================================== */

.section-cta {
	position: relative;
	height: clamp(500px, 41.74vw, 692px); /* responsive height */
	background: var(--color-blue-gray);
	overflow: hidden;
}

.section-cta__blue-bg,
.section-cta__white-bg,
.section-cta__laydown {
	position: absolute;
}

.section-cta__blue-bg {
	inset: 0;
	background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 60%), var(--cta-blue-bg-image, url('../images/cta-blue-bg.png'));
	background-size: cover;
	background-position: center;
}

.section-cta__white-bg {
	left: -1px;
	top: 0;
	width: 100%;
	height: 100%;
	background-image: var(--cta-white-bg-image, url('../images/cta-white-bg.png'));
	background-size: cover;
	background-position: center;
}

.section-cta__laydown {
	left: -19.42%; /* -322 / 1658 */
	top: -23.55%; /* -163 / 692 */
	width: 119.6%; /* 1983 / 1658 */
	height: 150.29%; /* 1040 / 692 */
	background-image: var(--cta-laydown-image, url('../images/cta-laydown.png'));
	background-size: contain;
	background-repeat: no-repeat;
	background-position: left center;
}

.section-cta__container {
	position: relative;
	height: 100%;
	z-index: 2;
}

.section-cta__title {
	position: absolute;
	margin: 0;
	font-family: var(--font-heading);
	font-weight: var(--font-weight-bold);
	font-size: clamp(4rem, 8.26vw, 8.5625rem); /* 137px at 1658 */
	line-height: 1;
	text-transform: uppercase;
	white-space: nowrap;
}

.section-cta__title--blue {
	left: 43.91%; /* 728 / 1658 */
	top: 15.9%; /* 110 / 692 */
	color: var(--color-blue-gray);
}

.section-cta__title--dark {
	left: 49.94%; /* 828 / 1658 */
	top: 31.79%; /* 220 / 692 */
	color: var(--color-dark-gray);
}

.section-cta__text {
	position: absolute;
	left: 50.24%; /* 833 / 1658 */
	top: 52.6%; /* 364 / 692 */
	width: 34.98%; /* 580 / 1658 */
	margin: 0;
	font-size: clamp(0.95rem, 1.205vw, 1.25rem); /* 20px */
	line-height: 1.5;
	color: var(--color-dark-gray);
}

.section-cta__links {
	margin: 0;
}

.section-cta__link {
	position: absolute;
	font-family: var(--font-heading);
	font-size: clamp(1.25rem, 1.688vw, 1.75rem); /* 28px */
	font-weight: var(--font-weight-bold);
	line-height: 1.3;
	text-transform: uppercase;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	white-space: nowrap;
	color: var(--color-dark-gray);
}

.section-cta__link:first-child {
	left: 53.86%; /* 893 / 1658 */
	top: 69.65%; /* 482 / 692 */
	transform: translateX(-50%);
}

/* --- Tablet (≤ 1024px) --- */
@media (max-width: 1024px) {
	.section-cta__laydown {
		left: -25%;
		width: 130%;
	}
}

/* --- Mobile (≤ 768px) --- */
@media (max-width: 768px) {
	.section-cta {
		height: 0;
		padding-bottom: 198.67%; /* 745 / 375 */
		min-height: 0;
	}

	/* Hide desktop blue-bg and white-bg (not in Figma mobile) */
	.section-cta__blue-bg,
	.section-cta__white-bg {
		display: none;
	}

	/* Show laydown with mobile image + Figma positioning */
	.section-cta .section-cta__laydown {
		left: -37.75%;
		top: -5.77%;
		width: 158.7%;
		height: 123.22%;
		background-image: var(--cta-mobile-laydown-image, url('../images/cta-laydown-mobile.png'));
		background-size: cover;
		background-position: center;
	}

	.section-cta__container {
		position: absolute;
		inset: 0;
	}

	.section-cta__title {
		font-size: 16.53vw; /* 62 / 375 */
	}

	.section-cta__title--blue {
		left: 16%; /* 60 / 375 */
		top: 6.04%; /* 45 / 745 */
	}

	.section-cta__title--dark {
		left: 37.87%; /* 142 / 375 */
		top: 13.28%; /* 98.94 / 745 */
	}

	.section-cta__text {
		left: 16%; /* 60 / 375 */
		top: 22.68%; /* 169 / 745 */
		width: 66.67%; /* 250 / 375 */
		font-size: 3.73vw; /* 14 / 375 */
	}

	.section-cta__link {
		font-size: 5.22vw; /* 19.583 / 375 */
	}

	.section-cta__link:first-child {
		left: 27.2%; /* 102 / 375 */
		top: 35.03%; /* 261 / 745 */
		transform: translateX(-50%); /* Figma centers text at x=102, aligning left edge with description */
	}
}
