/* CTA split archetype (Aerospace SS3/SS6/SS8, reused by later Industry pages).
 * .cmp-cta-story variant: content left / image right on desktop, image first on mobile. */
/* Headings measure slightly wider in-browser than in Figma; let them use the
 * card's padded width so the design's line breaks hold (SS6 one line, SS8 two). */
.cmp-cta-split .cmp-cta-content > .wp-block-group,
.cmp-cta-split .cmp-cta-content h2 {
	max-width: none;
}

.cmp-cta-story .cmp-cta-content h2 {
	text-wrap: balance;
}

/* Facilities stats variant (SS3, 33527:15826/16133): white keyline + gradient
 * headline via .cmp-stat-num. Width pinned here because the archetype's
 * max-width:none release above would defeat the group's 514px contentSize.
 * The home stylesheet pins .cmp-stat-num to 50px on mobile; this one follows
 * its xx-large preset at every viewport. */
.cmp-facil-stats .cmp-cta-content > .cmp-facil-stat {
	max-width: 514px;
	margin-left: auto;
	margin-right: auto;
	border-left: 1px solid var(--wp--preset--color--theme-01);
	padding-left: 18px;
}

.cmp-facil-stats .cmp-stat-num {
	font-size: var(--wp--preset--font-size--xx-large) !important;
}

/* Mobile artboard 33527:16133: headline is 700/ls-0 (not the desktop 600/-0.03em),
 * keeps its 32px block padding, sits flush against the image (row gap 0), and the
 * section closes at 30px. !important beats the pattern's inline typography style. */
@media (max-width: 781px) {
	/* doubled class beats the archetype's own equal-specificity mobile !importants */
	.cmp-cta-split.cmp-facil-stats {
		padding-bottom: 30px !important;
	}

	.cmp-cta-split.cmp-facil-stats .cmp-cta-row {
		gap: 0 !important;
	}

	.cmp-cta-split.cmp-facil-stats .cmp-cta-content {
		padding: 32px 0 !important;
	}

	.cmp-cta-split.cmp-facil-stats .cmp-stat-num {
		font-weight: 700 !important;
		letter-spacing: 0 !important;
	}
}

@media (min-width: 782px) {
	.cmp-cta-story .cmp-cta-row {
		flex-direction: row-reverse;
	}
}

@media (max-width: 781px) {
	.cmp-cta-split {
		padding-top: 30px !important;
		padding-bottom: 32px !important;
		padding-left: var(--wp--preset--spacing--40) !important;
		padding-right: var(--wp--preset--spacing--40) !important;
	}

	.cmp-cta-split .cmp-cta-row > * {
		flex-basis: 100% !important;
	}

	/* SS3/SS6: content first, image below. The story variant keeps image on top. */
	.cmp-cta-split:not(.cmp-cta-story) .cmp-cta-img {
		order: 2;
	}

	.cmp-cta-split .cmp-cta-content {
		padding: 0 !important;
	}

	.cmp-cta-split .cmp-cta-img img {
		aspect-ratio: 390 / 219 !important;
	}
}

/* QA 2026-09-02 DEC-3: every Figma CTA list (33535:17046, 33527:9656, 33527:13005 ...) is one
 * text node with listSpacing 16 between bullets; core lists stack li at 0. */
.cmp-cta-split .cmp-cta-list li + li {
	margin-top: 16px;
}

/* Certifications 50/50 — external markup round pin 72.
 *
 * The row is vertically centred, so against a tall copy column (eyebrow +
 * four-line heading + paragraph + bullet list) the image floated ~280px below
 * the eyebrow it belongs beside. Allison: "let's align the image with the
 * beginning of the copy." Applied to all five certification sections, not just
 * the aerospace one she pinned, since they share the layout. The block's
 * verticalAlignment lands in a hashed wp-container-* rule, so this two-class
 * selector is what outranks it. */
.cmp-cta-cert .cmp-cta-row,
.cmp-defense-cert .cmp-cta-row,
.cmp-space-cert .cmp-cta-row,
.cmp-semi-cert .cmp-cta-row,
.cmp-amt-cta-cert .cmp-cta-row {
	align-items: flex-start;
}
