/* ==========================================================================
   Shared: CTA band — template-parts/sections/cta-band.php
   Figma: Services/Coverage "CTA band", About/Service "CTA", Home "Dark Callout Banner" 519:31971
   ========================================================================== */
.cta-section { padding-bottom: 96px; }

.cta-band {
	position: relative; overflow: hidden; isolation: isolate;
	display: flex; align-items: center; justify-content: space-between; gap: 32px;
	padding: 48px 56px;
	border-radius: 12px;
	background: var(--c-blue); color: #fff;
}
.cta-band__bg {
	position: absolute; z-index: -1; top: 50%; left: calc(50% + 32.5px);
	width: 1503px; max-width: none; height: 426px;
	transform: translate(-50%, calc(-50% - 7px));
	object-fit: cover; object-position: bottom; opacity: .07; pointer-events: none;
}
.cta-band__copy { display: flex; flex-direction: column; gap: 10px; max-width: 620px; min-width: 0; }
.cta-band__title { font-weight: 300; font-size: 32px; line-height: 38px; color: #fff; }
.cta-band__text { font-family: var(--ff-text); font-weight: 400; font-size: 16px; line-height: 24px; color: #ccdbe0; }
.cta-band__btns { flex: none; gap: 12px; }

/* Inline variant (Home callout) */
.cta-band--inline { gap: 16px; padding: 40px; border-radius: 4px; }
.cta-band__line { max-width: 760px; font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: -.35px; color: var(--c-on-dark); }
.cta-band__line strong { font-weight: 500; color: #fff; }
.cta-band--inline .cta-band__btns .btn { min-height: 48px; padding-block: 13px; }

/* ---------- Tablet ---------- */
@media (max-width: 1199px) {
	.cta-section { padding-bottom: 72px; }
	.cta-band--stacked { flex-direction: column; align-items: flex-start; gap: 28px; padding: 48px 32px; }
	.cta-band--stacked .cta-band__copy { max-width: 624px; }
	.cta-band__title { font-size: 29px; line-height: 34px; }
	.cta-band--inline .cta-band__line { max-width: 400px; }
	.cta-band__bg { width: 2067px; height: 586px; }
}

/* ---------- Mobile ---------- */
@media (max-width: 767px) {
	.cta-section { padding-bottom: 56px; }
	.cta-band--stacked { gap: 20px; padding: 36px 20px; }
	.cta-band__title { font-size: 24px; line-height: 29px; }
	.cta-band--inline { flex-direction: column; align-items: stretch; gap: 20px; padding: 30px clamp(20px, 10.5vw, 40px); }
	.cta-band__btns { flex-direction: column; gap: 16px; width: 100%; }
	.cta-band__btns .btn { width: 100%; padding-inline: 22px; }
}