/* LW4 approved differences only. Unchanged source: mock.css.
 * Ad markup/JS contract (B2-N): .lw4-ad (aside), .lw4-ad__tab (button),
 * .lw4-ad__card, .lw4-ad__logo, .lw4-ad__lines (five p), .lw4-ad__link,
 * .lw4-ad__close; .lw4-ad.is-open / .is-dismissed.
 * Progressive enhancement: .lw4-ad.is-ready enables floating UI;
 * .lw4-ad.is-footer-near hides the fixed rail before the footer.
 * Without JS the card stays visible in document flow. */

/* SPEC §2/§3.1: use the existing WP aliases and four approved text tokens. */
body.lw4-page {
	line-height: normal;
	--paper: var(--wp--custom--mock--paper);
	--surface: var(--wp--custom--mock--surface);
	--ink: var(--wp--custom--mock--ink);
	--muted: var(--wp--preset--color--text-muted);
	--deep: var(--wp--custom--mock--deep);
	--lime: var(--wp--custom--mock--lime);
	--line: var(--wp--custom--mock--line);
	--rust: var(--wp--custom--mock--rust);
	--max: var(--wp--custom--mock--max);
	--space: var(--wp--custom--mock--space);
	--serif: var(--wp--custom--mock--serif);
}
/* SPEC §2: the reset anchor must yield to the source button's complete values. */
body.lw4-page .wp-block-button .wp-block-button__link.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 26px;
	padding: 16px 24px;
	min-height: 52px;
	border: 1px solid var(--deep);
	border-radius: 3px;
	background: var(--deep);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	transition: transform 200ms ease, background-color 200ms ease;
}
/* SPEC §2: retain the light and outline variants on core button anchors. */
body.lw4-page .wp-block-button .wp-block-button__link.btn.light {
	color: var(--deep);
	background: var(--lime);
	border-color: var(--lime);
}
/* SPEC §2: retain the light-page outline variant on core button anchors. */
body.lw4-page .wp-block-button .wp-block-button__link.btn.outline {
	color: var(--ink);
	background: transparent;
	border-color: var(--line);
}
/* SPEC §3.1: photo/dark lettering uses explicit specificity, with full selector specificity. */
body.lw4-page .hero-photo .wp-block-button .wp-block-button__link.btn.outline,
body.lw4-page .dark .wp-block-button .wp-block-button__link.btn.outline {
	color: #fff;
	border-color: #ffffff70;
}
/* SPEC §2: restoring .btn also restores the focus ring removed by all:unset. */
body.lw4-page .wp-block-button .wp-block-button__link.btn:focus-visible {
	outline: 3px solid var(--rust);
	outline-offset: 5px;
}
/* SPEC §3: approved persistent card surfaces, with fixed padding on all states. */
.lw4-page .topic,
.lw4-page .home-explore .topic,
.lw4-page .topic:hover,
.lw4-page .home-explore .topic:hover {
	padding: 30px;
	border: 1px solid var(--line);
	background-color: #e9ede1;
	transition: transform 200ms ease, box-shadow 200ms ease, background-color 200ms ease;
}
/* SPEC §3: alternating surface persists independently of hover. */
.lw4-page .topic:nth-child(even) {
	background-color: #e8e2d6;
}
/* SPEC §3: core cards own a single target; taxonomy/save controls stay above it. */
.lw4-page .topic,
.lw4-page .entry-card,
.lw4-page .connected-card,
.lw4-page .rest-link,
.lw4-page .text-post {
	position: relative;
	min-width: 0;
	transition: transform 200ms ease, box-shadow 200ms ease, background-color 200ms ease;
}
/* SPEC §2.1: a single actual heading/topic link stretches over the card. */
.lw4-page .topic .topic-end a::after,
.lw4-page .topic h3 a::after,
.lw4-page .entry-card h3 a::after,
.lw4-page .connected-card h3 a::after,
.lw4-page .rest-link h3 a::after,
.lw4-page .text-post h3 a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}
/* SPEC §2.1: independent controls remain clickable and keyboard reachable. */
.lw4-page .entry-card .card-meta,
.lw4-page .entry-card .save-button,
.lw4-page .entry-card .lw3-save,
.lw4-page .entry-card .wp-block-post-terms {
	position: relative;
	z-index: 2;
}
/* SPEC §2.1/§3: keyboard focus highlights the card without moving it. */
.lw4-page .topic:focus-within,
.lw4-page .entry-card:focus-within,
.lw4-page .connected-card:focus-within,
.lw4-page .rest-link:focus-within,
.lw4-page .text-post:focus-within {
	outline: 3px solid var(--rust);
	outline-offset: 5px;
}
/* SPEC §3: cancel the original unconditional hover on touch devices. */
.lw4-page .entry-card:hover,
.lw4-page .text-post:hover,
.lw4-page .btn:hover,
.lw4-page .btn:hover .arrow,
.lw4-page .text-link:hover .arrow,
.lw4-page .entry-card:hover .arrow,
.lw4-page .topic:hover .arrow,
.lw4-page .entry-card:hover img {
	transform: none;
}
/* SPEC §3: original resting surfaces remain stable on touch hover. */
.lw4-page .entry-card:hover { box-shadow: none; }
/* SPEC §3: connected surface is unchanged until a fine pointer hovers. */
.lw4-page .connected-card:hover { background-color: var(--surface); }
/* SPEC §3: rest surface is unchanged until a fine pointer hovers. */
.lw4-page .rest-link:hover { background-color: #e7e9d9; }
/* SPEC §3: remove photo zoom, retaining the source crop and reserved ratio. */
.lw4-page .card-media img { transition: none; }
/* SPEC §3: button and arrow transitions list only approved properties. */
.lw4-page .btn,
.lw4-page .arrow { transition: transform 200ms ease, background-color 200ms ease; }
/* SPEC §3.1: pale surfaces use the approved four small-text tokens. */
.lw4-page .kicker { color: var(--wp--preset--color--text-eyebrow); }
/* SPEC §3.1: meaningful numbers and labels need enough contrast on card surfaces. */
.lw4-page .topic-index,
.lw4-page .card-meta,
.lw4-page .art-label,
.lw4-page .step .num,
.lw4-page .pillar-icon,
.lw4-page .big-number-row b,
.lw4-page .breadcrumb span { color: var(--wp--preset--color--text-label); }
/* SPEC §3.1: metadata and checked helper text retain readable contrast. */
.lw4-page .card-footer,
.lw4-page .draft-note,
.lw4-page .check-item:has(input:checked) span,
.lw4-page .contact-form .form-status { color: var(--wp--preset--color--text-soft); }
/* SPEC §3.1: large hero emphasis also needs the approved darker token. */
.lw4-page .hero h1 em { color: var(--wp--preset--color--text-eyebrow); }
/* SPEC §3.1: restore photo and dark text after the generic small-text rule. */
.lw4-page .hero-photo h1 em,
.lw4-page .hero-photo .kicker,
.lw4-page .section.dark .kicker,
.lw4-page .wide-story .kicker { color: var(--lime); }
/* SPEC §3.1: explicit photo lead selector wins against generic lead text. */
.lw4-page .hero-photo .lead,
.lw4-page .hero-photo .breadcrumb,
.lw4-page .hero-photo .breadcrumb span { color: #e1e7dc; }
/* SPEC §3.1: wide-story copy stays light on its dark photographic overlay. */
.lw4-page .wide-story p { color: #e0e7dc; }
/* SPEC §3.1: dark surfaces use the source light small-text values. */
.lw4-page .section.dark .lead,
.lw4-page .section.dark .muted { color: #ced9ce; }
/* SPEC §2.1: section .hero-number is not the decorative numeral. */
.lw4-page .hero.hero-number {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	color: var(--ink);
	letter-spacing: normal;
	margin: 0;
}
/* SPEC §2.1: only the mark inherits the intended serif numeral styling. */
.lw4-page .hero-number .hero-number-mark {
	font-family: var(--serif);
	font-size: clamp(180px, 25vw, 340px);
	line-height: .8;
	color: #d8e0cc;
	letter-spacing: -.09em;
	margin: 20px 0 0;
}
/* SPEC §2.2: GSAP owns reveal transforms; CSS transitions must not compete. */
.lw4-page .reveal { transition: none; }
/* SPEC §2/§3.1: preserve real empty/error output from the existing server UI. */
.lw4-page .lw3-query-empty,
.lw4-page .lw-empty,
.lw4-page .lw3-ui-status,
.lw4-page .lw4-image-fallback {
	color: var(--wp--preset--color--text-soft);
	font-size: 14px;
	line-height: 1.8;
}
/* SPEC §2.2: pagination remains a real navigation rather than mock filter state. */
.lw4-page .lw3-pagination,
.lw4-page .lw-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	margin-top: 40px;
}
/* SPEC §2.2: the existing contact shortcode keeps native form controls. */
.lw4-page .contact-form input,
.lw4-page .contact-form select,
.lw4-page .contact-form textarea {
	min-width: 0;
	font-size: 16px;
}
/* SPEC §2.2: reader progress uses transform rather than layout width. */
.lw4-page .reading-bar { width: 100%; transform: scaleX(0); transform-origin: left; }

/* SPEC §7 + amend A1: JS failure defaults to a visible card in document flow. */
.lw4-ad {
	box-sizing: border-box;
	width: min(360px, calc(100% - 40px));
	max-width: 360px;
	margin: 32px auto;
	color: var(--wp--preset--color--text-muted);
	font-size: 14px;
	line-height: 1.6;
	container-type: inline-size;
}
/* SPEC §7: five sentences wrap naturally, without height clamps. */
.lw4-ad__card {
	position: relative;
	padding: 20px;
	border: 1px solid var(--line);
	background: #fffef9;
	max-height: calc(100dvh - 144px);
	overflow-y: auto;
	overflow-wrap: anywhere;
}
/* SPEC §7: the logo is the existing brand asset. */
.lw4-ad__logo {
	max-width: 100%;
	width: auto;
	height: auto;
	color: var(--ink);
	font-weight: 800;
}
/* SPEC §7 + amend A2: keep the five copy lines and destination in one column. */
.lw4-ad__lines { display: grid; gap: 8px; margin: 18px 0; }
/* SPEC §7: strip only WordPress flow spacing from the approved five lines. */
.lw4-ad__lines p { margin: 0; line-height: 1.6; }
/* SPEC §7: visible focus and full-size close target. */
:is(.lw4-ad__close, .lw4-ad .wp-block-button .wp-block-button__link.lw4-ad__close) {
	display: none;
	width: 44px;
	height: 44px;
	margin-left: auto;
	border: 0;
	background: transparent;
	color: var(--ink);
	cursor: pointer;
}
/* SPEC §7: the single destination remains readable and touchable. */
:is(.lw4-ad__link, .lw4-ad .wp-block-button .wp-block-button__link.lw4-ad__link) { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink); text-decoration: underline; }
/* amend A1: the enhanced side tab is absent from inline/failure states. */
:is(.lw4-ad__tab, .lw4-ad .wp-block-button .wp-block-button__link.lw4-ad__tab) { display: none; }
/* SPEC §7: dismissal removes the rail for the rest of this browser tab. */
.lw4-ad.is-dismissed { display: none; }
/* LW5 §6: enhanced cards stay fixed even when the footer guard hides them. */
@media (min-width: 1100px) and (max-width: 1879px) {
	/* amend A1: folded rail fits the 1440px gutter without shrinking the main. */
	.lw4-ad.is-ready {
		position: fixed;
		right: 6px;
		top: 50%;
		transform: translateY(-50%);
		width: 36px;
		margin: 0;
		z-index: 65;
		container-type: normal;
	}
	/* amend A1: logo + vertical two-letter label inside the folded tab. */
	.lw4-ad.is-ready :is(.lw4-ad__tab, .lw4-ad .wp-block-button .wp-block-button__link.lw4-ad__tab) {
		display: flex;
		position: relative;
		writing-mode: vertical-rl;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		gap: 12px;
		width: 36px;
		min-height: 132px;
		padding: 12px 4px;
		border: 1px solid var(--line);
		background: #fffef9;
		color: var(--ink);
	}
	/* amend A1: reuse the existing brand circle/diagonal mark above the vertical label. */
	.lw4-ad.is-ready .lw4-ad__tab::before {
		content: "";
		width: 26px;
		height: 26px;
		flex: none;
		border: 2px solid currentColor;
		border-radius: 50%;
	}
	/* amend A1: the source brand's diagonal stroke sits inside that circle. */
	.lw4-ad.is-ready .lw4-ad__tab::after {
		content: "";
		position: absolute;
		width: 14px;
		height: 2px;
		left: 10px;
		top: calc(50% - 20px);
		background: currentColor;
		transform: rotate(-38deg);
	}
	/* amend A1: close state is hidden from pointer and accessibility tree. */
	.lw4-ad.is-ready .lw4-ad__card { display: none; }
	/* amend A1: only an explicit open action overlays the content. */
	.lw4-ad.is-ready:is(.is-open, .is-measuring) .lw4-ad__card {
		display: block;
		position: absolute;
		right: 44px;
		top: 50%;
		transform: translateY(-50%);
		width: 240px;
		max-height: calc(100dvh - 48px);

	}
	/* amend A1: open-card close control uses the same 44px target. */
	.lw4-ad.is-ready.is-open :is(.lw4-ad__close, .lw4-ad .wp-block-button .wp-block-button__link.lw4-ad__close) { display: block; }
}
/* SPEC §7 + amend A1: large screens can hold a full rail outside the content. */
@media (min-width: 1880px) {
	/* SPEC §7: 200px rail leaves a 16px minimum gap at 1880px. */
	.lw4-ad.is-ready {
		position: fixed;
		width: 200px;
		right: 24px;
		top: 120px;
		margin: 0;
		z-index: 65;
	}
	/* SPEC §7: show dismissal only when enhanced, keeping fallback content intact. */
	.lw4-ad.is-ready :is(.lw4-ad__close, .lw4-ad .wp-block-button .wp-block-button__link.lw4-ad__close) { display: block; }
}
/* amend A1: open-card movement is separate from the stationary tab. */
@keyframes lw4-ad-open {
	from { opacity: 0; translate: 8px 0; }
	to { opacity: 1; translate: 0 0; }
}
/* LW5 §4–7: stable sponsor slots use the existing brand tokens. */
.lw5-ad-placement { container: lw5-ads / inline-size; }
.lw5-ad { color: var(--wp--preset--color--text-muted); font-size: 14px; line-height: 1.6; }
.lw5-ad, .lw5-ad * { box-sizing: border-box; }
.lw5-ad [hidden], .lw5-ad[hidden] { display: none !important; }
.lw5-ad__viewport { display: grid; min-width: 0; }
.lw5-ad__slide { grid-area: 1 / 1; min-width: 0; overflow-wrap: anywhere; }
.lw5-ad__slide[data-lw5-active="false"] { visibility: hidden; pointer-events: none; }
.lw5-ad__slide[data-lw5-active="true"] { visibility: visible; }
.lw5-ad .lw4-ad__logo { display: block; width: 160px; max-width: 100%; height: 64px; object-fit: contain; }
.lw5-ad__logo-box { position: relative; width: 160px; max-width: 100%; height: 64px; }
.lw5-ad__logo-box .lw4-ad__logo { position: absolute; inset: 0; }
.lw5-ad .lw4-ad__logo--failed { visibility: hidden; }
.lw5-ad__logo-fallback { position: absolute; inset: 0; display: flex; align-items: center; width: 160px; max-width: 100%; height: 64px; color: var(--ink); font-weight: 700; overflow-wrap: anywhere; }
.lw5-ad .lw5-ad__title { color: var(--ink); font-size: 18px; font-weight: 700; margin: 16px 0 8px; }
.lw5-ad .lw5-ad__region, .lw5-ad .lw4-ad__label { margin: 8px 0; color: var(--wp--preset--color--text-muted); }
.lw5-ad .lw4-ad__label { display: block; font-weight: 700; }
.lw5-ad__intro { min-width: 0; }
.lw5-ad__intro p { margin: 0; }
.lw5-ad__controls { width: 160px; max-width: 100%; display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; margin-top: 16px; align-items: center; }
.lw5-ad:not(.lw5-ad-ready) .lw5-ad__controls { display: none; }
.lw5-ad__controls button { min-height: 44px; min-width: 44px; padding: 8px; border: 1px solid var(--wp--preset--color--text-muted); background: var(--paper); color: var(--ink); font: inherit; line-height: 1.6; cursor: pointer; }
/* Both labels reserve the longer text width so pause never moves adjacent controls. */
.lw5-ad__pause { flex-basis: 100%; min-height: 64px !important; }
.lw5-ad button, .lw5-ad a { touch-action: manipulation; }
.lw5-ad :is(button, a):focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.lw5-ad__motion-note { display: flex; align-items: center; flex-basis: 100%; min-height: 64px; }
.lw5-ad--banner { max-width: var(--max); margin: 32px 60px; padding: 24px; border: 1px solid var(--line); background: #fffef9; }
.lw5-ad--banner .lw5-ad__bar.wrap { width: 100%; max-width: none; margin: 0; padding: 0; }
.lw5-ad--banner .lw5-ad__slide { display: grid; grid-template-columns: 160px minmax(0, 1fr) auto; gap: 24px; align-items: center; }
.lw5-ad--banner .lw5-ad__title { margin-top: 0; }
.lw5-ad--banner .lw5-ad__slide > * { min-width: 0; }
.lw5-ad--banner .lw5-ad__controls { margin-top: 0; }
@container lw5-ads (min-width: 1200px) {
	.lw5-ad--banner { margin-inline: auto; width: calc(100% - 120px); }
	.lw5-ad--banner .lw5-ad__bar:has(.lw5-ad__controls) { display: grid; grid-template-columns: minmax(0, 1fr) 160px; gap: 24px; align-items: center; }
}
@container lw5-ads (max-width: 1199px) {
	.lw5-ad--banner .lw5-ad__slide { grid-template-columns: 160px minmax(0, 1fr); }
	.lw5-ad--banner .lw5-ad__slide > :last-child { grid-column: 1 / -1; }
	.lw5-ad--banner .lw5-ad__controls { margin-top: 16px; }
}
@container lw5-ads (min-width: 641px) and (max-width: 1199px) {
	/* Shared tracks keep the sibling controls beside every slide's action. */
	.lw5-ad--banner .lw5-ad__bar.wrap { display: grid; grid-template-columns: 160px minmax(0, 1fr) 160px; grid-template-rows: auto auto; gap: 24px; align-items: start; }
	.lw5-ad--banner .lw5-ad__viewport { grid-area: 1 / 1 / 3 / -1; grid-template-columns: subgrid; grid-template-rows: subgrid; }
	.lw5-ad--banner .lw5-ad__slide { grid-area: 1 / 1 / 3 / -1; grid-template-columns: subgrid; grid-template-rows: subgrid; }
	.lw5-ad--banner .lw5-ad__logo-box { grid-area: 1 / 1; }
	.lw5-ad--banner .lw5-ad__text { grid-area: 1 / 2 / 2 / -1; }
	.lw5-ad--banner .lw5-ad__slide > .lw5-ad__action { grid-area: 2 / 1 / 3 / 3; align-self: start; }
	.lw5-ad--banner .lw5-ad__controls { grid-area: 2 / 3; margin-top: 0; }
}
@container lw5-ads (max-width: 640px) {
	.lw5-ad--banner { margin: 24px 20px; padding: 20px; }
	.lw5-ad--banner .lw5-ad__slide { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.lw5-ad--banner .lw5-ad__slide > :last-child { grid-column: auto; }
}
@media (min-width: 1100px) and (max-width: 1879px) {
	.lw4-ad.is-ready.is-pointer-open.is-open .lw4-ad__card { animation: lw4-ad-open 160ms ease-out; }
	.lw4-ad.is-ready.is-measuring .lw4-ad__card { animation: none; visibility: hidden; }
}
@media (prefers-reduced-motion: reduce) {
	.lw5-ad .lw4-ad__card { animation: none !important; }
}
.lw4-ad.is-measuring { visibility: hidden; }
/* SPEC §2: preserve the source wide content width through its WP alias. */
@media (min-width: 1500px) {
	/* SPEC §2: same 1400px source width, without changing non-target pages. */
	body.lw4-page { --max: var(--wp--custom--mock--max-wide); }
}
/* SPEC §3: actual hover changes only compositor movement, shadow and surface. */
@media (hover: hover) and (pointer: fine) {
	/* SPEC §3: topic padding and border width stay unchanged. */
	.lw4-page .topic:hover,
	.lw4-page .home-explore .topic:hover { background-color: #e9ebdf; transform: translateY(-3px); box-shadow: 0 20px 40px #263e350f; }
	/* SPEC §3: entry moves by three pixels, with no image zoom. */
	.lw4-page .entry-card:hover { transform: translateY(-3px); box-shadow: 0 20px 40px #263e350f; }
	/* SPEC §3: connected keeps the approved hover surface. */
	.lw4-page .connected-card:hover { background-color: #e2e7d5; }
	/* SPEC §3: rest keeps the approved hover surface. */
	.lw4-page .rest-link:hover { background-color: #dbe3c8; }
	/* SPEC §3: text card movement is reduced to three pixels. */
	.lw4-page .text-post:hover { transform: translateY(-3px); }
	/* SPEC §3: arrows retain the source four/-three motion only on a fine pointer. */
	.lw4-page .btn:hover .arrow,
	.lw4-page .text-link:hover .arrow,
	.lw4-page .entry-card:hover .arrow,
	.lw4-page .topic:hover .arrow { transform: translate(4px, -3px); }
	/* SPEC §3: original button hover is gated to a fine pointer. */
	.lw4-page .btn:hover { background-color: #385847; transform: translateY(-3px); }
	/* SPEC §3: core button specificity retains that same fine-pointer response. */
	body.lw4-page .wp-block-button .wp-block-button__link.btn:hover { background-color: #385847; transform: translateY(-3px); }
}
/* SPEC §3/§2.1: mobile padding and decorative numeral preserve source sizes. */
@media (max-width: 640px) {
	/* SPEC §3: mobile topic padding stays at 25px even under pointer hover. */
	.lw4-page .topic,
	.lw4-page .home-explore .topic,
	.lw4-page .topic:hover,
	.lw4-page .home-explore .topic:hover { padding: 25px; }
	/* SPEC §2.1: mobile numeral correction is limited to the mark. */
	.lw4-page .hero-number .hero-number-mark { font-size: 200px; margin-top: 5px; }
	/* SPEC §2: core buttons use source mobile hero spacing. */
	body.lw4-page .hero-copy .wp-block-button .wp-block-button__link.btn { gap: 17px; padding-inline: 18px; }
}
/* SPEC §3 + amend A1: reduced motion disables every card/image/arrow movement. */
@media (prefers-reduced-motion: reduce) {
	/* SPEC §3: moving cards and arrows stop while surfaces stay readable. */
	.lw4-page .topic:hover,
	.lw4-page .home-explore .topic:hover,
	.lw4-page .entry-card:hover,
	.lw4-page .text-post:hover,
	.lw4-page .btn:hover,
	.lw4-page .entry-card:hover img,
	.lw4-page .btn:hover .arrow,
	.lw4-page .text-link:hover .arrow,
	.lw4-page .entry-card:hover .arrow,
	.lw4-page .topic:hover .arrow,
	body.lw4-page .wp-block-button .wp-block-button__link.btn:hover {
		transform: none;
		transition: none;
	}
	/* amend A1: reduced motion shows an opened card immediately. */
	.lw4-ad__card { animation: none !important; translate: none; }
}
/* SPEC §7: printed articles omit the auxiliary advertisement. */
@media print {
	/* SPEC §7: advertisement has no role in the printed main content. */
	.lw4-ad { display: none; }
}

/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form {
	display: grid;
	gap: var(--wp--preset--spacing--m);
	max-width: 760px;
	min-width: 0;
}
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form > p { margin: 0; }
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form .lw-field {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: var(--wp--preset--spacing--xs);
	min-width: 0;
}
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form .lw-field__label {
	display: block;
	color: var(--wp--preset--color--text-label);
	font-size: var(--wp--preset--font-size--body);
	font-weight: 700;
}
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form .lw-field__input:not([type="checkbox"]) {
	display: block;
	width: 100%;
	min-width: 0;
	min-height: 3.25em;
	padding: var(--wp--preset--spacing--xs);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--button);
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--text-soft);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--body);
	line-height: 1.5;
}
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form textarea.lw-field__input { resize: vertical; }
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form .lw-field.is-invalid .lw-field__input {
	border-color: var(--wp--preset--color--text-eyebrow);
	border-width: 2px;
}
.lw4-page form.lw-contact-form .lw-field__input:focus-visible,
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form .lw-button:focus-visible {
	outline: 2px solid var(--wp--preset--color--deep);
	outline-offset: 3px;
}
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form .lw-field__error {
	margin: 0;
	padding-inline-start: var(--wp--preset--spacing--xs);
	border-inline-start: 2px solid var(--wp--preset--color--text-eyebrow);
	color: var(--wp--preset--color--text-eyebrow);
	font-size: var(--wp--preset--font-size--ui);
	font-weight: 700;
	line-height: 1.5;
}
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form .lw-field--check .lw-field__label {
	display: inline-flex;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--xs);
}
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form .lw-field--check .lw-field__input[type="checkbox"] {
	flex: none;
	width: 1.25em;
	height: 1.25em;
	margin: 0;
	accent-color: var(--wp--preset--color--deep);
}
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form .lw-button {
	min-height: 3.25em;
	padding: var(--wp--preset--spacing--xs) var(--wp--preset--spacing--m);
	border: 1px solid var(--wp--preset--color--deep);
	border-radius: var(--wp--custom--radius--button);
	background: var(--wp--preset--color--deep);
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--quote);
	font-weight: 700;
}
@media (hover: hover) and (pointer: fine) {
/* SPEC §2/§3: preserve the native form hover only for a fine pointer. */
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page form.lw-contact-form .lw-button:hover { background: var(--wp--preset--color--dark); }
}
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page .lw-form-notice {
	max-width: 760px;
	margin: 0 0 var(--wp--preset--spacing--m);
	padding: var(--wp--preset--spacing--s);
	border-inline-start: 3px solid var(--wp--preset--color--text-eyebrow);
	background: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--text-soft);
	font-size: var(--wp--preset--font-size--body);
	line-height: 1.7;
}
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page .lw-form-notice--success { border-color: var(--wp--preset--color--deep); }
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page .lw-form-notice--error { border-color: var(--wp--preset--color--text-eyebrow); }
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page .lw-form-notice p { margin: 0; }
/* SPEC §2: preserved real contact/error UI from sections/pages.css. */
.lw4-page .lw-form-notice p + p { margin-top: var(--wp--preset--spacing--xs); }

/* SPEC §2/§3.1: preserve taxonomy tap targets while D migrates legacy Query classes. */
.lw4-page .lw3-card__topic > a,
.lw4-page .card-meta > a {
	display: inline-block;
	min-width: 24px;
	min-height: 24px;
	padding: 3px 4px;
}
/* SPEC §2/§8: existing core details remain usable before their .faq class migration. */
.lw4-page .lw3-faq-items summary {
	min-height: 44px;
	padding-block: 10px;
	cursor: pointer;
}
/* SPEC §2.2: retain empty Query explanations rather than inventing article cards. */
.lw4-page .lw3-empty { padding: 34px; background: var(--surface); }
/* SPEC §2.2: leave clear separation between an empty heading and its next action. */
.lw4-page .lw3-empty .lw3-copy { margin-top: 15px; }
/* SPEC §2.2: existing pagination numbers retain their touch targets. */
.lw4-page .lw3-pagination a,
.lw4-page .lw3-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 10px;
	border: 1px solid var(--line);
}
/* SPEC §2.2: existing server pagination indicates the current page with a surface. */
.lw4-page .lw3-pagination .current { background: var(--lime); }

/* amend A1: the two-letter tab label runs vertically beside the content gutter. */
:is(.lw4-ad__tab, .lw4-ad .wp-block-button .wp-block-button__link.lw4-ad__tab) span { writing-mode: vertical-rl; letter-spacing: .12em; }

/* SPEC §2 + ORCH m1620: native hidden/inert state owns navigation and ad visibility. */
.lw4-page .lw-nav [hidden],
.lw4-page nav.lw-nav[hidden],
.lw4-ad[hidden],
.lw4-ad [hidden] { display: none !important; }
/* SPEC §2.2/§4 + ORCH m1620: JS failure exposes all genuine menu destinations. */
html:not(.lw-nav-ready) body.lw4-page .lw-header .header-inner {
	flex-wrap: wrap;
	height: auto;
	min-height: 88px;
}
/* SPEC §2.2/§4 + ORCH m1620: no-script menus participate in document flow. */
html:not(.lw-nav-ready) body.lw4-page .lw-header nav.lw-nav.wp-block-navigation {
	display: flex;
	position: static;
	flex-wrap: wrap;
	width: 100%;
	max-height: none;
	overflow: visible;
}
/* SPEC §2.2/§4 + ORCH m1620: child lists stay visible regardless of core hover state. */
html:not(.lw-nav-ready) body.lw4-page .lw-header nav.lw-nav.wp-block-navigation .wp-block-navigation__submenu-container {
	display: flex;
	position: static;
	visibility: visible;
	opacity: 1;
	transform: none;
	height: auto;
	overflow: visible;
}
/* SPEC §2.2/§4: no-script header expands rather than overlapping following content. */
html:not(.lw-nav-ready) body.lw4-page .lw-header .has-child {
	flex-wrap: wrap;
	align-items: flex-start;
}
/* SPEC §7: enhanced cards expose the native close action in all three layouts. */
.lw4-ad.is-ready :is(.lw4-ad__close, .lw4-ad .wp-block-button .wp-block-button__link.lw4-ad__close) { display: block; }
/* SPEC §2/§7: native control focus stays visible after core/button reset. */
.lw4-ad :is(.lw4-ad__tab, .lw4-ad__close, .lw4-ad__link):focus-visible,
.lw4-ad .wp-block-button .wp-block-button__link:focus-visible {
	outline: 3px solid var(--rust);
	outline-offset: 5px;
}
/* SPEC §2/§4: no-script mobile header retains the approved 74px baseline. */
@media (max-width: 640px) {
	/* SPEC §2/§4: the expanded no-script menu can grow below its mobile header. */
	html:not(.lw-nav-ready) body.lw4-page .lw-header .header-inner { min-height: 74px; }
}
/* SPEC §2/§4 + ORCH m1620: core navigation copies .nav onto its inner ul.
 * The source mobile .nav display:none must hide only the outer menu, not its list. */
.lw4-page .lw-header nav.lw-nav .wp-block-navigation__container { display: flex; }

/* SPEC §2.2 + B2-FIX1 #1: keep the real GET form with source filter-bar spacing. */
.lw4-page .filter-bar .lw3-content-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	width: 100%;
}
/* SPEC §2.2 + B2-FIX1 #1: native labels stay visible beside their controls. */
.lw4-page .filter-bar .lw3-content-filters label {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 12px;
	color: var(--wp--preset--color--text-muted);
}
/* SPEC §2.2 + B2-FIX1 #1: source .search-box input values for the real search. */
.lw4-page .filter-bar .lw3-content-filters input[type="search"] {
	border: 1px solid var(--line);
	background: transparent;
	min-height: 43px;
	width: 260px;
	max-width: 100%;
	padding: 11px 14px;
	border-radius: 3px;
	font-size: 12px;
	color: var(--ink);
}
/* SPEC §2.2 + B2-FIX1 #1: source .filter-btn values for selects and real actions. */
.lw4-page .filter-bar .lw3-content-filters select,
.lw4-page .filter-bar .lw3-content-filters button,
.lw4-page .filter-bar .lw3-content-filters .lw3-filter-reset {
	border: 1px solid var(--line);
	background: transparent;
	border-radius: 99px;
	padding: 11px 18px;
	font-size: 12px;
	min-height: 42px;
	color: var(--ink);
}
/* SPEC §2.2 + B2-FIX1 #1: the reset anchor shares the native action's alignment. */
.lw4-page .filter-bar .lw3-content-filters .lw3-filter-reset {
	display: inline-flex;
	align-items: center;
}
/* SPEC §2.1 + B2-FIX1 #2: remove list defaults from the existing generated TOC. */
.lw4-page .article-aside .lw3-toc ol,
.lw4-page .article-aside .lw3-toc ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
/* SPEC §2.1 + B2-FIX1 #2: source .article-aside a values for native TOC links. */
.lw4-page .article-aside .lw3-toc a {
	display: block;
	font-size: 12px;
	color: var(--wp--preset--color--text-muted);
	padding: 11px 0;
	line-height: 1.6;
}
/* SPEC §2.1 + B2-FIX1 #3: source cover is 490px (300px mobile); image fills it. */
.lw4-page .article-cover figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* SPEC §10 approved photo exception + B2-FIX1 #4: auxiliary hero stays within 240px. */
.lw4-page .hero-editorial .hero-visual,
.lw4-page .hero-editorial .hero-visual figure,
.lw4-page .hero-editorial .hero-visual img {
	min-height: 0;
	max-height: 240px;
}
/* SPEC §10 + B2-FIX1 #4: reserve the auxiliary photo's crop while it loads. */
.lw4-page .hero-editorial .hero-visual img {
	height: 240px;
	object-fit: cover;
}
/* SPEC §2.2 + B2-FIX1 #1: small screens keep GET controls inside their own form. */
@media (max-width: 640px) {
	.lw4-page .filter-bar .lw3-content-filters label {
		flex-wrap: wrap;
		max-width: 100%;
	}
	.lw4-page .filter-bar .lw3-content-filters input[type="search"] {
		width: 100%;
	}
}

/* SPEC §3.1 + B2-FIX1 photo regression: 360px hero kicker measured 4.48:1.
 * Inherit the source hero's white lettering over the restored photograph. */
.lw4-page .home-hero.hero-photo .kicker { color: inherit; }

/* SPEC §3.1 + B2-FIX1 TOC regression: WP's white button text measured 1.09:1
 * on the source aside's light save-button surface; reuse the approved text token. */
.lw4-page .article-aside .lw3-save-button.save-button {
	color: var(--wp--preset--color--text-soft);
}
/* SPEC §3.1 + ORCH B2-FIX1 correction: pressed lime uses the source ink token. */
.lw4-page .article-aside .lw3-save-button.save-button[aria-pressed="true"] {
	color: var(--ink);
}

/* SPEC §6 + B2-FIX2: the added photograph occupies the existing banner, not flow. */
.lw4-page .text-banner > figure.cover-image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	z-index: 0;
}
/* SPEC §6: core/image's figure and its image share the original cover crop. */
.lw4-page .text-banner > figure.cover-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* SPEC §6: retain the original #263e35 dark surface almost opaquely over photos.
 * Only banners with the added cover receive the overlay; text keeps its source position. */
.lw4-page .text-banner:has(> figure.cover-image)::before {
	content: '';
	position: absolute;
	inset: 0;
	background: rgb(38 62 53 / 92%);
	z-index: 1;
	pointer-events: none;
}
/* SPEC §6: the existing wrap and decorative stamp sit above the photographic overlay. */
.lw4-page .text-banner:has(> figure.cover-image) .wrap,
.lw4-page .text-banner:has(> figure.cover-image) .stamp {
	z-index: 2;
}
/* SPEC §3.1 + ORCH B2-FIX2 correction: the restored wide-story photo measured
 * 4.07:1 beneath its 11px lime kicker; inherit the source's white lettering. */
.lw4-page .wide-story .kicker { color: inherit; }
/* ORCH B2-FIX2 §5: keep the source photograph visible on the right while
 * the desktop text area stays on the dark side of the gradient. */
.lw4-page .wide-story::before {
	background: linear-gradient(90deg, #18382ef2 0%, #18382ee6 65%, #18382e54 100%);
}
.lw4-page .hero-photo::after {
	background: linear-gradient(90deg, #18362ef2 0%, #18362ee6 65%, #1b3a3133 100%);
}
@media screen and (max-width: 900px) {
	/* Narrow layouts place the text across the whole photograph. */
	.lw4-page .wide-story::before,
	.lw4-page .hero-photo::after {
		background: #18382ee6;
	}
}

/* DR-2: core table borders must yield to the mock's horizontal comparison rules. */
.lw4-page figure.wp-block-table.comparison,
.lw4-page figure.wp-block-table.comparison table,
.lw4-page figure.wp-block-table.comparison thead,
.lw4-page figure.wp-block-table.comparison tfoot {
	border: 0;
}
.lw4-page figure.wp-block-table.comparison th,
.lw4-page figure.wp-block-table.comparison td {
	border: 0;
	border-bottom: 1px solid var(--line);
}
/* LW5 §11: one viewport-selected place; both candidates reserve one grid row. */
.lw5-ad-narrow-controls[hidden] { display: none !important; }
.lw5-ad-narrow-controls { color: var(--wp--preset--color--text-muted); font-size: 14px; line-height: 1.6; }
.lw5-ad-narrow-controls button { min-height: 44px; min-width: 44px; padding: 8px; border: 1px solid var(--wp--preset--color--text-muted); background: var(--paper); color: var(--ink); font: inherit; line-height: 1.6; cursor: pointer; touch-action: manipulation; }
.lw5-ad-narrow-controls :is(button, a):focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.lw5-ad-narrow-controls [hidden] { display: none !important; }
@media (width < 1100px) {
	.lw5-ad-placement:not(:has(.lw5-ad)) { display: none; }
	/* Fallback reserves only the first server card; enhancement measures every slide. */
	.lw5-ad-placement:not(.lw5-ad-narrow-ready):has([data-lw5-slot="banner"]) > [data-lw5-slot="side"] { display: none; }
	.lw5-ad-placement:not(.lw5-ad-narrow-ready) .lw5-ad__slide[data-lw5-active="false"] { display: none; }
	.lw5-ad-placement { display: grid; grid-template-columns: minmax(0, 1fr); padding: 24px 20px; }
	.lw5-ad-placement > .lw5-ad { grid-area: 1 / 1; margin: 0; width: 100%; max-width: none; min-height: 0; align-self: stretch; }
	.lw5-ad-placement > .lw4-ad { display: grid; container-type: normal; }
	.lw5-ad-placement .lw4-ad__card { height: auto; min-height: 0; max-height: none; padding: 24px; overflow: visible; }
	.lw5-ad-placement .lw5-ad--banner { padding: 24px; }
	.lw5-ad-placement .lw5-ad__bar.wrap { display: block; }
	.lw5-ad-placement .lw5-ad__viewport { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; align-content: start; }
	.lw5-ad-placement .lw5-ad__slide { display: grid; grid-area: 1 / 1; grid-template-columns: 160px minmax(0, 1fr); grid-template-rows: auto auto; gap: 24px; align-items: start; align-self: start; }
	.lw5-ad-placement .lw5-ad__logo-box { grid-area: 1 / 1; }
	.lw5-ad-placement .lw5-ad__text { grid-area: 1 / 2; }
	.lw5-ad-placement .lw5-ad__title { margin-top: 0; }
	.lw5-ad-placement .lw4-ad__lines { margin: 0; gap: 0; }
	.lw5-ad-placement .lw5-ad__action { grid-area: 2 / 1 / 3 / -1; display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
	.lw5-ad-placement .lw4-ad__label { margin: 0; }
	.lw5-ad-placement > .lw5-ad-narrow-controls { grid-area: 2 / 1; width: 100%; max-width: none; margin: 8px 0 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: start; justify-content: flex-start; }
	.lw5-ad-narrow-controls > button { flex: 0 0 auto; min-height: 44px; white-space: nowrap; }
	/* Both pause labels and the reduced-motion note reserve the same strip footprint. */
	.lw5-ad-narrow-controls > :is(.lw5-ad__pause, .lw5-ad__motion-note) { flex: 0 0 auto; width: 10.5em; min-height: 44px !important; }
	.lw5-ad-narrow-controls > .lw5-ad__motion-note { display: flex; align-items: center; }
	.lw5-ad-placement .lw5-ad :is(.lw5-ad__controls, .lw4-ad__tab, .lw4-ad__close) { display: none !important; }
	/* Descendant visibility must not override the root's hidden state. */
	.lw5-ad-placement.lw5-ad-narrow-ready > .lw5-ad-narrow-hidden,
	.lw5-ad-placement.lw5-ad-narrow-ready > .lw5-ad-narrow-hidden * { visibility: hidden !important; pointer-events: none; }
	@container lw5-ads (max-width: 640px) {
		.lw5-ad-placement .lw5-ad--banner, .lw5-ad-placement .lw4-ad__card { padding: 20px; }
		.lw5-ad-placement .lw5-ad__slide { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto; gap: 16px; }
		.lw5-ad-placement .lw5-ad__text { grid-area: 2 / 1; }
		.lw5-ad-placement .lw5-ad__action { grid-area: 3 / 1; }
	}
}