/* ═══════════════════════════════════════════════════════════════════════════
   AOS COMPONENT LIBRARY
   Ported from mockups/components-restore.css + mockup inline <style> blocks.
   Covers: accordion (.aos-acc), tabs (.aos-tabs), stepper (.aos-steps),
   timeline (.aos-timeline), pullquote (.aos-pullquote), table (.aos-table),
   contact card (.c-contact), empty state (.aos-empty), progress bar.
   Component-specific styles for .hero, .c-program, .c-callout, .c-stat etc.
   live alongside their pattern files under patterns/.

   HSL tokens are authored as space-separated triplets to enable
   `hsl(var(--aos-navy) / 0.5)` opacity composition — same convention
   as the mockups.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ── Token shim ─────────────────────────────────────────────────────────
   Mockup CSS references raw CSS variables (--aos-navy, --display, etc).
   We mirror them here so the ported component styles work unchanged.
   Kept in sync with theme.json's palette + fontFamilies presets. */
:root {
	/* ── Agency OS design tokens — Minimal Premium (brand teal + charcoal) ──
	   Single front-end source of truth. HSL triplets enable hsl(var(--token)/a).
	   design-language.php mirrors these at wp_head priority 999. No hardcoded
	   color lives outside this block. No purple. */

	/* Ink — charcoal (220 13% 13%) */
	--aos-navy:        220 13% 13%;
	--aos-navy-deep:   220 14% 9%;
	--aos-navy-soft:   220 10% 24%;

	/* Accent — Agency OS teal (#2E9E9E). --aos-blue = AA-safe interactive teal
	   for text/links; --aos-yellow = brand teal for fills / on-dark accents. */
	--aos-blue:        174 60% 30%;
	--aos-blue-deep:   174 62% 24%;
	--aos-yellow:      174 55% 40%;
	--aos-yellow-soft: 174 45% 94%;
	--aos-yellow-deep: 174 60% 30%;
	--aos-mist:        220 12% 82%;
	--aos-rose:        220 9% 42%;
	--aos-rose-soft:   220 20% 96%;

	/* Surface */
	--bg:            0 0% 98%;
	--bg-alt:        210 20% 96%;
	--bg-card:       0 0% 100%;
	--paper:         0 0% 100%;
	--white:         0 0% 100%;

	/* Text */
	--fg:            220 13% 13%;
	--fg-muted:      220 9% 32%;
	--fg-subtle:     220 8% 43%;

	/* Border */
	--border:        220 9% 90%;
	--border-soft:   220 14% 95%;
	--border-strong: 220 9% 82%;
	--border-focus:  174 55% 40%;

	/* Font family aliases — Instrument Sans (brand), Cormorant for editorial emphasis */
	--display:   "Instrument Sans", -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", Arial, sans-serif;
	--body:      "Instrument Sans", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
	--editorial: "Cormorant Garamond", "New York", Georgia, "Times New Roman", serif;
	--mono:      "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

	/* Layout — fluid container with ceiling.
	   `min(100%, 1680px)` means the container is the full width of its
	   parent up to 1680px, then caps. NO lower bound — small viewports
	   stay fully responsive, no horizontal overflow. The actual frontend
	   value is emitted at wp_head priority 999 by design-language.php and
	   is admin-tunable via the `container_max` design token (default 1680);
	   this declaration is a fallback for any context where design tokens
	   don't load (editor canvas, pre-render previews, etc.). */
	--container: min(100%, 1680px);
	--gutter:    clamp(1.25rem, 4vw, 4rem);
	--section:   clamp(4rem, 6vw, 6rem);

	/* Radius */
	--r-sm:  6px;
	--r:     12px;
	--r-lg:  20px;
	--r-xl:  28px;
	--r-2xl: 40px;

	/* Shadows (navy-tinted) */
	--shadow-xs: 0 1px 2px hsl(var(--fg) / 0.04);
	--shadow-sm: 0 1px 3px hsl(var(--fg) / 0.05), 0 1px 2px hsl(var(--fg) / 0.03);
	--shadow-md: 0 4px 16px hsl(var(--fg) / 0.06), 0 2px 6px hsl(var(--fg) / 0.04);
	--shadow-lg: 0 20px 48px hsl(var(--fg) / 0.10), 0 8px 20px hsl(var(--fg) / 0.06);
	--shadow-xl: 0 40px 96px hsl(var(--fg) / 0.14), 0 16px 32px hsl(var(--fg) / 0.08);

	/* Motion */
	--ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
	--ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

	/* ── Semantic tokens ───────────────────────────────────────────────
	   Status / callout colours used across admissions and BSN. Folded
	   here as the single canonical declaration so family CSS doesn't
	   need to redeclare them. */
	--ok:          152 58% 34%;
	--ok-soft:     152 58% 94%;
	--warn:        38 90% 46%;
	--warn-soft:   38 90% 94%;
	--danger:      4 70% 48%;
	--danger-soft: 4 70% 95%;

	/* ── Hero pullquote panel accent (warm cream tint) ────────────────
	   Used by patterns/home-pullquote and friends. Folded here for
	   parity; family files no longer redeclare. */
	--panel-ink:   220 13% 13%;
	--panel-rule:  174 55% 40%;
}


/* ── Body / headings base tuning (matches mockup character) ────────────── */
body {
	background: hsl(var(--bg));
	font-feature-settings: "ss01", "cv11";
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
	font-variation-settings: "opsz" 60;
}

/* ── Confident display weight ───────────────────────────────────────────
   Only 400/500/600/700 of Instrument Sans are self-hosted, so the old
   350/400 heading weights rendered as thin regular — weak for large
   display type. Unify hero + section headings to a confident 500. */
.aos-hp h1, .aos-hp h2,
.has-hero-font-size, .has-h1-font-size, .has-h2-font-size {
	font-weight: 500;
}

::selection {
	background: hsl(var(--aos-yellow) / 0.45);
	color: hsl(var(--aos-navy));
}


/* ─────────────────────────────────────────────────────────────────────────
 * Design tokens — modular scale, fluid clamps, 8pt rhythm.
 *
 * Type scale: ratio 1.250 (major third) anchored at 16px body.
 *   The clamp ranges provide fluid sizing between 360px and 1440px viewports.
 *
 * Spacing scale: 8pt grid (4/8/12/16/24/32/48/64/96/128/160/192). Aliased
 *   here as semantic tokens (--space-section, --space-block, --space-card)
 *   so component CSS reads like prose, not arithmetic.
 *
 * Why these live in :root, not theme.json: theme.json presets are exposed
 *   as --wp--preset--* (long names, only available where Gutenberg layout
 *   utilities apply). Our own --t-* / --space-* tokens are short, available
 *   everywhere, and easy to override per surface.
 * ───────────────────────────────────────────────────────────────────────── */

:root {
	/* Type scale — fluid clamp(min, fluid, max) across 360→1440 viewports */
	--t-caption:  0.75rem;                        /* 12px  fixed */
	--t-small:    0.875rem;                       /* 14px  fixed */
	--t-body:     1rem;                           /* 16px  fixed */
	--t-lede:     clamp(1.0625rem, 0.85vw + 0.85rem, 1.1875rem);  /* 17–19 */
	--t-h6:       clamp(1rem,      0.5vw  + 0.9rem,  1.125rem);   /* 16–18 */
	--t-h5:       clamp(1.125rem,  0.5vw  + 1rem,    1.25rem);    /* 18–20 */
	--t-h4:       clamp(1.25rem,   0.6vw  + 1.1rem,  1.5rem);     /* 20–24 */
	--t-h3:       clamp(1.5rem,    1vw    + 1.25rem, 1.875rem);   /* 24–30 */
	--t-h2:       clamp(2rem,      1.6vw  + 1.5rem,  2.75rem);    /* 32–44 */
	--t-h1:       clamp(2.5rem,    2.4vw  + 1.8rem,  3.75rem);    /* 40–60 */
	--t-display:  clamp(3rem,      3.5vw  + 2rem,    5rem);       /* 48–80 */

	/* Line heights — calibrated to type role, not size */
	--lh-display: 1.05;  /* h1, hero, display */
	--lh-heading: 1.15;  /* h2, h3 */
	--lh-body:    1.6;   /* paragraph, lede */
	--lh-tight:   1.3;   /* small text in dense UI */

	/* Spacing rhythm — semantic aliases on the 8pt grid */
	--space-1:  4px;
	--space-2:  8px;
	--space-3:  12px;
	--space-4:  16px;
	--space-5:  24px;
	--space-6:  32px;
	--space-7:  48px;
	--space-8:  64px;
	--space-9:  96px;
	--space-10: 128px;

	/* Vertical rhythm inside a section: eyebrow → title → lede → content */
	--rhythm-eyebrow-to-title: var(--space-4);   /* 16 */
	--rhythm-title-to-lede:    var(--space-3);   /* 12 */
	--rhythm-lede-to-content:  var(--space-7);   /* 48 */
	--rhythm-block-gap:        var(--space-6);   /* 32 */

	/* Section padding (py) — fluid, but capped tighter than the old 141px */
	--section-py:    clamp(4rem, 6vw, 6rem);    /* 64–96 */
	--section-py-lg: clamp(5rem, 8vw, 8rem);    /* 80–128 — for hero callouts */
	--section-px:    clamp(1.25rem, 4vw, 4rem);

	/* Container max-widths */
	--container:     min(100% - 2.5rem, 1280px);
	--container-narrow: min(100% - 2.5rem, 880px);
	--container-wide:   min(100% - 2.5rem, 1480px);

	/* Card primitives — single source of truth for radius / padding / shadow */
	--card-radius:    14px;
	--card-radius-sm: 10px;
	--card-radius-lg: 18px;
	--card-padding:   var(--space-6);             /* 32 */
	--card-padding-sm: var(--space-5);            /* 24 */
	--card-padding-lg: var(--space-7);            /* 48 */
	--card-border:    1px solid hsl(var(--aos-border));
	--card-shadow:    0 1px 2px hsl(var(--aos-fg) / 0.04),
	                  0 6px 18px hsl(var(--aos-fg) / 0.05);
	--card-shadow-lg: 0 2px 6px hsl(var(--aos-fg) / 0.05),
	                  0 18px 48px hsl(var(--aos-fg) / 0.08);
}


/* ─────────────────────────────────────────────────────────────────────────
 * Heading typography — applied site-wide. Family CSS may override SIZE
 * inside specific heroes (e.g. .adm-hero h1 wants 60px) but should NOT
 * redeclare font-family or line-height — those are global.
 * ───────────────────────────────────────────────────────────────────────── */

main h1,
main .h1 { font-family: var(--display); font-size: var(--t-h1); line-height: var(--lh-display); letter-spacing: -0.022em; font-weight: 350; }
main h2,
main .h2 { font-family: var(--display); font-size: var(--t-h2); line-height: var(--lh-heading); letter-spacing: -0.018em; font-weight: 350; }
main h3,
main .h3 { font-family: var(--display); font-size: var(--t-h3); line-height: var(--lh-heading); letter-spacing: -0.014em; font-weight: 400; }
main h4,
main .h4 { font-family: var(--display); font-size: var(--t-h4); line-height: var(--lh-heading); letter-spacing: -0.01em;  font-weight: 500; }
main h5,
main .h5 { font-family: var(--body);    font-size: var(--t-h5); line-height: var(--lh-heading); letter-spacing: -0.005em; font-weight: 600; }
main h6,
main .h6 { font-family: var(--body);    font-size: var(--t-h6); line-height: var(--lh-heading); font-weight: 600; }


/* ─────────────────────────────────────────────────────────────────────────
 * Section anatomy — every body section uses .sec for outer frame and
 * .sec__head for the eyebrow + title + lede block. Vertical rhythm
 * is canonical: eyebrow → title 16px, title → lede 12px, lede → content 48px.
 * ───────────────────────────────────────────────────────────────────────── */

.sec {
	padding-block: var(--section-py);
}
.sec--lg { padding-block: var(--section-py-lg); }
.sec--tight { padding-block: clamp(2.5rem, 4vw, 4rem); }

.sec__inner {
	max-width: var(--container);
	margin-inline: auto;
	padding-inline: var(--section-px);
}
.sec__inner--narrow { max-width: var(--container-narrow); }
.sec__inner--wide   { max-width: var(--container-wide); }

.sec__head {
	display: flex;
	flex-direction: column;
	gap: 0;
	margin-bottom: var(--rhythm-lede-to-content);
	max-width: 64ch;
}
.sec__head--center { align-items: center; text-align: center; margin-inline: auto; }

/* eyebrow already styled by canonical rule; we only add inner-rhythm spacing */
.sec__head > .eyebrow + h1,
.sec__head > .eyebrow + h2,
.sec__head > .eyebrow + h3,
.sec__head > .aos-eyebrow + h1,
.sec__head > .aos-eyebrow + h2,
.sec__head > .aos-eyebrow + h3 {
	margin-top: var(--rhythm-eyebrow-to-title);
}
.sec__head > h1 + .lead, .sec__head > h2 + .lead, .sec__head > h3 + .lead,
.sec__head > h1 + .aos-lead, .sec__head > h2 + .aos-lead, .sec__head > h3 + .aos-lead,
.sec__head > h1 + p, .sec__head > h2 + p, .sec__head > h3 + p {
	margin-top: var(--rhythm-title-to-lede);
}



/* ─────────────────────────────────────────────────────────────────────────
 * Eyebrow — canonical site-wide pattern. Two surface variants:
 *
 *   Style A (on light) — sections on cream/paper.
 *     12px Instrument Sans, weight 600, 0.16em, blue, 24px yellow-deep tick.
 *
 *   Style B (on dark)  — navy heroes, navy callouts, dark bands.
 *     11px JetBrains Mono, weight 600, 0.18em, yellow, 28px yellow tick.
 *
 * Every BEM eyebrow modifier in the theme resolves to one of these two.
 * Selectors are scoped enough (e.g. `.c-callout--navy .c-callout__meta`)
 * to beat overly-greedy descendant rules like `.c-callout p` (0,1,1).
 * Do NOT add per-component eyebrow rules in family CSS — extend this list
 * instead.
 * ───────────────────────────────────────────────────────────────────────── */

:root {
	--eyebrow-font-light:    var(--body);
	--eyebrow-font-dark:     var(--mono);
	--eyebrow-size-light:    10px;
	--eyebrow-size-dark:     10px;
	--eyebrow-weight:        600;
	--eyebrow-tracking:      0.18em;
	--eyebrow-tracking-dark: 0.2em;
	--eyebrow-tick-light:    22px;
	--eyebrow-tick-dark:     26px;
	--eyebrow-color-light:   var(--aos-blue);
	--eyebrow-color-dark:    var(--aos-yellow);
	--eyebrow-tick-light-bg: var(--aos-yellow-deep);
	--eyebrow-tick-dark-bg:  var(--aos-yellow);
}

/* ── Style A (on light) ──────────────────────────────────────────────── */
.aos-eyebrow,
.eyebrow,
.hero__eyebrow,
.aos-hero__eyebrow,
.cost-card__eyebrow,
.tool-panel__kicker,
.tool-panel__meta,
.event-logistics__kicker,
.page-ai__eyebrow,
.page-ai__section-eyebrow,
.aos-news__signup-eyebrow,
.aos-byline__eyebrow,
.foot__campus-eyebrow,
.alert__eyebrow,
.cal-item__meta,
.c-event__meta,
.aos-acc__meta,
.aos-post__meta {
	font-family: var(--eyebrow-font-light);
	font-size: var(--eyebrow-size-light);
	font-weight: var(--eyebrow-weight);
	letter-spacing: var(--eyebrow-tracking);
	text-transform: uppercase;
	color: hsl(var(--eyebrow-color-light));
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
}

.aos-eyebrow::before,
.eyebrow::before,
.hero__eyebrow::before,
.aos-hero__eyebrow::before,
.cost-card__eyebrow::before,
.tool-panel__kicker::before,
.tool-panel__meta::before,
.event-logistics__kicker::before,
.page-ai__eyebrow::before,
.page-ai__section-eyebrow::before,
.aos-news__signup-eyebrow::before,
.aos-byline__eyebrow::before,
.foot__campus-eyebrow::before {
	content: "";
	width: var(--eyebrow-tick-light);
	height: 1px;
	background: hsl(var(--eyebrow-tick-light-bg));
	flex-shrink: 0;
}

/* ── Style B (on dark) ───────────────────────────────────────────────── */
.adm-hero__eyebrow,
.event-hero__eyebrow,
.aos-callout__eyebrow,
.c-callout--navy .c-callout__meta {
	font-family: var(--eyebrow-font-dark);
	font-size: var(--eyebrow-size-dark);
	font-weight: var(--eyebrow-weight);
	letter-spacing: var(--eyebrow-tracking-dark);
	text-transform: uppercase;
	color: hsl(var(--eyebrow-color-dark));
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
}

.adm-hero__eyebrow::before,
.event-hero__eyebrow::before,
.aos-callout__eyebrow::before,
.c-callout--navy .c-callout__meta::before {
	content: "";
	width: var(--eyebrow-tick-dark);
	height: 1px;
	background: hsl(var(--eyebrow-tick-dark-bg));
	flex-shrink: 0;
}


/* ── Lead paragraph ────────────────────────────────────────────────────── */
.aos-lead {
	font-size: clamp(17px, 1.15vw, 19px);
	line-height: 1.55;
	color: hsl(var(--fg-muted));
	max-width: 60ch;
}


/* ══════════════════════════════════════════════════════════════════════════
   Accordion (.aos-acc)
   ══════════════════════════════════════════════════════════════════════════ */
.aos-acc { display: flex; flex-direction: column; }
.aos-acc details {
	border-top: 1px solid hsl(var(--border));
	padding: var(--space-5) var(--space-1);     /* 24 4 */
	transition: background 200ms var(--ease-out);
}
.aos-acc details:last-child { border-bottom: 1px solid hsl(var(--border)); }
.aos-acc summary {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: var(--space-5);                         /* 24 */
	align-items: center;
	cursor: pointer;
	list-style: none;
	font-family: var(--display);
	font-size: var(--t-h5);                      /* 18-20 */
	font-weight: 400;
	line-height: var(--lh-heading);
	color: hsl(var(--aos-navy));
	letter-spacing: -0.012em;
}
.aos-acc summary::-webkit-details-marker { display: none; }
.aos-acc summary:focus { outline: none; }
.aos-acc summary:focus-visible { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: 2px; }
.aos-acc__chev {
	width: 34px; height: 34px;
	flex: 0 0 34px;
	border-radius: 50%;
	display: grid; place-items: center;
	border: 1px solid hsl(var(--border-strong));
	transition: transform 280ms var(--ease-out), background 200ms var(--ease-out), border-color 200ms var(--ease-out);
}
.aos-acc__chev svg { width: 11px; height: 11px; display: block; }
.aos-acc details[open] .aos-acc__chev {
	transform: rotate(180deg);
	background: hsl(var(--aos-yellow));
	border-color: hsl(var(--aos-yellow-deep));
}
.aos-acc details > p,
.aos-acc details > div:not(.aos-acc__panel) {
	padding-top: var(--space-3);                 /* 12 */
	font-family: var(--body);
	font-size: var(--t-body);                    /* 16 */
	line-height: var(--lh-body);
	color: hsl(var(--fg-muted));
	max-width: 62ch;
}


/* ══════════════════════════════════════════════════════════════════════════
   Tabs (.aos-tabs)
   ══════════════════════════════════════════════════════════════════════════ */
.aos-tabs {
	display: inline-flex;
	gap: 0;
	border-bottom: 1px solid hsl(var(--border));
	padding: 0 0 2px;
}
.aos-tabs button {
	padding: 14px 22px 16px;
	font-family: var(--body);
	font-size: 14px;
	font-weight: 500;
	color: hsl(var(--fg-muted));
	position: relative;
	background: none;
	border: 0;
	cursor: pointer;
	transition: color 200ms var(--ease-out);
}
.aos-tabs button::after {
	content: "";
	position: absolute;
	bottom: -1px; left: 12px; right: 12px;
	height: 2px;
	background: hsl(var(--aos-yellow-deep));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 280ms var(--ease-out);
}
.aos-tabs button:hover { color: hsl(var(--aos-navy)); }
.aos-tabs button.is-active { color: hsl(var(--aos-navy)); font-weight: 600; }
.aos-tabs button.is-active::after { transform: scaleX(1); }


/* ══════════════════════════════════════════════════════════════════════════
   Stepper (.aos-steps / .aos-step)
   ══════════════════════════════════════════════════════════════════════════ */
.aos-steps {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	align-items: start;
	gap: 0;
	position: relative;
}
.aos-steps__track {
	position: absolute;
	top: 13px; left: 10%; right: 10%;
	height: 2px;
	background: hsl(var(--border));
	z-index: 0;
}
.aos-steps__fill {
	position: absolute;
	top: 13px; left: 10%;
	height: 2px;
	background: hsl(var(--aos-yellow-deep));
	z-index: 1;
	transition: width 400ms var(--ease-out);
}
.aos-step {
	display: flex; flex-direction: column; align-items: center;
	gap: 10px;
	text-align: center;
	position: relative;
	z-index: 2;
}
.aos-step__dot {
	width: 26px; height: 26px;
	border-radius: 50%;
	background: hsl(var(--paper));
	border: 2px solid hsl(var(--border-strong));
	display: grid; place-items: center;
	font-family: var(--mono);
	font-size: 11px;
	font-weight: 600;
	color: hsl(var(--fg-subtle));
}
.aos-step.is-done .aos-step__dot {
	background: hsl(var(--aos-yellow));
	border-color: hsl(var(--aos-yellow-deep));
	color: hsl(var(--aos-navy));
}
.aos-step.is-current .aos-step__dot {
	background: hsl(var(--aos-navy));
	border-color: hsl(var(--aos-navy));
	color: hsl(var(--aos-yellow));
	box-shadow: 0 0 0 4px hsl(var(--aos-navy) / 0.08);
}
.aos-step__label {
	font-family: var(--body);
	font-size: 11.5px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: hsl(var(--fg-muted));
	max-width: 12ch;
	line-height: 1.3;
}
.aos-step.is-current .aos-step__label { color: hsl(var(--aos-navy)); font-weight: 600; }
.aos-step.is-done .aos-step__label { color: hsl(var(--aos-navy)); }


/* ══════════════════════════════════════════════════════════════════════════
   Linear progress (.aos-progress)
   ══════════════════════════════════════════════════════════════════════════ */
.aos-progress {
	height: 6px;
	background: hsl(var(--border-soft));
	border-radius: 100px;
	overflow: hidden;
	max-width: 380px;
}
.aos-progress__fill {
	height: 100%;
	background: linear-gradient(90deg, hsl(var(--aos-blue)), hsl(var(--aos-yellow-deep)));
	transition: width 400ms var(--ease-out);
}


/* ══════════════════════════════════════════════════════════════════════════
   Vertical timeline (.aos-timeline)
   ══════════════════════════════════════════════════════════════════════════ */
.aos-timeline {
	position: relative;
	padding-left: 40px;
	margin: 0;
	list-style: none;
	display: flex; flex-direction: column; gap: 28px;
}
.aos-timeline::before {
	content: "";
	position: absolute;
	top: 10px; bottom: 10px;
	left: 13px;
	width: 1px;
	background: hsl(var(--border));
}
.aos-timeline__item { position: relative; }
.aos-timeline__item::before {
	content: "";
	position: absolute;
	left: -32px; top: 6px;
	width: 13px; height: 13px;
	border-radius: 50%;
	background: hsl(var(--paper));
	border: 2px solid hsl(var(--aos-yellow-deep));
}
.aos-timeline__item.is-current::before {
	background: hsl(var(--aos-yellow));
	box-shadow: 0 0 0 4px hsl(var(--aos-yellow) / 0.25);
}
.aos-timeline__date {
	font-family: var(--mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--aos-blue));
}
.aos-timeline__title {
	font-family: var(--display);
	font-size: 19px;
	line-height: 1.2;
	color: hsl(var(--aos-navy));
	margin: 4px 0 6px;
}
.aos-timeline__body {
	font-family: var(--body);
	font-size: 14px;
	line-height: 1.58;
	color: hsl(var(--fg-muted));
	max-width: 54ch;
}


/* ══════════════════════════════════════════════════════════════════════════
   Pullquote (.aos-pullquote)
   ══════════════════════════════════════════════════════════════════════════ */
.aos-pullquote {
	padding: 48px 0;
	text-align: center;
	border-top: 1px solid hsl(var(--aos-yellow-deep));
	border-bottom: 1px solid hsl(var(--aos-yellow-deep));
	position: relative;
}
.aos-pullquote::before,
.aos-pullquote::after {
	content: "";
	position: absolute;
	width: 8px; height: 8px;
	background: hsl(var(--aos-yellow));
	transform: rotate(45deg);
	left: 50%; margin-left: -4px;
}
.aos-pullquote::before { top: -4px; }
.aos-pullquote::after  { bottom: -4px; }
.aos-pullquote blockquote {
	margin: 0 auto;
	max-width: 30ch;
	font-family: var(--display);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(1.6rem, 2.8vw, 2.2rem);
	line-height: 1.2;
	letter-spacing: -0.018em;
	color: hsl(var(--aos-navy));
}
.aos-pullquote__by {
	margin-top: 18px;
	font-family: var(--mono);
	font-size: 10.5px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}


/* ══════════════════════════════════════════════════════════════════════════
   Tables (.aos-table)
   ══════════════════════════════════════════════════════════════════════════ */
.aos-table-wrap {
	border: 1px solid hsl(var(--border));
	border-radius: var(--r);
	overflow: auto;
	background: hsl(var(--paper));
	box-shadow: var(--shadow-xs);
	max-height: 520px;
	position: relative;
}
.aos-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	font-family: var(--body);
	font-size: 14px;
	font-variant-numeric: tabular-nums lining-nums;
	color: hsl(var(--fg));
	line-height: 1.5;
}
.aos-table thead th {
	position: sticky;
	top: 0;
	z-index: 2;
	background: hsl(var(--bg-alt));
	color: hsl(var(--aos-navy));
	font-family: var(--body);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	padding: 16px 20px;
	text-align: left;
	border-bottom: 1px solid hsl(var(--border-strong));
	white-space: nowrap;
}
.aos-table th.is-num,
.aos-table td.is-num { text-align: right; }
.aos-table th.is-center,
.aos-table td.is-center { text-align: center; }
.aos-table tbody td {
	padding: 16px 20px;
	border-bottom: 1px solid hsl(var(--border-soft));
	vertical-align: top;
}
.aos-table tbody tr:last-child td { border-bottom: none; }
.aos-table tbody tr:hover td { background: hsl(var(--aos-yellow) / 0.05); }
.aos-table--zebra tbody tr:nth-child(even) td { background: hsl(var(--bg)); }
.aos-table--zebra tbody tr:nth-child(even):hover td { background: hsl(var(--aos-yellow) / 0.08); }


/* ══════════════════════════════════════════════════════════════════════════
   Contact card (.c-contact)
   ══════════════════════════════════════════════════════════════════════════ */
.c-contact {
	padding: var(--card-padding-sm);
	text-align: left;
	display: flex; flex-direction: column; gap: var(--space-3);
	background: hsl(var(--paper));
	border: var(--card-border);
	border-radius: var(--card-radius);
	box-shadow: var(--card-shadow);
}
.c-contact__photo {
	width: 88px; height: 88px;
	flex: 0 0 88px;
	border-radius: 50%;
	background: radial-gradient(circle at 32% 28%, hsl(var(--aos-yellow) / 0.5), hsl(var(--aos-blue)) 70%);
	border: 1px solid hsl(var(--border));
	overflow: hidden;
	position: relative;
}
.c-contact__photo::after {
	content: attr(data-initials);
	position: absolute; inset: 0;
	display: grid; place-items: center;
	font-family: var(--display);
	font-size: 30px;
	color: hsl(var(--white));
}
.c-contact__name {
	font-family: var(--display);
	font-size: 19px;
	line-height: 1.2;
	color: hsl(var(--aos-navy));
}
.c-contact__role {
	font-family: var(--body);
	font-size: 13px;
	color: hsl(var(--fg-muted));
	margin-bottom: 4px;
}
.c-contact__lines {
	display: flex; flex-direction: column; gap: 8px;
	padding-top: 14px;
	border-top: 1px solid hsl(var(--border-soft));
	font-family: var(--body);
	font-size: 13.5px;
	color: hsl(var(--fg));
}
.c-contact__lines a { color: hsl(var(--aos-blue)); }


/* ── Empty state (.aos-empty) ─────────────────────────────────────────── */
.aos-empty {
	text-align: center;
	padding: 48px 28px;
	border: 1px dashed hsl(var(--border-strong));
	border-radius: var(--r-lg);
	background: hsl(var(--bg));
}


/* ══════════════════════════════════════════════════════════════════════════
   Utility strip (.aos-util) — top-of-page thin nav strip
   ══════════════════════════════════════════════════════════════════════════ */
.aos-util {
	background: hsl(var(--aos-navy-deep));
	color: hsl(0 0% 100% / 0.78);
	font-size: 12.5px;
}
.aos-util__inner {
	max-width: var(--container);
	margin: 0 auto;
	padding: 10px var(--gutter);
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 24px;
	flex-wrap: wrap;
}
.aos-util a { color: inherit; }
.aos-util a:hover { color: hsl(var(--aos-yellow)); }


/* ══════════════════════════════════════════════════════════════════════════
   Hero — photo-forward variant (.aos-hero)
   ══════════════════════════════════════════════════════════════════════════ */
.aos-hero {
	background: hsl(var(--aos-navy));
	color: hsl(var(--paper));
	position: relative;
	overflow: hidden;
}
.aos-hero__inner {
	max-width: var(--container);
	margin: 0 auto;
	padding: clamp(3rem, 6vw, 5rem) var(--gutter) clamp(4rem, 7vw, 6rem);
	position: relative;
}
.aos-hero__eyebrow {
	font-family: var(--body);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--aos-yellow));
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 20px;
}
.aos-hero__eyebrow::before {
	content: "";
	width: 24px;
	height: 1px;
	background: hsl(var(--aos-yellow));
}
.aos-hero h1 {
	font-family: var(--display);
	font-weight: 350;
	line-height: 1.04;
	letter-spacing: -0.022em;
	font-size: clamp(2.25rem, 4.5vw, 4rem);
	color: hsl(var(--paper));
	max-width: 22ch;
	margin: 0 0 24px;
}
.aos-hero__lead {
	font-family: var(--body);
	font-size: clamp(17px, 1.15vw, 19px);
	line-height: 1.55;
	color: hsl(0 0% 100% / 0.85);
	max-width: 60ch;
	margin: 0 0 32px;
}
.aos-hero__ctas {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
}


/* ══════════════════════════════════════════════════════════════════════════
   Program card (.c-program)
   ══════════════════════════════════════════════════════════════════════════ */
.c-program {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 28px 26px 24px;
	background: hsl(var(--paper));
	border: 1px solid hsl(var(--border));
	border-radius: var(--r-lg);
	transition: transform 240ms var(--ease-out), border-color 240ms var(--ease-out), box-shadow 240ms var(--ease-out);
}
.c-program:hover {
	transform: translateY(-2px);
	border-color: hsl(var(--border-strong));
	box-shadow: var(--shadow-md);
}
.c-program__top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	padding-bottom: 14px;
	border-bottom: 1px solid hsl(var(--border-soft));
}
.c-program__school {
	font-family: var(--mono);
	font-size: 10.5px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--aos-blue));
}
.c-program__degree {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 999px;
	background: hsl(var(--aos-yellow-soft));
	color: hsl(var(--aos-navy));
	font-family: var(--mono);
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.c-program__title {
	font-family: var(--display);
	font-size: 22px;
	font-weight: 400;
	line-height: 1.2;
	color: hsl(var(--aos-navy));
	margin: 0;
	letter-spacing: -0.015em;
}
.c-program__desc {
	font-family: var(--body);
	font-size: 14.5px;
	line-height: 1.55;
	color: hsl(var(--fg-muted));
	margin: 0;
}
.c-program__link {
	margin-top: auto;
	padding-top: 8px;
	font-family: var(--body);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: hsl(var(--aos-blue));
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.c-program__link::after {
	content: "→";
	transition: transform 200ms var(--ease-out);
}
.c-program:hover .c-program__link::after {
	transform: translateX(4px);
}


/* ══════════════════════════════════════════════════════════════════════════
   Stat block (.c-stat)
   ══════════════════════════════════════════════════════════════════════════ */
.c-stat {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.c-stat__figure {
	font-family: var(--display);
	font-size: clamp(2.5rem, 4vw, 3.5rem);
	font-weight: 350;
	line-height: 1;
	color: hsl(var(--aos-navy));
	letter-spacing: -0.025em;
	font-variation-settings: "opsz" 72;
}
.c-stat__label {
	font-family: var(--body);
	font-size: 14.5px;
	font-weight: 600;
	color: hsl(var(--fg));
}
.c-stat__caption {
	font-family: var(--body);
	font-size: 13px;
	line-height: 1.5;
	color: hsl(var(--fg-muted));
	max-width: 32ch;
}


/* ══════════════════════════════════════════════════════════════════════════
   Callout band (.c-callout)
   ══════════════════════════════════════════════════════════════════════════ */
.c-callout {
	padding: clamp(2.5rem, 5vw, 4rem);
	border-radius: var(--r-xl);
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.c-callout--navy {
	background: hsl(var(--aos-navy));
	color: hsl(var(--paper));
}
.c-callout--yellow {
	background: hsl(var(--aos-yellow));
	color: hsl(var(--aos-navy));
}
.c-callout--rose {
	background: hsl(var(--aos-rose-soft));
	color: hsl(var(--aos-rose));
}
.c-callout__title {
	font-family: var(--display);
	font-size: clamp(1.75rem, 3vw, 2.5rem);
	font-weight: 350;
	line-height: 1.1;
	letter-spacing: -0.022em;
	margin: 0;
}
.c-callout__body {
	font-family: var(--body);
	font-size: 16px;
	line-height: 1.55;
	max-width: 50ch;
	margin: 0;
	opacity: 0.88;
}
.c-callout__ctas {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
	margin-top: 8px;
}


/* ══════════════════════════════════════════════════════════════════════════
   Button — AOS primary / ghost
   ══════════════════════════════════════════════════════════════════════════ */
.aos-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 26px;
	background: hsl(var(--aos-yellow));
	color: hsl(var(--aos-navy));
	font-family: var(--body);
	font-size: 14.5px;
	font-weight: 600;
	letter-spacing: -0.005em;
	border-radius: 999px;
	text-decoration: none;
	transition: background 200ms var(--ease-out), transform 200ms var(--ease-out);
}
.aos-btn:hover {
	background: hsl(var(--aos-yellow-deep));
	transform: translateY(-1px);
}
.aos-btn--ghost {
	background: transparent;
	border: 1px solid hsl(0 0% 100% / 0.32);
	color: hsl(var(--paper));
}
.aos-btn--ghost:hover {
	background: hsl(0 0% 100% / 0.08);
	border-color: hsl(0 0% 100% / 0.6);
}
.aos-btn--primary {
	background: hsl(var(--aos-navy));
	color: hsl(var(--paper));
}
.aos-btn--primary:hover {
	background: hsl(var(--aos-navy-soft));
}


/* ══════════════════════════════════════════════════════════════════════════
   Section wrapper (.aos-section)
   ══════════════════════════════════════════════════════════════════════════ */
.aos-section {
	padding: var(--section) 0;
}
.aos-section--alt {
	background: hsl(var(--bg-alt));
}
.aos-section--navy {
	background: hsl(var(--aos-navy));
	color: hsl(var(--paper));
}
.aos-section__inner {
	max-width: var(--container);
	margin: 0 auto;
	padding: 0 var(--gutter);
}
.aos-section__head {
	display: flex;
	flex-direction: column;
	gap: 14px;
	max-width: 62ch;
	margin-bottom: clamp(2rem, 4vw, 4rem);
}


/* ══════════════════════════════════════════════════════════════════════════
   Global safety
   ══════════════════════════════════════════════════════════════════════════ */
main svg:not([width]):not([height]) { max-width: 100%; }

/* ══════════════════════════════════════════════════════════════════════════
   HEADER + PRIMARY NAVIGATION
   Loads site-wide. Editorial nav with a primary CTA, responsive with a
   JS-enhanced mobile drawer.
   ══════════════════════════════════════════════════════════════════════════ */

.aos-header {
	padding: 18px clamp(16px, 4vw, 40px) !important;
	background: var(--wp--preset--color--background, hsl(var(--bg)));
}
.aos-header__inner {
	max-width: 1320px;
	margin: 0 auto;
	gap: 24px !important;
	align-items: center !important;
}

.wp-block-site-title.aos-header__brand,
.aos-header__brand a {
	font-family: var(--display) !important;
	font-size: 20px !important;
	font-weight: 500 !important;
	letter-spacing: -0.015em !important;
	color: hsl(var(--aos-navy)) !important;
	text-decoration: none !important;
}

.aos-header__nav {
	display: flex;
	align-items: center;
	gap: 24px;
}

.aos-header__list {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 4px;
	align-items: center;
}
.aos-header__list li { margin: 0; padding: 0; }
.aos-header__list a {
	display: inline-block;
	padding: 8px 14px;
	font-family: "Instrument Sans", -apple-system, system-ui, sans-serif;
	font-size: 14.5px;
	font-weight: 500;
	letter-spacing: -0.005em;
	color: hsl(var(--aos-fg, 212 40% 15%));
	text-decoration: none;
	border-radius: 999px;
	transition: background 160ms, color 160ms;
}
.aos-header__list a:hover,
.aos-header__list a[aria-current="page"] {
	background: hsl(var(--aos-yellow-soft));
	color: hsl(var(--aos-navy));
}
.aos-header__list a:focus-visible {
	outline: 0;
	box-shadow: 0 0 0 3px hsl(var(--aos-blue) / 0.25);
}

.aos-header__cta a {
	background: hsl(var(--aos-navy));
	color: hsl(var(--aos-yellow)) !important;
	padding: 10px 18px;
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-left: 10px;
	transition: background 180ms, transform 180ms;
}
.aos-header__cta a:hover {
	background: hsl(var(--aos-blue));
	color: hsl(var(--aos-yellow)) !important;
	transform: translateY(-1px);
}

/* Mobile toggle */
.aos-header__toggle {
	display: none;
	width: 40px;
	height: 40px;
	border: 0;
	background: transparent;
	cursor: pointer;
	padding: 10px 8px;
	flex-direction: column;
	justify-content: space-between;
	align-items: stretch;
	border-radius: 8px;
}
.aos-header__toggle:hover {
	background: hsl(var(--aos-yellow-soft));
}
.aos-header__toggle-line {
	display: block;
	height: 1.5px;
	background: hsl(var(--aos-navy));
	border-radius: 2px;
	transition: transform 200ms, opacity 200ms;
}
.aos-header__toggle[aria-expanded="true"] .aos-header__toggle-line:nth-child(1) {
	transform: translateY(6px) rotate(45deg);
}
.aos-header__toggle[aria-expanded="true"] .aos-header__toggle-line:nth-child(2) {
	opacity: 0;
}
.aos-header__toggle[aria-expanded="true"] .aos-header__toggle-line:nth-child(3) {
	transform: translateY(-6.5px) rotate(-45deg);
}

@media (max-width: 860px) {
	.aos-header__toggle {
		display: flex;
	}
	.aos-header__list {
		display: none;
		position: absolute;
		top: calc(100% + 1px);
		left: 0;
		right: 0;
		flex-direction: column;
		background: var(--wp--preset--color--background, hsl(var(--bg)));
		border-bottom: 1px solid var(--wp--preset--color--border-soft, hsl(var(--border-soft)));
		padding: 12px clamp(16px, 4vw, 40px) 20px;
		gap: 0;
		z-index: 90;
		box-shadow: 0 12px 24px hsl(var(--fg) / 0.06);
	}
	.aos-header__list.is-open { display: flex; }
	.aos-header__list li { width: 100%; border-bottom: 1px solid var(--wp--preset--color--border-soft, hsl(var(--border-soft))); }
	.aos-header__list li:last-child { border-bottom: 0; }
	.aos-header__list a {
		display: block;
		padding: 14px 8px;
		border-radius: 0;
		font-size: 16px;
	}
	.aos-header__cta a {
		background: transparent !important;
		color: hsl(var(--aos-navy)) !important;
		padding: 14px 8px;
		margin-left: 0;
		display: block;
	}
	.aos-header__inner { position: relative; }
}

/* ══════════════════════════════════════════════════════════════════════════
   BREADCRUMBS
   Tiny mono strip above the page hero on /news/ and single posts.
   ══════════════════════════════════════════════════════════════════════════ */

.aos-breadcrumb {
	max-width: 1240px;
	margin: 0 auto;
	padding: 20px clamp(16px, 4vw, 40px) 0;
}
.aos-breadcrumb__list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--aos-fg-subtle, 212 14% 53%));
}
.aos-breadcrumb__list li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.aos-breadcrumb__list li + li::before {
	content: "›";
	color: hsl(var(--aos-border-strong, 212 16% 76%));
	font-weight: 400;
}
.aos-breadcrumb__list a {
	color: hsl(var(--aos-fg-muted, 212 21% 38%));
	text-decoration: none;
	transition: color 160ms;
}
.aos-breadcrumb__list a:hover {
	color: hsl(var(--aos-navy));
}
.aos-breadcrumb__list li[aria-current="page"] {
	color: hsl(var(--aos-navy));
}

.aos-breadcrumb--post {
	padding-top: 28px;
	padding-bottom: 0;
}

@media (prefers-reduced-motion: reduce) {
	.aos-header__list a,
	.aos-header__cta a,
	.aos-header__toggle-line,
	.aos-breadcrumb__list a {
		transition: none !important;
	}
	.aos-header__cta a:hover { transform: none !important; }
}

/* ── Editorial emphasis — Cormorant Garamond italic for <em>/<i> in display type & quotes ── */
h1 em, h2 em, h3 em, .aos-hp em, blockquote em, blockquote i,
.has-hero-font-size em, .has-h1-font-size em, .has-h2-font-size em {
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	letter-spacing: 0;
}

/* ── Buttons (core blocks) — follow the site-wide .aos-btn system: navy
   pill + teal arrow chip (the chip is generated, so any editor-inserted
   button inherits the look). Dark bands flip to the paper variant. ── */
.wp-block-button__link {
	font-family: var(--body);
	font-weight: 500;
	font-size: 0.95rem;
	letter-spacing: 0.01em;
	border-radius: var(--r-pill, 999px);
	padding: 7px 7px 7px 22px;
	transition: background .18s var(--ease-out), color .18s var(--ease-out),
	            border-color .18s var(--ease-out), transform .18s var(--ease-out), box-shadow .18s var(--ease-out);
}
.wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	background: hsl(var(--aos-navy));
	color: hsl(var(--paper));
	border: 1px solid hsl(var(--aos-navy-deep) / 0.9);
	box-shadow:
		inset 0 1px 0 hsl(0 0% 100% / 0.09),
		0 1px 2px hsl(var(--aos-navy-deep) / 0.18),
		0 12px 32px -8px hsl(var(--aos-navy-deep) / 0.35);
}
.wp-block-button:not(.is-style-outline) > .wp-block-button__link::after {
	content: "\2192";
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border-radius: 999px;
	background: hsl(var(--aos-yellow));
	color: hsl(var(--aos-navy-deep));
	font-size: 0.9rem;
	line-height: 1;
}
.wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover {
	background: hsl(var(--aos-navy-soft));
	border-color: hsl(var(--aos-navy-deep) / 0.9);
	color: hsl(var(--paper));
	transform: translateY(-1px);
	box-shadow:
		inset 0 1px 0 hsl(0 0% 100% / 0.12),
		0 2px 4px hsl(var(--aos-navy-deep) / 0.2),
		0 18px 40px -10px hsl(var(--aos-navy-deep) / 0.42);
}
/* Flip on dark bands: hairline stroke ghost, teal chip carries the color */
:is(.has-navy-background-color, .has-navy-deep-background-color, .has-navy-soft-background-color) .wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	background: transparent;
	color: hsl(var(--bg));
	border-color: hsl(var(--bg) / 0.28);
	box-shadow: none;
}
:is(.has-navy-background-color, .has-navy-deep-background-color, .has-navy-soft-background-color) .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover {
	background: hsl(var(--aos-yellow) / 0.08);
	color: hsl(var(--bg));
	border-color: hsl(var(--aos-yellow) / 0.65);
	box-shadow: 0 12px 32px -12px hsl(var(--aos-yellow) / 0.25);
}
/* Secondary = the same pill and the same chip, drawn in hairline instead of
   filled. Identical geometry to the primary, so a primary/secondary pair sits
   on one optical line — the fill is the only thing that changes. */
.wp-block-button.is-style-outline > .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	background: transparent;
	color: hsl(var(--fg));
	border: 1px solid hsl(var(--border-strong));
	box-shadow: none;
}
.wp-block-button.is-style-outline > .wp-block-button__link::after {
	content: "\2192";
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border-radius: 999px;
	border: 1px solid hsl(var(--border-strong));
	background: transparent;
	color: hsl(var(--fg));
	font-size: 0.9rem;
	line-height: 1;
	transition: background-color .18s var(--ease-out), border-color .18s var(--ease-out), color .18s var(--ease-out);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	border-color: hsl(var(--fg) / 0.4);
	color: hsl(var(--fg));
	background: transparent;
	transform: translateY(-1px);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover::after {
	background: hsl(var(--aos-yellow));
	border-color: hsl(var(--aos-yellow));
	color: hsl(var(--aos-navy-deep));
}
/* Dark bands: hairline goes light */
:is(.has-navy-background-color, .has-navy-deep-background-color, .has-navy-soft-background-color) .wp-block-button.is-style-outline > .wp-block-button__link,
:is(.has-navy-background-color, .has-navy-deep-background-color, .has-navy-soft-background-color) .wp-block-button.is-style-outline > .wp-block-button__link::after {
	border-color: hsl(var(--bg) / 0.28);
	color: hsl(var(--bg));
}
.wp-block-button__link:focus-visible {
	outline: 2px solid hsl(var(--aos-blue));
	outline-offset: 3px;
}

/* ── Headings inside dark sections inherit the light section text color ──
   (theme.json pins headings to `foreground`; on dark bands that's invisible.
   Headings that carry their own has-*-color class are left untouched.) ── */
.has-navy-background-color :is(h1,h2,h3,h4,h5,h6):not([class*="-color"]),
.has-navy-deep-background-color :is(h1,h2,h3,h4,h5,h6):not([class*="-color"]),
.has-navy-soft-background-color :is(h1,h2,h3,h4,h5,h6):not([class*="-color"]) {
	color: inherit;
}

/* ── Contact form — tokenized, premium ── */
.aos-form { display:grid; gap:22px; }
.aos-form__row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.aos-field { display:grid; gap:8px; }
.aos-field__label { font-family:var(--body); font-size:.8125rem; font-weight:600; letter-spacing:-.005em; color:hsl(var(--fg)); }
.aos-field__label span { color:hsl(var(--fg-subtle)); font-weight:400; }
.aos-input, .aos-textarea {
	font-family:var(--body); font-size:1rem; color:hsl(var(--fg));
	background:hsl(var(--paper)); border:1.5px solid hsl(var(--border-strong));
	border-radius:12px; padding:12px 14px; width:100%;
	transition:border-color .18s var(--ease-out), box-shadow .18s var(--ease-out);
}
.aos-input::placeholder, .aos-textarea::placeholder { color:hsl(var(--fg-subtle)); }
.aos-input:focus, .aos-textarea:focus { outline:none; border-color:hsl(var(--aos-blue)); box-shadow:0 0 0 3px hsl(var(--aos-blue) / 0.14); }
.aos-textarea { resize:vertical; min-height:130px; line-height:1.5; }
.aos-chips { display:flex; flex-wrap:wrap; gap:8px; }
.aos-chip { font-family:var(--body); font-size:.8125rem; font-weight:500; padding:8px 15px; border-radius:999px;
	border:1.5px solid hsl(var(--border-strong)); background:hsl(var(--paper)); color:hsl(var(--fg-muted));
	cursor:pointer; transition:border-color .16s var(--ease-out), color .16s var(--ease-out), background .16s var(--ease-out); }
.aos-chip:hover { border-color:hsl(var(--aos-blue)); color:hsl(var(--aos-blue)); }
.aos-chip--on { background:hsl(var(--aos-yellow)); border-color:hsl(var(--aos-yellow)); color:hsl(var(--aos-navy)); }
.aos-contact-item { padding:18px 0; border-top:1px solid hsl(var(--border)); }
.aos-contact-item__label { font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; font-weight:700; color:hsl(var(--aos-blue)); }
.aos-contact-item__value { font-size:1.125rem; color:hsl(var(--fg)); margin-top:5px; }
.aos-contact-item__value a { color:inherit; }
@media (max-width:600px){ .aos-form__row{ grid-template-columns:1fr; } }

/* ── Cards: responsive padding so headings fit narrow multi-column layouts ──
   (48px inline padding squeezed content below word width -> mid-word breaks).
   !important is required to override the per-card inline padding. Words stay whole. */
.aos-hp .wp-block-columns > .wp-block-column.has-background,
.aos-hp .wp-block-columns > .wp-block-column.has-border-color {
	padding: clamp(1.25rem, 0.8vw + 1rem, 2rem) !important;
}
.aos-hp .wp-block-column .wp-block-heading { overflow-wrap: break-word; word-break: normal; hyphens: none; }

/* Card titles: slightly smaller so 8+ char words fit a 4-up row without mid-word breaks */
.aos-hp .wp-block-column.has-background > .wp-block-heading,
.aos-hp .wp-block-column.has-border-color > .wp-block-heading {
	font-size: clamp(1.0625rem, 0.4vw + 0.95rem, 1.3rem);
	line-height: 1.2;
}

/* Card titles in tight multi-up grids: hyphenate long words cleanly (no raw mid-word breaks) */
.aos-hp .wp-block-column.has-background > .wp-block-heading,
.aos-hp .wp-block-column.has-border-color > .wp-block-heading {
	-webkit-hyphens: auto;
	hyphens: auto;
	font-size: clamp(1rem, 0.3vw + 0.92rem, 1.2rem);
}

/* ── Scroll reveal — sections rise + fade as they enter the viewport ──
   Applied only to below-the-fold sections by aos-theme.js (no above-fold flash).
   Fully disabled under prefers-reduced-motion. */
.aos-reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s var(--ease-out), transform .7s var(--ease-out); }
.aos-reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .aos-reveal { opacity: 1 !important; transform: none !important; transition: none !important; } }

/* ── Readable measure: cap standalone prose within the wider content frame ──
   (card/column paragraphs are already narrower than this, so unaffected) */
.aos-hp > .wp-block-group > p,
.aos-hp > .wp-block-group > .wp-block-group > p { max-width: 64ch; }

/* ── Single-edge alignment ─────────────────────────────────────────────
   WP's constrained layout centers each child by its OWN max-width, so the
   inline-flex eyebrow lands at the padding edge and the width-capped lede
   center-shifts right — three different left edges from the heading. Pin
   every section eyebrow + standalone paragraph to the SAME content-column
   edge as the constrained heading. The calc reproduces the heading's left
   auto-margin, (container - content-size) / 2; on narrow viewports it
   clamps to 0 so everything hangs from the padding edge, matching the
   then-full-width heading. */
.aos-hp > .wp-block-group > p,
.aos-hp > .wp-block-group > .aos-eyebrow {
	/* !important overrides WP constrained-layout's `margin: auto !important`
	   (which centers by max-width, and computes to 0 on the inline-flex
	   eyebrow). */
	margin-left: max(0px, calc((100% - var(--wp--style--global--content-size, 1080px)) / 2)) !important;
	margin-right: auto !important;
}

/* ── Consistent eyebrow → title rhythm ─────────────────────────────────
   The eyebrow is the same size in every section, so its gap to the title
   should be constant. Section markup carried varying block-gaps (rendered
   16 / 8 / 12px across sections); pin to the design token so the
   label→title relationship reads identically site-wide. */
.aos-hp > .wp-block-group > .aos-eyebrow + :is(h1, h2, h3) {
	margin-top: var(--rhythm-eyebrow-to-title, 16px) !important;
}

/* ── Section vertical rhythm scales with the viewport ──────────────────
   The type scale compresses ~25% on phones (H1 68->45, H2 44->32) but the
   section padding was pinned at a fixed 64/80px, leaving the vertical
   rhythm proportionally too loose. Compress it in step on small screens.
   Scales 64px (at 600px) down to ~44px (narrow phones); handoff at 600px
   matches the desktop value so there's no visible jump. */
@media (max-width: 600px) {
	.aos-hp > .wp-block-group {
		padding-top: clamp(2.75rem, 10vw, 4rem) !important;
		padding-bottom: clamp(2.75rem, 10vw, 4rem) !important;
	}
}

/* ── Card craft — soft resting elevation + a teal-edged lift on hover.
   Covers discipline cards (wp:columns with card surface/border) AND work
   cards (bordered groups). Cards read as premium objects at rest, then
   rise toward a teal edge on hover. ── */
.aos-hp .wp-block-column.has-border-color,
.aos-hp .wp-block-column.has-background-card-background-color,
.aos-hp .wp-block-group.has-border-color {
	box-shadow: var(--shadow-sm);
	transition: transform .34s var(--ease-out), box-shadow .34s var(--ease-out), border-color .34s var(--ease-out);
}
.aos-hp .wp-block-column.has-border-color:hover,
.aos-hp .wp-block-column.has-background-card-background-color:hover,
.aos-hp .wp-block-group.has-border-color:hover {
	transform: translateY(-6px);
	box-shadow: var(--shadow-lg);
	border-color: hsl(var(--aos-yellow) / 0.55);
}

/* ── FAQ — refine the native <details>: drop the default triangle for a
   teal +/- marker that collapses on open, plus a hover affordance. ── */
.aos-hp details.wp-block-details > summary {
	list-style: none;
	cursor: pointer;
	position: relative;
	padding-right: 2.5rem;
	transition: color .2s var(--ease-out);
}
.aos-hp details.wp-block-details > summary::-webkit-details-marker { display: none; }
.aos-hp details.wp-block-details > summary::before,
.aos-hp details.wp-block-details > summary::after {
	content: "";
	position: absolute;
	right: 0.3rem;
	top: 50%;
	width: 14px;
	height: 2px;
	margin-top: -1px;
	background: hsl(var(--aos-yellow));
	border-radius: 2px;
	transition: transform .3s var(--ease-out), opacity .2s var(--ease-out);
}
.aos-hp details.wp-block-details > summary::after { transform: rotate(90deg); }
.aos-hp details.wp-block-details[open] > summary::after { opacity: 0; }
.aos-hp details.wp-block-details > summary:hover { color: hsl(var(--aos-yellow-deep)); }
.aos-hp details.wp-block-details > summary:focus { outline: none; }
.aos-hp details.wp-block-details > summary:focus-visible {
	outline: 2px solid hsl(var(--aos-blue));
	outline-offset: 3px;
}

/* ══════════════════════════════════════════════════════════════════════
   ATMOSPHERIC DEPTH — aurora glows on the dark bands tie the content back
   to the cinematic hero, so the navy sections read as designed light, not
   flat fills. The finale drifts slowly; content always sits above. ══════ */
.aos-hp .wp-block-group.has-navy-background-color,
.aos-hp .wp-block-group.has-navy-deep-background-color {
	position: relative;
	isolation: isolate;
	overflow: hidden;
}
.aos-hp .wp-block-group.has-navy-background-color::before,
.aos-hp .wp-block-group.has-navy-deep-background-color::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background:
		radial-gradient(58% 78% at 10% 6%, hsl(var(--aos-yellow) / 0.16), transparent 60%),
		radial-gradient(52% 68% at 94% 104%, hsl(var(--aos-blue) / 0.20), transparent 62%),
		radial-gradient(46% 62% at 80% 8%, hsl(var(--aos-blue-deep) / 0.28), transparent 72%);
}
.aos-hp .wp-block-group.has-navy-background-color > *,
.aos-hp .wp-block-group.has-navy-deep-background-color > * {
	position: relative;
	z-index: 1;
}
/* The finale: a richer, slowly drifting aurora + a hairline of teal light. */
.aos-hp .wp-block-group.has-navy-deep-background-color {
	border-top: 1px solid hsl(var(--aos-yellow) / 0.28);
}
.aos-hp .wp-block-group.has-navy-deep-background-color::before {
	background:
		radial-gradient(46% 58% at 22% 46%, hsl(var(--aos-yellow) / 0.30), transparent 62%),
		radial-gradient(62% 74% at 102% 104%, hsl(var(--aos-blue) / 0.44), transparent 58%),
		radial-gradient(52% 66% at 90% -6%, hsl(var(--aos-blue-deep) / 0.52), transparent 66%),
		radial-gradient(40% 50% at 60% 120%, hsl(var(--aos-yellow-deep) / 0.30), transparent 64%);
	background-size: 150% 150%;
	animation: aosAurora 22s ease-in-out infinite alternate;
}
@keyframes aosAurora {
	from { background-position: 0% 0%; }
	to   { background-position: 100% 100%; }
}
@media (prefers-reduced-motion: reduce) {
	.aos-hp .wp-block-group.has-navy-deep-background-color::before { animation: none; }
}

/* ══ Designed cards — a teal→blue accent bar draws across the top on hover,
   and the discipline index reads as a teal marker instead of muted grey. ══ */
.aos-hp .wp-block-columns > .wp-block-column.has-background-card-background-color,
.aos-hp .wp-block-group.has-border-color {
	position: relative;
	overflow: hidden;
}
.aos-hp .wp-block-columns > .wp-block-column.has-background-card-background-color::after,
.aos-hp .wp-block-group.has-border-color::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, hsl(var(--aos-yellow)), hsl(var(--aos-blue)));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .45s var(--ease-out);
}
.aos-hp .wp-block-columns > .wp-block-column.has-background-card-background-color:hover::after,
.aos-hp .wp-block-group.has-border-color:hover::after {
	transform: scaleX(1);
}
.aos-hp .wp-block-columns > .wp-block-column.has-background-card-background-color > p:first-child {
	color: hsl(var(--aos-yellow)) !important;
	font-weight: 700 !important;
	letter-spacing: 0.14em;
}

/* ══════════════════════════════════════════════════════════════════════
   SELECTED WORK — real products in premium device mockups. Alternating
   editorial feature rows tie the portfolio to the cinematic hero: a soft
   teal/blue backdrop glow, titanium phone frames for the iOS apps, and a
   browser frame for the web platform. Fully tokenized. ══════════════════ */
.aos-work {
	border-top: 1px solid hsl(var(--border));
	padding-block: clamp(4rem, 9vh, 7rem);
}
.aos-work__inner {
	/* match the WP constrained content edge exactly (1080px + root padding) */
	max-width: calc(var(--wp--style--global--content-size, 1080px) + 2 * var(--wp--style--root--padding-left, 24px));
	margin-inline: auto;
	padding-inline: var(--wp--style--root--padding-left, 24px);
}
.aos-work__head { max-width: 46ch; margin-bottom: clamp(3rem, 7vh, 5rem); }
.aos-work__head h2 {
	margin: 0.5rem 0 0;
	font-size: clamp(1.9rem, 3.6vw, 3rem);
	line-height: 1.06;
	letter-spacing: -0.02em;
	color: hsl(var(--fg));
}
.aos-work__items { display: flex; flex-direction: column; gap: clamp(4rem, 10vh, 8rem); }

.aos-work__item {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(2rem, 5vw, 5.5rem);
	align-items: center;
}
.aos-work__item:nth-child(even) .aos-work__media { order: 2; }
.aos-work__item:nth-child(even) .aos-work__body { order: 1; }

/* Media cell — soft teal/blue backdrop glow ties it to the hero */
.aos-work__media {
	position: relative;
	display: flex;
	justify-content: center;
	isolation: isolate;
}
.aos-work__media::before {
	content: "";
	position: absolute;
	inset: -10% -6%;
	z-index: -1;
	background:
		radial-gradient(58% 54% at 50% 42%, hsl(var(--aos-yellow) / 0.18), transparent 70%),
		radial-gradient(70% 62% at 62% 82%, hsl(var(--aos-blue) / 0.16), transparent 72%);
	filter: blur(8px);
}

/* Titanium iPhone frame (screenshots already carry the status bar/island) */
.aos-phone {
	width: min(100%, 286px);
	aspect-ratio: 640 / 1391;
	padding: 9px;
	border-radius: 46px;
	background: linear-gradient(155deg, hsl(var(--aos-navy-soft)) 0%, hsl(var(--aos-navy-deep)) 52%, hsl(var(--aos-navy)) 100%);
	box-shadow:
		0 2px 4px hsl(var(--aos-navy-deep) / 0.30),
		0 30px 60px hsl(var(--aos-navy-deep) / 0.32),
		inset 0 0 0 1px hsl(var(--paper) / 0.06);
	transition: transform .5s var(--ease-out), box-shadow .5s var(--ease-out);
}
.aos-phone img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 38px;
	display: block;
}
.aos-work__item:hover .aos-phone {
	transform: translateY(-8px) rotate(-0.6deg);
	box-shadow:
		0 4px 8px hsl(var(--aos-navy-deep) / 0.34),
		0 44px 82px hsl(var(--aos-navy-deep) / 0.40),
		inset 0 0 0 1px hsl(var(--paper) / 0.08);
}

/* Browser frame — the web platform */
.aos-browser {
	width: 100%;
	border-radius: var(--r-lg);
	overflow: hidden;
	background: hsl(var(--bg-card));
	border: 1px solid hsl(var(--border));
	box-shadow: 0 2px 4px hsl(var(--aos-navy) / 0.06), 0 30px 60px hsl(var(--aos-navy) / 0.16);
	transition: transform .5s var(--ease-out), box-shadow .5s var(--ease-out);
}
.aos-work__item:hover .aos-browser {
	transform: translateY(-8px);
	box-shadow: 0 4px 8px hsl(var(--aos-navy) / 0.08), 0 44px 82px hsl(var(--aos-navy) / 0.22);
}
.aos-browser__bar {
	display: flex;
	align-items: center;
	gap: 7px;
	height: 40px;
	padding: 0 15px;
	background: linear-gradient(hsl(var(--bg-alt)), hsl(var(--bg-card)));
	border-bottom: 1px solid hsl(var(--border));
}
.aos-browser__dot { width: 11px; height: 11px; border-radius: 50%; background: hsl(var(--border-strong)); }
.aos-browser__addr {
	margin-left: 10px;
	flex: 1;
	height: 22px;
	border-radius: 999px;
	background: hsl(var(--bg-alt));
	display: flex;
	align-items: center;
	padding: 0 12px;
	font-size: 11px;
	color: hsl(var(--fg-subtle));
	font-family: ui-monospace, "JetBrains Mono", monospace;
}
.aos-browser img { width: 100%; display: block; }

/* Body copy */
.aos-work__tag {
	margin: 0 0 0.75rem;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--aos-blue-deep));
}
.aos-work__name {
	margin: 0 0 0.6rem;
	font-size: clamp(1.6rem, 2.4vw, 2.2rem);
	letter-spacing: -0.02em;
	line-height: 1.05;
	color: hsl(var(--fg));
}
.aos-work__desc {
	margin: 0 0 1.4rem;
	color: hsl(var(--fg-muted));
	max-width: 46ch;
	line-height: 1.55;
}
.aos-work__roles { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.aos-work__roles li {
	font-size: 0.78rem;
	font-weight: 600;
	color: hsl(var(--aos-blue-deep));
	padding: 5px 12px;
	border-radius: 999px;
	background: hsl(var(--aos-yellow-soft));
	border: 1px solid hsl(var(--aos-yellow) / 0.22);
}

@media (max-width: 860px) {
	.aos-work__item { grid-template-columns: 1fr; gap: 2rem; justify-items: center; }
	.aos-work__item:nth-child(even) .aos-work__media,
	.aos-work__item:nth-child(even) .aos-work__body { order: initial; }
	.aos-work__body { text-align: left; width: 100%; }
	.aos-phone { width: min(70%, 260px); }
}
@media (prefers-reduced-motion: reduce) {
	.aos-work__item:hover .aos-phone,
	.aos-work__item:hover .aos-browser { transform: none; }
}

/* ══════════════════════════════════════════════════════════════════════
   WORLD-CLASS PASS — editorial art direction across every homepage band.
   Section indexing note: main.aos-hp children are 1 legacy hero (hidden),
   2 thesis, 3 one-team, 4 disciplines, 5 work, 6 marquee, 7 stats,
   8 testimonials, 9 faq, 10 finale. nth-child rules below rely on this.
   ══════════════════════════════════════════════════════════════════════ */

/* ── 1. THESIS — a statement moment, not a paragraph ── */
.aos-hp > .aos-sec-statement {
	position: relative;
	isolation: isolate;
	padding-top: clamp(4.5rem, 10vh, 7.5rem) !important;
	padding-bottom: clamp(4.5rem, 10vh, 7.5rem) !important;
}
.aos-hp > .aos-sec-statement::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background: radial-gradient(46% 64% at 10% 18%, hsl(var(--aos-yellow-soft) / 0.6), transparent 70%);
}
.aos-hp > .aos-sec-statement > * { position: relative; z-index: 1; }
.aos-hp > .aos-sec-statement > h2 {
	color: hsl(var(--fg)) !important;
	font-size: clamp(2rem, 3.4vw, 3.1rem) !important;
	line-height: 1.14 !important;
	letter-spacing: -0.02em;
	max-width: 26ch;
	/* WP centers width-capped children; pin to the shared content edge */
	margin-left: max(0px, calc((100% - var(--wp--style--global--content-size, 1080px)) / 2)) !important;
	margin-right: auto !important;
}
.aos-hp > .aos-sec-statement > h2 em {
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: 1.14em;
	letter-spacing: 0;
}
.aos-hp > .aos-sec-statement > p {
	font-family: var(--mono);
	font-size: 0.78rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}

/* ── 2. ONE TEAM — numbered editorial columns, gradient hairlines ── */
.aos-hp > .aos-sec-index .wp-block-columns { counter-reset: aos-team; }
.aos-hp > .aos-sec-index .wp-block-columns > .wp-block-column {
	counter-increment: aos-team;
	position: relative;
	border-top: none !important;
	padding-top: 1.5rem !important;
}
.aos-hp > .aos-sec-index .wp-block-columns > .wp-block-column::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(90deg, hsl(var(--aos-yellow)), hsl(var(--aos-blue) / 0.45) 55%, transparent);
}
.aos-hp > .aos-sec-index .wp-block-columns > .wp-block-column::after {
	content: "0" counter(aos-team);
	position: absolute;
	top: 0.9rem;
	right: 0;
	font-family: var(--mono);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	color: hsl(var(--aos-yellow));
}

/* ── 3. DISCIPLINE CARDS — interior teal glow wakes on hover ── */
.aos-hp .wp-block-columns > .wp-block-column.has-background-card-background-color::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: radial-gradient(70% 55% at 85% 0%, hsl(var(--aos-yellow) / 0.10), transparent 70%);
	opacity: 0;
	transition: opacity .4s var(--ease-out);
}
.aos-hp .wp-block-columns > .wp-block-column.has-background-card-background-color:hover::before { opacity: 1; }

/* ── 4. STATS — hairline separators, tabular numerals ── */
@media (min-width: 782px) {
	.aos-hp .wp-block-group.has-navy-background-color .wp-block-columns > .wp-block-column + .wp-block-column {
		border-left: 1px solid hsl(var(--paper) / 0.12);
		padding-left: clamp(1.25rem, 2.4vw, 2.25rem);
	}
}
.aos-hp .wp-block-group.has-navy-background-color .wp-block-column > h3 {
	font-variant-numeric: tabular-nums;
	letter-spacing: -0.01em;
}

/* ── 5. TESTIMONIALS — editorial pull quotes, serif open-quote flourish ── */
.aos-tq {
	position: relative;
	padding-top: 2.5rem;
	line-height: 1.55 !important;
	color: hsl(var(--fg)) !important;
}
.aos-tq::before {
	content: "\201C";
	position: absolute;
	top: -0.35rem;
	left: -0.1em;
	font-family: var(--editorial);
	font-size: 4rem;
	line-height: 1;
	font-weight: 500;
	color: hsl(var(--aos-yellow) / 0.9);
}
.aos-hp .wp-block-column:has(.aos-tq) {
	border-top: 1px solid hsl(var(--border));
	padding-top: 1.5rem;
}
.aos-hp .wp-block-column:has(.aos-tq) > p:nth-of-type(2) {
	font-weight: 600;
	color: hsl(var(--fg));
	margin-bottom: 0;
}
.aos-hp .wp-block-column:has(.aos-tq) > p:nth-of-type(3) {
	margin-top: 0.2rem !important;
}

/* ── 6. TECH MARQUEE — kinetic strip between work and impact ── */
.aos-marquee {
	overflow: hidden;
	border-top: 1px solid hsl(var(--border));
	border-bottom: 1px solid hsl(var(--border));
	background: hsl(var(--bg));
	padding-block: 1.1rem;
}
.aos-marquee__track {
	display: flex;
	width: max-content;
	animation: aosMarquee 36s linear infinite;
}
.aos-marquee:hover .aos-marquee__track { animation-play-state: paused; }
.aos-marquee__set { display: flex; align-items: center; flex: 0 0 auto; }
.aos-marquee__set span {
	font-family: var(--mono);
	font-size: 0.78rem;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
	padding-inline: 1.6rem;
}
.aos-marquee__set i {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: hsl(var(--aos-yellow));
	flex: 0 0 auto;
}
@keyframes aosMarquee { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
	.aos-marquee__track { animation: none; flex-wrap: wrap; width: auto; justify-content: center; row-gap: 8px; }
	.aos-marquee__set:last-child { display: none; }
}

/* ── 7. STAGGERED COLUMN ENTRANCES — JS-gated via .aos-reveal; uses the
   `translate` property so it never fights the hover `transform` lift ── */
.aos-reveal .wp-block-columns > .wp-block-column { opacity: 0; }
.aos-reveal.is-in .wp-block-columns > .wp-block-column {
	animation: aosRise .65s var(--ease-out) both;
}
.aos-reveal.is-in .wp-block-columns > .wp-block-column:nth-child(2) { animation-delay: 110ms; }
.aos-reveal.is-in .wp-block-columns > .wp-block-column:nth-child(3) { animation-delay: 220ms; }
.aos-reveal.is-in .wp-block-columns > .wp-block-column:nth-child(4) { animation-delay: 330ms; }
@keyframes aosRise {
	from { opacity: 0; translate: 0 18px; }
	to   { opacity: 1; translate: 0 0; }
}
@media (prefers-reduced-motion: reduce) {
	.aos-reveal .wp-block-columns > .wp-block-column { opacity: 1 !important; animation: none !important; translate: none !important; }
}

/* ── 8. FILMIC GRAIN — quiet texture on the dark bands ── */
.aos-hp .wp-block-group.has-navy-background-color::after,
.aos-hp .wp-block-group.has-navy-deep-background-color::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	opacity: 0.5;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ══════════════════════════════════════════════════════════════════════
   NUCLEAR PASS — craft systems layered over the whole page
   ══════════════════════════════════════════════════════════════════════ */

/* ── Scroll-progress hairline (element injected by aos-theme.js) ── */
.aos-progress {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	z-index: 300;
	background: linear-gradient(90deg, hsl(var(--aos-yellow)), hsl(var(--aos-blue)));
	transform: scaleX(0);
	transform-origin: left;
	pointer-events: none;
}

/* ── Brand text selection ── */
::selection {
	background: hsl(var(--aos-yellow) / 0.9);
	color: hsl(var(--paper));
}

/* ── Section headings rise into focus as their band reveals ── */
.aos-reveal > h2 { opacity: 0; }
.aos-reveal.is-in > h2 {
	animation: aosHeadRise .8s var(--ease-out) 90ms both;
}
@keyframes aosHeadRise {
	from { opacity: 0; translate: 0 22px; }
	to   { opacity: 1; translate: 0 0; }
}
@media (prefers-reduced-motion: reduce) {
	.aos-reveal > h2 { opacity: 1 !important; animation: none !important; translate: none !important; filter: none !important; }
}

/* ── FAQ — editorial split: sticky title column, questions column.
   Targets the only alt-background section that contains <details>. ── */
@media (min-width: 900px) {
	.aos-hp > .wp-block-group.has-background-alt-background-color:has(> details) {
		display: grid;
		grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.55fr);
		grid-auto-flow: dense;
		column-gap: clamp(2.5rem, 5vw, 5.5rem);
		align-items: start;
		/* alignfull escapes root padding via negative margins, so the % basis
		   is (section width - 2*root padding); add root padding back to land
		   on the exact shared 180px content edge */
		padding-inline: max(var(--wp--style--root--padding-left, 24px), calc((100% - var(--wp--style--global--content-size, 1080px)) / 2 + var(--wp--style--root--padding-left, 24px))) !important;
	}
	.aos-hp > .wp-block-group.has-background-alt-background-color:has(> details) > * {
		max-width: none !important;
		margin-inline: 0 !important;
	}
	.aos-hp > .wp-block-group.has-background-alt-background-color:has(> details) > .aos-eyebrow,
	.aos-hp > .wp-block-group.has-background-alt-background-color:has(> details) > h2 {
		grid-column: 1;
	}
	.aos-hp > .wp-block-group.has-background-alt-background-color:has(> details) > h2 {
		position: sticky;
		top: 130px;
		font-size: clamp(1.9rem, 2.8vw, 2.6rem) !important;
		line-height: 1.1;
		max-width: 14ch !important;
	}
	.aos-hp > .wp-block-group.has-background-alt-background-color:has(> details) > details {
		grid-column: 2;
	}
	.aos-hp > .wp-block-group.has-background-alt-background-color:has(> details) > details:first-of-type {
		margin-top: 0 !important;
	}
}

/* ── Finale — the italic word carries the whole headline ── */
.aos-hp .wp-block-group.has-navy-deep-background-color > h2 em {
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: 1.14em;
	letter-spacing: 0;
	color: hsl(var(--aos-yellow));
}

/* ══════════════════════════════════════════════════════════════════════
   CORE TYPE & RHYTHM SYSTEM — one scale, one rhythm, everywhere.
   Audit found 5 H2 sizes (40–68px), 4 section paddings (64–108px),
   uncapped 1080px headline measures, sibling titles 11px apart, and an
   inverted stat rhythm. This block is the single source of truth; it
   deliberately overrides the scattered per-section values above.

   Scale (from 16px body): 14 · 16 · 21 · 26 · 34 · 52 · 66
   Two display levels only: statement (thesis + finale) and section H2.
   ══════════════════════════════════════════════════════════════════════ */
:root {
	--type-statement: clamp(2.6rem, 1.45rem + 2.95vw, 4.125rem);  /* 66px @1440 */
	--type-h2:        clamp(2.25rem, 1.2rem + 2.3vw, 3.25rem);    /* 52px @1440 */
	--type-h2-sm:     clamp(1.75rem, 1.35rem + 1.3vw, 2.625rem);  /* 42px @1440 — narrow-column contexts */
	--type-h3-lg:     1.625rem;                                   /* 26px — open pillar titles */
	--type-h3:        1.3125rem;                                  /* 21px — card titles */
	--type-num:       2.125rem;                                   /* 34px — stat numerals */
	--type-lede:      1.25rem;                                    /* 20px */
	--disp-lh:        1.08;
	--disp-ls:        -0.022em;
	--sec-pad:        clamp(5.5rem, 4rem + 3.2vw, 7.5rem);        /* ~110px @1440 */
	--head-gap:       clamp(2.75rem, 2rem + 2vw, 3.5rem);         /* H2 → content, 56px @1440 */
}

/* Balanced wrapping for all display text */
.aos-hp h1, .aos-hp h2, .aos-hp h3,
.aos-work__name, .aos-work__head h2 { text-wrap: balance; }

/* One section padding for every band (mobile compression rule still wins <601px) */
@media (min-width: 601px) {
	.aos-hp > .wp-block-group,
	.aos-hp > .aos-work {
		padding-top: var(--sec-pad) !important;
		padding-bottom: var(--sec-pad) !important;
	}
}

/* One H2 spec: size, leading, tracking, weight, capped measure, shared edge */
.aos-hp > .wp-block-group > h2,
.aos-work__head h2 {
	font-size: var(--type-h2) !important;
	line-height: var(--disp-lh) !important;
	letter-spacing: var(--disp-ls) !important;
	font-weight: 500;
	max-width: 24ch;
	margin-top: 0;
	margin-bottom: var(--head-gap) !important;
}
.aos-hp > .wp-block-group > h2 {
	/* width-capped headings must still hang on the shared content edge */
	margin-left: max(0px, calc((100% - var(--wp--style--global--content-size, 1080px)) / 2)) !important;
	margin-right: auto !important;
}
/* Eyebrow → title: one gap */
.aos-hp > .wp-block-group > .aos-eyebrow + :is(h1, h2, h3),
.aos-work__head .aos-eyebrow + h2 {
	margin-top: 20px !important;
}
.aos-work__head { margin-bottom: 0; }
.aos-work__head h2 { margin-bottom: var(--head-gap); }
.aos-work__items { margin-top: 0; }

/* Statement bands (thesis + finale): one step up, tighter measure */
.aos-hp > .aos-sec-statement > h2,
.aos-hp > .wp-block-group.has-navy-deep-background-color > h2 {
	font-size: var(--type-statement) !important;
	line-height: 1.06 !important;
	max-width: 18ch;
}

/* Narrow-column H2 (FAQ split title) — mobile keeps the shared head gap */
.aos-hp > .wp-block-group.has-background-alt-background-color:has(> details) > h2 {
	font-size: var(--type-h2-sm) !important;
}

/* Interior (program) pages: map the size presets onto the system scale so
   every section title sits on 52/42/66 like the homepage (interior QA found
   44px strays). FAQ groups keep their deliberate narrow step-down. */
.aos-program-page h2.has-h2-font-size {
	font-size: var(--type-h2-sm) !important;
	line-height: var(--disp-lh) !important;
	letter-spacing: var(--disp-ls) !important;
}
.aos-program-page h2.has-h1-font-size {
	font-size: var(--type-h2) !important;
	line-height: var(--disp-lh) !important;
	letter-spacing: var(--disp-ls) !important;
}
/* FAQ groups keep the deliberate narrow step-down (must follow the rule above) */
.aos-program-page .wp-block-group:has(> details) > h2.has-h1-font-size {
	font-size: var(--type-h2-sm) !important;
}

/* Mid-level titles: two deliberate steps, both weight 500 */
.aos-hp > .aos-sec-index .wp-block-column > h3 {
	font-size: var(--type-h3-lg) !important;
	line-height: 1.25 !important;
	letter-spacing: -0.014em !important;
	font-weight: 500 !important;
}
.aos-hp .wp-block-column.has-background > .wp-block-heading,
.aos-hp .wp-block-column.has-border-color > .wp-block-heading {
	font-size: var(--type-h3) !important;
	line-height: 1.3 !important;
	letter-spacing: -0.01em !important;
	font-weight: 500 !important;
}
.aos-work__name { font-weight: 500; letter-spacing: -0.02em; }

/* One grid gap for every column layout */
.aos-hp .wp-block-columns { gap: 40px 32px !important; }

/* Stats: numeral one step up, label tight to its description (proximity fixed) */
.aos-hp .wp-block-group.has-navy-background-color .wp-block-column > h3 {
	font-size: var(--type-num) !important;
	font-weight: 600 !important;
	line-height: 1.1 !important;
	margin-bottom: 12px !important;
}
.aos-hp .wp-block-group.has-navy-background-color .wp-block-column > h3 + p {
	font-size: 0.9375rem;
	margin-bottom: 0 !important;
}
.aos-hp .wp-block-group.has-navy-background-color .wp-block-column > p + p {
	margin-top: 8px !important;
	font-size: 0.875rem;
	line-height: 1.55;
}

/* Ledes: readable measure, consistent size */
.aos-hp > .wp-block-group > p.has-lead-font-size {
	font-size: var(--type-lede) !important;
	line-height: 1.55 !important;
	max-width: 58ch;
}
.aos-vhero__tagline { font-size: clamp(1.1rem, 1.4vw, 1.3rem); }

/* ══════════════════════════════════════════════════════════════════════
   UNMISTAKABLY PREMIUM — structural pass. An editorial numbering spine,
   a second split layout to break header-plus-columns repetition, correct
   statement proximity, de-templated labels, unified button geometry.
   ══════════════════════════════════════════════════════════════════════ */

/* ── Section numbering spine: eyebrows carry a mono index (01–07).
   Only sections that have an eyebrow increment; the hidden legacy hero
   generates no box, so it never counts. ── */
.aos-hp { counter-reset: aossec; }
.aos-hp > :is(.wp-block-group, .aos-work):has(.aos-eyebrow) { counter-increment: aossec; }
.aos-hp .aos-eyebrow::before {
	content: counter(aossec, decimal-leading-zero);
	width: auto;
	height: auto;
	background: none;
	border-radius: 0;
	transform: none;
	display: inline-block;
	font-family: var(--mono);
	font-weight: 600;
	font-size: 1em;
	letter-spacing: 0.1em;
	color: hsl(var(--fg-subtle));
	margin-right: 12px;
}
.aos-hp .wp-block-group.has-navy-background-color .aos-eyebrow::before,
.aos-hp .wp-block-group.has-navy-deep-background-color .aos-eyebrow::before {
	color: hsl(var(--paper) / 0.55);
}

/* ── One team → editorial index: split layout with numbered rows.
   Mirrors the FAQ split so the page alternates layout systems instead of
   repeating header-plus-three-columns. ── */
@media (min-width: 900px) {
	.aos-hp > .aos-sec-index {
		display: grid;
		grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.55fr);
		grid-template-rows: auto 1fr;
		column-gap: clamp(2.5rem, 5vw, 5.5rem);
		align-items: start;
		padding-inline: max(var(--wp--style--root--padding-left, 24px), calc((100% - var(--wp--style--global--content-size, 1080px)) / 2 + var(--wp--style--root--padding-left, 24px))) !important;
	}
	.aos-hp > .aos-sec-index > * {
		max-width: none !important;
		margin-inline: 0 !important;
	}
	.aos-hp > .aos-sec-index > .aos-eyebrow { grid-column: 1; grid-row: 1; }
	.aos-hp > .aos-sec-index > h2 {
		grid-column: 1;
		grid-row: 2;
		align-self: start;
		position: sticky;
		top: 130px;
		font-size: var(--type-h2-sm) !important;
		max-width: 14ch !important;
	}
	.aos-hp > .aos-sec-index > .wp-block-columns {
		grid-column: 2;
		grid-row: 1 / span 2;
		display: block !important;
	}
	.aos-hp > .aos-sec-index .wp-block-columns > .wp-block-column {
		display: grid;
		grid-template-columns: 3rem minmax(0, 0.72fr) minmax(0, 1fr);
		column-gap: 32px;
		align-items: start;
		border-top: 1px solid hsl(var(--border));
		padding: 30px 0 !important;
		margin: 0 !important;
	}
	.aos-hp > .aos-sec-index .wp-block-columns > .wp-block-column:last-child {
		border-bottom: 1px solid hsl(var(--border));
	}
	/* number becomes the first grid cell; drop the mobile hairline/corner-number treatment */
	.aos-hp > .aos-sec-index .wp-block-columns > .wp-block-column::before {
		content: "0" counter(aos-team);
		position: static;
		width: auto;
		height: auto;
		background: none;
		font-family: var(--mono);
		font-size: 0.72rem;
		font-weight: 600;
		letter-spacing: 0.12em;
		color: hsl(var(--aos-yellow));
		padding-top: 7px;
	}
	.aos-hp > .aos-sec-index .wp-block-columns > .wp-block-column::after { display: none; }
	.aos-hp > .aos-sec-index .wp-block-columns > .wp-block-column > h3 { margin: 0 !important; }
	.aos-hp > .aos-sec-index .wp-block-columns > .wp-block-column > p {
		margin: 0 !important;
		color: hsl(var(--fg-muted));
	}
}

/* ── Statement proximity: support copy belongs to its headline ── */
.aos-hp > .aos-sec-statement > h2,
.aos-hp > .wp-block-group.has-navy-deep-background-color > h2 {
	margin-bottom: 1.5rem !important;
}
.aos-hp .wp-block-group.has-navy-deep-background-color .wp-block-buttons {
	margin-top: 2.5rem !important;
}

/* Core buttons follow the one .aos-btn system (navy pill + teal arrow chip,
   flipped to stroke-ghost on dark bands) — see the Buttons block above. A
   teal-gradient override used to live here and beat that system via
   !important on any page carrying .aos-hp; the system now owns it outright.
   WP global-styles' wp-element-button rule is out-specified there, not here. */

/* ── FAQ: questions scan as titles, answers read as body ── */
.aos-hp details.wp-block-details > summary {
	font-size: 1.0625rem;
	font-weight: 500;
	color: hsl(var(--fg));
}
.aos-hp details.wp-block-details > :not(summary) {
	color: hsl(var(--fg-muted));
	max-width: 58ch;
}

/* ── Work labels: one mono label voice (tags + roles), no pill chrome ── */
.aos-work__tag {
	font-family: var(--mono);
	font-weight: 600;
	letter-spacing: 0.12em;
}
.aos-work__roles { gap: 0 14px; }
.aos-work__roles li {
	background: none;
	border: none;
	padding: 0;
	border-radius: 0;
	display: inline-flex;
	align-items: center;
	font-family: var(--mono);
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-work__roles li + li::before {
	content: "";
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: hsl(var(--aos-yellow));
	margin-right: 14px;
	flex: 0 0 auto;
}

/* ── Discipline cards: room to breathe, one internal rhythm, mono index ── */
.aos-hp .wp-block-columns > .wp-block-column.has-background-card-background-color {
	padding: clamp(1.75rem, 1.3rem + 1.4vw, 2.375rem) !important;
}
.aos-hp .wp-block-columns > .wp-block-column.has-background-card-background-color > p:first-child {
	font-family: var(--mono);
	font-weight: 600 !important;
	font-size: 0.72rem;
	letter-spacing: 0.12em;
	margin-bottom: 14px !important;
}
.aos-hp .wp-block-columns > .wp-block-column.has-background-card-background-color > .wp-block-heading {
	margin-bottom: 6px !important;
}
.aos-hp .wp-block-columns > .wp-block-column.has-background-card-background-color > .wp-block-heading + p {
	margin-top: 0 !important;
	margin-bottom: 12px !important;
	font-size: 0.9375rem;
}

/* ══════════════════════════════════════════════════════════════════════
   COMPONENT LIBRARY PAGE (.aos-cl) — /components/
   The design-system showcase the site banner promises. Documents the
   tokens, the type scale, the button set, all aos/* blocks, and the AI
   assistance layer. Same system as the homepage: numbered sections,
   mono labels, hairline rows, shared type tokens.
   ══════════════════════════════════════════════════════════════════════ */
.aos-cl {
	counter-reset: aoscl;
	max-width: calc(var(--wp--style--global--content-size, 1080px) + 2 * var(--wp--style--root--padding-left, 24px));
	margin-inline: auto;
	padding-inline: var(--wp--style--root--padding-left, 24px);
	color: hsl(var(--fg));
}
.aos-cl__hero { padding: clamp(4.5rem, 8vw, 7.5rem) 0 clamp(3.5rem, 5vw, 5rem); }
.aos-cl__hero h1 {
	margin: 0 0 1.5rem;
	font-size: var(--type-statement);
	line-height: 1.06;
	letter-spacing: var(--disp-ls);
	font-weight: 500;
	max-width: 20ch;
	text-wrap: balance;
}
.aos-cl__hero h1 em {
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: 1.14em;
	letter-spacing: 0;
	color: hsl(var(--aos-yellow-deep));
}
.aos-cl__hero > p {
	margin: 0;
	font-size: var(--type-lede);
	line-height: 1.55;
	max-width: 58ch;
	color: hsl(var(--fg-muted));
}
.aos-cl section {
	padding-block: clamp(3.5rem, 5vw, 5.5rem);
	border-top: 1px solid hsl(var(--border));
}
.aos-cl__eyebrow {
	display: inline-flex;
	align-items: center;
	margin: 0 0 20px;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--aos-blue));
}
.aos-cl section .aos-cl__eyebrow::before {
	counter-increment: aoscl;
	content: counter(aoscl, decimal-leading-zero);
	font-family: var(--mono);
	font-weight: 600;
	letter-spacing: 0.1em;
	color: hsl(var(--fg-subtle));
	margin-right: 12px;
}
.aos-cl section h2 {
	margin: 0 0 1rem;
	font-size: var(--type-h2);
	line-height: var(--disp-lh);
	letter-spacing: var(--disp-ls);
	font-weight: 500;
	max-width: 24ch;
	text-wrap: balance;
}
.aos-cl__intro {
	margin: 0 0 var(--head-gap);
	max-width: 58ch;
	color: hsl(var(--fg-muted));
	line-height: 1.6;
}
/* Group label inside a section */
.aos-cl__group {
	margin: 2.5rem 0 0;
	padding-bottom: 12px;
	border-bottom: 1px solid hsl(var(--border));
	font-family: var(--mono);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
/* Color swatches */
.aos-cl__swatches {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: 24px;
}
.aos-cl__swatch-chip {
	height: 88px;
	border-radius: var(--r-md, 12px);
	border: 1px solid hsl(var(--border));
	margin-bottom: 10px;
}
.aos-cl__swatch strong { display: block; font-size: 0.9375rem; font-weight: 600; }
.aos-cl__swatch code {
	font-family: var(--mono);
	font-size: 0.72rem;
	letter-spacing: 0.02em;
	color: hsl(var(--fg-subtle));
}
/* Type specimens */
.aos-cl__spec {
	display: grid;
	grid-template-columns: 12rem minmax(0, 1fr);
	column-gap: 32px;
	align-items: baseline;
	padding-block: 22px;
	border-top: 1px solid hsl(var(--border-soft));
}
.aos-cl__spec:first-of-type { border-top: none; }
.aos-cl__spec-meta {
	font-family: var(--mono);
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-cl__spec > div { min-width: 0; overflow-wrap: break-word; }
.aos-cl__ex-statement { font-size: var(--type-statement); line-height: 1.06; letter-spacing: var(--disp-ls); font-weight: 500; }
.aos-cl__ex-statement em { font-family: var(--editorial); font-style: italic; font-size: 1.14em; color: hsl(var(--aos-yellow-deep)); }
.aos-cl__ex-h2 { font-size: var(--type-h2); line-height: var(--disp-lh); letter-spacing: var(--disp-ls); font-weight: 500; }
.aos-cl__ex-pillar { font-size: var(--type-h3-lg); line-height: 1.25; letter-spacing: -0.014em; font-weight: 500; }
.aos-cl__ex-card { font-size: var(--type-h3); line-height: 1.3; letter-spacing: -0.01em; font-weight: 500; }
.aos-cl__ex-body { font-size: 1rem; line-height: 1.6; color: hsl(var(--fg-muted)); max-width: 58ch; }
.aos-cl__ex-label { font-family: var(--mono); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: hsl(var(--aos-blue-deep)); }
/* Button row */
.aos-cl__btnrow { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; padding-top: 8px; }
/* Index rows (blocks + AI) */
.aos-cl__row {
	display: grid;
	grid-template-columns: 15rem minmax(0, 1fr);
	column-gap: 32px;
	align-items: start;
	padding-block: 14px;
	border-top: 1px solid hsl(var(--border-soft));
}
.aos-cl__row code {
	justify-self: start;
	font-family: var(--mono);
	font-size: 0.78rem;
	color: hsl(var(--aos-blue-deep));
	background: hsl(var(--aos-yellow-soft));
	padding: 3px 9px;
	border-radius: var(--r-sm, 6px);
	white-space: nowrap;
}
.aos-cl__row p { margin: 0; font-size: 0.9375rem; line-height: 1.55; color: hsl(var(--fg-muted)); }
.aos-cl__row p strong { color: hsl(var(--fg)); font-weight: 600; }
/* Closing band */
.aos-cl__cta { padding-block: clamp(3.5rem, 5vw, 5rem) clamp(5rem, 7vw, 7rem); border-top: 1px solid hsl(var(--border)); }
.aos-cl__cta p { margin: 0 0 2rem; font-size: var(--type-lede); line-height: 1.55; max-width: 58ch; color: hsl(var(--fg-muted)); }
@media (max-width: 700px) {
	.aos-cl__spec, .aos-cl__row { grid-template-columns: 1fr; row-gap: 8px; }
}

/* ── Content link focus-visible (teal ring) — accessibility + polish ── */
.aos-hp a:focus-visible,
.aos-form a:focus-visible,
.aos-contact-item__value a:focus-visible {
	outline: 2px solid hsl(var(--aos-blue));
	outline-offset: 3px;
	border-radius: 3px;
}

/* ── Sections butt directly (internal padding drives spacing) ──
   Removes the stray WP block-gap margin that shows the page bg as a white
   sliver between adjacent dark bands (e.g. stats -> CTA on service pages). */
.aos-hp > .wp-block-group { margin-block: 0; }

/* ── Testimonial quotes: decorative Cormorant quotation mark (editorial) ── */
.aos-tq { position: relative; font-family: var(--body); font-style: normal; border: 0; padding-left: 0; }
.aos-tq::before {
	content: "\201C";
	font-family: var(--editorial);
	font-weight: 600;
	font-size: 3.25rem;
	line-height: 0.75;
	color: hsl(var(--aos-blue));
	display: block;
	margin-bottom: 4px;
}

/* ── Project metric -> teal pill (elevates the proof point in Selected Work) ── */
.aos-metric {
	display: inline-block;
	background: hsl(var(--aos-yellow-soft));
	color: hsl(var(--aos-blue-deep));
	padding: 6px 13px;
	border-radius: var(--r-pill, 999px);
	font-size: 0.8rem;
	letter-spacing: -0.005em;
}


/* ══════════════════════════════════════════════════════════════════════
   CINEMATIC VIDEO-TEXT-MASK HERO  (.aos-vhero, injected via front-page.html)
   A pin-scrolled stage: a full-bleed looping video, with the headline cut
   out of a white overlay via mix-blend-mode:screen so the video plays
   THROUGH the letters. Scroll choreography: video → white-with-video-text
   reveal → supporting copy + teal CTA → exit up. Resolves to a warm LIGHT
   rest state (white surround), on-brand. Fully tokenized. Graceful no-JS
   and reduced-motion fallbacks show the resting state without the pin.
   ══════════════════════════════════════════════════════════════════════ */

/* The hero lives in page content as an aos-theme/hero-video-mask pattern. */

.aos-vhero {
	position: relative;
	height: 500vh;                         /* pin-scroll travel — matches the reference h-[500vh] for a deliberate, cinematic reveal */
	background: hsl(var(--bg));            /* light: after the stage exits, the hero hands off to the light thesis without a dark flash */
}
.aos-vhero__pin {
	position: sticky;
	top: 0;
	height: 100vh;
	overflow: hidden;
	isolation: isolate;                    /* contain mix-blend to this box */
}
/* Stage wraps every layer so the exit fade/translate hits them together */
.aos-vhero__stage {
	position: absolute;
	inset: 0;
	will-change: opacity, transform;
}
/* Layer 0 — dark cinematic fallback behind the video */
.aos-vhero__fallback {
	position: absolute;
	inset: 0;
	z-index: 0;
	background:
		radial-gradient(120% 90% at 72% 28%, hsl(var(--aos-blue-deep) / 0.55), transparent 60%),
		linear-gradient(140deg, hsl(var(--aos-navy-deep)) 0%, hsl(var(--aos-navy)) 55%, hsl(var(--aos-navy-deep)) 100%);
}
/* Layer 1 — full-bleed video */
.aos-vhero__video {
	position: absolute;
	inset: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(1.06) contrast(1.02);
}
/* Layer 1b — cinematic grade / vignette over the video for depth */
.aos-vhero__grade {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.04 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E"),
		radial-gradient(130% 105% at 50% 40%, transparent 46%, hsl(var(--aos-navy-deep) / 0.62) 100%),
		linear-gradient(180deg, hsl(var(--aos-navy-deep) / 0.28) 0%, transparent 28%, transparent 68%, hsl(var(--aos-navy-deep) / 0.44) 100%);
}
/* Layer 2 — the text mask. White fills the screen EXCEPT the letters, which
   show the video (screen blend: white→white, black text→shows backdrop). */
.aos-vhero__mask {
	position: absolute;
	inset: 0;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	background: hsl(var(--bg));
	mix-blend-mode: screen;
	opacity: 0;                            /* JS drives 0→1 across scroll 0.12–0.42 */
	will-change: opacity;
}
.aos-vhero__title {
	margin: 0;
	padding: 0 4vw;
	color: #000;                           /* pure black → screen-blend reveals video */
	-webkit-text-fill-color: #000;
	font-weight: 700;                      /* Instrument Sans tops out at 700… */
	-webkit-text-stroke: 0.021em #000;     /* …so a black stroke fattens the glyphs to ~900: far more video through the letterforms */
	font-size: clamp(3rem, 12.5vw, 14rem);
	line-height: 0.9;
	letter-spacing: -0.035em;
	text-align: center;
	text-transform: none;
	transform: translateY(-7vh);
	user-select: none;
}
/* Layer 3 — supporting copy (not blended; charcoal on the white rest state).
   A full-frame column anchored to the bottom: eyebrow → tagline → CTA row,
   then a hairline meta strip that squares off the frame. */
.aos-vhero__support {
	position: absolute;
	inset: 0;
	z-index: 4;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	padding: 0 clamp(1.5rem, 4vw, 3.5rem);
	opacity: 0;                            /* JS drives 0→1 across scroll 0.48–0.58 */
	will-change: opacity, transform;
	pointer-events: none;                  /* layer covers the frame; only the links catch clicks */
}
.aos-vhero__support a { pointer-events: auto; }
.aos-vhero__lockup {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: clamp(2.25rem, 6.5vh, 4.5rem);
}
.aos-vhero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.9rem;
	margin: 0 0 clamp(1.1rem, 2.6vh, 1.6rem);
	font-family: var(--mono);
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: hsl(var(--aos-yellow-deep));
}
.aos-vhero__eyebrow-tick {
	width: 22px;
	height: 1px;
	background: hsl(var(--aos-yellow-deep) / 0.5);
}
.aos-vhero__tagline {
	margin: 0;
	max-width: 46ch;
	font-size: clamp(1rem, 1.3vw, 1.2rem);
	line-height: 1.55;
	color: hsl(var(--fg-muted));
	text-wrap: balance;
}
.aos-vhero__tagline strong {
	display: block;
	margin-bottom: 0.3rem;
	font-size: 1.16em;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: hsl(var(--fg));
}
.aos-vhero__actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: center;
	gap: clamp(1.25rem, 2.5vw, 2rem);
	margin-top: clamp(1.75rem, 4.5vh, 2.75rem);
}
/* ── THE button. One system, site-wide: deep-navy pill, hairline inset
   light, teal arrow chip. Quiet at rest; the chip carries the color, the
   hover carries the motion. `--dark` flips it for navy/deep bands. ── */
.aos-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.9rem;
	padding: 0.4rem 0.45rem 0.4rem 1.5rem;
	border-radius: var(--r-pill, 999px);
	background: hsl(var(--aos-navy));
	border: 1px solid hsl(var(--aos-navy-deep) / 0.9);
	color: hsl(var(--paper));
	font-weight: 500;
	font-size: 0.95rem;
	letter-spacing: 0.01em;
	text-decoration: none;
	white-space: nowrap;
	box-shadow:
		inset 0 1px 0 hsl(0 0% 100% / 0.09),
		0 1px 2px hsl(var(--aos-navy-deep) / 0.18),
		0 12px 32px -8px hsl(var(--aos-navy-deep) / 0.35);
	transition:
		transform 0.25s var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1)),
		background-color 0.25s ease,
		box-shadow 0.25s ease;
}
.aos-btn__chip {
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border-radius: 999px;
	background: hsl(var(--aos-yellow));
	color: hsl(var(--aos-navy-deep));
	transition: background-color 0.25s ease;
}
.aos-btn__chip svg {
	display: block;
	transition: transform 0.25s var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1));
}
.aos-btn:hover {
	transform: translateY(-1px);
	background: hsl(var(--aos-navy-soft));
	color: hsl(var(--paper));
	box-shadow:
		inset 0 1px 0 hsl(0 0% 100% / 0.12),
		0 2px 4px hsl(var(--aos-navy-deep) / 0.2),
		0 18px 40px -10px hsl(var(--aos-navy-deep) / 0.42);
}
.aos-btn:hover .aos-btn__chip svg { transform: translateX(2px); }
.aos-btn:active { transform: translateY(0) scale(0.99); }
.aos-btn:focus-visible {
	outline: 2px solid hsl(var(--aos-yellow-deep));
	outline-offset: 3px;
}
/* Flipped for dark bands: hairline stroke ghost — transparent pill, thin
   light border, light label; the solid teal chip stays the single point
   of color and carries the primary weight. Hover warms the stroke to
   teal with a faint teal wash. */
.aos-btn--dark {
	background: transparent;
	border-color: hsl(var(--bg) / 0.28);
	color: hsl(var(--bg));
	box-shadow: none;
}
.aos-btn--dark:hover {
	background: hsl(var(--aos-yellow) / 0.08);
	border-color: hsl(var(--aos-yellow) / 0.65);
	color: hsl(var(--bg));
	box-shadow: 0 12px 32px -12px hsl(var(--aos-yellow) / 0.25);
}
.aos-btn--dark:focus-visible { outline-color: hsl(var(--aos-yellow)); }
/* Quiet secondary — underlined text link; `--dark` flips for navy bands */
.aos-ghost {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding-block: 0.3rem;
	font-size: 0.92rem;
	font-weight: 500;
	color: hsl(var(--fg-muted));
	text-decoration: none;
	background: linear-gradient(hsl(var(--fg) / 0.25), hsl(var(--fg) / 0.25)) left calc(100% - 2px) / 100% 1px no-repeat;
	transition: color 0.2s ease;
}
.aos-ghost:hover { color: hsl(var(--fg)); }
.aos-ghost__arrow {
	display: inline-block;
	transition: transform 0.25s var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1));
}
.aos-ghost:hover .aos-ghost__arrow { transform: translate(1px, 1px); }
.aos-ghost--dark {
	color: hsl(var(--bg) / 0.72);
	background-image: linear-gradient(hsl(var(--bg) / 0.3), hsl(var(--bg) / 0.3));
}
.aos-ghost--dark:hover { color: hsl(var(--bg)); }
/* Meta strip — hairline-ruled index of the three practices; squares the frame.
   Width + bottom padding keep it clear of corner overlay widgets. */
.aos-vhero__meta {
	width: 100%;
	max-width: min(1128px, 100%);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-top: 1.2rem;
	padding-bottom: clamp(2.5rem, 6vh, 4rem);
	border-top: 1px solid hsl(var(--fg) / 0.1);
	font-family: var(--mono);
	font-size: 0.66rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-vhero__meta-item {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	white-space: nowrap;
}
.aos-vhero__meta-num {
	font-weight: 600;
	color: hsl(var(--aos-yellow-deep));
}
/* Scroll nudge — over the dark video on landing; fades out immediately */
.aos-vhero__scroll {
	position: absolute;
	bottom: 2.4rem;
	left: 50%;
	transform: translateX(-50%);
	z-index: 5;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	color: hsl(var(--bg) / 0.82);
	font-family: ui-monospace, "JetBrains Mono", "SFMono-Regular", monospace;
	font-size: 0.66rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	pointer-events: none;
}
.aos-vhero__scroll-line {
	position: relative;
	width: 1px;
	height: 44px;
	background: hsl(var(--bg) / 0.28);
	overflow: hidden;
}
.aos-vhero__scroll-line::after {
	content: "";
	position: absolute;
	left: 0;
	top: -12px;
	width: 1px;
	height: 12px;
	background: hsl(var(--bg) / 0.95);
	animation: aosVheroLine 2.2s cubic-bezier(0.45, 0, 0.55, 1) infinite;
}
@keyframes aosVheroLine {
	0%   { transform: translateY(0); }
	100% { transform: translateY(56px); }
}

/* Brand mark on the video landing — the nav is hidden there, so the
   wordmark carries identity from the first frame; it yields to the nav. */
.aos-vhero__brand {
	position: absolute;
	top: clamp(1.5rem, 3.5vh, 2.25rem);
	left: clamp(1.5rem, 4vw, 3.5rem);
	z-index: 5;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	line-height: 1;
	pointer-events: none;
	transition: opacity 0.4s var(--ease-out);
}
.aos-vhero__brand-a  { font-weight: 300; font-size: 19px; letter-spacing: -0.01em; color: hsl(var(--bg) / 0.92); }
.aos-vhero__brand-dot { width: 5px; height: 5px; border-radius: 999px; background: hsl(var(--aos-yellow)); }
.aos-vhero__brand-os { font-weight: 700; font-size: 19px; letter-spacing: -0.02em; color: hsl(var(--bg)); }
body.is-nav-scrolled .aos-vhero__brand { opacity: 0; }
@media (max-width: 1023px) {
	.aos-vhero { height: 400vh; }
	.aos-vhero__title { font-size: clamp(2.75rem, 15vw, 5.5rem); -webkit-text-stroke-width: 0.016em; transform: translateY(-5vh); }
	.aos-vhero__lockup { margin-bottom: clamp(1.75rem, 5vh, 3rem); }
}
@media (max-width: 767px) {
	.aos-vhero__meta { display: none; }
	.aos-vhero__lockup { margin-bottom: clamp(2.5rem, 9vh, 4.5rem); }
	.aos-vhero__tagline strong { font-size: 1.1em; }
}
/* No-JS: show the resting state (white surround + video-text + copy), no pin */
@media (scripting: none) {
	.aos-vhero { height: 100vh; }
	.aos-vhero__mask,
	.aos-vhero__support { opacity: 1 !important; transform: none !important; }
	.aos-vhero__scroll { display: none; }
}
/* Reduced motion: no pin travel, no drift; resting state, video paused via JS */
@media (prefers-reduced-motion: reduce) {
	.aos-vhero { height: 100vh; }
	.aos-vhero__stage { opacity: 1 !important; transform: none !important; }
	.aos-vhero__mask,
	.aos-vhero__support { opacity: 1 !important; transform: none !important; }
	.aos-vhero__scroll,
	.aos-vhero__scroll-line::after { animation: none; display: none; }
}

/* ── Homepage immersive chrome ─────────────────────────────────────────
   On landing the video is the ONLY thing on screen. The nav slides down
   the moment the page is scrolled, reusing body.is-nav-scrolled (toggled
   at 8px by initScrollNav). The alert + utility strip are dropped on the
   homepage for a clean, cinematic top. Scoped to body.home:has(.aos-vhero) only. */
body.home:has(.aos-vhero) .wp-site-blocks > header.wp-block-template-part {
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	transform: translateY(-100%);
	transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1);
	will-change: transform;
}
body.home:has(.aos-vhero).is-nav-scrolled .wp-site-blocks > header.wp-block-template-part {
	transform: translateY(0);
}
/* Alert aside out of normal flow so the hero video starts at the very top */
body.home:has(.aos-vhero) .wp-site-blocks > aside.wp-block-template-part {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 40;
}
body.home:has(.aos-vhero) .alert { display: none; }
body.home:has(.aos-vhero) .util { display: none; }
body.home:has(.aos-vhero) .aos-vhero { margin-top: 0 !important; }
@media (prefers-reduced-motion: reduce) {
	body.home:has(.aos-vhero) .wp-site-blocks > header.wp-block-template-part { transition: none; }
}
/* No-JS: is-nav-scrolled never fires, so restore a normal, functional nav */
@media (scripting: none) {
	body.home:has(.aos-vhero) .wp-site-blocks > header.wp-block-template-part { position: sticky; transform: none; }
	body.home:has(.aos-vhero) .wp-site-blocks > aside.wp-block-template-part { position: relative; }
	body.home:has(.aos-vhero) .alert,
	body.home:has(.aos-vhero) .util { display: revert; }
}

/* ══════════════════════════════════════════════════════════════════════
   HOMEPAGE — STRUCTURAL REBUILD (aos-s-*)
   A conversion-ordered narrative in nine acts: manifesto → priced service
   index → shipped work → impact wall → engagement timeline → voices →
   objection-handling FAQ → scarcity-backed close. Every section owns a
   distinct layout: split grids, ghost numerals, an asymmetric stat matrix,
   a process rail. One shared frame, one eyebrow system, one button.
   ══════════════════════════════════════════════════════════════════════ */

/* ── Shared frame + section head system ── */
.aos-s-inner,
.aos-work__inner {
	max-width: calc(1200px + 2 * var(--wp--style--root--padding-left, 24px));
	margin-inline: auto;
	padding-inline: var(--wp--style--root--padding-left, 24px);
}
.aos-s-eyebrow {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0;
	font-family: var(--mono);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-eyebrow__num { color: hsl(var(--fg-subtle)); }
.aos-s-eyebrow__tick { width: 26px; height: 1px; background: hsl(var(--aos-yellow-deep) / 0.5); flex: 0 0 auto; }
.aos-s-eyebrow--dark { color: hsl(var(--aos-yellow)); }
.aos-s-eyebrow--dark .aos-s-eyebrow__num { color: hsl(var(--bg) / 0.5); }
.aos-s-eyebrow--dark .aos-s-eyebrow__tick { background: hsl(var(--aos-yellow) / 0.5); }
.aos-s-eyebrow--center { justify-content: center; }
.aos-s-title {
	margin: 1.1rem 0 0;
	font-family: var(--display);
	font-size: clamp(2.1rem, 3.6vw, 3.4rem);
	line-height: 1.05;
	letter-spacing: -0.025em;
	font-weight: 500;
	color: hsl(var(--fg));
}
.aos-s-lede {
	margin: 1.2rem 0 0;
	max-width: 52ch;
	font-size: clamp(1rem, 1.25vw, 1.15rem);
	line-height: 1.6;
	color: hsl(var(--fg-muted));
}

/* ── ACT 1: THESIS — dictionary-entry manifesto + proof strip ── */
.aos-s-thesis {
	position: relative;
	isolation: isolate;
	border-top: 1px solid hsl(var(--border));
	padding-block: clamp(5rem, 12vh, 8rem);
}
.aos-s-thesis::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: radial-gradient(46% 64% at 8% 12%, hsl(var(--aos-yellow-soft) / 0.55), transparent 70%);
}
.aos-s-thesis__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(230px, 320px);
	gap: clamp(2.5rem, 6vw, 6rem);
	align-items: end;
}
.aos-s-thesis__line {
	margin: 0;
	font-family: var(--display);
	font-size: clamp(2.3rem, 4.6vw, 4.3rem);
	line-height: 1.08;
	letter-spacing: -0.028em;
	font-weight: 500;
	color: hsl(var(--fg));
}
.aos-s-thesis__line em {
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: 1.1em;
	letter-spacing: 0;
}
.aos-s-thesis__brand { color: hsl(var(--aos-yellow-deep)); }
.aos-s-thesis__note {
	display: flex;
	flex-direction: column;
	gap: 0.7rem;
	padding: 0.4rem 0 0.4rem 1.6rem;
	border-left: 1px solid hsl(var(--border-strong));
	font-family: var(--mono);
}
.aos-s-thesis__pron { font-size: 0.72rem; letter-spacing: 0.08em; color: hsl(var(--fg-subtle)); }
.aos-s-thesis__def { font-size: 0.86rem; line-height: 1.6; color: hsl(var(--fg-muted)); }
.aos-s-thesis__ref { font-size: 0.72rem; letter-spacing: 0.05em; color: hsl(var(--fg-subtle)); }
.aos-s-thesis__ref em { font-family: var(--editorial); font-style: italic; font-size: 1.15em; color: hsl(var(--aos-yellow-deep)); }
.aos-s-thesis__props {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1.5rem, 3.5vw, 3.5rem);
	list-style: none;
	margin: clamp(3.5rem, 8vh, 5.5rem) 0 0;
	padding: clamp(1.9rem, 3.5vh, 2.6rem) 0 0;
	border-top: 1px solid hsl(var(--border));
}
.aos-s-thesis__props li { display: flex; flex-direction: column; gap: 0.55rem; }
.aos-s-thesis__prop-num {
	font-family: var(--mono);
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-thesis__props strong { font-size: 1.06rem; font-weight: 600; letter-spacing: -0.01em; color: hsl(var(--fg)); }
.aos-s-thesis__props li > span:not(.aos-s-thesis__prop-num) { font-size: 0.92rem; line-height: 1.58; color: hsl(var(--fg-muted)); }

/* ── ACT 2: OFFER — the priced service index. Full-width rows, ghost
   numerals, deliverable ticks, price anchor, arrow chip. The whole row
   is the link. ── */
.aos-s-offer {
	border-top: 1px solid hsl(var(--border));
	background: hsl(var(--bg-alt));
	padding-block: clamp(5rem, 12vh, 8rem);
}
.aos-s-offer .aos-s-head { margin-bottom: clamp(2.75rem, 6vh, 4.25rem); }
.aos-s-offer__rows { display: flex; flex-direction: column; border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-offer__row {
	position: relative;
	display: grid;
	grid-template-columns: minmax(90px, 150px) minmax(0, 1fr) auto;
	gap: clamp(1.25rem, 3vw, 3rem);
	align-items: start;
	padding: clamp(1.9rem, 4.5vh, 3rem) clamp(0.5rem, 1.5vw, 1.5rem);
	border-bottom: 1px solid hsl(var(--border-strong));
	text-decoration: none;
	color: inherit;
	transition: background-color 0.3s var(--ease-out);
}
.aos-s-offer__row:hover { background: hsl(var(--paper)); }
.aos-s-offer__row:focus-visible { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: -2px; }
.aos-s-offer__ghost {
	font-family: var(--display);
	font-weight: 700;
	font-size: clamp(3rem, 6vw, 5.5rem);
	line-height: 0.85;
	letter-spacing: -0.04em;
	color: hsl(var(--fg) / 0.07);
	user-select: none;
	transition: color 0.35s ease;
}
.aos-s-offer__row:hover .aos-s-offer__ghost { color: hsl(var(--aos-yellow-deep) / 0.16); }
.aos-s-offer__name {
	margin: 0;
	font-family: var(--display);
	font-size: clamp(1.5rem, 2.6vw, 2.3rem);
	font-weight: 500;
	letter-spacing: -0.02em;
	line-height: 1.08;
	color: hsl(var(--fg));
}
.aos-s-offer__kicker {
	margin: 0.55rem 0 0;
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: 1.18rem;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-offer__desc { margin: 0.85rem 0 0; max-width: 56ch; font-size: 0.98rem; line-height: 1.6; color: hsl(var(--fg-muted)); }
.aos-s-offer__tags { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; margin: 1.15rem 0 0; padding: 0; list-style: none; }
.aos-s-offer__tags li {
	position: relative;
	padding-left: 14px;
	font-family: var(--mono);
	font-size: 0.68rem;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-s-offer__tags li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 6px;
	height: 1px;
	background: hsl(var(--aos-yellow-deep));
}
.aos-s-offer__side {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1rem;
	align-self: stretch;
}
.aos-s-offer__price {
	font-family: var(--mono);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--fg));
	padding: 7px 14px;
	border: 1px solid hsl(var(--border-strong));
	border-radius: 999px;
	background: hsl(var(--paper));
	white-space: nowrap;
}
.aos-s-offer__arrow {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 999px;
	border: 1px solid hsl(var(--border-strong));
	background: hsl(var(--paper));
	color: hsl(var(--fg));
	transition: background-color 0.3s var(--ease-out), border-color 0.3s var(--ease-out), color 0.3s var(--ease-out), transform 0.3s var(--ease-out);
}
.aos-s-offer__row:hover .aos-s-offer__arrow {
	background: hsl(var(--aos-yellow));
	border-color: hsl(var(--aos-yellow));
	color: hsl(var(--aos-navy-deep));
	transform: translateX(4px);
}

/* ── ACT 3: WORK — keep the device art direction; add ghost case numerals,
   mono meta, hairline role chips, a closing conversion row, wider frame ── */
.aos-work { padding-block: clamp(5rem, 12vh, 8rem); }
.aos-work__head { max-width: none; }
.aos-work__head h2 {
	margin: 1.1rem 0 0;
	max-width: 30ch;
	font-size: clamp(2.1rem, 3.6vw, 3.4rem);
	line-height: 1.05;
	letter-spacing: -0.025em;
	font-weight: 500;
}
.aos-work__ghostnum {
	position: absolute;
	z-index: -2;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -56%);
	font-family: var(--display);
	font-weight: 700;
	font-size: clamp(11rem, 24vw, 22rem);
	line-height: 1;
	letter-spacing: -0.05em;
	color: hsl(var(--fg) / 0.06);
	pointer-events: none;
	user-select: none;
}
.aos-work__tag {
	display: flex;
	align-items: center;
	gap: 12px;
	font-family: var(--mono);
	font-weight: 600;
	font-size: 0.68rem;
	letter-spacing: 0.18em;
	color: hsl(var(--aos-yellow-deep));
}
.aos-work__idx { color: hsl(var(--fg-subtle)); }
.aos-work__name { font-size: clamp(1.7rem, 2.6vw, 2.4rem); font-weight: 500; }
.aos-work__roles li {
	font-family: var(--mono);
	font-size: 0.64rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: hsl(var(--fg-muted));
	background: transparent;
	border: 1px solid hsl(var(--border-strong));
	padding: 6px 12px;
}
.aos-work__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1.5rem;
	margin-top: clamp(4rem, 9vh, 6.5rem);
	padding-top: clamp(1.9rem, 3.5vh, 2.6rem);
	border-top: 1px solid hsl(var(--border));
}
.aos-work__foot p {
	margin: 0;
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: clamp(1.25rem, 1.9vw, 1.6rem);
	color: hsl(var(--fg));
}

/* ── Stack divider — labelled marquee ── */
.aos-s-stack { padding-block: clamp(2.25rem, 5vh, 3.5rem); border-top: 1px solid hsl(var(--border)); }
.aos-s-stack__label {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	margin: 0 0 1.5rem;
	font-family: var(--mono);
	font-size: 0.66rem;
	font-weight: 600;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-s-stack__tick { width: 22px; height: 1px; background: hsl(var(--border-strong)); }
.aos-s-stack .aos-marquee { border: 0; padding: 0; }

/* ── ACT 4: IMPACT — asymmetric stat matrix on navy-deep. Head cell,
   2×2 count-up stats, and a full-width proof quote share one hairline
   lattice; glows bleed through translucent cells. ── */
.aos-s-impact {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: hsl(var(--aos-navy-deep));
	padding-block: clamp(5rem, 12vh, 8rem);
}
.aos-s-impact::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.03 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E"),
		radial-gradient(50% 60% at 84% 6%, hsl(var(--aos-yellow) / 0.13), transparent 65%),
		radial-gradient(45% 55% at 6% 96%, hsl(var(--aos-blue) / 0.12), transparent 62%);
}
.aos-s-impact::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, hsl(var(--aos-yellow) / 0.55), transparent);
}
.aos-s-impact__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1fr);
	gap: 1px;
	background: hsl(var(--bg) / 0.12);
	border: 1px solid hsl(var(--bg) / 0.12);
}
.aos-s-impact__grid > * {
	margin: 0;
	background: hsl(var(--aos-navy-deep) / 0.55);
	padding: clamp(1.75rem, 3.2vw, 2.9rem);
}
.aos-s-impact__head { grid-row: 1 / span 2; }
.aos-s-impact .aos-s-title { color: hsl(var(--bg)); }
.aos-s-impact .aos-s-title em { color: hsl(var(--aos-yellow)); }
.aos-s-impact .aos-s-lede { color: hsl(var(--bg) / 0.55); }
.aos-s-impact__value { margin: 0; display: flex; align-items: baseline; gap: 0.4rem; }
.aos-s-impact__num {
	font-family: var(--display);
	font-size: clamp(3rem, 5.5vw, 4.75rem);
	font-weight: 600;
	letter-spacing: -0.035em;
	line-height: 1;
	color: hsl(var(--bg));
	font-variant-numeric: tabular-nums;
}
.aos-s-impact__unit {
	font-family: var(--mono);
	font-size: clamp(0.95rem, 1.4vw, 1.2rem);
	font-weight: 600;
	letter-spacing: 0.04em;
	color: hsl(var(--aos-yellow));
}
.aos-s-impact__label {
	margin: 1.1rem 0 0;
	font-family: var(--mono);
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: hsl(var(--aos-yellow));
}
.aos-s-impact__desc { margin: 0.5rem 0 0; font-size: 0.88rem; line-height: 1.55; color: hsl(var(--bg) / 0.55); }
.aos-s-impact__quote { grid-column: 1 / -1; }
.aos-s-impact__quote blockquote {
	margin: 0;
	max-width: 58ch;
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: clamp(1.2rem, 1.9vw, 1.55rem);
	line-height: 1.45;
	color: hsl(var(--bg) / 0.88);
}
.aos-s-impact__quote figcaption {
	margin-top: 1rem;
	font-family: var(--mono);
	font-size: 0.68rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.5);
}
.aos-s-impact__quote figcaption strong { color: hsl(var(--bg) / 0.85); font-weight: 600; }

/* ── ACT 5: PROCESS — the engagement rail. A single hairline runs the
   width; four markered steps hang off it with week stamps. ── */
.aos-s-process { border-top: 1px solid hsl(var(--border)); padding-block: clamp(5rem, 12vh, 8rem); }
.aos-s-process .aos-s-head { margin-bottom: clamp(3rem, 7vh, 4.75rem); }
.aos-s-process__rail {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(1.5rem, 3vw, 2.75rem);
	margin: 0;
	padding: 0;
	list-style: none;
}
.aos-s-process__rail::before {
	content: "";
	position: absolute;
	top: 5px;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, hsl(var(--aos-yellow-deep) / 0.6), hsl(var(--border-strong)));
}
.aos-s-process__step { position: relative; padding-top: 1.9rem; }
.aos-s-process__marker {
	position: absolute;
	top: 0;
	left: 0;
	width: 11px;
	height: 11px;
	border-radius: 999px;
	background: hsl(var(--bg));
	border: 2px solid hsl(var(--aos-yellow-deep));
}
.aos-s-process__when {
	font-family: var(--mono);
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-process__step h3 {
	margin: 0.65rem 0 0;
	font-family: var(--display);
	font-size: 1.28rem;
	font-weight: 600;
	letter-spacing: -0.015em;
	color: hsl(var(--fg));
}
.aos-s-process__step p { margin: 0.6rem 0 0; font-size: 0.94rem; line-height: 1.6; color: hsl(var(--fg-muted)); }

/* ── ACT 6: VOICES — one voice at a time, full stage. A single display-
   scale serif quote with maximum air, a quiet proof line in the
   attribution row, and a hairline rail (counter + prev/next). Slides
   stack in one grid cell and crossfade; gentle auto-advance pauses on
   hover/focus, stops on manual use, and is off under reduced motion. ── */
.aos-s-voices { border-top: 1px solid hsl(var(--border)); padding-block: clamp(5rem, 12vh, 8rem); }
.aos-s-voices .aos-s-head { margin-bottom: clamp(3rem, 7vh, 4.5rem); }
.aos-s-voices__viewport { display: grid; }
.aos-s-voices__slide {
	grid-area: 1 / 1;
	margin: 0;
	opacity: 0;
	translate: 0 14px;
	pointer-events: none;
	transition: opacity 0.55s var(--ease-out), translate 0.55s var(--ease-out);
}
.aos-s-voices__slide.is-active {
	opacity: 1;
	translate: 0 0;
	pointer-events: auto;
}
.aos-s-voices__slide::before {
	content: "\201C";
	display: block;
	height: 0.6em;
	font-family: var(--editorial);
	font-size: clamp(3.5rem, 5.5vw, 5rem);
	line-height: 1;
	margin-bottom: 1.5rem;
	color: hsl(var(--aos-yellow));
}
.aos-s-voices__slide blockquote {
	margin: 0;
	max-width: 30ch;
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: clamp(1.7rem, 3.1vw, 2.7rem);
	line-height: 1.42;
	color: hsl(var(--fg));
	text-wrap: pretty;
}
.aos-s-voices__slide mark {
	background: linear-gradient(hsl(var(--aos-yellow) / 0.26), hsl(var(--aos-yellow) / 0.26)) 0 86% / 100% 0.16em no-repeat;
	color: hsl(var(--aos-yellow-deep));
	padding-bottom: 0.05em;
}
.aos-s-voices__slide figcaption {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 1rem;
	margin-top: clamp(1.75rem, 4vh, 2.5rem);
}
.aos-s-voices__monogram {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	border-radius: 999px;
	background: hsl(var(--aos-yellow-soft));
	border: 1px solid hsl(var(--aos-yellow) / 0.3);
	color: hsl(var(--aos-yellow-deep));
	font-family: var(--mono);
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.05em;
}
.aos-s-voices__who { display: flex; flex-direction: column; gap: 2px; }
.aos-s-voices__who strong { font-size: 0.95rem; font-weight: 600; color: hsl(var(--fg)); }
.aos-s-voices__who span { font-size: 0.8rem; color: hsl(var(--fg-subtle)); }
/* Quiet proof line — the quote's number, distilled to one breath */
.aos-s-voices__proof {
	margin-left: auto;
	display: inline-flex;
	align-items: baseline;
	gap: 0.5rem;
	font-family: var(--mono);
	font-size: 0.66rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-s-voices__proof em {
	font-family: var(--display);
	font-style: normal;
	font-weight: 600;
	font-size: 1.35rem;
	line-height: 1;
	letter-spacing: -0.02em;
	color: hsl(var(--aos-yellow-deep));
}
/* Rail — counter left, hairline arrows right */
.aos-s-voices__rail {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-top: clamp(2.5rem, 6vh, 3.75rem);
	padding-top: 1.4rem;
	border-top: 1px solid hsl(var(--border));
}
.aos-s-voices__count {
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	font-family: var(--mono);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	color: hsl(var(--fg-subtle));
}
.aos-s-voices__count [data-voices-current] { color: hsl(var(--aos-yellow-deep)); }
.aos-s-voices__count i { width: 22px; height: 1px; background: hsl(var(--border-strong)); }
.aos-s-voices__nav { display: flex; gap: 0.6rem; }
.aos-s-voices__btn {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border-radius: 999px;
	border: 1px solid hsl(var(--border-strong));
	background: hsl(var(--paper));
	color: hsl(var(--fg));
	cursor: pointer;
	transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.25s var(--ease-out);
}
.aos-s-voices__btn:hover {
	background: hsl(var(--aos-yellow));
	border-color: hsl(var(--aos-yellow));
	color: hsl(var(--aos-navy-deep));
}
.aos-s-voices__btn:active { transform: scale(0.96); }
.aos-s-voices__btn:focus-visible { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: 3px; }
.aos-s-voices__btn svg { display: block; }
@media (prefers-reduced-motion: reduce) {
	.aos-s-voices__slide { transition: none; translate: none; }
}
@media (max-width: 640px) {
	.aos-s-voices__proof { margin-left: 0; flex-basis: 100%; }
}

/* ── ACT 7: FAQ — sticky pitch column + animated ledger of answers ── */
.aos-s-faq { border-top: 1px solid hsl(var(--border)); background: hsl(var(--bg-alt)); padding-block: clamp(5rem, 12vh, 8rem); }
.aos-s-faq__grid {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: clamp(2.5rem, 6vw, 6rem);
	align-items: start;
}
.aos-s-faq .aos-s-head { position: sticky; top: 110px; }
.aos-s-faq .aos-ghost { margin-top: 1.6rem; }
.aos-s-faq__list { border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-faq__item { border-bottom: 1px solid hsl(var(--border-strong)); }
.aos-s-faq__item summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	padding: 1.45rem 0.25rem;
	cursor: pointer;
	list-style: none;
}
.aos-s-faq__item summary::-webkit-details-marker { display: none; }
.aos-s-faq__item summary:focus-visible { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: 2px; }
.aos-s-faq__q { font-size: 1.08rem; font-weight: 600; letter-spacing: -0.01em; color: hsl(var(--fg)); transition: color 0.2s ease; }
.aos-s-faq__item summary:hover .aos-s-faq__q { color: hsl(var(--aos-yellow-deep)); }
.aos-s-faq__icon {
	position: relative;
	flex: 0 0 auto;
	width: 30px;
	height: 30px;
	border-radius: 999px;
	border: 1px solid hsl(var(--border-strong));
	background: hsl(var(--paper));
	transition: transform 0.3s var(--ease-out), background-color 0.3s ease, border-color 0.3s ease;
}
.aos-s-faq__icon::before,
.aos-s-faq__icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 10px;
	height: 1.5px;
	background: hsl(var(--fg));
	translate: -50% -50%;
	transition: background-color 0.3s ease;
}
.aos-s-faq__icon::after { rotate: 90deg; }
.aos-s-faq__item[open] .aos-s-faq__icon {
	background: hsl(var(--aos-yellow));
	border-color: hsl(var(--aos-yellow));
	transform: rotate(45deg);
}
.aos-s-faq__item[open] .aos-s-faq__icon::before,
.aos-s-faq__item[open] .aos-s-faq__icon::after { background: hsl(var(--aos-navy-deep)); }
.aos-s-faq__a > div { overflow: hidden; }
.aos-s-faq__a p { margin: 0; padding: 0.1rem 3.5rem 1.5rem 0.25rem; max-width: 62ch; font-size: 0.97rem; line-height: 1.65; color: hsl(var(--fg-muted)); }

/* ── ACT 8: FINALE — scarcity-backed close on navy-deep ── */
.aos-s-finale {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: hsl(var(--aos-navy-deep));
	padding-block: clamp(6rem, 15vh, 10rem);
	text-align: center;
}
.aos-s-finale::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	/* Glow sits behind the CTA row, not on the bottom edge — the section
	   settles back to flat navy-deep before the footer seam. */
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.03 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E"),
		radial-gradient(48% 52% at 50% 74%, hsl(var(--aos-yellow) / 0.15), transparent 62%),
		radial-gradient(40% 50% at 50% -12%, hsl(var(--aos-blue) / 0.12), transparent 60%);
}
.aos-s-finale::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, hsl(var(--aos-yellow) / 0.55), transparent);
}
.aos-s-finale__title {
	margin: 1.5rem 0 0;
	font-family: var(--display);
	font-size: clamp(2.6rem, 5.5vw, 4.6rem);
	line-height: 1.04;
	letter-spacing: -0.03em;
	font-weight: 500;
	color: hsl(var(--bg));
}
.aos-s-finale__title em {
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: 1.08em;
	color: hsl(var(--aos-yellow));
}
.aos-s-finale__lede {
	margin: 1.4rem auto 0;
	max-width: 52ch;
	font-size: clamp(1.02rem, 1.3vw, 1.2rem);
	line-height: 1.6;
	color: hsl(var(--bg) / 0.65);
}
.aos-s-finale__actions {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: clamp(1.25rem, 2.5vw, 2rem);
	margin-top: clamp(2.25rem, 5.5vh, 3.25rem);
}
.aos-s-finale__note {
	margin: clamp(2.5rem, 6vh, 3.5rem) 0 0;
	font-family: var(--mono);
	font-size: 0.68rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.45);
}

/* ── Entrance stagger for the new structures (rides .aos-reveal) ── */
@keyframes aosSRise {
	from { opacity: 0; translate: 0 18px; }
	to   { opacity: 1; translate: 0 0; }
}
.aos-reveal :is(.aos-s-thesis__props li, .aos-s-offer__row, .aos-s-process__step, .aos-s-impact__grid > *, .aos-s-voices__card) { opacity: 0; }
.aos-reveal.is-in :is(.aos-s-thesis__props li, .aos-s-offer__row, .aos-s-process__step, .aos-s-impact__grid > *, .aos-s-voices__card) {
	animation: aosSRise 0.6s var(--ease-out) 0.15s forwards;
}
.aos-reveal.is-in :is(.aos-s-thesis__props li, .aos-s-offer__row, .aos-s-process__step, .aos-s-impact__grid > *, .aos-s-voices__card):nth-child(2) { animation-delay: 0.25s; }
.aos-reveal.is-in :is(.aos-s-thesis__props li, .aos-s-offer__row, .aos-s-process__step, .aos-s-impact__grid > *, .aos-s-voices__card):nth-child(3) { animation-delay: 0.35s; }
.aos-reveal.is-in :is(.aos-s-thesis__props li, .aos-s-offer__row, .aos-s-process__step, .aos-s-impact__grid > *, .aos-s-voices__card):nth-child(4) { animation-delay: 0.45s; }
.aos-reveal.is-in :is(.aos-s-thesis__props li, .aos-s-offer__row, .aos-s-process__step, .aos-s-impact__grid > *, .aos-s-voices__card):nth-child(5) { animation-delay: 0.55s; }
.aos-reveal.is-in :is(.aos-s-thesis__props li, .aos-s-offer__row, .aos-s-process__step, .aos-s-impact__grid > *, .aos-s-voices__card):nth-child(6) { animation-delay: 0.65s; }
@media (prefers-reduced-motion: reduce) {
	.aos-reveal :is(.aos-s-thesis__props li, .aos-s-offer__row, .aos-s-process__step, .aos-s-impact__grid > *, .aos-s-voices__card) { opacity: 1 !important; animation: none !important; }
}

/* ── Responsive: the structures reflow, never squeeze ── */
@media (max-width: 1023px) {
	.aos-s-impact__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.aos-s-impact__head { grid-column: 1 / -1; grid-row: auto; }
}
@media (max-width: 900px) {
	.aos-s-thesis__grid { grid-template-columns: 1fr; align-items: start; }
	.aos-s-thesis__note { border-left: 0; border-top: 1px solid hsl(var(--border-strong)); padding: 1.25rem 0 0; max-width: 40ch; }
	.aos-s-thesis__props { grid-template-columns: 1fr; gap: 1.5rem; }
	.aos-s-offer__row { grid-template-columns: minmax(0, 1fr); }
	.aos-s-offer__ghost { position: absolute; top: 1.4rem; right: 0.5rem; font-size: 3.4rem; opacity: 0.7; }
	.aos-s-offer__side { flex-direction: row; align-items: center; justify-content: flex-start; margin-top: 1.25rem; }
	.aos-s-process__rail { grid-template-columns: 1fr; gap: 2.25rem; }
	.aos-s-process__rail::before { top: 0; bottom: 0; left: 5px; right: auto; width: 1px; height: auto; background: linear-gradient(180deg, hsl(var(--aos-yellow-deep) / 0.6), hsl(var(--border-strong))); }
	.aos-s-process__step { padding-top: 0; padding-left: 2rem; }
	.aos-s-faq__grid { grid-template-columns: 1fr; }
	.aos-s-faq .aos-s-head { position: static; }
	.aos-s-faq__a p { padding-right: 1rem; }
}
@media (max-width: 640px) {
	.aos-s-impact__grid { grid-template-columns: 1fr; }
	.aos-work__foot { flex-direction: column; align-items: flex-start; }
	.aos-work__ghostnum { font-size: clamp(9rem, 40vw, 13rem); }
}

/* ══════════════════════════════════════════════════════════════════════
   WORK DECK — each case study is a full-width, art-directed panel that
   sticks and stacks as you scroll: its own palette, an oversized device
   cropped by the card edge, a ghost case numeral. The final (platform)
   card goes navy-deep and hands the page off to the Impact band.
   ══════════════════════════════════════════════════════════════════════ */
.aos-work__head { margin-bottom: clamp(2.5rem, 6vh, 4rem); }
.aos-work__deck {
	max-width: calc(1200px + 2 * var(--wp--style--root--padding-left, 24px));
	margin-inline: auto;
	padding-inline: var(--wp--style--root--padding-left, 24px);
	display: flex;
	flex-direction: column;
}
.aos-work__card {
	position: sticky;
	top: clamp(84px, 11vh, 130px);
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: clamp(1.5rem, 4vw, 4rem);
	align-items: center;
	min-height: min(74vh, 700px);
	margin-bottom: clamp(2.5rem, 6vh, 4rem);
	padding: clamp(2rem, 4vw, 4.5rem);
	border-radius: 28px;
	border: 1px solid hsl(var(--border));
	overflow: hidden;
	isolation: isolate;
	background: hsl(var(--paper));
	box-shadow:
		0 -24px 60px -46px hsl(var(--aos-navy-deep) / 0.5),
		0 30px 80px -40px hsl(var(--aos-navy-deep) / 0.35);
}
.aos-work__card:last-child { margin-bottom: 0; }
.aos-work__card--possibility {
	background:
		radial-gradient(60% 80% at 88% 18%, hsl(var(--aos-yellow) / 0.14), transparent 65%),
		linear-gradient(115deg, hsl(var(--paper)) 45%, hsl(var(--aos-yellow-soft)) 100%);
}
.aos-work__card--aizen {
	background:
		radial-gradient(60% 80% at 88% 82%, hsl(var(--aos-blue) / 0.12), transparent 65%),
		linear-gradient(115deg, hsl(var(--paper)) 45%, hsl(var(--aos-blue) / 0.09) 100%);
}
.aos-work__card--platform {
	border-color: hsl(var(--aos-navy-soft));
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.03 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E"),
		radial-gradient(55% 70% at 85% 10%, hsl(var(--aos-yellow) / 0.16), transparent 62%),
		radial-gradient(50% 60% at 10% 95%, hsl(var(--aos-blue) / 0.14), transparent 60%),
		linear-gradient(140deg, hsl(var(--aos-navy-deep)) 0%, hsl(var(--aos-navy)) 60%, hsl(var(--aos-navy-deep)) 100%);
}
/* Ghost case numeral — top-right of the card, behind everything */
.aos-work__card .aos-work__ghostnum {
	position: absolute;
	z-index: 0;
	top: clamp(1rem, 2.5vh, 1.75rem);
	right: clamp(1.25rem, 3vw, 2.75rem);
	left: auto;
	transform: none;
	font-size: clamp(6.5rem, 12vw, 11rem);
	color: hsl(var(--fg) / 0.07);
}
.aos-work__card--platform .aos-work__ghostnum { color: hsl(var(--bg) / 0.08); }
.aos-work__body { position: relative; z-index: 2; }
.aos-work__desc { max-width: 44ch; }
/* Media cell — device is absolutely placed and deliberately cropped by
   the card edge for scale; the card's overflow does the cropping. */
.aos-work__media {
	position: relative;
	z-index: 1;
	align-self: stretch;
	min-height: clamp(380px, 52vh, 560px);
}
.aos-work__media::before { content: none; }
.aos-work__card .aos-phone {
	position: absolute;
	top: 9%;
	left: 50%;
	width: min(76%, 330px);
	transform: translateX(-50%) rotate(2.5deg);
	transition: transform 0.6s var(--ease-out);
}
.aos-work__card:hover .aos-phone { transform: translateX(-50%) translateY(-10px) rotate(1.2deg); }
.aos-work__card .aos-browser {
	position: absolute;
	top: 14%;
	left: 2%;
	width: 112%;
	max-width: none;
	transform: rotate(-1.2deg);
	border-color: hsl(var(--bg) / 0.16);
	box-shadow: 0 2px 4px hsl(0 0% 0% / 0.2), 0 40px 80px -20px hsl(0 0% 0% / 0.5);
	transition: transform 0.6s var(--ease-out);
}
.aos-work__card:hover .aos-browser { transform: translateY(-10px) rotate(-0.4deg); }
/* Dark (platform) card text flips */
.aos-work__card--platform .aos-work__tag { color: hsl(var(--aos-yellow)); }
.aos-work__card--platform .aos-work__idx { color: hsl(var(--bg) / 0.5); }
.aos-work__card--platform .aos-work__name { color: hsl(var(--bg)); }
.aos-work__card--platform .aos-work__desc { color: hsl(var(--bg) / 0.68); }
.aos-work__card--platform .aos-work__roles li {
	border-color: hsl(var(--bg) / 0.25);
	color: hsl(var(--bg) / 0.72);
}
.aos-work__foot { margin-top: clamp(3rem, 7vh, 5rem); border-top: 0; padding-top: 0; }
@media (max-width: 900px) {
	.aos-work__card {
		grid-template-columns: 1fr;
		gap: 1.5rem;
		min-height: 0;
		padding: clamp(1.5rem, 5vw, 2.25rem);
		top: clamp(72px, 9vh, 100px);
	}
	.aos-work__media { min-height: 340px; }
	.aos-work__card .aos-phone { width: min(58%, 250px); top: 4%; }
	.aos-work__card .aos-browser { width: 106%; left: 0; top: 8%; }
	.aos-work__card .aos-work__ghostnum { font-size: 4.5rem; top: 1rem; right: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) {
	.aos-work__card { position: static; }
	.aos-work__card:hover .aos-phone,
	.aos-work__card:hover .aos-browser { transform: translateX(-50%) rotate(2.5deg); }
	.aos-work__card:hover .aos-browser { transform: rotate(-1.2deg); }
}

/* ── Perfection pass ── */
/* Reveal animations must never trigger browser scroll-anchor jumps */
main.aos-hp { overflow-anchor: none; }
/* Display type wraps in balanced lines, never a widowed word */
.aos-s-title,
.aos-s-thesis__line,
.aos-s-finale__title,
.aos-work__head h2,
.aos-s-lede,
.aos-s-finale__lede { text-wrap: balance; }
/* Anchor targets clear the sticky nav */
#work, #contact { scroll-margin-top: 90px; }
/* Offer ghost numerals align optically with the row top */
.aos-s-offer__ghost { margin-top: 0.35rem; }
/* Feature-quote mark: keep the underline wash off descenders */
.aos-s-voices__feature mark { padding-bottom: 0.05em; }
/* Impact quote cell breathes a little more than the stat cells */
.aos-s-impact__quote { padding-block: clamp(2rem, 3.5vw, 3.1rem); }
@media (max-width: 480px) {
	.aos-s-thesis__line { font-size: clamp(1.9rem, 8.2vw, 2.3rem); }
	.aos-s-finale__title { font-size: clamp(2.1rem, 9vw, 2.6rem); }
}

/* Testimonial proof units (the "wk" in 9wk) render small mono */
.aos-s-voices__proof em i {
	font-family: var(--mono);
	font-style: normal;
	font-size: 0.55em;
	font-weight: 600;
	letter-spacing: 0.04em;
	margin-left: 1px;
}

/* ══════════════════════════════════════════════════════════════════════
   SERVICE PAGE SYSTEM (aos-ihero, aos-s-ledger / proof / econ / why /
   window / pricing). Built for /ai-agents; the shape is deliberately
   reusable by /app-development, /consulting and the vertical landers.
   Shares the homepage design language — same eyebrow, title, button,
   hairline lattice and navy-deep bands — without reusing its layouts.
   ══════════════════════════════════════════════════════════════════════ */

/* ── INTERIOR HERO — cinematic navy-deep. Not the homepage's pinned video
   mask: a stated hero with a live cost meter as its signature. ── */
.aos-ihero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: hsl(var(--aos-navy-deep));
	padding-block: clamp(5rem, 14vh, 9rem) clamp(4rem, 10vh, 6rem);
}
/* --band: the meter demoted from hero to mid-page section — band rhythm, h2 scale */
.aos-ihero--band { padding-block: var(--sp-band); }
.aos-ihero--band .aos-ihero__title { font-size: clamp(1.9rem, 3.4vw, 3rem); }
.aos-ihero--band .aos-ihero__lede { max-width: 42ch; }
.aos-ihero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.03 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E"),
		radial-gradient(58% 62% at 82% 8%, hsl(var(--aos-yellow) / 0.16), transparent 62%),
		radial-gradient(50% 58% at 4% 92%, hsl(var(--aos-blue) / 0.14), transparent 60%);
}
.aos-ihero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.85fr);
	gap: clamp(2.5rem, 5vw, 5rem);
	align-items: center;
}
.aos-ihero__title {
	margin: 1.35rem 0 0;
	font-family: var(--display);
	font-size: clamp(2.4rem, 4.4vw, 4rem);
	line-height: 1.04;
	letter-spacing: -0.03em;
	font-weight: 500;
	color: hsl(var(--bg));
	text-wrap: balance;
}
.aos-ihero__title em {
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: 1.06em;
	color: hsl(var(--aos-yellow));
}
.aos-ihero__lede {
	margin: 1.4rem 0 0;
	max-width: 54ch;
	font-size: clamp(1rem, 1.25vw, 1.15rem);
	line-height: 1.6;
	color: hsl(var(--bg) / 0.66);
}
.aos-ihero__actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: clamp(1.25rem, 2.5vw, 2rem);
	margin-top: clamp(1.9rem, 4.5vh, 2.75rem);
}
.aos-ihero__trust {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem 1.75rem;
	margin: clamp(2.25rem, 5vh, 3rem) 0 0;
	padding: 1.2rem 0 0;
	border-top: 1px solid hsl(var(--bg) / 0.12);
	list-style: none;
	font-family: var(--mono);
	font-size: 0.66rem;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.5);
}
.aos-ihero__trust li { display: inline-flex; align-items: center; gap: 0.55rem; }
.aos-ihero__trust li::before {
	content: "";
	width: 5px;
	height: 5px;
	border-radius: 999px;
	background: hsl(var(--aos-yellow));
}

/* Live cost meter — the hero's signature. Hairline panel, mono chrome,
   tabular figures that tick. Derived from the page's own numbers. */
.aos-meter {
	position: relative;
	padding: clamp(1.5rem, 2.5vw, 2rem);
	border: 1px solid hsl(var(--bg) / 0.14);
	border-radius: 18px;
	background: linear-gradient(160deg, hsl(var(--bg) / 0.05), hsl(var(--bg) / 0.01));
	backdrop-filter: blur(2px);
}
.aos-meter__head {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	font-family: var(--mono);
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.5);
}
.aos-meter__live {
	width: 6px;
	height: 6px;
	border-radius: 999px;
	background: hsl(var(--aos-yellow));
	box-shadow: 0 0 0 0 hsl(var(--aos-yellow) / 0.6);
	animation: aosMeterPulse 2.4s ease-out infinite;
}
@keyframes aosMeterPulse {
	0%   { box-shadow: 0 0 0 0 hsl(var(--aos-yellow) / 0.5); }
	70%  { box-shadow: 0 0 0 7px hsl(var(--aos-yellow) / 0); }
	100% { box-shadow: 0 0 0 0 hsl(var(--aos-yellow) / 0); }
}
.aos-meter__caption {
	margin: 1rem 0 1.5rem;
	font-size: 0.92rem;
	line-height: 1.5;
	color: hsl(var(--bg) / 0.72);
}
.aos-meter__row + .aos-meter__row {
	margin-top: 1.25rem;
	padding-top: 1.25rem;
	border-top: 1px solid hsl(var(--bg) / 0.1);
}
.aos-meter__value {
	display: block;
	font-family: var(--display);
	font-size: clamp(2rem, 3.2vw, 2.9rem);
	font-weight: 600;
	line-height: 1;
	letter-spacing: -0.03em;
	color: hsl(var(--bg));
	font-variant-numeric: tabular-nums;
}
.aos-meter__value em {
	font-family: var(--mono);
	font-style: normal;
	font-size: 0.36em;
	font-weight: 600;
	letter-spacing: 0.04em;
	margin-left: 4px;
	color: hsl(var(--aos-yellow));
}
.aos-meter__label {
	display: block;
	margin-top: 0.5rem;
	font-size: 0.82rem;
	color: hsl(var(--bg) / 0.5);
}
@media (prefers-reduced-motion: reduce) { .aos-meter__live { animation: none; } }

/* ── PROBLEM LEDGER — oversized stat opposite the claim it proves ── */
.aos-s-ledger { border-top: 1px solid hsl(var(--border)); padding-block: clamp(5rem, 12vh, 8rem); }
.aos-s-ledger .aos-s-head { margin-bottom: clamp(2.75rem, 6vh, 4rem); }
.aos-s-ledger__rows { border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-ledger__row {
	display: grid;
	grid-template-columns: minmax(140px, 220px) minmax(0, 1fr);
	gap: clamp(1.5rem, 4vw, 4rem);
	align-items: start;
	padding: clamp(2rem, 4.5vh, 3rem) 0;
	border-bottom: 1px solid hsl(var(--border-strong));
}
.aos-s-ledger__stat {
	font-family: var(--display);
	font-size: clamp(2.4rem, 4.2vw, 3.6rem);
	font-weight: 600;
	line-height: 0.95;
	letter-spacing: -0.035em;
	color: hsl(var(--aos-yellow-deep));
	font-variant-numeric: tabular-nums;
}
.aos-s-ledger__unit {
	display: block;
	margin-top: 0.7rem;
	font-family: var(--mono);
	font-size: 0.64rem;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-s-ledger__claim {
	margin: 0;
	font-family: var(--display);
	font-size: clamp(1.2rem, 1.9vw, 1.6rem);
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: -0.015em;
	color: hsl(var(--fg));
}
.aos-s-ledger__body { margin: 0.85rem 0 0; max-width: 62ch; line-height: 1.6; color: hsl(var(--fg-muted)); }

/* ── PROOF — one case, told as a snippet, not a wall. Four cases at equal
   weight meant none of them landed. Photography carries 55% of the frame
   (per the Apple study: the image is the design), the metric asserts, and
   the link hands off to the full story. ── */
.aos-s-proof {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: hsl(var(--aos-navy-deep));
	padding-block: var(--sp-band);
}
.aos-s-proof::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: radial-gradient(55% 60% at 85% 6%, hsl(var(--aos-yellow) / 0.1), transparent 62%);
}
.aos-s-proof::after {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, hsl(var(--aos-yellow) / 0.5), transparent);
}
.aos-s-proof .aos-s-title { color: hsl(var(--bg)); }
.aos-s-proof .aos-s-title em { color: hsl(var(--aos-yellow)); }
.aos-s-case {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	align-items: stretch;
	border: 1px solid hsl(var(--bg) / 0.14);
	border-radius: 24px;
	overflow: hidden;
	background: hsl(var(--bg) / 0.03);
	text-decoration: none;
	transition: border-color .45s var(--ease-out), transform .45s var(--ease-out);
}
.aos-s-case:hover { border-color: hsl(var(--aos-yellow) / 0.45); transform: translateY(-2px); }
.aos-s-case:focus-visible { outline: 2px solid hsl(var(--aos-yellow)); outline-offset: 4px; }
/* Photography — graded to the brand so stock never reads as stock */
.aos-s-case__media { position: relative; overflow: hidden; min-height: clamp(280px, 42vh, 460px); }
.aos-s-case__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: grayscale(1) contrast(1.05);
	transition: transform 1.2s var(--ease-out);
}
.aos-s-case:hover .aos-s-case__media img { transform: scale(1.04); }
.aos-s-case__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg, transparent 55%, hsl(var(--aos-navy-deep)) 100%),
		linear-gradient(200deg, hsl(var(--aos-blue) / 0.5), hsl(var(--aos-navy-deep) / 0.75));
	mix-blend-mode: multiply;
}
.aos-s-case__badge {
	position: absolute;
	z-index: 1;
	top: clamp(1rem, 2vw, 1.5rem);
	left: clamp(1rem, 2vw, 1.5rem);
	padding: 6px 12px;
	border-radius: 999px;
	background: hsl(var(--aos-navy-deep) / 0.7);
	border: 1px solid hsl(var(--bg) / 0.18);
	backdrop-filter: blur(6px);
	font-family: var(--mono);
	font-size: 0.58rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.8);
}
.aos-s-case__body {
	display: flex;
	flex-direction: column;
	padding: clamp(2rem, 3.5vw, 3.25rem);
}
.aos-s-case__client {
	margin: 0 0 auto;
	font-family: var(--mono);
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.45);
}
.aos-s-case__metric {
	display: block;
	margin: clamp(1.75rem, 4vh, 2.5rem) 0 0;
	font-family: var(--display);
	font-size: clamp(3.6rem, 6.5vw, 5.5rem);
	font-weight: 600;
	line-height: 0.86;
	letter-spacing: -0.045em;
	color: hsl(var(--aos-yellow));
	font-variant-numeric: tabular-nums;
}
.aos-s-case__unit { display: block; margin-top: 0.8rem; font-size: 0.92rem; color: hsl(var(--bg) / 0.55); }
.aos-s-case__claim {
	margin: clamp(1.5rem, 3vh, 2rem) 0 0;
	padding-top: clamp(1.5rem, 3vh, 2rem);
	border-top: 1px solid hsl(var(--bg) / 0.1);
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: clamp(1.25rem, 1.8vw, 1.6rem);
	line-height: 1.35;
	color: hsl(var(--bg) / 0.92);
	text-wrap: balance;
}
.aos-s-case__link {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	margin-top: clamp(1.75rem, 4vh, 2.25rem);
	font-family: var(--mono);
	font-size: 0.66rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--aos-yellow));
}
.aos-s-case__link span {
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 999px;
	border: 1px solid hsl(var(--aos-yellow) / 0.45);
	transition: background-color .3s var(--ease-out), color .3s var(--ease-out), transform .3s var(--ease-out);
}
.aos-s-case:hover .aos-s-case__link span {
	background: hsl(var(--aos-yellow));
	color: hsl(var(--aos-navy-deep));
	transform: translateX(3px);
}
@media (max-width: 900px) {
	.aos-s-case { grid-template-columns: 1fr; }
	.aos-s-case__media::after { background: linear-gradient(180deg, transparent 45%, hsl(var(--aos-navy-deep)) 100%), linear-gradient(200deg, hsl(var(--aos-blue) / 0.5), hsl(var(--aos-navy-deep) / 0.7)); }
}
@media (prefers-reduced-motion: reduce) {
	.aos-s-case, .aos-s-case__media img, .aos-s-case__link span { transition: none; }
	.aos-s-case:hover { transform: none; }
	.aos-s-case:hover .aos-s-case__media img { transform: none; }
}

/* ── ECONOMICS — the delta belongs BETWEEN the two numbers it compares,
   not in a heavy black column beside them. Each metric is one row: the old
   value (muted), the delta (teal chip), the new value (teal). Contrast is
   carried by weight and colour, not by strike-throughs and slabs. ── */
.aos-s-econ { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-econ__switch { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: clamp(1.75rem, 4vh, 2.5rem); }
.aos-s-econ__switch button {
	padding: 8px 16px;
	border-radius: 999px;
	border: 1px solid hsl(var(--border-strong));
	background: transparent;
	font-family: var(--mono);
	font-size: 0.64rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
	cursor: pointer;
	transition: background-color .25s var(--ease-out), color .25s var(--ease-out), border-color .25s var(--ease-out);
}
.aos-s-econ__switch button:hover { color: hsl(var(--fg)); border-color: hsl(var(--fg) / 0.35); }
.aos-s-econ__switch button[aria-selected="true"] { background: hsl(var(--aos-navy)); border-color: hsl(var(--aos-navy)); color: hsl(var(--paper)); }
.aos-s-econ__switch button:focus-visible { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: 2px; }
.aos-s-econ__panel[hidden] { display: none; }
.aos-s-econ__instrument {
	border: 1px solid hsl(var(--border-strong));
	border-radius: 22px;
	overflow: hidden;
	background: hsl(var(--paper));
}
/* Metric rows — old | delta | new, on one optical line */
.aos-s-econ__metric {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: center;
	gap: clamp(1rem, 3vw, 2.5rem);
	padding: clamp(1.4rem, 3vh, 2rem) clamp(1.5rem, 3vw, 2.75rem);
	border-bottom: 1px solid hsl(var(--border));
}
.aos-s-econ__metric:first-child { background: hsl(var(--bg-alt) / 0.6); }
.aos-s-econ__val { display: flex; flex-direction: column; gap: 0.3rem; }
.aos-s-econ__val--old b {
	font-family: var(--display);
	font-size: clamp(1.5rem, 2.4vw, 2.1rem);
	font-weight: 500;
	letter-spacing: -0.03em;
	line-height: 1;
	color: hsl(var(--fg-subtle));
	font-variant-numeric: tabular-nums;
}
.aos-s-econ__val--new { text-align: right; }
.aos-s-econ__val--new b {
	font-family: var(--display);
	font-size: clamp(1.9rem, 3.2vw, 2.9rem);
	font-weight: 600;
	letter-spacing: -0.035em;
	line-height: 1;
	color: hsl(var(--aos-yellow-deep));
	font-variant-numeric: tabular-nums;
}
.aos-s-econ__val span {
	font-family: var(--mono);
	font-size: 0.56rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-s-econ__chip {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 7px 14px;
	border-radius: 999px;
	background: hsl(var(--aos-yellow-soft));
	border: 1px solid hsl(var(--aos-yellow) / 0.35);
	font-family: var(--mono);
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: hsl(var(--aos-yellow-deep));
	white-space: nowrap;
}
.aos-s-econ__chip::before { content: "\2192"; font-size: 0.9em; }
/* The two paths, side by side under the numbers */
.aos-s-econ__paths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.aos-s-econ__path { padding: clamp(1.4rem, 3vh, 2rem) clamp(1.5rem, 3vw, 2.75rem); }
.aos-s-econ__path--before { background: hsl(var(--bg-alt) / 0.6); border-right: 1px solid hsl(var(--border)); }
.aos-s-econ__label {
	margin: 0 0 1rem;
	font-family: var(--mono);
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-s-econ__path--after .aos-s-econ__label { color: hsl(var(--aos-yellow-deep)); }
.aos-s-econ__steps { margin: 0; padding: 0; list-style: none; counter-reset: econ; }
.aos-s-econ__steps li {
	position: relative;
	counter-increment: econ;
	padding: 0.45rem 0 0.45rem 2.2rem;
	font-size: 0.92rem;
	line-height: 1.5;
	color: hsl(var(--fg-muted));
}
.aos-s-econ__steps li::before {
	content: "0" counter(econ);
	position: absolute;
	left: 0;
	top: 0.5rem;
	font-family: var(--mono);
	font-size: 0.58rem;
	font-weight: 600;
	color: hsl(var(--fg-subtle));
}
.aos-s-econ__path--after .aos-s-econ__steps li::before { color: hsl(var(--aos-yellow-deep)); }
@media (max-width: 767px) {
	.aos-s-econ__metric { grid-template-columns: 1fr; gap: 0.75rem; text-align: left; }
	.aos-s-econ__val--new { text-align: left; }
	.aos-s-econ__paths { grid-template-columns: 1fr; }
	.aos-s-econ__path--before { border-right: 0; border-bottom: 1px solid hsl(var(--border)); }
}

/* ── WHY US — an asymmetric editorial spread. The old version was three
   equal columns over a three-box stat bar: the most default agency layout
   there is. Now the proof numbers stand as a rail beside the claim, and
   the commitments read as a ledger of promises. ── */
.aos-s-why { border-top: 1px solid hsl(var(--border)); background: hsl(var(--bg-alt)); padding-block: var(--sp-band); }
.aos-s-why__grid {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: clamp(2.5rem, 6vw, 6rem);
	align-items: start;
}
.aos-s-why__aside { position: sticky; top: 110px; }
/* Proof rail — the numbers that license the claim, right next to it */
.aos-s-why__proof {
	margin: clamp(2rem, 4vh, 2.75rem) 0 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid hsl(var(--border-strong));
}
.aos-s-why__proof li {
	display: flex;
	align-items: baseline;
	gap: 1rem;
	padding: 0.9rem 0;
	border-bottom: 1px solid hsl(var(--border));
}
.aos-s-why__proof b {
	flex: 0 0 auto;
	min-width: 4.5ch;
	font-family: var(--display);
	font-size: clamp(1.4rem, 2vw, 1.85rem);
	font-weight: 600;
	letter-spacing: -0.03em;
	line-height: 1;
	color: hsl(var(--aos-yellow-deep));
	font-variant-numeric: tabular-nums;
}
.aos-s-why__proof span {
	font-family: var(--mono);
	font-size: 0.62rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	line-height: 1.4;
	color: hsl(var(--fg-subtle));
}
/* Commitments — a ledger, each promise carrying its own hard term */
.aos-s-why__list { margin: 0; padding: 0; list-style: none; border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-why__item {
	display: grid;
	grid-template-columns: minmax(70px, 90px) minmax(0, 1fr);
	gap: clamp(1rem, 2vw, 2rem);
	align-items: baseline;
	padding: clamp(1.6rem, 3.5vh, 2.4rem) 0;
	border-bottom: 1px solid hsl(var(--border-strong));
}
.aos-s-why__term {
	font-family: var(--mono);
	font-size: 0.66rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--aos-yellow-deep));
	line-height: 1.5;
}
.aos-s-why__item h3 {
	margin: 0;
	font-family: var(--display);
	font-size: clamp(1.15rem, 1.7vw, 1.5rem);
	font-weight: 500;
	line-height: 1.32;
	letter-spacing: -0.015em;
	color: hsl(var(--fg));
	text-wrap: balance;
}
.aos-s-why__item p { margin: 0.6rem 0 0; font-size: 0.93rem; line-height: 1.6; color: hsl(var(--fg-muted)); max-width: 52ch; }
@media (max-width: 900px) {
	.aos-s-why__grid { grid-template-columns: 1fr; }
	.aos-s-why__aside { position: static; }
	.aos-s-why__item { grid-template-columns: 1fr; gap: 0.4rem; }
}

/* ── MARKET WINDOW — a closing-window timeline ── */
.aos-s-window { border-top: 1px solid hsl(var(--border)); padding-block: clamp(5rem, 12vh, 8rem); }
.aos-s-window .aos-s-head { margin-bottom: clamp(2.75rem, 6vh, 4rem); }
.aos-s-window__rail { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.25rem, 3vw, 2.5rem); margin: 0; padding: 0; list-style: none; }
.aos-s-window__step { position: relative; padding: 1.75rem 0 0; border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-window__step::before {
	content: "";
	position: absolute;
	top: -1px; left: 0;
	height: 3px;
	width: 100%;
	background: hsl(var(--border-strong));
}
.aos-s-window__step--open::before { background: hsl(var(--aos-yellow)); }
.aos-s-window__step--soon::before { background: hsl(var(--aos-yellow) / 0.4); width: 55%; }
.aos-s-window__step--closed::before { background: hsl(var(--fg) / 0.25); width: 18%; }
.aos-s-window__when {
	font-family: var(--mono);
	font-size: 0.66rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-window__step--closed .aos-s-window__when { color: hsl(var(--fg-subtle)); }
.aos-s-window__step h3 {
	margin: 0.7rem 0 0;
	font-family: var(--display);
	font-size: clamp(1.05rem, 1.4vw, 1.25rem);
	font-weight: 600;
	line-height: 1.3;
	color: hsl(var(--fg));
}
.aos-s-window__step p { margin: 0.6rem 0 0; font-size: 0.92rem; line-height: 1.6; color: hsl(var(--fg-muted)); }
.aos-s-window__kicker {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 1.5rem;
	margin-top: clamp(2.5rem, 6vh, 3.5rem);
	padding: clamp(1.5rem, 3vw, 2.25rem);
	border: 1px solid hsl(var(--border-strong));
	border-radius: 16px;
	background: hsl(var(--bg-alt));
}
.aos-s-window__kicker b {
	font-family: var(--display);
	font-size: clamp(2rem, 3.4vw, 3rem);
	font-weight: 600;
	letter-spacing: -0.035em;
	line-height: 1;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-window__kicker p { margin: 0; flex: 1 1 32ch; font-size: 0.95rem; line-height: 1.6; color: hsl(var(--fg-muted)); }

/* ── PRICING — three tiers, the middle one carried ── */
.aos-s-pricing {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: hsl(var(--aos-navy-deep));
	padding-block: clamp(5rem, 12vh, 8rem);
}
.aos-s-pricing::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: radial-gradient(55% 50% at 50% 0%, hsl(var(--aos-yellow) / 0.12), transparent 60%);
}
.aos-s-pricing .aos-s-title { color: hsl(var(--bg)); }
.aos-s-pricing .aos-s-title em { color: hsl(var(--aos-yellow)); }
.aos-s-pricing .aos-s-lede { color: hsl(var(--bg) / 0.6); }
.aos-s-pricing .aos-s-head { margin-bottom: clamp(2.75rem, 6vh, 4rem); }
.aos-s-pricing__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.75rem); align-items: stretch; }
.aos-s-tier {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: clamp(1.75rem, 2.6vw, 2.4rem);
	border: 1px solid hsl(var(--bg) / 0.14);
	border-radius: 20px;
	background: hsl(var(--bg) / 0.03);
}
.aos-s-tier--featured {
	border-color: hsl(var(--aos-yellow) / 0.55);
	background: linear-gradient(170deg, hsl(var(--aos-yellow) / 0.1), hsl(var(--bg) / 0.02));
	box-shadow: 0 30px 70px -30px hsl(var(--aos-yellow) / 0.3);
}
.aos-s-tier__flag {
	position: absolute;
	top: -1px;
	right: clamp(1.25rem, 2vw, 1.75rem);
	transform: translateY(-50%);
	padding: 5px 12px;
	border-radius: 999px;
	background: hsl(var(--aos-yellow));
	color: hsl(var(--aos-navy-deep));
	font-family: var(--mono);
	font-size: 0.56rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}
.aos-s-tier__name {
	margin: 0;
	font-family: var(--display);
	font-size: 1.15rem;
	font-weight: 600;
	letter-spacing: -0.012em;
	color: hsl(var(--bg));
}
.aos-s-tier__price {
	margin: 0.85rem 0 0;
	font-family: var(--display);
	font-size: clamp(1.6rem, 2.4vw, 2.1rem);
	font-weight: 600;
	letter-spacing: -0.03em;
	line-height: 1;
	color: hsl(var(--aos-yellow));
	font-variant-numeric: tabular-nums;
}
.aos-s-tier__term {
	display: block;
	margin-top: 0.55rem;
	font-family: var(--mono);
	font-size: 0.6rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.45);
}
.aos-s-tier__for {
	margin: 1.1rem 0 0;
	padding-top: 1.1rem;
	border-top: 1px solid hsl(var(--bg) / 0.1);
	font-size: 0.84rem;
	color: hsl(var(--bg) / 0.55);
}
.aos-s-tier__for b { color: hsl(var(--bg) / 0.8); font-weight: 600; }
.aos-s-tier__desc { margin: 0.9rem 0 1.4rem; font-size: 0.92rem; line-height: 1.6; color: hsl(var(--bg) / 0.62); }
.aos-s-tier__list { margin: 0 0 1.75rem; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 0.6rem; }
.aos-s-tier__list li {
	position: relative;
	padding-left: 1.4rem;
	font-size: 0.88rem;
	line-height: 1.5;
	color: hsl(var(--bg) / 0.72);
}
.aos-s-tier__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.5em;
	width: 8px;
	height: 1px;
	background: hsl(var(--aos-yellow));
}
.aos-s-tier .aos-btn { margin-top: auto; align-self: flex-start; }
.aos-s-pricing__note {
	margin: clamp(2.25rem, 5vh, 3rem) auto 0;
	max-width: 68ch;
	text-align: center;
	font-size: 0.92rem;
	line-height: 1.6;
	color: hsl(var(--bg) / 0.55);
}

/* ── Service-page responsive ── */
@media (max-width: 1023px) {
	.aos-ihero__grid { grid-template-columns: 1fr; gap: 2.5rem; }
	.aos-s-proof__grid { grid-template-columns: 1fr; }
	.aos-s-why__list { grid-template-columns: 1fr; gap: 1.75rem; }
	.aos-s-pricing__grid { grid-template-columns: 1fr; }
	.aos-s-window__rail { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
	.aos-s-ledger__row { grid-template-columns: 1fr; gap: 1rem; }
	.aos-s-econ__pair { grid-template-columns: 1fr; }
	.aos-s-why__bar { grid-template-columns: 1fr; }
	.aos-s-proof__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
}

/* Service-page entrance choreography — rides the shared .aos-reveal gate */
.aos-reveal :is(.aos-s-ledger__row, .aos-s-proof__case, .aos-s-why__item, .aos-s-window__step, .aos-s-tier, .aos-s-econ__col) { opacity: 0; }
.aos-reveal.is-in :is(.aos-s-ledger__row, .aos-s-proof__case, .aos-s-why__item, .aos-s-window__step, .aos-s-tier, .aos-s-econ__col) {
	animation: aosSRise 0.6s var(--ease-out) 0.12s forwards;
}
.aos-reveal.is-in :is(.aos-s-ledger__row, .aos-s-proof__case, .aos-s-why__item, .aos-s-window__step, .aos-s-tier, .aos-s-econ__col):nth-child(2) { animation-delay: 0.24s; }
.aos-reveal.is-in :is(.aos-s-ledger__row, .aos-s-proof__case, .aos-s-why__item, .aos-s-window__step, .aos-s-tier, .aos-s-econ__col):nth-child(3) { animation-delay: 0.36s; }
.aos-reveal.is-in :is(.aos-s-ledger__row, .aos-s-proof__case, .aos-s-why__item, .aos-s-window__step, .aos-s-tier, .aos-s-econ__col):nth-child(4) { animation-delay: 0.48s; }
@media (prefers-reduced-motion: reduce) {
	.aos-reveal :is(.aos-s-ledger__row, .aos-s-proof__case, .aos-s-why__item, .aos-s-window__step, .aos-s-tier, .aos-s-econ__col) { opacity: 1 !important; animation: none !important; }
}
/* Service page owns its scroll anchoring like the homepage does */
main.aos-sp { overflow-anchor: none; }
.aos-ihero__title, .aos-s-ledger__claim, .aos-s-proof__claim { text-wrap: balance; }

@media (max-width: 900px) {
	.aos-s-econ__instrument { grid-template-columns: 1fr; }
	.aos-s-econ__delta { flex-direction: row; justify-content: space-around; gap: 1rem; }
	.aos-s-econ__delta::before, .aos-s-econ__delta::after { display: none; }
}

/* ══════════════════════════════════════════════════════════════════════
   RHYTHM — one spacing scale for every section. Hand-tuned clamps had
   drifted (process head 63px vs 54px elsewhere, hero title 22 vs 18), so
   the vertical rhythm read as almost-aligned. These tokens are the source
   of truth; sections opt in rather than inventing their own values.
   ══════════════════════════════════════════════════════════════════════ */
:root {
	--sp-band:  clamp(5rem, 12vh, 8rem);    /* section top/bottom */
	--sp-head:  clamp(2.75rem, 6vh, 4rem);  /* section head → content */
	--sp-title: 1.1rem;                     /* eyebrow → title */
	--sp-lede:  1.2rem;                     /* title → lede */
}
main.aos-sp > section { padding-block: var(--sp-band); }
main.aos-sp .aos-s-head { margin-bottom: var(--sp-head); }
main.aos-sp .aos-s-title { margin-top: var(--sp-title); }
main.aos-sp .aos-s-lede { margin-top: var(--sp-lede); }
main.aos-sp .aos-ihero__title { margin-top: var(--sp-title); }
/* The finale closes the page — it earns extra air, deliberately. */
main.aos-sp > .aos-s-finale { padding-block: calc(var(--sp-band) * 1.25); }
/* FAQ head is sticky inside a grid; its bottom margin only matters stacked. */
@media (max-width: 900px) { main.aos-sp .aos-s-faq .aos-s-head { margin-bottom: var(--sp-head); } }
@media (min-width: 901px) { main.aos-sp .aos-s-faq .aos-s-head { margin-bottom: 0; } }

/* Ledger and proof lose their body copy — the stat and the claim carry
   them. Re-balance what's left so the rows breathe instead of sag. */
.aos-s-ledger__row { align-items: center; }
.aos-s-proof__case .aos-s-proof__stats { margin-bottom: 0; border-bottom: 0; padding-bottom: 0; }
.aos-s-proof__claim { margin-bottom: auto; }

/* ══════════════════════════════════════════════════════════════════════
   SECTION LIBRARY — thirteen additional systems, same law as the hero
   and the work deck: one shared frame, the eyebrow system, hairline
   lattices, mono meta, editorial serif accents, ghost numerals, the
   .aos-btn language. Every section works on .aos-hp and .aos-sp mains.
   ══════════════════════════════════════════════════════════════════════ */

/* ── LOGO STRIP — client names as typography, not logo soup ── */
.aos-s-logos { border-top: 1px solid hsl(var(--border)); padding-block: clamp(2.5rem, 6vh, 4rem); }
.aos-s-logos__label {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	margin: 0 0 1.75rem;
	font-family: var(--mono);
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-s-logos__label i { width: 22px; height: 1px; background: hsl(var(--border-strong)); }
.aos-s-logos__row {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: center;
	gap: clamp(1.5rem, 4vw, 3.5rem);
	margin: 0;
	padding: 0;
	list-style: none;
}
.aos-s-logos__row li {
	font-family: var(--display);
	font-size: clamp(1.05rem, 1.5vw, 1.3rem);
	font-weight: 500;
	letter-spacing: -0.01em;
	color: hsl(var(--fg-subtle));
	transition: color 0.3s var(--ease-out);
}
.aos-s-logos__row li:hover { color: hsl(var(--fg)); }

/* ── KEY STAT — one number carries the section ── */
.aos-s-keystat { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-keystat__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(2rem, 5vw, 5rem);
	align-items: end;
}
.aos-s-keystat__num {
	margin: 0;
	font-family: var(--display);
	font-size: clamp(5rem, 12vw, 11rem);
	font-weight: 600;
	line-height: 0.82;
	letter-spacing: -0.05em;
	color: hsl(var(--aos-yellow-deep));
	font-variant-numeric: tabular-nums;
}
.aos-s-keystat__num em {
	font-family: var(--mono);
	font-style: normal;
	font-size: 0.22em;
	font-weight: 600;
	letter-spacing: 0.06em;
	margin-left: 8px;
	color: hsl(var(--fg-subtle));
}
.aos-s-keystat__body h2, .aos-s-keystat__body h3 {
	margin: 0;
	font-family: var(--display);
	font-size: clamp(1.4rem, 2.4vw, 2.1rem);
	font-weight: 500;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: hsl(var(--fg));
	text-wrap: balance;
}
.aos-s-keystat__source {
	display: block;
	margin-top: clamp(1.25rem, 3vh, 1.75rem);
	padding-top: 1.1rem;
	border-top: 1px solid hsl(var(--border));
	font-family: var(--mono);
	font-size: 0.62rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}

/* ── FEATURE SPLIT — media beside copy, brand-graded ── */
.aos-s-split { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-split__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(2rem, 5vw, 5rem);
	align-items: center;
}
.aos-s-split--flip .aos-s-split__media { order: 2; }
.aos-s-split__media {
	position: relative;
	border-radius: 22px;
	overflow: hidden;
	border: 1px solid hsl(var(--border-strong));
	isolation: isolate;
	aspect-ratio: 4 / 3;
	background: hsl(var(--bg-alt));
}
.aos-s-split__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: grayscale(1) contrast(1.05);
}
.aos-s-split__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(200deg, hsl(var(--aos-blue) / 0.35), hsl(var(--aos-navy-deep) / 0.45));
	mix-blend-mode: multiply;
}
.aos-s-split__ticks { margin: clamp(1.5rem, 3.5vh, 2.25rem) 0 0; padding: 0; list-style: none; border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-split__ticks li {
	display: flex;
	align-items: baseline;
	gap: 0.9rem;
	padding: 0.85rem 0;
	border-bottom: 1px solid hsl(var(--border));
	font-size: 0.95rem;
	color: hsl(var(--fg-muted));
}
.aos-s-split__ticks b {
	font-family: var(--mono);
	font-size: 0.6rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	color: hsl(var(--aos-yellow-deep));
}
/* expandable supporting points — native details, animated where supported */
.aos-s-split__accwrap { margin-top: clamp(1.5rem, 3.5vh, 2.25rem); border-top: 1px solid hsl(var(--border-strong)); interpolate-size: allow-keywords; }
.aos-s-split__acc { border-bottom: 1px solid hsl(var(--border)); }
.aos-s-split__acc summary {
	display: flex;
	align-items: baseline;
	gap: 0.9rem;
	padding: 0.95rem 0;
	cursor: pointer;
	list-style: none;
	font-size: 0.98rem;
	font-weight: 500;
	color: hsl(var(--fg));
	transition: color 0.25s var(--ease-out);
}
.aos-s-split__acc summary::-webkit-details-marker { display: none; }
/* no focus box on click; keyboard users still get a ring */
.aos-s-split__acc summary:focus { outline: none; }
.aos-s-split__acc summary:focus-visible { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: 3px; border-radius: 4px; }
.aos-s-split__acc summary:hover { color: hsl(var(--aos-yellow-deep)); }
.aos-s-split__acc summary b { font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.12em; color: hsl(var(--aos-yellow-deep)); }
.aos-s-split__acc summary::after { content: "+"; margin-left: auto; font-family: var(--mono); font-size: 0.9rem; color: hsl(var(--fg-subtle)); transition: transform 0.3s var(--ease-out); }
.aos-s-split__acc[open] summary::after { transform: rotate(45deg); }
.aos-s-split__acc p { margin: 0; padding: 0 0 1.05rem 2rem; max-width: 46ch; font-size: 0.92rem; line-height: 1.6; color: hsl(var(--fg-muted)); }
.aos-s-split__acc::details-content { block-size: 0; overflow-y: clip; transition: content-visibility 0.35s allow-discrete, block-size 0.35s var(--ease-out); }
.aos-s-split__acc[open]::details-content { block-size: auto; }

/* ── FEATURE GRID — six cells on a hairline lattice ── */
.aos-s-features { border-top: 1px solid hsl(var(--border)); background: hsl(var(--bg-alt)); padding-block: var(--sp-band); }
.aos-s-features__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	background: hsl(var(--fg) / 0.12);
	border: 1px solid hsl(var(--fg) / 0.12);
}
.aos-s-features__cell { background: hsl(var(--bg-alt)); padding: clamp(1.6rem, 2.6vw, 2.4rem); transition: background-color 0.35s var(--ease-out); }
.aos-s-features__cell:hover { background: hsl(var(--paper)); }
.aos-s-features__num {
	display: block;
	font-family: var(--mono);
	font-size: 0.64rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-features__cell h3 {
	margin: 0.9rem 0 0;
	font-family: var(--display);
	font-size: clamp(1.05rem, 1.4vw, 1.2rem);
	font-weight: 600;
	letter-spacing: -0.012em;
	line-height: 1.3;
	color: hsl(var(--fg));
}
.aos-s-features__cell p { margin: 0.6rem 0 0; font-size: 0.92rem; line-height: 1.55; color: hsl(var(--fg-muted)); }

/* ── COMPARISON — two ways of working, one verdict column ── */
.aos-s-compare { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-compare__table {
	border: 1px solid hsl(var(--border-strong));
	border-radius: 22px;
	overflow: hidden;
	background: hsl(var(--paper));
}
.aos-s-compare__row {
	display: grid;
	grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr);
	border-bottom: 1px solid hsl(var(--border));
}
.aos-s-compare__row:last-child { border-bottom: 0; }
.aos-s-compare__row > * { padding: clamp(1rem, 2vh, 1.35rem) clamp(1.25rem, 2.5vw, 2rem); font-size: 0.94rem; }
.aos-s-compare__row > :nth-child(3) { background: hsl(var(--aos-yellow-soft) / 0.5); }
.aos-s-compare__row--head { background: hsl(var(--bg-alt)); border-bottom: 1px solid hsl(var(--border-strong)); }
.aos-s-compare__row--head > * {
	font-family: var(--mono);
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-s-compare__row--head > :nth-child(3) { color: hsl(var(--aos-yellow-deep)); }
.aos-s-compare__row dt, .aos-s-compare__what { color: hsl(var(--fg)); font-weight: 500; }
.aos-s-compare__them { color: hsl(var(--fg-subtle)); }
.aos-s-compare__us { color: hsl(var(--fg)); font-weight: 500; }

/* ── QUOTE BAND — one voice, full bleed, navy-deep ── */
.aos-s-quoteband {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: hsl(var(--aos-navy-deep));
	padding-block: var(--sp-band);
	text-align: center;
}
.aos-s-quoteband::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: radial-gradient(50% 60% at 50% 0%, hsl(var(--aos-yellow) / 0.1), transparent 62%);
}
.aos-s-quoteband::after {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, hsl(var(--aos-yellow) / 0.5), transparent);
}
.aos-s-quoteband blockquote {
	margin: 0 auto;
	max-width: 30ch;
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: clamp(1.8rem, 3.6vw, 3rem);
	line-height: 1.32;
	color: hsl(var(--bg));
	text-wrap: balance;
}
.aos-s-quoteband blockquote::before {
	content: "\201C";
	display: block;
	height: 0.55em;
	font-size: 1.9em;
	line-height: 1;
	color: hsl(var(--aos-yellow));
	margin-bottom: 0.4em;
}
.aos-s-quoteband blockquote mark {
	background: linear-gradient(hsl(var(--aos-yellow) / 0.26), hsl(var(--aos-yellow) / 0.26)) 0 86% / 100% 0.14em no-repeat;
	color: hsl(var(--aos-yellow));
}
.aos-s-quoteband figcaption {
	margin-top: clamp(1.75rem, 4vh, 2.5rem);
	font-family: var(--mono);
	font-size: 0.66rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.5);
}
.aos-s-quoteband figcaption b { color: hsl(var(--bg) / 0.85); }

/* ── CTA SLIM — a mid-page ask, one line, one button ── */
.aos-s-ctaslim { border-block: 1px solid hsl(var(--border)); background: hsl(var(--bg-alt)); padding-block: clamp(2.75rem, 7vh, 4.5rem); }
/* instrument rule: a strip of tick marks fading at both edges */
.aos-s-ctaslim__ticks {
	height: 9px;
	margin-bottom: clamp(1.75rem, 4vh, 2.5rem);
	background: repeating-linear-gradient(90deg, hsl(var(--border-strong)) 0 1px, transparent 1px 14px);
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 18%, #000 82%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 18%, #000 82%, transparent);
}
.aos-s-ctaslim__kicker { display: block; margin-bottom: 0.8rem; font-family: var(--mono); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: hsl(var(--aos-yellow-deep)); }
.aos-s-ctaslim__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: clamp(1.25rem, 3vw, 2.5rem);
}
.aos-s-ctaslim__row h2 {
	margin: 0;
	font-family: var(--display);
	font-size: clamp(1.35rem, 2.2vw, 1.9rem);
	font-weight: 500;
	letter-spacing: -0.02em;
	line-height: 1.25;
	color: hsl(var(--fg));
	text-wrap: balance;
}

/* ── NEWSLETTER — one field, one chip, navy band ── */
.aos-s-newsletter {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: hsl(var(--aos-navy-deep));
	padding-block: var(--sp-band);
	text-align: center;
}
.aos-s-newsletter::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: radial-gradient(45% 55% at 50% 100%, hsl(var(--aos-yellow) / 0.12), transparent 62%);
}
.aos-s-newsletter .aos-s-title { color: hsl(var(--bg)); }
.aos-s-newsletter .aos-s-title em { color: hsl(var(--aos-yellow)); }
.aos-s-newsletter__form {
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: 460px;
	margin: clamp(1.75rem, 4vh, 2.5rem) auto 0;
	padding: 6px 6px 6px 20px;
	border: 1px solid hsl(var(--bg) / 0.22);
	border-radius: 999px;
	background: hsl(var(--bg) / 0.04);
	transition: border-color 0.25s var(--ease-out);
}
.aos-s-newsletter__form:focus-within { border-color: hsl(var(--aos-yellow) / 0.6); }
.aos-s-newsletter__form input {
	flex: 1;
	min-width: 0;
	background: transparent;
	border: 0;
	outline: none;
	font: inherit;
	font-size: 0.95rem;
	color: hsl(var(--bg));
	padding: 8px 0;
}
.aos-s-newsletter__form input::placeholder { color: hsl(var(--bg) / 0.4); }
.aos-s-newsletter__note {
	margin: 1.1rem 0 0;
	font-family: var(--mono);
	font-size: 0.6rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.4);
}

/* ── ARTICLE TEASERS — three editorial cards ── */
.aos-s-articles { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-articles__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 4vw, 3.5rem); }
.aos-s-articles__card { display: flex; flex-direction: column; padding-top: 1.4rem; border-top: 1px solid hsl(var(--border-strong)); text-decoration: none; }
.aos-s-articles__meta {
	display: flex;
	gap: 1rem;
	margin: 0;
	font-family: var(--mono);
	font-size: 0.6rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-s-articles__meta b { color: hsl(var(--aos-yellow-deep)); }
.aos-s-articles__card h3 {
	margin: 0.9rem 0 0;
	font-family: var(--display);
	font-size: clamp(1.15rem, 1.6vw, 1.4rem);
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: -0.015em;
	color: hsl(var(--fg));
	text-wrap: balance;
	transition: color 0.25s var(--ease-out);
}
.aos-s-articles__card:hover h3 { color: hsl(var(--aos-yellow-deep)); }
.aos-s-articles__card p { margin: 0.7rem 0 0; font-size: 0.92rem; line-height: 1.55; color: hsl(var(--fg-muted)); }
.aos-s-articles__card .aos-ghost { margin-top: auto; padding-top: 1.25rem; align-self: flex-start; }

/* ── MILESTONES — years down a hairline spine ── */
.aos-s-milestones { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-milestones__rail { position: relative; margin: 0; padding: 0; list-style: none; }
.aos-s-milestones__rail::before {
	content: "";
	position: absolute;
	top: 6px; bottom: 6px; left: clamp(70px, 8vw, 110px);
	width: 1px;
	background: linear-gradient(180deg, hsl(var(--aos-yellow-deep) / 0.6), hsl(var(--border-strong)));
}
.aos-s-milestones__item {
	position: relative;
	display: grid;
	grid-template-columns: clamp(70px, 8vw, 110px) minmax(0, 1fr);
	gap: clamp(1.5rem, 3vw, 2.5rem);
	padding: clamp(1.25rem, 3vh, 1.9rem) 0;
}
.aos-s-milestones__item::before {
	content: "";
	position: absolute;
	top: calc(clamp(1.25rem, 3vh, 1.9rem) + 0.45em);
	left: calc(clamp(70px, 8vw, 110px) - 5px);
	width: 11px;
	height: 11px;
	border-radius: 999px;
	background: hsl(var(--bg));
	border: 2px solid hsl(var(--aos-yellow-deep));
}
.aos-s-milestones__year {
	font-family: var(--mono);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	color: hsl(var(--aos-yellow-deep));
	padding-top: 0.3em;
}
.aos-s-milestones__item h3 {
	margin: 0;
	font-family: var(--display);
	font-size: clamp(1.1rem, 1.6vw, 1.4rem);
	font-weight: 500;
	letter-spacing: -0.015em;
	color: hsl(var(--fg));
}
.aos-s-milestones__item p { margin: 0.45rem 0 0; max-width: 56ch; font-size: 0.93rem; line-height: 1.55; color: hsl(var(--fg-muted)); }

/* ── CONTACT PANEL — the ways in, as a ledger ── */
.aos-s-contactpanel { border-top: 1px solid hsl(var(--border)); background: hsl(var(--bg-alt)); padding-block: var(--sp-band); }
.aos-s-contactpanel__grid {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: clamp(2.5rem, 6vw, 6rem);
	align-items: start;
}
.aos-s-contactpanel__list { margin: 0; padding: 0; list-style: none; border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-contactpanel__list a {
	display: grid;
	grid-template-columns: minmax(90px, 130px) minmax(0, 1fr) auto;
	align-items: center;
	gap: clamp(1rem, 2.5vw, 2rem);
	padding: clamp(1.25rem, 3vh, 1.75rem) 0.25rem;
	border-bottom: 1px solid hsl(var(--border-strong));
	text-decoration: none;
	transition: background-color 0.3s var(--ease-out);
}
.aos-s-contactpanel__list a:hover { background: hsl(var(--paper)); }
.aos-s-contactpanel__kind {
	font-family: var(--mono);
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-contactpanel__value {
	font-family: var(--display);
	font-size: clamp(1.1rem, 1.8vw, 1.5rem);
	font-weight: 500;
	letter-spacing: -0.015em;
	color: hsl(var(--fg));
}
.aos-s-contactpanel__arrow {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 999px;
	border: 1px solid hsl(var(--border-strong));
	color: hsl(var(--fg));
	background: hsl(var(--paper));
	transition: background-color 0.3s var(--ease-out), border-color 0.3s var(--ease-out), color 0.3s var(--ease-out), transform 0.3s var(--ease-out);
}
.aos-s-contactpanel__list a:hover .aos-s-contactpanel__arrow {
	background: hsl(var(--aos-yellow));
	border-color: hsl(var(--aos-yellow));
	color: hsl(var(--aos-navy-deep));
	transform: translateX(3px);
}

/* ── VALUES MANIFESTO — numbered assertions, ghost numerals ── */
.aos-s-values { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-values__list { margin: 0; padding: 0; list-style: none; border-top: 1px solid hsl(var(--border-strong)); counter-reset: val; }
.aos-s-values__item {
	position: relative;
	display: grid;
	grid-template-columns: minmax(90px, 150px) minmax(0, 1fr);
	gap: clamp(1.25rem, 3vw, 3rem);
	align-items: baseline;
	padding: clamp(1.75rem, 4vh, 2.6rem) 0;
	border-bottom: 1px solid hsl(var(--border-strong));
	counter-increment: val;
}
.aos-s-values__item::before {
	content: "0" counter(val);
	font-family: var(--display);
	font-weight: 700;
	font-size: clamp(2.4rem, 4.5vw, 4rem);
	line-height: 0.85;
	letter-spacing: -0.04em;
	color: hsl(var(--fg) / 0.08);
	transition: color 0.35s ease;
}
.aos-s-values__item:hover::before { color: hsl(var(--aos-yellow-deep) / 0.16); }
.aos-s-values__item h3 {
	margin: 0;
	font-family: var(--display);
	font-size: clamp(1.3rem, 2.2vw, 1.9rem);
	font-weight: 500;
	letter-spacing: -0.02em;
	line-height: 1.25;
	color: hsl(var(--fg));
	text-wrap: balance;
}
.aos-s-values__item h3 em { font-family: var(--editorial); font-style: italic; font-weight: 500; font-size: 1.06em; color: hsl(var(--aos-yellow-deep)); }
.aos-s-values__item p { margin: 0.65rem 0 0; max-width: 58ch; font-size: 0.94rem; line-height: 1.6; color: hsl(var(--fg-muted)); }

/* ── TEAM GRID — people on the lattice, monogram-first ── */
.aos-s-team { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-team__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	background: hsl(var(--fg) / 0.12);
	border: 1px solid hsl(var(--fg) / 0.12);
}
/* Two-founder variant: a 3-col grid with 2 cards leaves a visible empty
   gap-background cell; render.php appends --two only when count is exactly 2. */
.aos-s-team__grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.aos-s-team__card { background: hsl(var(--bg)); padding: clamp(1.75rem, 2.8vw, 2.5rem); }
.aos-s-team__mono {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: 999px;
	background: hsl(var(--aos-yellow-soft));
	border: 1px solid hsl(var(--aos-yellow) / 0.3);
	color: hsl(var(--aos-yellow-deep));
	font-family: var(--mono);
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.05em;
}
.aos-s-team__card h3 { margin: 1.1rem 0 0; font-family: var(--display); font-size: 1.15rem; font-weight: 600; letter-spacing: -0.012em; color: hsl(var(--fg)); }
.aos-s-team__role {
	display: block;
	margin-top: 0.35rem;
	font-family: var(--mono);
	font-size: 0.6rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-team__card p { margin: 0.8rem 0 0; font-size: 0.9rem; line-height: 1.55; color: hsl(var(--fg-muted)); }

/* ── Library-wide entrance choreography ── */
.aos-reveal :is(.aos-s-features__cell, .aos-s-articles__card, .aos-s-team__card, .aos-s-values__item, .aos-s-milestones__item, .aos-s-compare__row, .aos-s-split__grid > *, .aos-s-keystat__grid > *) { opacity: 0; }
.aos-reveal.is-in :is(.aos-s-features__cell, .aos-s-articles__card, .aos-s-team__card, .aos-s-values__item, .aos-s-milestones__item, .aos-s-compare__row, .aos-s-split__grid > *, .aos-s-keystat__grid > *) {
	animation: aosSRise 0.6s var(--ease-out) 0.12s forwards;
}
.aos-reveal.is-in :is(.aos-s-features__cell, .aos-s-articles__card, .aos-s-team__card, .aos-s-values__item, .aos-s-milestones__item, .aos-s-compare__row):nth-child(2) { animation-delay: 0.22s; }
.aos-reveal.is-in :is(.aos-s-features__cell, .aos-s-articles__card, .aos-s-team__card, .aos-s-values__item, .aos-s-milestones__item, .aos-s-compare__row):nth-child(3) { animation-delay: 0.32s; }
.aos-reveal.is-in :is(.aos-s-features__cell, .aos-s-articles__card, .aos-s-team__card, .aos-s-values__item, .aos-s-milestones__item, .aos-s-compare__row):nth-child(4) { animation-delay: 0.42s; }
.aos-reveal.is-in :is(.aos-s-features__cell, .aos-s-team__card, .aos-s-values__item, .aos-s-compare__row):nth-child(5) { animation-delay: 0.52s; }
.aos-reveal.is-in :is(.aos-s-features__cell, .aos-s-team__card, .aos-s-compare__row):nth-child(6) { animation-delay: 0.62s; }
@media (prefers-reduced-motion: reduce) {
	.aos-reveal :is(.aos-s-features__cell, .aos-s-articles__card, .aos-s-team__card, .aos-s-values__item, .aos-s-milestones__item, .aos-s-compare__row, .aos-s-split__grid > *, .aos-s-keystat__grid > *) { opacity: 1 !important; animation: none !important; }
}

/* ── Library responsive ── */
@media (max-width: 1023px) {
	.aos-s-features__grid, .aos-s-team__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.aos-s-articles__grid { grid-template-columns: 1fr; gap: 2rem; }
}
@media (max-width: 767px) {
	.aos-s-keystat__grid, .aos-s-split__grid, .aos-s-contactpanel__grid { grid-template-columns: 1fr; }
	.aos-s-split--flip .aos-s-split__media { order: 0; }
	.aos-s-features__grid, .aos-s-team__grid { grid-template-columns: 1fr; }
	.aos-s-compare__row { grid-template-columns: 1fr; }
	.aos-s-compare__row > * { padding-block: 0.6rem; }
	.aos-s-compare__row > :first-child { padding-top: 1.1rem; font-weight: 600; }
	.aos-s-compare__row > :last-child { padding-bottom: 1.1rem; }
	.aos-s-values__item { grid-template-columns: 1fr; gap: 0.75rem; }
	.aos-s-milestones__rail::before { left: 5px; }
	.aos-s-milestones__item { grid-template-columns: 1fr; gap: 0.35rem; padding-left: 2rem; }
	.aos-s-milestones__item::before { left: 0; }
	.aos-s-contactpanel__list a { grid-template-columns: 1fr; gap: 0.4rem; }
	.aos-s-contactpanel__arrow { display: none; }
}

/* ══════════════════════════════════════════════════════════════════════
   PIN-SCROLL SECTIONS — the homepage's signature, generalized. A shared
   driver scrubs --p (0→1) through any [data-aos-pin] section; each
   section choreographs itself from that one variable. Resting state
   (--p: 1) is the no-JS and reduced-motion fallback, so nothing breaks.
   ══════════════════════════════════════════════════════════════════════ */

/* ── PINNED MANIFESTO — three claims light up as the reader travels ── */
.aos-s-pinman {
	--p: 1;
	position: relative;
	height: 260vh;
	background: hsl(var(--aos-navy-deep));
}
.aos-s-pinman__pin {
	position: sticky;
	top: 0;
	height: 100vh;
	overflow: hidden;
	isolation: isolate;
	display: flex;
	align-items: center;
}
.aos-s-pinman__pin::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.03 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E"),
		radial-gradient(55% 60% at 80% 10%, hsl(var(--aos-yellow) / 0.13), transparent 62%);
}
.aos-s-pinman__pin::after {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, hsl(var(--aos-yellow) / 0.5), transparent);
}
.aos-s-pinman__lines { margin: 0; padding: 0; list-style: none; }
.aos-s-pinman__lines li {
	margin: 0;
	font-family: var(--display);
	font-size: clamp(2.1rem, 4.6vw, 4rem);
	font-weight: 500;
	line-height: 1.18;
	letter-spacing: -0.03em;
	color: hsl(var(--bg));
	text-wrap: balance;
}
.aos-s-pinman__lines li + li { margin-top: clamp(1.25rem, 3.5vh, 2.25rem); }
.aos-s-pinman__lines em {
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: 1.06em;
	color: hsl(var(--aos-yellow));
}
/* Each claim lights up across its own third of the travel */
.aos-s-pinman__lines li:nth-child(1) { opacity: clamp(0.16, (var(--p) - 0.02) * 4, 1); translate: 0 calc(min(1, max(0, (var(--p) - 0.02) * 4)) * -6px + 6px); }
.aos-s-pinman__lines li:nth-child(2) { opacity: clamp(0.16, (var(--p) - 0.3) * 4, 1); translate: 0 calc(min(1, max(0, (var(--p) - 0.3) * 4)) * -6px + 6px); }
.aos-s-pinman__lines li:nth-child(3) { opacity: clamp(0.16, (var(--p) - 0.58) * 4, 1); translate: 0 calc(min(1, max(0, (var(--p) - 0.58) * 4)) * -6px + 6px); }
.aos-s-pinman__progress {
	position: absolute;
	bottom: clamp(2rem, 5vh, 3rem);
	left: 50%;
	translate: -50% 0;
	width: min(220px, 30vw);
	height: 1px;
	background: hsl(var(--bg) / 0.15);
}
.aos-s-pinman__progress::after {
	content: "";
	position: absolute;
	inset: 0;
	transform-origin: left;
	transform: scaleX(var(--p));
	background: hsl(var(--aos-yellow));
}
@media (prefers-reduced-motion: reduce) {
	.aos-s-pinman { height: auto; }
	.aos-s-pinman__pin { position: static; height: auto; padding-block: var(--sp-band); }
	.aos-s-pinman__lines li { opacity: 1 !important; translate: none !important; }
	.aos-s-pinman__progress { display: none; }
}

/* ── PINNED PHONE SHOWCASE — the titanium frame holds center while the
   story scrolls past it. Pure position:sticky; no JS required. ── */
.aos-s-pinphone { border-top: 1px solid hsl(var(--border)); }
.aos-s-pinphone__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(2rem, 5vw, 5rem);
	align-items: start;
}
.aos-s-pinphone__steps { padding-block: clamp(3rem, 8vh, 5rem); }
.aos-s-pinphone__step {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 76vh;
	max-width: 44ch;
}
.aos-s-pinphone__step + .aos-s-pinphone__step { border-top: 1px solid hsl(var(--border)); }
.aos-s-pinphone__num {
	font-family: var(--display);
	font-weight: 700;
	font-size: clamp(2.6rem, 4.5vw, 4rem);
	line-height: 0.85;
	letter-spacing: -0.04em;
	color: hsl(var(--fg) / 0.08);
}
.aos-s-pinphone__step h3 {
	margin: 1.4rem 0 0;
	font-family: var(--display);
	font-size: clamp(1.5rem, 2.6vw, 2.3rem);
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: -0.022em;
	color: hsl(var(--fg));
	text-wrap: balance;
}
.aos-s-pinphone__step h3 em { font-family: var(--editorial); font-style: italic; font-weight: 500; font-size: 1.06em; color: hsl(var(--aos-yellow-deep)); }
.aos-s-pinphone__step p { margin: 0.9rem 0 0; font-size: 0.98rem; line-height: 1.6; color: hsl(var(--fg-muted)); }
.aos-s-pinphone__stage {
	position: sticky;
	top: 0;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	isolation: isolate;
}
.aos-s-pinphone__stage::before {
	content: "";
	position: absolute;
	inset: 12% 6%;
	z-index: -1;
	border-radius: 50%;
	background:
		radial-gradient(50% 50% at 50% 42%, hsl(var(--aos-yellow) / 0.16), transparent 70%),
		radial-gradient(60% 55% at 55% 70%, hsl(var(--aos-blue) / 0.12), transparent 72%);
	filter: blur(10px);
}
.aos-s-pinphone__stage .aos-phone { width: min(72%, 320px); }
@media (max-width: 900px) {
	.aos-s-pinphone__grid { grid-template-columns: 1fr; }
	.aos-s-pinphone__stage { position: relative; height: auto; padding-block: 2rem; order: -1; }
	.aos-s-pinphone__step { min-height: 0; padding-block: clamp(2rem, 5vh, 3rem); }
}
@media (prefers-reduced-motion: reduce) {
	.aos-s-pinphone__stage { position: relative; height: auto; padding-block: 2rem; }
	.aos-s-pinphone__step { min-height: 0; padding-block: clamp(2rem, 5vh, 3rem); }
}

/* ── STACKING STATEMENTS — three full panels deal over each other ── */
.aos-s-pinstack { padding-block: clamp(2rem, 5vh, 3.5rem); }
.aos-s-pinstack__deck {
	max-width: calc(1200px + 2 * var(--wp--style--root--padding-left, 24px));
	margin-inline: auto;
	padding-inline: var(--wp--style--root--padding-left, 24px);
}
.aos-s-pinstack__panel {
	position: sticky;
	top: clamp(72px, 9vh, 110px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: min(76vh, 720px);
	margin-bottom: clamp(2rem, 5vh, 3rem);
	padding: clamp(2.5rem, 5vw, 5rem);
	border-radius: 28px;
	border: 1px solid hsl(var(--border));
	overflow: hidden;
	isolation: isolate;
	background: hsl(var(--paper));
	box-shadow:
		0 -24px 60px -46px hsl(var(--aos-navy-deep) / 0.5),
		0 30px 80px -40px hsl(var(--aos-navy-deep) / 0.35);
}
.aos-s-pinstack__panel:last-child { margin-bottom: 0; }
.aos-s-pinstack__panel--wash {
	background:
		radial-gradient(60% 80% at 88% 12%, hsl(var(--aos-yellow) / 0.14), transparent 65%),
		linear-gradient(115deg, hsl(var(--paper)) 45%, hsl(var(--aos-yellow-soft)) 100%);
}
.aos-s-pinstack__panel--dark {
	border-color: hsl(var(--aos-navy-soft));
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.03 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E"),
		radial-gradient(55% 70% at 85% 10%, hsl(var(--aos-yellow) / 0.16), transparent 62%),
		linear-gradient(140deg, hsl(var(--aos-navy-deep)) 0%, hsl(var(--aos-navy)) 60%, hsl(var(--aos-navy-deep)) 100%);
}
.aos-s-pinstack__kicker {
	margin: 0 0 1.25rem;
	font-family: var(--mono);
	font-size: 0.64rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-pinstack__panel--dark .aos-s-pinstack__kicker { color: hsl(var(--aos-yellow)); }
.aos-s-pinstack__panel h3 {
	margin: 0;
	max-width: 22ch;
	font-family: var(--display);
	font-size: clamp(1.9rem, 4vw, 3.4rem);
	font-weight: 500;
	line-height: 1.12;
	letter-spacing: -0.028em;
	color: hsl(var(--fg));
	text-wrap: balance;
}
.aos-s-pinstack__panel--dark h3 { color: hsl(var(--bg)); }
.aos-s-pinstack__panel h3 em { font-family: var(--editorial); font-style: italic; font-weight: 500; font-size: 1.06em; color: hsl(var(--aos-yellow-deep)); }
.aos-s-pinstack__panel--dark h3 em { color: hsl(var(--aos-yellow)); }
.aos-s-pinstack__panel p { margin: 1.1rem 0 0; max-width: 50ch; font-size: 0.98rem; line-height: 1.6; color: hsl(var(--fg-muted)); }
.aos-s-pinstack__panel--dark p { color: hsl(var(--bg) / 0.62); }
.aos-s-pinstack__panel .aos-btn { margin-top: clamp(1.75rem, 4vh, 2.5rem); align-self: flex-start; }
.aos-s-pinstack__ghost {
	position: absolute;
	top: clamp(1rem, 2.5vh, 1.75rem);
	right: clamp(1.25rem, 3vw, 2.75rem);
	font-family: var(--display);
	font-weight: 700;
	font-size: clamp(6.5rem, 12vw, 11rem);
	line-height: 1;
	letter-spacing: -0.05em;
	color: hsl(var(--fg) / 0.07);
	pointer-events: none;
	user-select: none;
}
.aos-s-pinstack__panel--dark .aos-s-pinstack__ghost { color: hsl(var(--bg) / 0.08); }
@media (prefers-reduced-motion: reduce) {
	.aos-s-pinstack__panel { position: static; min-height: 0; }
}

/* ══════════════════════════════════════════════════════════════════════
   CROWN JEWELS — twenty-five more systems. Same law throughout: the
   lattice, the mono meta, the editorial italic, the teal restraint, the
   one button. Scroll choreography rides the shared --p driver; marquees
   and the orbit are pure CSS; tabs/carousel/slider share three tiny
   generic JS primitives. Everything degrades to a designed resting state.
   ══════════════════════════════════════════════════════════════════════ */

/* ── 1. BENTO — one asymmetric board, six unequal cells ── */
.aos-s-bento { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-bento__grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	grid-auto-rows: minmax(150px, auto);
	gap: clamp(0.75rem, 1.2vw, 1.25rem);
}
.aos-s-bento__cell {
	position: relative;
	border: 1px solid hsl(var(--border-strong));
	border-radius: 20px;
	background: hsl(var(--paper));
	padding: clamp(1.25rem, 2vw, 1.9rem);
	overflow: hidden;
	isolation: isolate;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	transition: transform 0.4s var(--ease-out), border-color 0.4s var(--ease-out);
}
.aos-s-bento__cell:hover { transform: translateY(-3px); border-color: hsl(var(--aos-yellow) / 0.45); }
.aos-s-bento__cell--media { grid-column: span 7; grid-row: span 2; padding: 0; }
.aos-s-bento__cell--media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.aos-s-bento__cell--media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(200deg, hsl(var(--aos-blue) / 0.4), hsl(var(--aos-navy-deep) / 0.6));
	mix-blend-mode: multiply;
}
.aos-s-bento__caption {
	position: relative;
	z-index: 1;
	align-self: flex-start;
	margin: auto 1.4rem 1.25rem;
	padding: 6px 12px;
	border-radius: 999px;
	background: hsl(var(--aos-navy-deep) / 0.72);
	backdrop-filter: blur(6px);
	border: 1px solid hsl(var(--bg) / 0.16);
	font-family: var(--mono);
	font-size: 0.58rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.9);
}
.aos-s-bento__cell--stat { grid-column: span 5; }
.aos-s-bento__num {
	font-family: var(--display);
	font-size: clamp(2.6rem, 4.5vw, 4rem);
	font-weight: 600;
	line-height: 0.9;
	letter-spacing: -0.04em;
	color: hsl(var(--aos-yellow-deep));
	font-variant-numeric: tabular-nums;
}
.aos-s-bento__cell--dark {
	grid-column: span 5;
	border-color: hsl(var(--aos-navy-soft));
	background:
		radial-gradient(60% 70% at 85% 10%, hsl(var(--aos-yellow) / 0.14), transparent 62%),
		hsl(var(--aos-navy-deep));
}
.aos-s-bento__cell--dark blockquote {
	margin: 0;
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: clamp(1.05rem, 1.5vw, 1.3rem);
	line-height: 1.4;
	color: hsl(var(--bg) / 0.92);
}
.aos-s-bento__cell--dark figcaption { margin-top: 0.9rem; font-family: var(--mono); font-size: 0.58rem; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--bg) / 0.5); }
.aos-s-bento__cell--feature { grid-column: span 4; }
.aos-s-bento__cell--feature:last-child { grid-column: span 8; flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 1.5rem; }
.aos-s-bento__kicker { font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: hsl(var(--aos-yellow-deep)); }
.aos-s-bento__cell h3 { margin: 0.6rem 0 0; font-family: var(--display); font-size: clamp(1.05rem, 1.4vw, 1.25rem); font-weight: 600; letter-spacing: -0.012em; color: hsl(var(--fg)); }
.aos-s-bento__cell p { margin: 0.5rem 0 0; font-size: 0.9rem; line-height: 1.5; color: hsl(var(--fg-muted)); }
.aos-s-bento__label { margin-top: 0.5rem; font-family: var(--mono); font-size: 0.58rem; letter-spacing: 0.12em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }

/* ── 2. HORIZONTAL RAIL — pinned, the deck slides sideways on --p ── */
.aos-s-hrail { --p: 1; --shift: -150vw; position: relative; height: 320vh; border-top: 1px solid hsl(var(--border)); }
.aos-s-hrail__pin { position: sticky; top: 0; height: 100vh; overflow: hidden; display: flex; flex-direction: column; justify-content: center; }
.aos-s-hrail__head { margin-bottom: clamp(1.75rem, 4vh, 2.5rem); }
.aos-s-hrail__track {
	display: flex;
	gap: clamp(1.25rem, 2.5vw, 2rem);
	padding-inline: var(--wp--style--root--padding-left, 24px);
	transform: translateX(calc((1 - var(--p)) * 0vw + var(--p) * var(--shift)));
	will-change: transform;
}
.aos-s-hrail__card {
	flex: 0 0 auto;
	width: min(68vw, 760px);
	min-height: min(54vh, 480px);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: clamp(1.75rem, 3vw, 2.75rem);
	border: 1px solid hsl(var(--border-strong));
	border-radius: 24px;
	background: hsl(var(--paper));
	position: relative;
	overflow: hidden;
	isolation: isolate;
}
.aos-s-hrail__card--dark {
	border-color: hsl(var(--aos-navy-soft));
	background: radial-gradient(60% 70% at 85% 10%, hsl(var(--aos-yellow) / 0.14), transparent 62%), hsl(var(--aos-navy-deep));
}
.aos-s-hrail__ghost {
	position: absolute;
	top: clamp(0.75rem, 2vh, 1.25rem);
	right: clamp(1rem, 2vw, 1.75rem);
	font-family: var(--display);
	font-weight: 700;
	font-size: clamp(5rem, 9vw, 8rem);
	line-height: 1;
	letter-spacing: -0.05em;
	color: hsl(var(--fg) / 0.07);
	pointer-events: none;
}
.aos-s-hrail__card--dark .aos-s-hrail__ghost { color: hsl(var(--bg) / 0.08); }
.aos-s-hrail__card h3 { margin: 0; max-width: 24ch; font-family: var(--display); font-size: clamp(1.5rem, 2.6vw, 2.2rem); font-weight: 500; letter-spacing: -0.022em; line-height: 1.18; color: hsl(var(--fg)); text-wrap: balance; }
.aos-s-hrail__card--dark h3 { color: hsl(var(--bg)); }
.aos-s-hrail__card h3 em { font-family: var(--editorial); font-style: italic; font-weight: 500; color: hsl(var(--aos-yellow-deep)); }
.aos-s-hrail__card--dark h3 em { color: hsl(var(--aos-yellow)); }
.aos-s-hrail__card p { margin: 0.75rem 0 0; max-width: 44ch; font-size: 0.94rem; line-height: 1.55; color: hsl(var(--fg-muted)); }
.aos-s-hrail__card--dark p { color: hsl(var(--bg) / 0.6); }
.aos-s-hrail__progress { margin: clamp(1.75rem, 4vh, 2.5rem) auto 0; width: min(220px, 30vw); height: 1px; background: hsl(var(--fg) / 0.15); }
.aos-s-hrail__progress::after { content: ""; display: block; height: 100%; transform-origin: left; transform: scaleX(var(--p)); background: hsl(var(--aos-yellow-deep)); }
@media (max-width: 900px), (prefers-reduced-motion: reduce) {
	.aos-s-hrail { height: auto; }
	.aos-s-hrail__pin { position: static; height: auto; overflow-x: auto; padding-block: var(--sp-band); scroll-snap-type: x mandatory; }
	.aos-s-hrail__track { transform: none; }
	.aos-s-hrail__card { width: min(82vw, 640px); scroll-snap-align: center; }
	.aos-s-hrail__progress { display: none; }
}

/* ── 3. TESTIMONIAL MARQUEE — two counter-scrolling rows of voices ── */
@keyframes aosMarqX { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.aos-s-tmarquee { border-block: 1px solid hsl(var(--border)); padding-block: clamp(3rem, 7vh, 4.5rem); overflow: hidden; }
.aos-s-tmarquee__row { display: flex; width: max-content; gap: clamp(1rem, 1.5vw, 1.5rem); animation: aosMarqX 48s linear infinite; }
.aos-s-tmarquee__row + .aos-s-tmarquee__row { margin-top: clamp(1rem, 1.5vw, 1.5rem); animation-direction: reverse; animation-duration: 56s; }
.aos-s-tmarquee:hover .aos-s-tmarquee__row { animation-play-state: paused; }
.aos-s-tmarquee__chip {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 0.9rem;
	max-width: 420px;
	padding: 1rem 1.4rem;
	border: 1px solid hsl(var(--border-strong));
	border-radius: 16px;
	background: hsl(var(--paper));
}
.aos-s-tmarquee__chip q { font-size: 0.9rem; line-height: 1.45; color: hsl(var(--fg-muted)); quotes: "\201C" "\201D"; }
.aos-s-tmarquee__who { font-family: var(--mono); font-size: 0.56rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: hsl(var(--fg-subtle)); white-space: nowrap; }
@media (prefers-reduced-motion: reduce) {
	.aos-s-tmarquee__row { animation: none; flex-wrap: wrap; width: auto; }
}

/* ── 4. EXPANDING PANELS — four doors, the open one tells its story ── */
.aos-s-expand { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-expand__row { display: flex; gap: clamp(0.6rem, 1vw, 1rem); min-height: min(62vh, 560px); }
.aos-s-expand__panel {
	position: relative;
	flex: 1;
	border-radius: 20px;
	overflow: hidden;
	isolation: isolate;
	border: 1px solid hsl(var(--border-strong));
	background: hsl(var(--aos-navy-deep));
	cursor: pointer;
	transition: flex 0.65s var(--ease-out);
}
.aos-s-expand__panel:hover, .aos-s-expand__panel:focus-within, .aos-s-expand__panel.is-open { flex: 3.2; }
/* closed: quiet duotone. open: full color arrives with a slow settle */
.aos-s-expand__panel img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: grayscale(1) contrast(1.05);
	opacity: 0.55;
	transform: scale(1.06);
	transition: opacity 0.6s var(--ease-out), filter 0.7s var(--ease-out), transform 0.9s var(--ease-out);
}
.aos-s-expand__panel:hover img, .aos-s-expand__panel:focus-within img, .aos-s-expand__panel.is-open img { opacity: 1; filter: grayscale(0) contrast(1.02) saturate(1.05); transform: scale(1); }
/* scrim keeps its weight at the foot (copy legibility) and lifts only up top,
   so an opened panel reads as full colour without washing out its own words */
.aos-s-expand__panel::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, hsl(var(--aos-navy-deep) / 0.45) 0%, hsl(var(--aos-navy-deep) / 0.1) 42%, hsl(var(--aos-navy-deep) / 0.72) 72%, hsl(var(--aos-navy-deep) / 0.94) 88%);
	transition: opacity 0.6s var(--ease-out);
}
/* open: the top clears to full colour, the foot keeps enough weight that the
   index, title, and copy all sit on ~0.8+ — no washed-out teal on bright frames */
.aos-s-expand__panel:hover::after, .aos-s-expand__panel:focus-within::after, .aos-s-expand__panel.is-open::after {
	background: linear-gradient(180deg, transparent 0%, transparent 38%, hsl(var(--aos-navy-deep) / 0.6) 64%, hsl(var(--aos-navy-deep) / 0.93) 86%);
}
/* Titles align across all panels: the copy row collapses to 0fr when closed,
   so the num+title block always rests on the same baseline no matter how many
   lines a panel's copy would wrap to. (opacity alone still reserves space.) */
.aos-s-expand__body {
	position: absolute;
	z-index: 1;
	inset: auto 0 0 0;
	padding: clamp(1.25rem, 2vw, 1.9rem);
	display: grid;
	grid-template-rows: auto auto 0fr;
	transition: grid-template-rows 0.6s var(--ease-out);
}
.aos-s-expand__panel:hover .aos-s-expand__body,
.aos-s-expand__panel:focus-within .aos-s-expand__body,
.aos-s-expand__panel.is-open .aos-s-expand__body { grid-template-rows: auto auto 1fr; }
.aos-s-expand__num { font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.16em; color: hsl(var(--aos-yellow)); }
.aos-s-expand__body h3 { margin: 0.5rem 0 0; font-family: var(--display); font-size: clamp(1.05rem, 1.6vw, 1.4rem); font-weight: 600; letter-spacing: -0.015em; color: hsl(var(--bg)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aos-s-expand__body p {
	margin: 0;
	padding-top: 0.6rem;
	min-height: 0;
	overflow: hidden;
	max-width: 44ch;
	font-size: 0.9rem;
	line-height: 1.5;
	color: hsl(var(--bg) / 0.7);
	opacity: 0;
	transform: translateY(6px);
	transition: opacity 0.45s var(--ease-out) 0.15s, transform 0.45s var(--ease-out) 0.15s;
}
.aos-s-expand__panel:hover p, .aos-s-expand__panel:focus-within p, .aos-s-expand__panel.is-open p { opacity: 1; transform: none; }
@media (max-width: 900px) {
	.aos-s-expand__row { flex-direction: column; min-height: 0; }
	.aos-s-expand__panel { min-height: 200px; }
	.aos-s-expand__body p { opacity: 1; transform: none; }
}

/* ── 5. DEVICE SWITCHER — one stage, phone or browser ── */
.aos-s-devices { border-top: 1px solid hsl(var(--border)); background: hsl(var(--bg-alt)); padding-block: var(--sp-band); }
/* one axis: title left, tabs right on the same head row; stage centered below */
.aos-s-devices .aos-s-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; text-align: left; }
.aos-s-devices__tabs { display: flex; gap: 0.5rem; }
.aos-s-devices__tabs button {
	padding: 8px 18px;
	border-radius: 999px;
	border: 1px solid hsl(var(--border-strong));
	background: transparent;
	font-family: var(--mono);
	font-size: 0.64rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
	cursor: pointer;
	transition: background-color .25s var(--ease-out), color .25s var(--ease-out), border-color .25s var(--ease-out);
}
.aos-s-devices__tabs button[aria-selected="true"] { background: hsl(var(--aos-navy)); border-color: hsl(var(--aos-navy)); color: hsl(var(--paper)); }
.aos-s-devices__tabs button:focus-visible { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: 2px; }
/* fixed-height stage + absolute panels: no height jump when devices swap */
.aos-s-devices__stage { position: relative; height: min(66vh, 640px); isolation: isolate; }
.aos-s-devices__panel { position: absolute; inset: 0; display: grid; place-items: center; }
.aos-s-devices__stage::before {
	content: "";
	position: absolute;
	inset: 8% 18%;
	z-index: -1;
	border-radius: 50%;
	background: radial-gradient(50% 50% at 50% 45%, hsl(var(--aos-yellow) / 0.15), transparent 70%);
	filter: blur(12px);
}
.aos-s-devices__stage .aos-phone { width: min(60vw, 270px); }
.aos-s-devices__stage .aos-browser { width: min(92%, 860px); }
.aos-s-devices__panel[hidden] { display: none; }
@media (max-width: 767px) { .aos-s-devices .aos-s-head { flex-direction: column; align-items: flex-start; } .aos-s-devices__stage { height: auto; min-height: 420px; } .aos-s-devices__panel { position: static; } .aos-s-devices__panel[hidden] { display: none; } }

/* ── 6. STAT STRIP — four figures, hairline verticals, one line each ── */
.aos-s-statstrip { border-block: 1px solid hsl(var(--border)); padding-block: clamp(2.5rem, 6vh, 4rem); }
.aos-s-statstrip__row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.aos-s-statstrip__cell { padding-inline: clamp(1.25rem, 2.5vw, 2.5rem); border-left: 1px solid hsl(var(--border-strong)); }
.aos-s-statstrip__cell:first-child { border-left: 0; padding-left: 0; }
.aos-s-statstrip__cell b {
	display: block;
	font-family: var(--display);
	font-size: clamp(1.9rem, 3.2vw, 2.8rem);
	font-weight: 600;
	line-height: 1;
	letter-spacing: -0.03em;
	color: hsl(var(--fg));
	font-variant-numeric: tabular-nums;
}
.aos-s-statstrip__cell b em { font-style: normal; color: hsl(var(--aos-yellow-deep)); }
.aos-s-statstrip__cell > span { display: block; margin-top: 0.6rem; font-size: 0.85rem; line-height: 1.45; color: hsl(var(--fg-subtle)); }
.aos-s-statstrip__cell b span { display: inline; font: inherit; color: inherit; margin: 0; }
@media (max-width: 900px) {
	.aos-s-statstrip__row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem 0; }
	.aos-s-statstrip__cell:nth-child(3) { border-left: 0; padding-left: 0; }
}

/* ── 7. PINNED PROCESS — the number counts itself up the stage ── */
.aos-s-pinproc { --p: 1; position: relative; height: 340vh; border-top: 1px solid hsl(var(--border)); }
.aos-s-pinproc__pin { position: sticky; top: 0; height: 100vh; overflow: hidden; display: flex; align-items: center; }
.aos-s-pinproc__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; width: 100%; }
/* The stage is an odometer: one numeral-height window, the roll of four
   solid quiet numerals translating through it on --p, edges masked. */
.aos-s-pinproc__stage {
	position: relative;
	font-size: clamp(9rem, 20vw, 15rem);
	height: 1em;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(180deg, transparent, #000 24%, #000 76%, transparent);
	mask-image: linear-gradient(180deg, transparent, #000 24%, #000 76%, transparent);
}
.aos-s-pinproc__roll {
	display: flex;
	flex-direction: column;
	transform: translateY(calc(var(--p) * -75%));
	will-change: transform;
}
.aos-s-pinproc__roll span {
	display: flex;
	align-items: center;
	height: 1em;
	font-family: var(--display);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.05em;
	color: hsl(var(--fg) / 0.14);
	font-variant-numeric: tabular-nums;
}
.aos-s-pinproc__steps { margin: 0; padding: 0; list-style: none; }
.aos-s-pinproc__steps li { padding: clamp(0.9rem, 2vh, 1.25rem) 0; border-top: 1px solid hsl(var(--border)); }
.aos-s-pinproc__steps li:first-child { border-top: 0; }
.aos-s-pinproc__steps h3 { margin: 0; font-family: var(--display); font-size: clamp(1.1rem, 1.7vw, 1.5rem); font-weight: 500; letter-spacing: -0.015em; color: hsl(var(--fg)); }
.aos-s-pinproc__steps p { margin: 0.4rem 0 0; font-size: 0.9rem; line-height: 1.5; color: hsl(var(--fg-muted)); max-width: 46ch; }
.aos-s-pinproc__steps li:nth-child(1) { opacity: clamp(0.25, (0.28 - var(--p)) * 8 + 1, 1); }
.aos-s-pinproc__steps li:nth-child(1) { opacity: calc(0.25 + 0.75 * clamp(0, (0.28 - var(--p)) * 8, 1)); }
.aos-s-pinproc__steps li:nth-child(2) { opacity: calc(0.25 + 0.75 * clamp(0, 1 - max((var(--p) - 0.53) * 8, (0.28 - var(--p)) * 8), 1)); }
.aos-s-pinproc__steps li:nth-child(3) { opacity: calc(0.25 + 0.75 * clamp(0, 1 - max((var(--p) - 0.78) * 8, (0.53 - var(--p)) * 8), 1)); }
.aos-s-pinproc__steps li:nth-child(4) { opacity: calc(0.25 + 0.75 * clamp(0, (var(--p) - 0.78) * 8, 1)); }
@media (max-width: 900px), (prefers-reduced-motion: reduce) {
	.aos-s-pinproc { height: auto; }
	.aos-s-pinproc__pin { position: static; height: auto; padding-block: var(--sp-band); }
	.aos-s-pinproc__grid { grid-template-columns: 1fr; }
	.aos-s-pinproc__stage { display: none; }
	.aos-s-pinproc__steps li { opacity: 1 !important; }
}

/* ── 8. PARALLAX STATEMENT — full-bleed image drifts under a claim ── */
.aos-s-parallax { --p: 0.5; position: relative; height: 170vh; }
.aos-s-parallax__pin { position: sticky; top: 0; height: 100vh; overflow: hidden; isolation: isolate; display: flex; align-items: flex-end; }
.aos-s-parallax__pin img {
	position: absolute;
	inset: -18% 0 auto 0;
	width: 100%;
	height: 130%;
	object-fit: cover;
	filter: grayscale(1) contrast(1.05);
	transform: translateY(calc(var(--p) * 12%));
	will-change: transform;
}
.aos-s-parallax__pin::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, hsl(var(--aos-navy-deep) / 0.25), transparent 35%, hsl(var(--aos-navy-deep) / 0.85) 100%),
		linear-gradient(200deg, hsl(var(--aos-blue) / 0.4), hsl(var(--aos-navy-deep) / 0.5));
	mix-blend-mode: multiply;
}
.aos-s-parallax__body { position: relative; z-index: 1; width: 100%; padding-bottom: clamp(3rem, 8vh, 5.5rem); }
.aos-s-parallax__body h2 {
	margin: 1.2rem 0 0;
	max-width: 20ch;
	font-family: var(--display);
	font-size: clamp(2.2rem, 4.8vw, 4.2rem);
	font-weight: 500;
	line-height: 1.08;
	letter-spacing: -0.03em;
	color: hsl(var(--bg));
	text-wrap: balance;
}
.aos-s-parallax__body h2 em { font-family: var(--editorial); font-style: italic; font-weight: 500; color: hsl(var(--aos-yellow)); }
@media (prefers-reduced-motion: reduce) {
	.aos-s-parallax { height: auto; }
	.aos-s-parallax__pin { position: static; height: 80vh; }
	.aos-s-parallax__pin img { transform: none; }
}

/* ── 9. VIDEO BAND — ambient motion in a cinema panel ── */
.aos-s-videoband { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-videoband__panel { position: relative; border-radius: 28px; overflow: hidden; isolation: isolate; border: 1px solid hsl(var(--border-strong)); aspect-ratio: 21 / 9; transform: translateZ(0); }
/* the video is 24% taller than its frame; --py (−1…1 across the viewport) pans it — true parallax */
.aos-s-videoband__panel video { position: absolute; inset: -12% 0; width: 100%; height: 124%; object-fit: cover; transform: translateY(calc(var(--py, 0) * -6%)); will-change: transform; }
.aos-s-videoband__panel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, hsl(var(--aos-navy-deep) / 0.8)); }
.aos-s-videoband__bar {
	position: absolute;
	z-index: 1;
	inset: auto 0 0 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: clamp(1.25rem, 2.5vw, 2rem);
}
.aos-s-videoband__bar p { margin: 0; font-family: var(--editorial); font-style: italic; font-weight: 500; font-size: clamp(1.15rem, 1.9vw, 1.6rem); color: hsl(var(--bg)); }
.aos-s-videoband__bar span { font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: hsl(var(--bg) / 0.6); }
@media (max-width: 767px) { .aos-s-videoband__panel { aspect-ratio: 4 / 3; } }

/* ── 10. SPLIT CTA DUO — two doors, two audiences ── */
.aos-s-duo { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-duo__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.75rem); }
.aos-s-duo__door {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: min(46vh, 420px);
	padding: clamp(1.75rem, 3vw, 2.75rem);
	border: 1px solid hsl(var(--border-strong));
	border-radius: 24px;
	background: hsl(var(--bg-alt));
	text-decoration: none;
	overflow: hidden;
	isolation: isolate;
	transition: transform 0.4s var(--ease-out), border-color 0.4s var(--ease-out);
}
.aos-s-duo__door:hover { transform: translateY(-3px); border-color: hsl(var(--aos-yellow) / 0.5); box-shadow: 0 30px 60px -35px hsl(var(--aos-navy-deep) / 0.4); }
.aos-s-duo__door::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(65% 55% at 12% 0%, hsl(var(--aos-yellow) / 0.09), transparent 62%);
	opacity: 0;
	transition: opacity 0.45s var(--ease-out);
	pointer-events: none;
}
.aos-s-duo__door:hover::before { opacity: 1; }
/* watermark numeral — solid low-alpha, never hollow */
.aos-s-duo__wm {
	position: absolute;
	right: clamp(0.75rem, 2vw, 1.5rem);
	bottom: -0.18em;
	font-family: var(--display);
	font-size: clamp(6rem, 11vw, 9.5rem);
	font-weight: 600;
	line-height: 1;
	letter-spacing: -0.04em;
	color: hsl(var(--fg) / 0.05);
	pointer-events: none;
	user-select: none;
}
.aos-s-duo__door--dark .aos-s-duo__wm { color: hsl(var(--bg) / 0.06); }
.aos-s-duo__door--dark {
	border-color: hsl(var(--aos-navy-soft));
	background: radial-gradient(60% 70% at 85% 8%, hsl(var(--aos-yellow) / 0.14), transparent 62%), hsl(var(--aos-navy-deep));
}
.aos-s-duo__kicker { font-family: var(--mono); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: hsl(var(--aos-yellow-deep)); }
.aos-s-duo__door--dark .aos-s-duo__kicker { color: hsl(var(--aos-yellow)); }
.aos-s-duo__door h3 { margin: 1rem 0 0; max-width: 18ch; font-family: var(--display); font-size: clamp(1.5rem, 2.6vw, 2.2rem); font-weight: 500; letter-spacing: -0.022em; line-height: 1.15; color: hsl(var(--fg)); text-wrap: balance; }
.aos-s-duo__door--dark h3 { color: hsl(var(--bg)); }
.aos-s-duo__door p { margin: 0.75rem 0 0; max-width: 40ch; font-size: 0.93rem; line-height: 1.55; color: hsl(var(--fg-muted)); }
.aos-s-duo__door--dark p { color: hsl(var(--bg) / 0.6); }
.aos-s-duo__foot { display: flex; align-items: center; gap: 0.9rem; margin-top: auto; padding-top: clamp(1.5rem, 3.5vh, 2.25rem); }
.aos-s-duo__foot i { font-style: normal; font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); transition: color 0.3s var(--ease-out), transform 0.3s var(--ease-out); }
.aos-s-duo__door--dark .aos-s-duo__foot i { color: hsl(var(--bg) / 0.55); }
.aos-s-duo__door:hover .aos-s-duo__foot i { color: hsl(var(--fg)); transform: translateX(2px); }
.aos-s-duo__door--dark:hover .aos-s-duo__foot i { color: hsl(var(--bg)); }
.aos-s-duo__go {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 999px;
	border: 1px solid hsl(var(--border-strong));
	background: hsl(var(--paper));
	color: hsl(var(--fg));
	transition: background-color 0.3s var(--ease-out), border-color 0.3s var(--ease-out), color 0.3s var(--ease-out), transform 0.3s var(--ease-out);
}
.aos-s-duo__door--dark .aos-s-duo__go { background: transparent; border-color: hsl(var(--bg) / 0.28); color: hsl(var(--bg)); }
.aos-s-duo__door:hover .aos-s-duo__go { background: hsl(var(--aos-yellow)); border-color: hsl(var(--aos-yellow)); color: hsl(var(--aos-navy-deep)); transform: translateX(4px); }
@media (max-width: 767px) { .aos-s-duo__grid { grid-template-columns: 1fr; } .aos-s-duo__door { min-height: 0; } }

/* ── 11. LINK INDEX — an A-to-Z of ways in, each row a door ── */
.aos-s-linkindex { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-linkindex__rows { border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-linkindex__row {
	display: grid;
	grid-template-columns: minmax(60px, 100px) minmax(0, 1fr) auto;
	align-items: center;
	gap: clamp(1rem, 3vw, 3rem);
	padding: clamp(1.4rem, 3.2vh, 2.1rem) clamp(0.25rem, 1vw, 1rem);
	border-bottom: 1px solid hsl(var(--border-strong));
	text-decoration: none;
	transition: background-color 0.3s var(--ease-out), padding-left 0.3s var(--ease-out);
}
.aos-s-linkindex__row:hover { background: hsl(var(--bg-alt)); padding-left: clamp(0.75rem, 2vw, 1.75rem); }
.aos-s-linkindex__num { font-family: var(--mono); font-size: 0.66rem; font-weight: 600; letter-spacing: 0.16em; color: hsl(var(--fg-subtle)); }
.aos-s-linkindex__row h3 { margin: 0; font-family: var(--display); font-size: clamp(1.4rem, 2.6vw, 2.2rem); font-weight: 500; letter-spacing: -0.022em; color: hsl(var(--fg)); }
.aos-s-linkindex__row h3 em { font-family: var(--editorial); font-style: italic; font-weight: 500; color: hsl(var(--aos-yellow-deep)); }
.aos-s-linkindex__go { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 999px; border: 1px solid hsl(var(--border-strong)); color: hsl(var(--fg)); background: hsl(var(--paper)); transition: background-color 0.3s var(--ease-out), border-color 0.3s var(--ease-out), color 0.3s var(--ease-out), transform 0.3s var(--ease-out); }
.aos-s-linkindex__row:hover .aos-s-linkindex__go { background: hsl(var(--aos-yellow)); border-color: hsl(var(--aos-yellow)); color: hsl(var(--aos-navy-deep)); transform: translateX(4px); }

/* ── 12. QUOTE WALL — a masonry of voices, one lit ── */
.aos-s-quotewall { border-top: 1px solid hsl(var(--border)); background: hsl(var(--bg-alt)); padding-block: var(--sp-band); }
.aos-s-quotewall__cols { columns: 2; column-gap: clamp(1rem, 2vw, 1.5rem); }
.aos-s-quotewall__card {
	break-inside: avoid;
	margin: 0 0 clamp(1rem, 2vw, 1.5rem);
	padding: clamp(1.4rem, 2.4vw, 2rem);
	border: 1px solid hsl(var(--border-strong));
	border-radius: 18px;
	background: hsl(var(--paper));
}
.aos-s-quotewall__card--lit { background: linear-gradient(165deg, hsl(var(--aos-yellow-soft)), hsl(var(--paper))); border-color: hsl(var(--aos-yellow) / 0.4); }
.aos-s-quotewall__card blockquote { margin: 0; font-size: 0.96rem; line-height: 1.6; color: hsl(var(--fg-muted)); }
.aos-s-quotewall__card--lit blockquote { font-family: var(--editorial); font-style: italic; font-weight: 500; font-size: 1.2rem; line-height: 1.45; color: hsl(var(--fg)); }
.aos-s-quotewall__card figcaption { display: flex; align-items: center; gap: 0.7rem; margin-top: 1.1rem; }
.aos-s-quotewall__card figcaption span { display: flex; flex-direction: column; }
.aos-s-quotewall__card figcaption b { font-size: 0.85rem; font-weight: 600; color: hsl(var(--fg)); }
.aos-s-quotewall__card figcaption i { font-style: normal; font-size: 0.72rem; color: hsl(var(--fg-subtle)); }
@media (max-width: 767px) { .aos-s-quotewall__cols { columns: 1; } }

/* ── 13. BARS — before/after drawn as data, not decoration ── */
.aos-s-bars { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-bars__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(2.5rem, 6vw, 6rem); align-items: center; }
.aos-s-bars__chart { display: flex; flex-direction: column; gap: 1.4rem; }
.aos-s-bars__row { display: grid; gap: 0.5rem; }
.aos-s-bars__label { display: flex; justify-content: space-between; font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-bars__label b { color: hsl(var(--fg)); }
.aos-s-bars__track { height: 34px; border-radius: 8px; background: hsl(var(--fg) / 0.06); overflow: hidden; }
.aos-s-bars__fill { display: block; height: 100%; width: var(--w, 50%); border-radius: 8px; background: hsl(var(--fg) / 0.22); }
.aos-s-bars__row--after .aos-s-bars__fill { background: linear-gradient(90deg, hsl(var(--aos-yellow-deep)), hsl(var(--aos-yellow))); }
.aos-reveal .aos-s-bars__fill { width: 0; transition: width 1.1s var(--ease-out) 0.3s; }
.aos-reveal.is-in .aos-s-bars__fill { width: var(--w, 50%); }
@media (max-width: 900px) { .aos-s-bars__grid { grid-template-columns: 1fr; } }

/* ── 14. ORBIT — the stack in slow rotation around the mark ── */
@keyframes aosOrbit { to { rotate: 360deg; } }
@keyframes aosOrbitCounter { to { rotate: -360deg; } }
.aos-s-orbit {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: hsl(var(--aos-navy-deep));
	padding-block: var(--sp-band);
}
.aos-s-orbit::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, hsl(var(--aos-yellow) / 0.5), transparent); }
.aos-s-orbit .aos-s-title { color: hsl(var(--bg)); }
.aos-s-orbit .aos-s-title em { color: hsl(var(--aos-yellow)); }
.aos-s-orbit__stage { position: relative; width: min(78vw, 560px); aspect-ratio: 1; margin: clamp(2rem, 5vh, 3rem) auto 0; }
.aos-s-orbit__ring { position: absolute; inset: 0; border: 1px solid hsl(var(--bg) / 0.12); border-radius: 50%; }
.aos-s-orbit__ring--inner { inset: 22%; }
.aos-s-orbit__core {
	position: absolute;
	top: 50%; left: 50%;
	translate: -50% -50%;
	display: grid;
	place-items: center;
	width: clamp(90px, 18%, 120px);
	aspect-ratio: 1;
	border-radius: 50%;
	background: hsl(var(--aos-yellow));
	color: hsl(var(--aos-navy-deep));
	font-family: var(--display);
	font-weight: 700;
	font-size: 1.1rem;
	letter-spacing: -0.02em;
	box-shadow: 0 0 0 14px hsl(var(--aos-yellow) / 0.08), 0 0 80px hsl(var(--aos-yellow) / 0.25);
}
.aos-s-orbit__belt { position: absolute; inset: 0; animation: aosOrbit 70s linear infinite; }
.aos-s-orbit__stage:hover .aos-s-orbit__belt, .aos-s-orbit__stage:hover .aos-s-orbit__belt li { animation-play-state: paused; }
.aos-s-orbit__belt li {
	position: absolute;
	top: 50%; left: 50%;
	margin: -16px 0 0 -50px;
	width: 100px;
	text-align: center;
	padding: 7px 0;
	border-radius: 999px;
	border: 1px solid hsl(var(--bg) / 0.2);
	background: hsl(var(--aos-navy) / 0.85);
	backdrop-filter: blur(4px);
	font-family: var(--mono);
	font-size: 0.58rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.8);
	transform: rotate(var(--a)) translateX(min(39vw, 280px)) rotate(calc(var(--a) * -1));
	animation: aosOrbitCounter 70s linear infinite;
}
@media (prefers-reduced-motion: reduce) { .aos-s-orbit__belt, .aos-s-orbit__belt li { animation: none; } }

/* ── 15. PRESS BAND — outlets speak, we stay quiet ── */
.aos-s-press { border-top: 1px solid hsl(var(--border)); padding-block: clamp(3.5rem, 8vh, 5.5rem); }
.aos-s-press__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 4vw, 3.5rem); }
.aos-s-press__item { padding-left: clamp(1.25rem, 2vw, 1.75rem); border-left: 1px solid hsl(var(--border-strong)); }
.aos-s-press__outlet { font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-press__item q { display: block; margin-top: 0.8rem; font-family: var(--editorial); font-style: italic; font-weight: 500; font-size: clamp(1.05rem, 1.5vw, 1.3rem); line-height: 1.4; color: hsl(var(--fg)); quotes: "\201C" "\201D"; }
@media (max-width: 900px) { .aos-s-press__grid { grid-template-columns: 1fr; } }

/* ── 16. SPOTLIGHT — one person, at portrait scale ── */
.aos-s-spotlight { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-spotlight__grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.aos-s-spotlight__media { position: relative; border-radius: 22px; overflow: hidden; isolation: isolate; aspect-ratio: 4 / 5; border: 1px solid hsl(var(--border-strong)); }
.aos-s-spotlight__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.08); }
.aos-s-spotlight__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, hsl(var(--aos-blue) / 0.35), hsl(var(--aos-navy-deep) / 0.4)); mix-blend-mode: multiply; }
.aos-s-spotlight__quote { margin: clamp(1.5rem, 3.5vh, 2.25rem) 0 0; font-family: var(--editorial); font-style: italic; font-weight: 500; font-size: clamp(1.4rem, 2.4vw, 2rem); line-height: 1.4; color: hsl(var(--fg)); max-width: 34ch; text-wrap: balance; }
.aos-s-spotlight__who { display: flex; align-items: center; gap: 0.9rem; margin-top: 1.5rem; }
.aos-s-spotlight__who span { display: flex; flex-direction: column; gap: 2px; }
.aos-s-spotlight__who b { font-size: 0.95rem; font-weight: 600; color: hsl(var(--fg)); }
.aos-s-spotlight__who i { font-style: normal; font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
@media (max-width: 900px) { .aos-s-spotlight__grid { grid-template-columns: 1fr; } .aos-s-spotlight__media { aspect-ratio: 16 / 10; } }

/* ── 17. CAPABILITY MATRIX — what ships at each level ── */
.aos-s-matrix { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-matrix__table { border: 1px solid hsl(var(--border-strong)); border-radius: 22px; overflow: hidden; background: hsl(var(--paper)); }
.aos-s-matrix__row { display: grid; grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr)); border-bottom: 1px solid hsl(var(--border)); }
.aos-s-matrix__row:last-child { border-bottom: 0; }
.aos-s-matrix__row > * { padding: clamp(0.9rem, 1.8vh, 1.2rem) clamp(1rem, 2vw, 1.75rem); font-size: 0.92rem; display: flex; align-items: center; }
.aos-s-matrix__row > :nth-child(n+2) { justify-content: center; border-left: 1px solid hsl(var(--border)); }
.aos-s-matrix__row > :nth-child(4) { background: hsl(var(--aos-yellow-soft) / 0.5); }
.aos-s-matrix__row--head { background: hsl(var(--bg-alt)); border-bottom-color: hsl(var(--border-strong)); }
.aos-s-matrix__row--head > * { font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-matrix__row--head > :nth-child(4) { color: hsl(var(--aos-yellow-deep)); }
.aos-s-matrix__feature { color: hsl(var(--fg)); font-weight: 500; }
.aos-s-matrix__yes { width: 20px; height: 20px; border-radius: 999px; background: hsl(var(--aos-yellow)); position: relative; }
.aos-s-matrix__yes::after { content: ""; position: absolute; top: 6px; left: 5px; width: 9px; height: 5px; border-left: 2px solid hsl(var(--aos-navy-deep)); border-bottom: 2px solid hsl(var(--aos-navy-deep)); transform: rotate(-45deg); }
.aos-s-matrix__no { width: 12px; height: 1.5px; background: hsl(var(--fg) / 0.25); }
@media (max-width: 767px) {
	.aos-s-matrix__row { grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); }
	.aos-s-matrix__row > * { padding: 0.75rem 0.6rem; font-size: 0.8rem; }
}

/* ── 18. BEFORE/AFTER — drag the seam, see the difference ── */
.aos-s-basplit { border-top: 1px solid hsl(var(--border)); background: hsl(var(--bg-alt)); padding-block: var(--sp-band); }
.aos-s-basplit__stage { --x: 50%; position: relative; border-radius: 24px; overflow: hidden; isolation: isolate; border: 1px solid hsl(var(--border-strong)); aspect-ratio: 16 / 9; }
.aos-s-basplit__stage img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.aos-s-basplit__before { filter: grayscale(1) contrast(0.95) brightness(1.02); }
.aos-s-basplit__after { clip-path: inset(0 0 0 var(--x)); }
.aos-s-basplit__seam { position: absolute; top: 0; bottom: 0; left: var(--x); width: 2px; margin-left: -1px; background: hsl(var(--aos-yellow)); z-index: 1; pointer-events: none; }
.aos-s-basplit__seam::after {
	content: "\2194";
	position: absolute;
	top: 50%; left: 50%;
	translate: -50% -50%;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 999px;
	background: hsl(var(--aos-yellow));
	color: hsl(var(--aos-navy-deep));
	font-size: 1.1rem;
	box-shadow: 0 4px 20px hsl(var(--aos-navy-deep) / 0.4);
}
.aos-s-basplit__stage input[type="range"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: ew-resize; z-index: 2; }
.aos-s-basplit__tag { position: absolute; bottom: 1rem; z-index: 1; padding: 6px 12px; border-radius: 999px; background: hsl(var(--aos-navy-deep) / 0.7); backdrop-filter: blur(6px); border: 1px solid hsl(var(--bg) / 0.18); font-family: var(--mono); font-size: 0.56rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--bg) / 0.85); }
.aos-s-basplit__tag--before { left: 1rem; }
.aos-s-basplit__tag--after { right: 1rem; }

/* ── 19. HEADLINE MARQUEE — the statement at freight-train scale ── */
.aos-s-headline { border-block: 1px solid hsl(var(--border)); padding-block: clamp(2rem, 5vh, 3.5rem); overflow: hidden; }
.aos-s-headline__track { display: flex; width: max-content; animation: aosMarqX 36s linear infinite; }
.aos-s-headline:hover .aos-s-headline__track { animation-play-state: paused; }
.aos-s-headline__set { display: flex; align-items: baseline; white-space: nowrap; padding-right: 0.6em; }
.aos-s-headline__set span {
	font-family: var(--display);
	font-weight: 700;
	font-size: clamp(4rem, 11vw, 9.5rem);
	line-height: 1;
	letter-spacing: -0.045em;
	color: hsl(var(--fg) / 0.12);
	padding-right: 0.6em;
}
.aos-s-headline__set em { font-family: var(--editorial); font-style: italic; font-weight: 500; color: hsl(var(--aos-yellow-deep)); }
@media (prefers-reduced-motion: reduce) { .aos-s-headline__track { animation: none; } }

/* ── 20. SNAP CAROUSEL — cards on a rail, arrows on the rail's terms ── */
.aos-s-carousel { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-carousel .aos-s-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.aos-s-carousel__nav { display: flex; gap: 0.6rem; }
.aos-s-carousel__btn {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border-radius: 999px;
	border: 1px solid hsl(var(--border-strong));
	background: hsl(var(--paper));
	color: hsl(var(--fg));
	cursor: pointer;
	transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}
.aos-s-carousel__btn:hover { background: hsl(var(--aos-yellow)); border-color: hsl(var(--aos-yellow)); color: hsl(var(--aos-navy-deep)); }
.aos-s-carousel__btn:focus-visible { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: 3px; }
.aos-s-carousel__track {
	display: flex;
	gap: clamp(1rem, 2vw, 1.5rem);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	padding-block: 0.25rem;
}
.aos-s-carousel__track::-webkit-scrollbar { display: none; }
.aos-s-carousel__card {
	flex: 0 0 auto;
	width: min(78vw, 420px);
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	padding: clamp(1.5rem, 2.4vw, 2.1rem);
	border: 1px solid hsl(var(--border-strong));
	border-radius: 20px;
	background: hsl(var(--paper));
	text-decoration: none;
	transition: border-color 0.35s var(--ease-out), transform 0.35s var(--ease-out);
}
.aos-s-carousel__card:hover { border-color: hsl(var(--aos-yellow) / 0.5); transform: translateY(-3px); }
.aos-s-carousel__meta { font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--aos-yellow-deep)); }
.aos-s-carousel__card h3 { margin: 0.9rem 0 0; font-family: var(--display); font-size: clamp(1.15rem, 1.7vw, 1.45rem); font-weight: 500; line-height: 1.28; letter-spacing: -0.015em; color: hsl(var(--fg)); text-wrap: balance; }
.aos-s-carousel__card p { margin: 0.7rem 0 1.4rem; font-size: 0.92rem; line-height: 1.55; color: hsl(var(--fg-muted)); }
.aos-s-carousel__card .aos-ghost { margin-top: auto; align-self: flex-start; }

/* ── 21. PRICE SOLO — one number, one promise, no grid ── */
.aos-s-pricesolo {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: hsl(var(--aos-navy-deep));
	padding-block: var(--sp-band);
}
.aos-s-pricesolo::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(50% 55% at 50% 8%, hsl(var(--aos-yellow) / 0.13), transparent 62%); }
.aos-s-pricesolo::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, hsl(var(--aos-yellow) / 0.5), transparent); }
.aos-s-pricesolo__card {
	max-width: 720px;
	margin-inline: auto;
	padding: clamp(2rem, 4vw, 3.5rem);
	border: 1px solid hsl(var(--aos-yellow) / 0.45);
	border-radius: 28px;
	background: linear-gradient(170deg, hsl(var(--aos-yellow) / 0.09), hsl(var(--bg) / 0.02));
	box-shadow: 0 40px 90px -40px hsl(var(--aos-yellow) / 0.3);
	text-align: center;
}
.aos-s-pricesolo__kicker { font-family: var(--mono); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: hsl(var(--aos-yellow)); }
.aos-s-pricesolo__price { margin: 1.25rem 0 0; font-family: var(--display); font-size: clamp(3.2rem, 7vw, 5.5rem); font-weight: 600; line-height: 0.9; letter-spacing: -0.045em; color: hsl(var(--bg)); font-variant-numeric: tabular-nums; }
.aos-s-pricesolo__price em { font-family: var(--mono); font-style: normal; font-size: 0.24em; font-weight: 600; letter-spacing: 0.08em; color: hsl(var(--bg) / 0.5); }
.aos-s-pricesolo__ticks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.7rem 2rem; margin: clamp(1.75rem, 4vh, 2.5rem) 0 0; padding: clamp(1.5rem, 3vh, 2rem) 0 0; border-top: 1px solid hsl(var(--bg) / 0.12); list-style: none; text-align: left; }
.aos-s-pricesolo__ticks li { position: relative; padding-left: 1.4rem; font-size: 0.9rem; line-height: 1.5; color: hsl(var(--bg) / 0.72); }
.aos-s-pricesolo__ticks li::before { content: ""; position: absolute; left: 0; top: 0.55em; width: 8px; height: 1px; background: hsl(var(--aos-yellow)); }
.aos-s-pricesolo__card .aos-btn { margin-top: clamp(1.75rem, 4vh, 2.5rem); }
@media (max-width: 640px) { .aos-s-pricesolo__ticks { grid-template-columns: 1fr; } }

/* ── 22. HERO SPLIT (LIGHT) — the daylight sibling of the meter hero ── */
.aos-hero-split { border-bottom: 1px solid hsl(var(--border)); padding-block: clamp(4rem, 11vh, 7rem) clamp(3.5rem, 9vh, 6rem); }
.aos-hero-split__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(2.5rem, 5vw, 5rem); align-items: center; }
.aos-hero-split__title { margin: 1.35rem 0 0; font-family: var(--display); font-size: clamp(2.4rem, 4.4vw, 4rem); line-height: 1.04; letter-spacing: -0.03em; font-weight: 500; color: hsl(var(--fg)); text-wrap: balance; }
.aos-hero-split__title em { font-family: var(--editorial); font-style: italic; font-weight: 500; font-size: 1.06em; color: hsl(var(--aos-yellow-deep)); }
.aos-hero-split__lede { margin: 1.4rem 0 0; max-width: 50ch; font-size: clamp(1rem, 1.25vw, 1.15rem); line-height: 1.6; color: hsl(var(--fg-muted)); }
.aos-hero-split__actions { display: flex; align-items: center; flex-wrap: wrap; gap: clamp(1.25rem, 2.5vw, 2rem); margin-top: clamp(1.9rem, 4.5vh, 2.75rem); }
.aos-hero-split__media { position: relative; border-radius: 24px; overflow: hidden; isolation: isolate; aspect-ratio: 4 / 5; border: 1px solid hsl(var(--border-strong)); }
.aos-hero-split__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.aos-hero-split__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, hsl(var(--aos-blue) / 0.35), hsl(var(--aos-navy-deep) / 0.45)); mix-blend-mode: multiply; }
.aos-hero-split__chip {
	position: absolute;
	z-index: 1;
	left: clamp(1rem, 2vw, 1.5rem);
	bottom: clamp(1rem, 2vw, 1.5rem);
	padding: 0.9rem 1.2rem;
	border-radius: 16px;
	background: hsl(var(--aos-navy-deep) / 0.75);
	backdrop-filter: blur(8px);
	border: 1px solid hsl(var(--bg) / 0.18);
}
.aos-hero-split__chip b { display: block; font-family: var(--display); font-size: 1.6rem; font-weight: 600; letter-spacing: -0.03em; line-height: 1; color: hsl(var(--aos-yellow)); font-variant-numeric: tabular-nums; }
.aos-hero-split__chip > span { display: block; margin-top: 0.4rem; font-family: var(--mono); font-size: 0.56rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--bg) / 0.6); }
/* Floating proof card — light glass over the duotone panel */
.aos-hero-split__proof {
	position: absolute;
	z-index: 1;
	left: clamp(1rem, 2vw, 1.5rem);
	bottom: clamp(1rem, 2vw, 1.5rem);
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding: 0.6rem 1.1rem 0.6rem 0.6rem;
	border-radius: 999px;
	background: hsl(var(--bg) / 0.92);
	backdrop-filter: blur(12px);
	border: 0.5px solid hsl(var(--bg) / 0.5);
	box-shadow: 0 18px 40px -18px hsl(var(--aos-navy-deep) / 0.55);
}
/* the media panel's img rule (absolute, duotone) must not reach the proof avatars */
.aos-hero-split__proof .aos-avatars--sm img { position: static; inset: auto; width: 30px; height: 30px; filter: none; border-color: hsl(var(--bg)); }
.aos-hero-split__proof-copy { display: block; }
.aos-hero-split__proof-copy b { display: block; font-family: var(--display); font-size: 0.85rem; font-weight: 600; letter-spacing: -0.01em; line-height: 1.2; color: hsl(var(--fg)); }
.aos-hero-split__proof-copy i { display: block; margin-top: 0.15rem; font-style: normal; font-size: 0.72rem; line-height: 1.35; color: hsl(var(--fg-subtle)); }
@media (max-width: 900px) { .aos-hero-split__grid { grid-template-columns: 1fr; } .aos-hero-split__media { aspect-ratio: 16 / 10; } }

/* ── 23. HERO CENTERED — the Apple open: name it, claim it ── */
.aos-hero-center { border-bottom: 1px solid hsl(var(--border)); padding-block: clamp(5rem, 14vh, 9rem); text-align: center; }
.aos-hero-center__title { margin: 1.5rem auto 0; max-width: 16ch; font-family: var(--display); font-size: clamp(2.8rem, 6vw, 5.5rem); line-height: 1.02; letter-spacing: -0.035em; font-weight: 500; color: hsl(var(--fg)); text-wrap: balance; }
.aos-hero-center__title em { font-family: var(--editorial); font-style: italic; font-weight: 500; font-size: 1.06em; color: hsl(var(--aos-yellow-deep)); }
.aos-hero-center__lede { margin: 1.4rem auto 0; max-width: 44ch; font-size: clamp(1.02rem, 1.3vw, 1.2rem); line-height: 1.6; color: hsl(var(--fg-muted)); text-wrap: balance; }
.aos-hero-center__actions { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: clamp(1.25rem, 2.5vw, 2rem); margin-top: clamp(2rem, 5vh, 3rem); }
.aos-hero-center__meta {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 0.6rem 2rem;
	margin: clamp(2.5rem, 6vh, 3.5rem) auto 0;
	padding-top: 1.3rem;
	border-top: 1px solid hsl(var(--border));
	max-width: 640px;
	list-style: none;
	font-family: var(--mono);
	font-size: 0.62rem;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-hero-center__meta li { display: inline-flex; align-items: center; gap: 0.55rem; }
.aos-hero-center__meta li::before { content: ""; width: 5px; height: 5px; border-radius: 999px; background: hsl(var(--aos-yellow-deep)); }

/* ── 24. ANNOTATED FRAME — the product, footnoted ── */
.aos-s-annotated { border-top: 1px solid hsl(var(--border)); background: hsl(var(--bg-alt)); padding-block: var(--sp-band); }
.aos-s-annotated__stage { position: relative; max-width: 980px; margin-inline: auto; }
.aos-s-annotated__stage .aos-browser { width: 100%; }
.aos-s-annotated__note {
	position: absolute;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	max-width: 200px;
}
.aos-s-annotated__note::before { content: ""; width: clamp(28px, 4vw, 48px); height: 1px; background: hsl(var(--aos-yellow-deep)); }
.aos-s-annotated__note--left { text-align: right; align-items: flex-end; }
.aos-s-annotated__note b { font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--aos-yellow-deep)); }
.aos-s-annotated__note span { font-size: 0.82rem; line-height: 1.45; color: hsl(var(--fg-muted)); }
@media (max-width: 1100px) {
	.aos-s-annotated__note { position: static; max-width: none; flex-direction: row; align-items: baseline; gap: 0.75rem; margin-top: 1rem; text-align: left; }
	.aos-s-annotated__note::before { display: none; }
	.aos-s-annotated__note--left { align-items: baseline; }
}

/* ── 25. RECOGNITION — the record, kept in mono ── */
.aos-s-recognition { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-recognition__rows { border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-recognition__row {
	display: grid;
	grid-template-columns: minmax(70px, 110px) minmax(0, 1.6fr) minmax(0, 1fr);
	align-items: baseline;
	gap: clamp(1rem, 3vw, 3rem);
	padding: clamp(1.1rem, 2.6vh, 1.6rem) 0.25rem;
	border-bottom: 1px solid hsl(var(--border-strong));
	transition: background-color 0.3s var(--ease-out);
}
.aos-s-recognition__row:hover { background: hsl(var(--bg-alt)); }
.aos-s-recognition__year { font-family: var(--mono); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.14em; color: hsl(var(--aos-yellow-deep)); }
.aos-s-recognition__what { font-family: var(--display); font-size: clamp(1.05rem, 1.6vw, 1.35rem); font-weight: 500; letter-spacing: -0.014em; color: hsl(var(--fg)); }
.aos-s-recognition__org { font-family: var(--mono); font-size: 0.62rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); text-align: right; }
@media (max-width: 640px) {
	.aos-s-recognition__row { grid-template-columns: minmax(60px, 80px) 1fr; }
	.aos-s-recognition__org { grid-column: 2; text-align: left; }
}

/* ── Jewels: shared entrance + responsive spine ── */
.aos-reveal :is(.aos-s-bento__cell, .aos-s-duo__door, .aos-s-press__item, .aos-s-linkindex__row, .aos-s-recognition__row, .aos-s-quotewall__card, .aos-s-carousel__card) { opacity: 0; }
.aos-reveal.is-in :is(.aos-s-bento__cell, .aos-s-duo__door, .aos-s-press__item, .aos-s-linkindex__row, .aos-s-recognition__row, .aos-s-quotewall__card, .aos-s-carousel__card) { animation: aosSRise 0.6s var(--ease-out) 0.1s forwards; }
.aos-reveal.is-in :is(.aos-s-bento__cell, .aos-s-duo__door, .aos-s-press__item, .aos-s-linkindex__row, .aos-s-recognition__row, .aos-s-quotewall__card, .aos-s-carousel__card):nth-child(2) { animation-delay: 0.2s; }
.aos-reveal.is-in :is(.aos-s-bento__cell, .aos-s-linkindex__row, .aos-s-recognition__row, .aos-s-quotewall__card, .aos-s-carousel__card):nth-child(3) { animation-delay: 0.3s; }
.aos-reveal.is-in :is(.aos-s-bento__cell, .aos-s-linkindex__row, .aos-s-recognition__row, .aos-s-quotewall__card, .aos-s-carousel__card):nth-child(4) { animation-delay: 0.4s; }
.aos-reveal.is-in :is(.aos-s-bento__cell, .aos-s-linkindex__row, .aos-s-recognition__row):nth-child(5) { animation-delay: 0.5s; }
@media (prefers-reduced-motion: reduce) {
	.aos-reveal :is(.aos-s-bento__cell, .aos-s-duo__door, .aos-s-press__item, .aos-s-linkindex__row, .aos-s-recognition__row, .aos-s-quotewall__card, .aos-s-carousel__card) { opacity: 1 !important; animation: none !important; }
}
@media (max-width: 900px) {
	.aos-s-bento__cell--media, .aos-s-bento__cell--stat, .aos-s-bento__cell--dark, .aos-s-bento__cell--feature, .aos-s-bento__cell--feature:last-child { grid-column: span 12; }
	.aos-s-bento__cell--media { min-height: 300px; }
	/* The desktop wide-cell treatment (row layout, span 8) squeezes its title
	   and body into side-by-side slivers once the cell is span 12 — stack it. */
	.aos-s-bento__cell--feature:last-child { flex-direction: column; align-items: stretch; justify-content: flex-start; }
}

/* ══════════════════════════════════════════════════════════════════════
   HAIRLINE PASS — borders were reading harsh. Two moves, site-wide:
   the divider tokens lighten a step inside page mains, and every card
   or panel container wears a half-pixel border (renders as a true
   hairline on retina, a paler line on 1x). Focus rings, button fills,
   and the 2px accent rules are deliberately untouched.
   ══════════════════════════════════════════════════════════════════════ */
main.aos-hp, main.aos-sp {
	--border: 220 9% 92%;
	--border-strong: 220 9% 87%;
}
:is(.aos-s-bento__cell, .aos-s-duo__door, .aos-s-carousel__card, .aos-s-quotewall__card,
	.aos-s-tmarquee__chip, .aos-s-hrail__card, .aos-s-pinstack__panel, .aos-s-econ__instrument,
	.aos-s-compare__table, .aos-s-matrix__table, .aos-s-basplit__stage, .aos-s-videoband__panel,
	.aos-s-split__media, .aos-s-spotlight__media, .aos-hero-split__media, .aos-s-expand__panel,
	.aos-s-window__kicker, .aos-s-tier, .aos-meter, .aos-s-case, .aos-s-pricesolo__card,
	.aos-work__card, .aos-s-features__grid, .aos-s-team__grid, .aos-s-proof__grid,
	.aos-s-voices__lattice, .aos-s-impact__grid) {
	border-width: 0.5px;
}
.aos-s-statstrip__cell, .aos-s-econ__path--before { border-width: 0 0 0 0.5px; }
.aos-s-statstrip__cell:first-child { border-left-width: 0; }

/* ══════════════════════════════════════════════════════════════════════
   BATCH THREE — ten more, Salix-informed: the blueprint frame, and
   product UI drawn entirely from theme tokens (no screenshots): a
   dashboard vignette, spark stats, a code window, a notification stack.
   Plus the editorial pieces: inline-image manifesto, hover-preview list,
   centered FAQ, changelog ledger, avatar CTA.
   ══════════════════════════════════════════════════════════════════════ */

/* ── 26. BLUEPRINT FRAME — the statement, drafted ── */
.aos-s-blueprint { padding-block: var(--sp-band); }
.aos-s-blueprint__frame {
	position: relative;
	padding: clamp(3rem, 7vw, 6rem) clamp(1.5rem, 5vw, 5rem);
	border: 0.5px solid hsl(var(--fg) / 0.18);
	text-align: center;
}
.aos-s-blueprint__frame i {
	position: absolute;
	width: 10px;
	height: 10px;
	border: 1px solid hsl(var(--aos-yellow-deep));
	background: hsl(var(--bg));
}
.aos-s-blueprint__frame i:nth-child(1) { top: -5px; left: -5px; }
.aos-s-blueprint__frame i:nth-child(2) { top: -5px; right: -5px; }
.aos-s-blueprint__frame i:nth-child(3) { bottom: -5px; left: -5px; }
.aos-s-blueprint__frame i:nth-child(4) { bottom: -5px; right: -5px; }
.aos-s-blueprint__dim {
	position: absolute;
	top: -0.5em;
	left: 50%;
	translate: -50% 0;
	padding: 0 12px;
	background: hsl(var(--bg));
	font-family: var(--mono);
	font-size: 0.6rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-s-blueprint__frame h2 {
	margin: 0 auto;
	max-width: 22ch;
	font-family: var(--display);
	font-size: clamp(1.9rem, 3.8vw, 3.2rem);
	font-weight: 500;
	line-height: 1.15;
	letter-spacing: -0.026em;
	color: hsl(var(--fg));
	text-wrap: balance;
}
.aos-s-blueprint__frame h2 em { font-family: var(--editorial); font-style: italic; font-weight: 500; color: hsl(var(--aos-yellow-deep)); }
.aos-s-blueprint__note { margin: 1.25rem 0 0; font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.16em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }

/* ── 27. DASHBOARD VIGNETTE — the product, drawn from tokens ── */
.aos-s-dash { border-top: 1px solid hsl(var(--border)); background: hsl(var(--bg-alt)); padding-block: var(--sp-band); }
.aos-s-dash__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); align-items: start; }
.aos-s-dash__card {
	border: 0.5px solid hsl(var(--fg) / 0.14);
	border-radius: 18px;
	background: hsl(var(--paper));
	padding: 1.25rem;
	box-shadow: 0 24px 50px -30px hsl(var(--aos-navy-deep) / 0.18);
}
.aos-s-dash__card:nth-child(2) { translate: 0 clamp(0.75rem, 2vw, 1.5rem); }
.aos-s-dash__title { margin: 0 0 1rem; font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-dash__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 0.7rem 0.8rem;
	border: 0.5px solid hsl(var(--fg) / 0.1);
	border-radius: 12px;
	background: hsl(var(--bg));
}
.aos-s-dash__row + .aos-s-dash__row { margin-top: 0.5rem; }
.aos-s-dash__row b { font-size: 0.82rem; font-weight: 600; color: hsl(var(--fg)); }
.aos-s-dash__row span { font-family: var(--mono); font-size: 0.56rem; letter-spacing: 0.08em; color: hsl(var(--fg-subtle)); }
.aos-s-dash__state {
	padding: 3px 9px;
	border-radius: 999px;
	font-family: var(--mono);
	font-size: 0.52rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	background: hsl(var(--aos-yellow-soft));
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-dash__state--wait { background: hsl(var(--fg) / 0.06); color: hsl(var(--fg-subtle)); }
.aos-s-dash__bar { display: grid; gap: 0.4rem; }
.aos-s-dash__bar + .aos-s-dash__bar { margin-top: 0.9rem; }
.aos-s-dash__bar span { font-family: var(--mono); font-size: 0.56rem; letter-spacing: 0.1em; text-transform: uppercase; color: hsl(var(--fg-subtle)); display: flex; justify-content: space-between; }
.aos-s-dash__bar span b { color: hsl(var(--aos-yellow-deep)); }
.aos-s-dash__track { height: 22px; border-radius: 6px; background: hsl(var(--fg) / 0.05); overflow: hidden; }
.aos-s-dash__fill { display: block; height: 100%; width: var(--w, 50%); border-radius: 6px; background: linear-gradient(90deg, hsl(var(--aos-yellow-deep)), hsl(var(--aos-yellow))); }
.aos-s-dash__fill--muted { background: hsl(var(--fg) / 0.18); }
.aos-reveal .aos-s-dash__fill { width: 0; transition: width 1s var(--ease-out) 0.35s; }
.aos-reveal.is-in .aos-s-dash__fill { width: var(--w, 50%); }
.aos-s-dash__big { font-family: var(--display); font-size: clamp(1.9rem, 3vw, 2.6rem); font-weight: 600; letter-spacing: -0.03em; line-height: 1; color: hsl(var(--fg)); font-variant-numeric: tabular-nums; }
.aos-s-dash__delta { display: inline-flex; align-items: center; gap: 4px; margin-left: 0.6rem; font-family: var(--mono); font-size: 0.6rem; font-weight: 600; color: hsl(var(--aos-yellow-deep)); }
.aos-s-dash__spark { margin-top: 1rem; width: 100%; height: 52px; }
.aos-s-dash__spark polyline { fill: none; stroke: hsl(var(--aos-yellow-deep)); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.aos-s-dash__spark polygon { fill: hsl(var(--aos-yellow) / 0.12); }
@media (max-width: 900px) { .aos-s-dash__grid { grid-template-columns: 1fr; } .aos-s-dash__card:nth-child(2) { translate: none; } }

/* ── 28. SPARK STATS — three KPIs with their own weather ── */
.aos-s-spark { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-spark__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); }
.aos-s-spark__card { border: 0.5px solid hsl(var(--fg) / 0.14); border-radius: 18px; background: hsl(var(--paper)); padding: clamp(1.4rem, 2.2vw, 1.9rem); }
.aos-s-spark__label { font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-spark__value { display: flex; align-items: baseline; gap: 0.7rem; margin-top: 0.9rem; }
.aos-s-spark__value b { font-family: var(--display); font-size: clamp(2.1rem, 3.4vw, 3rem); font-weight: 600; letter-spacing: -0.035em; line-height: 1; color: hsl(var(--fg)); font-variant-numeric: tabular-nums; }
.aos-s-spark__delta { font-family: var(--mono); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.06em; color: hsl(var(--aos-yellow-deep)); }
.aos-s-spark__delta--down { color: hsl(var(--fg-subtle)); }
.aos-s-spark__card svg { width: 100%; height: 46px; margin-top: 1.1rem; }
.aos-s-spark__card polyline { fill: none; stroke: hsl(var(--aos-yellow-deep)); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 900px) { .aos-s-spark__grid { grid-template-columns: 1fr; } }

/* ── 29. CODE WINDOW — the API, in the brand's own terminal ── */
.aos-s-code { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-code__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.aos-s-code__window {
	border-radius: 18px;
	overflow: hidden;
	border: 0.5px solid hsl(var(--aos-navy-soft));
	background: hsl(var(--aos-navy-deep));
	box-shadow: 0 40px 80px -40px hsl(var(--aos-navy-deep) / 0.5);
}
.aos-s-code__bar { display: flex; align-items: center; gap: 7px; padding: 0.8rem 1rem; border-bottom: 1px solid hsl(var(--bg) / 0.08); }
.aos-s-code__dot { width: 10px; height: 10px; border-radius: 50%; background: hsl(var(--bg) / 0.15); }
.aos-s-code__file { margin-left: 8px; font-family: var(--mono); font-size: 0.6rem; letter-spacing: 0.1em; color: hsl(var(--bg) / 0.45); }
.aos-s-code__window pre {
	margin: 0;
	padding: 1.25rem 1.4rem 1.5rem;
	overflow-x: auto;
	font-family: var(--mono);
	font-size: 0.78rem;
	line-height: 1.75;
	color: hsl(var(--bg) / 0.75);
}
.aos-s-code__window pre b { font-weight: 600; color: hsl(var(--aos-yellow)); }
.aos-s-code__window pre i { font-style: normal; color: hsl(var(--aos-blue) / 0.9); }
.aos-s-code__window pre u { text-decoration: none; color: hsl(var(--bg) / 0.4); }
@media (max-width: 900px) { .aos-s-code__grid { grid-template-columns: 1fr; } }

/* ── 30. NOTIFICATION STACK — the agent, working, as UI ── */
.aos-s-notif { border-top: 1px solid hsl(var(--border)); background: hsl(var(--bg-alt)); padding-block: var(--sp-band); }
.aos-s-notif__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.aos-s-notif__stack { display: flex; flex-direction: column; gap: 0.9rem; }
.aos-s-notif__card {
	display: flex;
	align-items: flex-start;
	gap: 0.9rem;
	padding: 1rem 1.2rem;
	border: 0.5px solid hsl(var(--fg) / 0.12);
	border-radius: 16px;
	background: hsl(var(--paper));
	box-shadow: 0 18px 40px -24px hsl(var(--aos-navy-deep) / 0.25);
}
.aos-s-notif__card:nth-child(1) { rotate: -0.6deg; }
.aos-s-notif__card:nth-child(2) { rotate: 0.4deg; translate: clamp(0.5rem, 2vw, 1.5rem) 0; }
.aos-s-notif__card:nth-child(3) { rotate: -0.3deg; }
.aos-s-notif__icon {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border-radius: 10px;
	background: hsl(var(--aos-yellow-soft));
	color: hsl(var(--aos-yellow-deep));
	font-family: var(--mono);
	font-size: 0.62rem;
	font-weight: 700;
}
.aos-s-notif__card b { display: block; font-size: 0.86rem; font-weight: 600; color: hsl(var(--fg)); }
.aos-s-notif__card p { margin: 0.2rem 0 0; font-size: 0.8rem; line-height: 1.45; color: hsl(var(--fg-muted)); }
.aos-s-notif__time { margin-left: auto; flex: 0 0 auto; font-family: var(--mono); font-size: 0.54rem; letter-spacing: 0.08em; color: hsl(var(--fg-subtle)); }
.aos-reveal .aos-s-notif__card { opacity: 0; translate: 0 14px; }
.aos-reveal.is-in .aos-s-notif__card { animation: aosSRise 0.55s var(--ease-out) forwards; }
.aos-reveal.is-in .aos-s-notif__card:nth-child(1) { animation-delay: 0.15s; }
.aos-reveal.is-in .aos-s-notif__card:nth-child(2) { animation-delay: 0.5s; }
.aos-reveal.is-in .aos-s-notif__card:nth-child(3) { animation-delay: 0.85s; }
@media (prefers-reduced-motion: reduce) { .aos-reveal .aos-s-notif__card { opacity: 1 !important; animation: none !important; } }
@media (max-width: 900px) { .aos-s-notif__grid { grid-template-columns: 1fr; } }

/* ── 31. INLINE MANIFESTO — images living inside the sentence ── */
.aos-s-inlineman { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-inlineman h2 {
	margin: 0;
	max-width: 24ch;
	font-family: var(--display);
	font-size: clamp(2.2rem, 4.8vw, 4.2rem);
	font-weight: 500;
	line-height: 1.22;
	letter-spacing: -0.028em;
	color: hsl(var(--fg));
}
.aos-s-inlineman h2 em { font-family: var(--editorial); font-style: italic; font-weight: 500; color: hsl(var(--aos-yellow-deep)); }
.aos-s-inlineman__img {
	display: inline-block;
	vertical-align: middle;
	width: clamp(3.2rem, 7vw, 6rem);
	height: clamp(2rem, 4.4vw, 3.75rem);
	margin: 0 0.18em;
	border-radius: 999px;
	overflow: hidden;
	border: 0.5px solid hsl(var(--fg) / 0.15);
}
.aos-s-inlineman__img img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); }

/* ── 32. HOVER LIST — rows summon their preview ── */
.aos-s-hoverlist { position: relative; border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-hoverlist__rows { border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-hoverlist__row {
	display: grid;
	grid-template-columns: minmax(60px, 90px) minmax(0, 1fr) auto;
	align-items: baseline;
	gap: clamp(1rem, 3vw, 3rem);
	padding: clamp(1.4rem, 3vh, 2rem) 0.25rem;
	border-bottom: 1px solid hsl(var(--border-strong));
	text-decoration: none;
	transition: opacity 0.3s var(--ease-out);
}
.aos-s-hoverlist__rows:hover .aos-s-hoverlist__row { opacity: 0.35; }
.aos-s-hoverlist__rows .aos-s-hoverlist__row:hover { opacity: 1; }
.aos-s-hoverlist__num { font-family: var(--mono); font-size: 0.64rem; font-weight: 600; letter-spacing: 0.16em; color: hsl(var(--fg-subtle)); }
.aos-s-hoverlist__row h3 { margin: 0; font-family: var(--display); font-size: clamp(1.35rem, 2.4vw, 2rem); font-weight: 500; letter-spacing: -0.02em; color: hsl(var(--fg)); }
.aos-s-hoverlist__meta { font-family: var(--mono); font-size: 0.6rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-hoverlist__preview {
	position: fixed;
	z-index: 50;
	width: 240px;
	aspect-ratio: 4 / 3;
	border-radius: 14px;
	overflow: hidden;
	border: 0.5px solid hsl(var(--fg) / 0.2);
	box-shadow: 0 30px 60px -25px hsl(var(--aos-navy-deep) / 0.5);
	pointer-events: none;
	opacity: 0;
	scale: 0.92;
	transition: opacity 0.25s var(--ease-out), scale 0.25s var(--ease-out);
	translate: -50% -50%;
}
.aos-s-hoverlist__preview.is-on { opacity: 1; scale: 1; }
.aos-s-hoverlist__preview img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.aos-s-hoverlist__preview::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, hsl(var(--aos-blue) / 0.35), hsl(var(--aos-navy-deep) / 0.4)); mix-blend-mode: multiply; }
@media (hover: none), (prefers-reduced-motion: reduce) { .aos-s-hoverlist__preview { display: none; } .aos-s-hoverlist__rows:hover .aos-s-hoverlist__row { opacity: 1; } }

/* ── 33. FAQ CENTERED — one quiet column of answers ── */
.aos-s-faqcenter { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-faqcenter__col { max-width: 760px; margin-inline: auto; }
.aos-s-faqcenter__col .aos-s-head { text-align: center; }
.aos-s-faqcenter__col .aos-s-eyebrow { justify-content: center; }
.aos-s-faqcenter__col .aos-s-lede { margin-inline: auto; }
.aos-s-faqcenter__list { margin-top: clamp(2.25rem, 5vh, 3.25rem); border-top: 1px solid hsl(var(--border-strong)); }

/* ── 34. CHANGELOG — the product's pulse, kept honestly ── */
.aos-s-changelog { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-changelog__rows { border-top: 1px solid hsl(var(--border-strong)); max-width: 860px; }
.aos-s-changelog__row {
	display: grid;
	grid-template-columns: minmax(100px, 140px) minmax(0, 1fr);
	gap: clamp(1.25rem, 3vw, 2.5rem);
	padding: clamp(1.5rem, 3.2vh, 2.1rem) 0;
	border-bottom: 1px solid hsl(var(--border-strong));
}
.aos-s-changelog__stamp { display: flex; flex-direction: column; gap: 0.5rem; align-items: flex-start; }
.aos-s-changelog__ver {
	padding: 4px 10px;
	border-radius: 999px;
	border: 0.5px solid hsl(var(--aos-yellow) / 0.45);
	background: hsl(var(--aos-yellow-soft) / 0.6);
	font-family: var(--mono);
	font-size: 0.6rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-changelog__date { font-family: var(--mono); font-size: 0.58rem; letter-spacing: 0.12em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-changelog__row h3 { margin: 0; font-family: var(--display); font-size: clamp(1.1rem, 1.6vw, 1.35rem); font-weight: 600; letter-spacing: -0.014em; color: hsl(var(--fg)); }
.aos-s-changelog__row ul { margin: 0.7rem 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 0.4rem; }
.aos-s-changelog__row li { position: relative; padding-left: 1.2rem; font-size: 0.92rem; line-height: 1.5; color: hsl(var(--fg-muted)); }
.aos-s-changelog__row li::before { content: ""; position: absolute; left: 0; top: 0.6em; width: 7px; height: 1px; background: hsl(var(--aos-yellow-deep)); }
@media (max-width: 640px) { .aos-s-changelog__row { grid-template-columns: 1fr; gap: 0.75rem; } .aos-s-changelog__stamp { flex-direction: row; align-items: center; } }

/* ── 35. AVATAR CTA — the room you'd be joining ── */
.aos-s-avatarcta { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); text-align: center; }
.aos-s-avatarcta__stack { display: flex; justify-content: center; margin-bottom: clamp(1.5rem, 3.5vh, 2.25rem); }
.aos-s-avatarcta__stack span {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: 999px;
	border: 2px solid hsl(var(--bg));
	background: hsl(var(--aos-yellow-soft));
	color: hsl(var(--aos-yellow-deep));
	font-family: var(--mono);
	font-size: 0.72rem;
	font-weight: 600;
}
.aos-s-avatarcta__stack span + span { margin-left: -14px; }
.aos-s-avatarcta__stack span:nth-child(even) { background: hsl(var(--aos-navy)); color: hsl(var(--bg)); }
.aos-s-avatarcta__stack span:last-child { background: hsl(var(--aos-yellow)); color: hsl(var(--aos-navy-deep)); }
.aos-s-avatarcta h2 {
	margin: 0 auto;
	max-width: 20ch;
	font-family: var(--display);
	font-size: clamp(1.9rem, 3.6vw, 3.1rem);
	font-weight: 500;
	line-height: 1.12;
	letter-spacing: -0.025em;
	color: hsl(var(--fg));
	text-wrap: balance;
}
.aos-s-avatarcta h2 em { font-family: var(--editorial); font-style: italic; font-weight: 500; color: hsl(var(--aos-yellow-deep)); }
.aos-s-avatarcta__note { margin: 1rem 0 0; font-family: var(--mono); font-size: 0.62rem; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-avatarcta .aos-btn { margin-top: clamp(1.75rem, 4vh, 2.5rem); }

/* ── 36. GROWTH STORIES — the Clover pattern in AOS clothes: quote cards
   and an ambient video-testimonial card sharing one snap rail. The video
   card plays a muted portrait loop under a navy grade, the sitter's name
   on the glass. Arrows ride the existing carousel primitive. ── */
.aos-s-stories { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-stories .aos-s-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.aos-s-stories__track {
	display: flex;
	gap: clamp(1rem, 2vw, 1.5rem);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	padding-block: 0.25rem;
}
.aos-s-stories__track::-webkit-scrollbar { display: none; }
.aos-s-stories__card {
	position: relative;
	flex: 0 0 auto;
	width: min(76vw, 380px);
	aspect-ratio: 4 / 5;
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	padding: clamp(1.4rem, 2.2vw, 1.9rem);
	border: 0.5px solid hsl(var(--fg) / 0.14);
	border-radius: 20px;
	background: hsl(var(--paper));
	overflow: hidden;
	isolation: isolate;
}
.aos-s-stories__card blockquote {
	margin: 0;
	font-size: 0.98rem;
	line-height: 1.6;
	color: hsl(var(--fg-muted));
}
.aos-s-stories__card blockquote::before {
	content: "\201C";
	display: block;
	margin-bottom: 0.7rem;
	font-family: var(--editorial);
	font-size: 2.4rem;
	line-height: 0.55;
	color: hsl(var(--aos-yellow));
}
.aos-s-stories__who { display: flex; align-items: center; gap: 0.75rem; margin-top: auto; padding-top: 1.25rem; }
.aos-s-stories__who img { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 999px; object-fit: cover; border: 0.5px solid hsl(var(--fg) / 0.14); }
.aos-s-stories__who span { display: flex; flex-direction: column; gap: 2px; }
.aos-s-stories__who b { font-size: 0.88rem; font-weight: 600; color: hsl(var(--fg)); }
.aos-s-stories__who i { font-style: normal; font-family: var(--mono); font-size: 0.58rem; letter-spacing: 0.12em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
/* The video card — ambient loop, navy grade, identity on the glass */
.aos-s-stories__card--video { padding: 0; border-color: hsl(var(--aos-navy-soft)); }
.aos-s-stories__card--video video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.aos-s-stories__card--video::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, hsl(var(--aos-navy-deep) / 0.12), transparent 35%, hsl(var(--aos-navy-deep) / 0.82) 100%),
		linear-gradient(200deg, hsl(var(--aos-blue) / 0.22), transparent 55%);
	mix-blend-mode: multiply;
}
.aos-s-stories__glass {
	position: absolute;
	z-index: 1;
	inset: auto 0.9rem 0.9rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 0.85rem 1.1rem;
	border-radius: 14px;
	border: 0.5px solid hsl(var(--bg) / 0.2);
	background: hsl(var(--aos-navy-deep) / 0.55);
	backdrop-filter: blur(10px);
}
.aos-s-stories__glass span { display: flex; flex-direction: column; gap: 2px; }
.aos-s-stories__glass b { font-size: 0.88rem; font-weight: 600; color: hsl(var(--bg)); }
.aos-s-stories__glass i { font-style: normal; font-family: var(--mono); font-size: 0.56rem; letter-spacing: 0.12em; text-transform: uppercase; color: hsl(var(--bg) / 0.6); }
/* Photo story card — same grade + glass as the video card, still image */
.aos-s-stories__card--photo { padding: 0; border-color: hsl(var(--aos-navy-soft)); }
.aos-s-stories__card--photo > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(0.35) contrast(1.04); }
.aos-s-stories__card--photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, hsl(var(--aos-navy-deep) / 0.12), transparent 35%, hsl(var(--aos-navy-deep) / 0.82) 100%),
		linear-gradient(200deg, hsl(var(--aos-blue) / 0.22), transparent 55%);
	mix-blend-mode: multiply;
}
/* Ledger story card — one engagement told as before → after rows */
.aos-s-stories__card--ledger { background: hsl(var(--aos-navy-deep)); border-color: hsl(var(--aos-navy-soft)); }
.aos-s-stories__card--ledger .aos-s-stories__tag { font-family: var(--mono); font-size: 0.56rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--bg) / 0.5); }
.aos-s-stories__rows { margin: auto 0 0; padding: 0; list-style: none; }
.aos-s-stories__rows li { display: flex; flex-direction: column; gap: 0.3rem; padding-block: clamp(0.8rem, 1.6vh, 1.1rem); border-top: 0.5px solid hsl(var(--bg) / 0.14); }
.aos-s-stories__rows li:first-child { border-top: 0; }
.aos-s-stories__rows i { font-style: normal; font-family: var(--mono); font-size: 0.56rem; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase; color: hsl(var(--bg) / 0.48); }
.aos-s-stories__rows b { font-family: var(--display); font-size: clamp(1rem, 1.5vw, 1.2rem); font-weight: 500; letter-spacing: -0.014em; color: hsl(var(--bg)); }
.aos-s-stories__rows b em { font-style: normal; color: hsl(var(--aos-yellow)); }

/* ══════════════════════════════════════════════════════════════════════
   HUNAAR SET — ten systems translated from the Hunar template into the
   house language: photography-led hero card, dark service canvases,
   stat-anchored process, proof board, dark comparison, billing-toggle
   pricing, cover-led articles. Same tokens, same button, same hairlines.
   ══════════════════════════════════════════════════════════════════════ */

/* ── 37. PHOTO HERO CARD — full-bleed portrait inset as one rounded frame ── */
.aos-hero-photo { padding: clamp(0.75rem, 1.5vw, 1.25rem) clamp(0.75rem, 1.5vw, 1.25rem) 0; }
.aos-hero-photo__card {
	position: relative;
	min-height: min(92vh, 900px);
	border-radius: 28px;
	overflow: hidden;
	isolation: isolate;
	display: flex;
	align-items: flex-end;
}
.aos-hero-photo__card > img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: grayscale(0.25) contrast(1.04);
}
.aos-hero-photo__card::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, hsl(var(--aos-navy-deep) / 0.3), transparent 30%, transparent 55%, hsl(var(--aos-navy-deep) / 0.85) 100%),
		linear-gradient(90deg, hsl(var(--aos-navy-deep) / 0.55), transparent 55%);
}
.aos-hero-photo__body {
	position: relative;
	z-index: 1;
	width: 100%;
	padding: clamp(1.75rem, 4vw, 4rem);
}
.aos-hero-photo__title {
	margin: 1.35rem 0 0;
	max-width: 15ch;
	font-family: var(--display);
	font-size: clamp(2.5rem, 5.2vw, 4.6rem);
	font-weight: 500;
	line-height: 1.02;
	letter-spacing: -0.032em;
	color: hsl(var(--bg));
	text-wrap: balance;
}
.aos-hero-photo__title em { font-family: var(--editorial); font-style: italic; font-weight: 500; font-size: 1.06em; color: hsl(var(--aos-yellow)); }
.aos-hero-photo__lede { margin: 1.3rem 0 0; max-width: 44ch; font-size: clamp(1rem, 1.25vw, 1.15rem); line-height: 1.6; color: hsl(var(--bg) / 0.75); }
.aos-hero-photo__actions { display: flex; align-items: center; flex-wrap: wrap; gap: clamp(1.25rem, 2.5vw, 2rem); margin-top: clamp(1.75rem, 4vh, 2.5rem); }
/* Floating detail card — the small second image, bottom right */
.aos-hero-photo__mini {
	position: absolute;
	z-index: 1;
	right: clamp(1.25rem, 3vw, 3rem);
	bottom: clamp(1.25rem, 3vw, 3rem);
	width: clamp(150px, 18vw, 230px);
	border-radius: 16px;
	overflow: hidden;
	isolation: isolate;
	transform: translateZ(0); /* forces compositor clipping — video/backdrop corners */
	border: 0.5px solid hsl(var(--bg) / 0.3);
	box-shadow: 0 30px 60px -25px hsl(var(--aos-navy-deep) / 0.7);
}
.aos-hero-photo__mini img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.aos-hero-photo__mini span {
	position: absolute;
	inset: auto 0 0 0;
	padding: 0.5rem 0.8rem;
	background: hsl(var(--aos-navy-deep) / 0.6);
	backdrop-filter: blur(8px);
	border-radius: 0 0 15px 15px; /* backdrop-filter ignores ancestor radius clip */
	font-family: var(--mono);
	font-size: 0.52rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.85);
}
@media (max-width: 767px) { .aos-hero-photo__mini { display: none; } }

/* ── 38. STORY SPLIT — a pill-and-thumb intro beside an arrow ledger ── */
.aos-s-story { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-story__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: clamp(2.5rem, 6vw, 6rem); align-items: start; }
.aos-s-story__intro { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
/* thumb takes img OR video; aspect lives on the container so modifiers swap it */
.aos-s-story__thumb { display: block; width: clamp(90px, 10vw, 130px); aspect-ratio: 4 / 3; border-radius: 14px; overflow: hidden; border: 0.5px solid hsl(var(--fg) / 0.14); transform: translateZ(0); }
.aos-s-story__thumb img, .aos-s-story__thumb video { display: block; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.aos-s-story__thumb--11 { aspect-ratio: 1 / 1; }
.aos-s-story__thumb--45 { aspect-ratio: 4 / 5; }
.aos-s-story__thumb--169 { aspect-ratio: 16 / 9; width: clamp(120px, 14vw, 190px); }
.aos-s-story h2 { margin: 1.4rem 0 0; font-family: var(--display); font-size: clamp(1.7rem, 2.8vw, 2.5rem); font-weight: 500; line-height: 1.15; letter-spacing: -0.024em; color: hsl(var(--fg)); text-wrap: balance; }
.aos-s-story h2 em { font-family: var(--editorial); font-style: italic; font-weight: 500; color: hsl(var(--aos-yellow-deep)); }
.aos-s-story__ledger { margin: 0; padding: 0; list-style: none; border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-story__ledger li {
	display: flex;
	align-items: baseline;
	gap: 1rem;
	padding: clamp(1.1rem, 2.6vh, 1.6rem) 0.25rem;
	border-bottom: 1px solid hsl(var(--border-strong));
	font-family: var(--display);
	font-size: clamp(1.05rem, 1.6vw, 1.35rem);
	font-weight: 500;
	letter-spacing: -0.014em;
	color: hsl(var(--fg));
	transition: padding-left 0.3s var(--ease-out);
}
.aos-s-story__ledger li:hover { padding-left: 0.9rem; }
.aos-s-story__ledger li::before { content: "\2192"; font-family: var(--mono); font-size: 0.8em; color: hsl(var(--aos-yellow-deep)); }
@media (max-width: 900px) { .aos-s-story__grid { grid-template-columns: 1fr; } }

/* ── 39. PROJECT CARDS — big covers, the wordmark on the glass ── */
.aos-s-projects { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-projects .aos-s-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.aos-s-projects__lede { max-width: 34ch; font-size: 0.95rem; line-height: 1.55; color: hsl(var(--fg-muted)); text-align: right; }
.aos-s-projects__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.25rem, 2.5vw, 2rem); }
.aos-s-projects__card { text-decoration: none; }
.aos-s-projects__cover {
	position: relative;
	border-radius: 22px;
	overflow: hidden;
	isolation: isolate;
	aspect-ratio: 4 / 3;
	border: 0.5px solid hsl(var(--fg) / 0.12);
}
.aos-s-projects__cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(0.6) contrast(1.04); transition: transform 1s var(--ease-out), filter 0.6s var(--ease-out); }
.aos-s-projects__card:hover .aos-s-projects__cover img { transform: scale(1.035); filter: grayscale(0.2) contrast(1.04); }
.aos-s-projects__cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, hsl(var(--aos-blue) / 0.28), hsl(var(--aos-navy-deep) / 0.42)); mix-blend-mode: multiply; }
.aos-s-projects__mark {
	position: absolute;
	z-index: 1;
	top: 50%; left: 50%;
	translate: -50% -50%;
	font-family: var(--display);
	font-size: clamp(1.5rem, 2.6vw, 2.2rem);
	font-weight: 600;
	letter-spacing: -0.02em;
	color: hsl(var(--bg));
	text-shadow: 0 2px 30px hsl(var(--aos-navy-deep) / 0.6);
}
.aos-s-projects__meta { display: flex; gap: 0.8rem; margin: 1.1rem 0 0; font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-projects__card h3 { margin: 0.45rem 0 0; font-family: var(--display); font-size: clamp(1.25rem, 1.9vw, 1.65rem); font-weight: 500; letter-spacing: -0.016em; color: hsl(var(--fg)); transition: color 0.25s var(--ease-out); }
.aos-s-projects__card:hover h3 { color: hsl(var(--aos-yellow-deep)); }
@media (max-width: 767px) { .aos-s-projects__grid { grid-template-columns: 1fr; } }

/* ── 40. INLINE MARQUEE — the train carries a picture with it ── */
.aos-s-inlinemarquee { border-block: 1px solid hsl(var(--border)); padding-block: clamp(2rem, 5vh, 3.5rem); overflow: hidden; }
.aos-s-inlinemarquee__track { display: flex; width: max-content; animation: aosMarqX 40s linear infinite; }
.aos-s-inlinemarquee:hover .aos-s-inlinemarquee__track { animation-play-state: paused; }
.aos-s-inlinemarquee__set { display: flex; align-items: center; white-space: nowrap; }
.aos-s-inlinemarquee__set > span {
	font-family: var(--display);
	font-weight: 500;
	font-size: clamp(3rem, 8.5vw, 7.5rem);
	line-height: 1;
	letter-spacing: -0.04em;
	color: hsl(var(--fg) / 0.22);
	padding-right: 0.35em;
}
.aos-s-inlinemarquee__set > span em { font-family: var(--editorial); font-style: italic; font-weight: 500; color: hsl(var(--aos-yellow-deep)); }
.aos-s-inlinemarquee__chip {
	flex: 0 0 auto;
	position: relative;
	width: clamp(4.5rem, 10vw, 8.5rem);
	height: clamp(2.8rem, 6.2vw, 5.25rem);
	margin-right: 0.35em;
	border-radius: 999px;
	overflow: hidden;
	border: 0.5px solid hsl(var(--fg) / 0.15);
	transform: translateZ(0);
}
/* absolute fill: immune to global img width/height resets */
.aos-s-inlinemarquee__chip img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; object-fit: cover; display: block; filter: grayscale(1) contrast(1.05); }
@media (prefers-reduced-motion: reduce) { .aos-s-inlinemarquee__track { animation: none; } }

/* ── 41. SERVICES CANVAS — one dark rounded board, text and image cards ── */
.aos-s-canvas { padding-block: clamp(2rem, 5vh, 3.5rem); }
.aos-s-canvas__board {
	border-radius: 28px;
	overflow: hidden;
	isolation: isolate;
	position: relative;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.03 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E"),
		radial-gradient(55% 60% at 85% 6%, hsl(var(--aos-yellow) / 0.12), transparent 62%),
		hsl(var(--aos-navy-deep));
	padding: clamp(1.75rem, 4vw, 3.5rem);
}
.aos-s-canvas__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: clamp(1.75rem, 4vh, 2.75rem); }
.aos-s-canvas__head .aos-s-title { color: hsl(var(--bg)); }
.aos-s-canvas__head .aos-s-title em { color: hsl(var(--aos-yellow)); }
.aos-s-canvas__lede { max-width: 34ch; font-size: 0.95rem; line-height: 1.55; color: hsl(var(--bg) / 0.55); text-align: right; }
.aos-s-canvas__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: clamp(1rem, 2vw, 1.5rem); }
.aos-s-canvas__cell {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: clamp(220px, 32vh, 320px);
	padding: clamp(1.4rem, 2.4vw, 2rem);
	border: 0.5px solid hsl(var(--bg) / 0.14);
	border-radius: 18px;
	background: hsl(var(--bg) / 0.04);
	overflow: hidden;
	transition: background-color 0.35s var(--ease-out), border-color 0.35s var(--ease-out);
}
.aos-s-canvas__cell::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(70% 55% at 85% 0%, hsl(var(--aos-yellow) / 0.1), transparent 65%);
	opacity: 0;
	transition: opacity 0.4s var(--ease-out);
	pointer-events: none;
}
.aos-s-canvas__cell:hover { background: hsl(var(--bg) / 0.07); border-color: hsl(var(--aos-yellow) / 0.4); }
.aos-s-canvas__cell:hover::before { opacity: 1; }
a.aos-s-canvas__cell { text-decoration: none; color: inherit; }
.aos-s-canvas__idx { display: flex; align-items: center; gap: 0.7rem; font-family: var(--mono); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.16em; color: hsl(var(--bg) / 0.38); }
.aos-s-canvas__idx::after { content: ""; width: 26px; height: 1px; background: hsl(var(--aos-yellow) / 0.5); }
.aos-s-canvas__cell h3 { margin: 0; font-family: var(--display); font-size: clamp(1.2rem, 1.8vw, 1.55rem); font-weight: 600; letter-spacing: -0.016em; color: hsl(var(--bg)); }
.aos-s-canvas__cell p { margin: 0.6rem 0 0; max-width: 30ch; font-size: 0.9rem; line-height: 1.55; color: hsl(var(--bg) / 0.6); }
.aos-s-canvas__go {
	position: absolute;
	right: clamp(1.2rem, 2vw, 1.75rem);
	bottom: clamp(1.2rem, 2vw, 1.75rem);
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border-radius: 999px;
	border: 0.5px solid hsl(var(--bg) / 0.25);
	color: hsl(var(--bg) / 0.8);
	opacity: 0;
	transform: translateY(8px);
	transition: opacity 0.35s var(--ease-out), transform 0.35s var(--ease-out), background-color 0.35s var(--ease-out), color 0.35s var(--ease-out);
}
.aos-s-canvas__cell:hover .aos-s-canvas__go { opacity: 1; transform: translateY(0); background: hsl(var(--aos-yellow)); border-color: hsl(var(--aos-yellow)); color: hsl(var(--aos-navy-deep)); }
.aos-s-canvas__cell--media { position: relative; padding: 0; overflow: hidden; justify-content: flex-start; }
.aos-s-canvas__cell--media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(0.4) contrast(1.04); }
.aos-s-canvas__cell--media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, hsl(var(--aos-blue) / 0.3), hsl(var(--aos-navy-deep) / 0.45)); mix-blend-mode: multiply; }
.aos-s-canvas__tag {
	position: absolute;
	z-index: 1;
	top: 1rem; left: 1rem;
	padding: 6px 12px;
	border-radius: 999px;
	background: hsl(var(--aos-navy-deep) / 0.65);
	backdrop-filter: blur(6px);
	border: 0.5px solid hsl(var(--bg) / 0.2);
	font-family: var(--mono);
	font-size: 0.56rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.85);
}
@media (max-width: 900px) { .aos-s-canvas__grid { grid-template-columns: 1fr; } .aos-s-canvas__head { flex-direction: column; align-items: flex-start; } .aos-s-canvas__lede { text-align: left; } }

/* ── 42. PROCESS WITH PAYOFFS — each step ends in its number ── */
.aos-s-procstats { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-procstats .aos-s-head { margin-bottom: clamp(2.75rem, 6vh, 4rem); }
.aos-s-procstats__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.75rem, 4vw, 4rem); }
.aos-s-procstats__col { display: flex; flex-direction: column; padding-top: 1.5rem; border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-procstats__step { display: flex; align-items: baseline; gap: 0.7rem; font-family: var(--display); font-size: clamp(1.1rem, 1.6vw, 1.35rem); font-weight: 600; letter-spacing: -0.014em; color: hsl(var(--fg)); }
.aos-s-procstats__step i { font-style: normal; font-family: var(--mono); font-size: 0.66rem; font-weight: 600; letter-spacing: 0.12em; color: hsl(var(--aos-yellow-deep)); }
.aos-s-procstats__col p { margin: 0.8rem 0 0; font-size: 0.93rem; line-height: 1.6; color: hsl(var(--fg-muted)); }
.aos-s-procstats__payoff { display: flex; align-items: baseline; gap: 0.9rem; margin-top: clamp(1.5rem, 3.5vh, 2.25rem); }
.aos-s-procstats__payoff b {
	font-family: var(--display);
	font-size: clamp(2.2rem, 3.8vw, 3.2rem);
	font-weight: 600;
	line-height: 0.95;
	letter-spacing: -0.035em;
	color: hsl(var(--aos-yellow-deep));
	font-variant-numeric: tabular-nums;
}
.aos-s-procstats__payoff span { max-width: 16ch; font-family: var(--mono); font-size: 0.56rem; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; line-height: 1.5; color: hsl(var(--fg-subtle)); }
@media (max-width: 900px) { .aos-s-procstats__grid { grid-template-columns: 1fr; } }

/* ── 43. PROOF BOARD — logos, claims, and one dark voice on a row ── */
.aos-s-proofboard { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-proofboard .aos-s-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: clamp(2rem, 5vh, 3rem); }
.aos-s-proofboard__lede { max-width: 34ch; font-size: 0.95rem; line-height: 1.55; color: hsl(var(--fg-muted)); text-align: right; }
.aos-s-proofboard__row { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr) minmax(0, 1.2fr); gap: clamp(1rem, 2vw, 1.5rem); align-items: stretch; }
.aos-s-proofboard__cell {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 1.5rem;
	padding: clamp(1.4rem, 2.4vw, 2rem);
	border: 0.5px solid hsl(var(--fg) / 0.14);
	border-radius: 18px;
	background: hsl(var(--paper));
	transition: transform 0.35s var(--ease-out), box-shadow 0.35s var(--ease-out);
}
.aos-s-proofboard__cell:hover { transform: translateY(-3px); box-shadow: 0 24px 48px -30px hsl(var(--aos-navy-deep) / 0.35); }
.aos-s-proofboard__logos { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; align-items: baseline; }
.aos-s-proofboard__logos span { font-family: var(--display); font-size: 1rem; font-weight: 500; color: hsl(var(--fg-subtle)); }
/* product ledger — name left, platform/meta right, hairline rows */
.aos-s-proofboard__list { margin: 0; padding: 0; list-style: none; }
.aos-s-proofboard__list li { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding-block: clamp(0.7rem, 1.4vh, 0.95rem); border-bottom: 0.5px solid hsl(var(--fg) / 0.1); }
.aos-s-proofboard__list li:last-child { border-bottom: 0; }
.aos-s-proofboard__list b { font-family: var(--display); font-size: clamp(1rem, 1.4vw, 1.15rem); font-weight: 500; letter-spacing: -0.012em; color: hsl(var(--fg)); }
.aos-s-proofboard__list i { font-style: normal; font-family: var(--mono); font-size: 0.56rem; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-proofboard__ava { display: flex; }
.aos-s-proofboard__ava img { width: 30px; height: 30px; border-radius: 999px; object-fit: cover; border: 1.5px solid hsl(var(--aos-navy-deep)); }
.aos-s-proofboard__ava img + img { margin-left: -9px; }
.aos-s-proofboard__cell > p { margin: 0; font-family: var(--display); font-size: clamp(1.1rem, 1.7vw, 1.45rem); font-weight: 500; line-height: 1.3; letter-spacing: -0.015em; color: hsl(var(--fg)); text-wrap: balance; }
.aos-s-proofboard__cap { font-family: var(--mono); font-size: 0.58rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-proofboard__cell--dark {
	border-color: hsl(var(--aos-navy-soft));
	background: radial-gradient(60% 70% at 85% 10%, hsl(var(--aos-yellow) / 0.13), transparent 62%), hsl(var(--aos-navy-deep));
}
.aos-s-proofboard__cell--dark > p { color: hsl(var(--bg) / 0.92); font-family: var(--editorial); font-style: italic; }
.aos-s-proofboard__cell--dark > p b { color: hsl(var(--aos-yellow)); font-weight: 500; font-style: normal; font-family: var(--display); }
.aos-s-proofboard__cell--dark .aos-s-proofboard__cap { color: hsl(var(--bg) / 0.5); }
@media (max-width: 900px) { .aos-s-proofboard__row { grid-template-columns: 1fr; } .aos-s-proofboard .aos-s-head { flex-direction: column; align-items: flex-start; } .aos-s-proofboard__lede { text-align: left; } }

/* ── 44. DARK COMPARE — the brand row lit against the field ── */
.aos-s-comparedark { padding-block: clamp(2rem, 5vh, 3.5rem); }
.aos-s-comparedark__board {
	border-radius: 28px;
	overflow: hidden;
	position: relative;
	isolation: isolate;
	background:
		radial-gradient(50% 55% at 12% 0%, hsl(var(--aos-yellow) / 0.1), transparent 60%),
		hsl(var(--aos-navy-deep));
	padding: clamp(1.75rem, 4vw, 3.5rem);
}
.aos-s-comparedark__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: clamp(1.75rem, 4vh, 2.75rem); }
.aos-s-comparedark__head .aos-s-title { color: hsl(var(--bg)); }
.aos-s-comparedark__head .aos-s-title em { color: hsl(var(--aos-yellow)); }
.aos-s-comparedark__lede { max-width: 34ch; font-size: 0.95rem; line-height: 1.55; color: hsl(var(--bg) / 0.55); text-align: right; }
.aos-s-comparedark__row {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) repeat(4, minmax(0, 1fr));
	align-items: center;
	border-bottom: 1px solid hsl(var(--bg) / 0.1);
}
.aos-s-comparedark__row:last-child { border-bottom: 0; }
.aos-s-comparedark__row > * { padding: clamp(0.9rem, 2vh, 1.25rem) clamp(0.5rem, 1.5vw, 1.25rem); display: flex; justify-content: center; }
.aos-s-comparedark__row > :first-child { justify-content: flex-start; font-family: var(--display); font-weight: 500; font-size: 0.98rem; color: hsl(var(--bg)); }
.aos-s-comparedark__row--head > * { font-family: var(--mono); font-size: 0.58rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--bg) / 0.45); }
.aos-s-comparedark__row--us {
	border-radius: 14px;
	background: hsl(var(--bg) / 0.05);
	border: 0.5px solid hsl(var(--aos-yellow) / 0.4);
}
.aos-s-comparedark__row--us > :first-child { color: hsl(var(--aos-yellow)); font-weight: 600; }
.aos-s-comparedark__yes { width: 20px; height: 20px; border-radius: 999px; background: hsl(var(--aos-yellow)); position: relative; }
.aos-s-comparedark__yes::after { content: ""; position: absolute; top: 6px; left: 5px; width: 9px; height: 5px; border-left: 2px solid hsl(var(--aos-navy-deep)); border-bottom: 2px solid hsl(var(--aos-navy-deep)); transform: rotate(-45deg); }
.aos-s-comparedark__no { width: 12px; height: 1.5px; background: hsl(var(--bg) / 0.25); align-self: center; margin-top: 0.6em; }
@media (max-width: 767px) {
	.aos-s-comparedark__row { grid-template-columns: minmax(0, 1.2fr) repeat(4, minmax(0, 1fr)); }
	.aos-s-comparedark__row > * { padding: 0.7rem 0.3rem; font-size: 0.78rem; }
	.aos-s-comparedark__head { flex-direction: column; align-items: flex-start; }
	.aos-s-comparedark__lede { text-align: left; }
}

/* ── 45. PRICING DUO — billing toggle, an add-on card, the dark plan ── */
.aos-s-priceduo { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-priceduo .aos-s-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.aos-s-priceduo__lede { max-width: 32ch; font-size: 0.95rem; line-height: 1.55; color: hsl(var(--fg-muted)); text-align: right; }
.aos-s-priceduo__toggle { display: flex; justify-content: center; gap: 0.4rem; margin: clamp(1.5rem, 3.5vh, 2.25rem) 0; }
.aos-s-priceduo__toggle button {
	padding: 8px 18px;
	border-radius: 999px;
	border: 0.5px solid hsl(var(--border-strong));
	background: transparent;
	font-family: var(--mono);
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
	cursor: pointer;
	transition: background-color .25s var(--ease-out), color .25s var(--ease-out), border-color .25s var(--ease-out);
}
.aos-s-priceduo__toggle button[aria-selected="true"] { background: hsl(var(--aos-navy)); border-color: hsl(var(--aos-navy)); color: hsl(var(--paper)); }
.aos-s-priceduo__toggle button:focus-visible { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: 2px; }
.aos-s-priceduo__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: clamp(1rem, 2vw, 1.5rem); align-items: stretch; }
.aos-s-priceduo__addon {
	display: flex;
	flex-direction: column;
	padding: clamp(1.6rem, 2.8vw, 2.4rem);
	border: 0.5px solid hsl(var(--fg) / 0.14);
	border-radius: 22px;
	background: hsl(var(--paper));
}
.aos-s-priceduo__addon h3 { margin: 0; font-family: var(--display); font-size: 1.2rem; font-weight: 600; letter-spacing: -0.014em; color: hsl(var(--fg)); }
.aos-s-priceduo__addon p { margin: 0.7rem 0 0; font-size: 0.92rem; line-height: 1.6; color: hsl(var(--fg-muted)); }
.aos-s-priceduo__addonfoot { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: auto; padding-top: clamp(1.5rem, 4vh, 2.5rem); }
.aos-s-priceduo__addonprice { font-family: var(--display); font-size: clamp(1.9rem, 3vw, 2.6rem); font-weight: 600; letter-spacing: -0.03em; color: hsl(var(--fg-subtle)); font-variant-numeric: tabular-nums; }
/* visual add-on switch — a styled checkbox, teal when on */
.aos-s-priceduo__switch { position: relative; display: inline-block; width: 52px; height: 30px; }
.aos-s-priceduo__switch input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.aos-s-priceduo__switch i {
	position: absolute;
	inset: 0;
	border-radius: 999px;
	background: hsl(var(--fg) / 0.15);
	transition: background-color 0.25s var(--ease-out);
}
.aos-s-priceduo__switch i::after {
	content: "";
	position: absolute;
	top: 3px; left: 3px;
	width: 24px; height: 24px;
	border-radius: 999px;
	background: hsl(var(--paper));
	box-shadow: 0 2px 6px hsl(var(--aos-navy-deep) / 0.3);
	transition: translate 0.25s var(--ease-out);
}
.aos-s-priceduo__switch input:checked + i { background: hsl(var(--aos-yellow)); }
.aos-s-priceduo__switch input:checked + i::after { translate: 22px 0; }
.aos-s-priceduo__switch input:focus-visible + i { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: 2px; }
.aos-s-priceduo__plan {
	position: relative;
	isolation: isolate;
	display: flex;
	flex-direction: column;
	padding: clamp(1.75rem, 3vw, 2.75rem);
	border: 0.5px solid hsl(var(--aos-navy-soft));
	border-radius: 22px;
	overflow: hidden;
	background:
		radial-gradient(55% 60% at 85% 8%, hsl(var(--aos-yellow) / 0.13), transparent 62%),
		hsl(var(--aos-navy-deep));
}
.aos-s-priceduo__plan h3 { margin: 0; font-family: var(--display); font-size: clamp(1.4rem, 2.2vw, 1.9rem); font-weight: 600; letter-spacing: -0.018em; color: hsl(var(--bg)); }
.aos-s-priceduo__ticks { margin: clamp(1.25rem, 3vh, 1.9rem) 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 0.65rem; }
.aos-s-priceduo__ticks li { position: relative; padding-left: 1.4rem; font-size: 0.92rem; line-height: 1.5; color: hsl(var(--bg) / 0.72); }
.aos-s-priceduo__ticks li::before { content: ""; position: absolute; left: 0; top: 0.55em; width: 8px; height: 1px; background: hsl(var(--aos-yellow)); }
.aos-s-priceduo__planfoot { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; margin-top: auto; padding-top: clamp(1.75rem, 4.5vh, 2.75rem); }
.aos-s-priceduo__price { font-family: var(--display); font-size: clamp(2.4rem, 4.4vw, 3.8rem); font-weight: 600; line-height: 0.9; letter-spacing: -0.04em; color: hsl(var(--bg)); font-variant-numeric: tabular-nums; }
.aos-s-priceduo__price em { font-family: var(--mono); font-style: normal; font-size: 0.26em; font-weight: 600; letter-spacing: 0.08em; color: hsl(var(--bg) / 0.5); }
.aos-s-priceduo__panel[hidden] { display: none; }
@media (max-width: 900px) { .aos-s-priceduo__grid { grid-template-columns: 1fr; } .aos-s-priceduo .aos-s-head { flex-direction: column; align-items: flex-start; } .aos-s-priceduo__lede { text-align: left; } }

/* ── 46. ARTICLE COVERS — the journal, with photography and bylines ── */
.aos-s-articlecovers { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-articlecovers .aos-s-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.aos-s-articlecovers__lede { max-width: 32ch; font-size: 0.95rem; line-height: 1.55; color: hsl(var(--fg-muted)); text-align: right; }
.aos-s-articlecovers__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.25rem, 2.5vw, 2rem); }
.aos-s-articlecovers__card { text-decoration: none; display: flex; flex-direction: column; }
.aos-s-articlecovers__cover { position: relative; border-radius: 18px; overflow: hidden; isolation: isolate; aspect-ratio: 1; border: 0.5px solid hsl(var(--fg) / 0.12); }
.aos-s-articlecovers__cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(0.5) contrast(1.04); transition: transform 0.9s var(--ease-out); }
.aos-s-articlecovers__card:hover .aos-s-articlecovers__cover img { transform: scale(1.04); }
.aos-s-articlecovers__cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, hsl(var(--aos-blue) / 0.2), hsl(var(--aos-navy-deep) / 0.3)); mix-blend-mode: multiply; }
.aos-s-articlecovers__meta { display: flex; justify-content: space-between; gap: 1rem; margin-top: 1rem; font-family: var(--mono); font-size: 0.58rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-articlecovers__meta b { color: hsl(var(--aos-yellow-deep)); }
.aos-s-articlecovers__card h3 { margin: 0.6rem 0 0; font-family: var(--display); font-size: clamp(1.1rem, 1.6vw, 1.35rem); font-weight: 500; line-height: 1.3; letter-spacing: -0.015em; color: hsl(var(--fg)); text-wrap: balance; transition: color 0.25s var(--ease-out); }
.aos-s-articlecovers__card:hover h3 { color: hsl(var(--aos-yellow-deep)); }
.aos-s-articlecovers__author { display: flex; align-items: center; gap: 0.6rem; margin-top: 0.9rem; }
.aos-s-articlecovers__author .aos-s-voices__monogram { width: 28px; height: 28px; font-size: 0.56rem; }
.aos-s-articlecovers__author span { font-size: 0.82rem; color: hsl(var(--fg-muted)); }
@media (max-width: 900px) { .aos-s-articlecovers__grid { grid-template-columns: 1fr; } }

/* Hunaar set entrance choreography */
.aos-reveal :is(.aos-s-projects__card, .aos-s-canvas__cell, .aos-s-procstats__col, .aos-s-proofboard__cell, .aos-s-articlecovers__card, .aos-s-story__ledger li) { opacity: 0; }
.aos-reveal.is-in :is(.aos-s-projects__card, .aos-s-canvas__cell, .aos-s-procstats__col, .aos-s-proofboard__cell, .aos-s-articlecovers__card, .aos-s-story__ledger li) { animation: aosSRise 0.6s var(--ease-out) 0.1s forwards; }
.aos-reveal.is-in :is(.aos-s-projects__card, .aos-s-canvas__cell, .aos-s-procstats__col, .aos-s-proofboard__cell, .aos-s-articlecovers__card, .aos-s-story__ledger li):nth-child(2) { animation-delay: 0.22s; }
.aos-reveal.is-in :is(.aos-s-canvas__cell, .aos-s-procstats__col, .aos-s-proofboard__cell, .aos-s-articlecovers__card, .aos-s-story__ledger li):nth-child(3) { animation-delay: 0.34s; }
.aos-reveal.is-in :is(.aos-s-story__ledger li):nth-child(4) { animation-delay: 0.46s; }
@media (prefers-reduced-motion: reduce) {
	.aos-reveal :is(.aos-s-projects__card, .aos-s-canvas__cell, .aos-s-procstats__col, .aos-s-proofboard__cell, .aos-s-articlecovers__card, .aos-s-story__ledger li) { opacity: 1 !important; animation: none !important; }
}

/* ── 47. TYPE HERO — the sentence is the hero; the team lives inside it.
   Elevations over the source: editorial teal greeting, duotone avatar
   chips that fan straight on hover, a live local-time status chip, and
   the mono meta rail closing the frame. ── */
.aos-hero-type { border-bottom: 1px solid hsl(var(--border)); padding-block: clamp(4rem, 11vh, 7rem) clamp(3rem, 8vh, 5rem); }
.aos-hero-type__status {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: clamp(2rem, 5vh, 3rem);
}
.aos-hero-type__chip {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	padding: 7px 13px;
	border-radius: 999px;
	border: 0.5px solid hsl(var(--fg) / 0.16);
	background: hsl(var(--paper));
	font-family: var(--mono);
	font-size: 0.6rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--fg-muted));
}
.aos-hero-type__chip--live::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 999px;
	background: hsl(var(--aos-yellow));
	box-shadow: 0 0 0 0 hsl(var(--aos-yellow) / 0.6);
	animation: aosMeterPulse 2.4s ease-out infinite;
}
.aos-hero-type__grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.aos-hero-type__title {
	margin: 0;
	font-family: var(--display);
	font-size: clamp(2.6rem, 5.4vw, 4.8rem);
	font-weight: 500;
	line-height: 1.06;
	letter-spacing: -0.032em;
	color: hsl(var(--fg));
	text-wrap: balance;
}
.aos-hero-type__hey {
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	color: hsl(var(--aos-yellow-deep));
	margin-right: 0.15em;
}
.aos-hero-type__title em { font-family: var(--editorial); font-style: italic; font-weight: 500; font-size: 1.05em; color: hsl(var(--aos-yellow-deep)); }
/* The crew, inside the sentence */
.aos-hero-type__crew {
	display: inline-flex;
	vertical-align: middle;
	margin: 0 0.14em;
	translate: 0 -0.06em;
}
.aos-hero-type__crew span {
	display: inline-block;
	width: clamp(2.6rem, 4.6vw, 4.2rem);
	height: clamp(2.6rem, 4.6vw, 4.2rem);
	border-radius: 14px;
	overflow: hidden;
	border: 2px solid hsl(var(--bg));
	box-shadow: 0 10px 26px -12px hsl(var(--aos-navy-deep) / 0.45);
	transition: rotate 0.35s var(--ease-out), translate 0.35s var(--ease-out);
}
.aos-hero-type__crew span img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(0.75) contrast(1.06); transition: filter 0.35s var(--ease-out); }
.aos-hero-type__crew span:nth-child(1) { rotate: -7deg; translate: 0.2em 0; z-index: 1; }
.aos-hero-type__crew span:nth-child(2) { rotate: 4deg; z-index: 2; }
.aos-hero-type__crew span:nth-child(3) { rotate: -3deg; translate: -0.2em 0; z-index: 3; }
.aos-hero-type__crew:hover span { rotate: 0deg; translate: 0 0; }
.aos-hero-type__crew:hover span img { filter: grayscale(0.1) contrast(1.04); }
.aos-hero-type__aside { padding-top: 0.6em; }
.aos-hero-type__aside p { margin: 0; max-width: 38ch; font-size: clamp(0.95rem, 1.15vw, 1.08rem); line-height: 1.65; color: hsl(var(--fg-muted)); }
.aos-hero-type__actions { display: flex; align-items: center; flex-wrap: wrap; gap: clamp(1.25rem, 2.5vw, 2rem); margin-top: clamp(1.9rem, 4.5vh, 2.75rem); }
.aos-hero-type__meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.6rem 2rem;
	margin: clamp(2.5rem, 6vh, 3.5rem) 0 0;
	padding-top: 1.3rem;
	border-top: 1px solid hsl(var(--border));
	list-style: none;
	font-family: var(--mono);
	font-size: 0.62rem;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
}
.aos-hero-type__meta li { display: inline-flex; align-items: center; gap: 0.55rem; }
.aos-hero-type__meta li::before { content: ""; width: 5px; height: 5px; border-radius: 999px; background: hsl(var(--aos-yellow-deep)); }
@media (max-width: 900px) { .aos-hero-type__grid { grid-template-columns: 1fr; } .aos-hero-type__aside { padding-top: 0; } }
@media (prefers-reduced-motion: reduce) { .aos-hero-type__chip--live::before { animation: none; } }

/* ══════════════════════════════════════════════════════════════════════
   REVIEW-NOTES PASS — Eric's 35 keeper notes, implemented. Each block
   cites the note it answers.
   ══════════════════════════════════════════════════════════════════════ */

/* [quote-band] "remove underline" — the mark keeps its teal voice, loses the wash */
.aos-s-quoteband blockquote mark { background: none; }

/* [faq-centered] "HATE the outline when you click" — pointer clicks lose the
   ring everywhere; keyboard focus keeps it (accessibility stays intact) */
.aos-s-faq__item summary:focus { outline: none; }
.aos-s-faq__item summary:focus-visible { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: 2px; }
details.aos-s-faq__item:focus, .aos-s-faq__item summary::-moz-focus-inner { outline: none; border: 0; }

/* [cta-slim] "make text h2 size" */
.aos-s-ctaslim__row h2 { font-size: clamp(2.1rem, 3.6vw, 3.4rem); letter-spacing: -0.025em; line-height: 1.05; }

/* [pricing-tiers] "typography spacing flawless" — one rhythm, no drift */
.aos-s-tier__name { letter-spacing: -0.014em; }
.aos-s-tier__price { margin-top: 1rem; }
.aos-s-tier__term { margin-top: 0.6rem; }
.aos-s-tier__for { margin-top: 1.25rem; padding-top: 1.25rem; }
.aos-s-tier__list { margin: 1.25rem 0 1.9rem; gap: 0.7rem; }
.aos-s-tier .aos-btn { margin-top: auto; }

/* Shared avatar stack — seeded with stock faces wherever monograms stood */
.aos-avatars { display: flex; }
.aos-avatars img {
	width: 44px;
	height: 44px;
	border-radius: 999px;
	object-fit: cover;
	border: 2px solid hsl(var(--bg));
	box-shadow: 0 6px 18px -8px hsl(var(--aos-navy-deep) / 0.4);
}
.aos-avatars img + img { margin-left: -12px; }
.aos-avatars--sm img { width: 30px; height: 30px; border-width: 1.5px; }
.aos-avatars--sm img + img { margin-left: -9px; }
/* [hero-split-light] proof chip becomes an avatar stack */
.aos-hero-split__chip--proof { display: flex; align-items: center; gap: 0.9rem; }
.aos-hero-split__chip--proof .aos-avatars img { border-color: hsl(var(--aos-navy-deep)); }
/* [hero-type-crew] avatars are links now */
.aos-hero-type__crew a { display: inline-block; line-height: 0; border-radius: 14px; }
.aos-hero-type__crew a:focus-visible { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: 3px; }

/* [bento] media cell takes video or an auto-playing slideshow; badge gone */
.aos-s-bento__cell--media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
@keyframes aosSlidefade { 0%, 28% { opacity: 1; } 38%, 90% { opacity: 0; } 100% { opacity: 1; } }
.aos-s-bento__slides img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; animation: aosSlidefade 12s infinite; }
.aos-s-bento__slides img:nth-child(2) { animation-delay: 4s; }
.aos-s-bento__slides img:nth-child(3) { animation-delay: 8s; }
@media (prefers-reduced-motion: reduce) { .aos-s-bento__slides img { animation: none; } .aos-s-bento__slides img:first-child { opacity: 1; } }

/* [hero-photo-card] the mini is a live clip; corners stay crisp */
.aos-hero-photo__mini video { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 0; }

/* [inline-marquee] WCAG contrast + pills that vary and always fill */
.aos-s-inlinemarquee__set > span { color: hsl(var(--fg) / 0.55); }
.aos-s-inlinemarquee__chip img { display: block; }
.aos-s-inlinemarquee__chip--wide { width: clamp(6rem, 13vw, 11rem); }
.aos-s-inlinemarquee__chip--square { border-radius: 22px; width: clamp(2.8rem, 6.2vw, 5.25rem); }

/* [inline-manifesto] refine: looser measure, alternating chip shapes */
.aos-s-inlineman h2 { max-width: 28ch; line-height: 1.26; }
.aos-s-inlineman__img:nth-of-type(even) { border-radius: 20px; }

/* [logo-strip] right-to-left scroll with a gorgeous edge fade */
.aos-s-logos--marquee .aos-s-logos__viewport {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}
@keyframes aosMarqRTL { from { transform: translateX(-50%); } to { transform: translateX(0); } }
.aos-s-logos--marquee .aos-s-logos__track { display: flex; width: max-content; animation: aosMarqRTL 36s linear infinite; }
.aos-s-logos--marquee .aos-s-logos__row { flex-wrap: nowrap; padding-right: clamp(1.5rem, 4vw, 3.5rem); }
.aos-s-logos--marquee:hover .aos-s-logos__track { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .aos-s-logos--marquee .aos-s-logos__track { animation: none; } }

/* [contact-panel] icons ride the kind column */
.aos-s-contactpanel__kind { display: inline-flex; align-items: center; gap: 0.55rem; }
.aos-s-contactpanel__kind svg { flex: 0 0 auto; }

/* [feature-grid] icon chips as an option beside the index */
.aos-s-features__iconchip {
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	margin-bottom: 0.9rem;
	border-radius: 11px;
	background: hsl(var(--aos-yellow-soft));
	color: hsl(var(--aos-yellow-deep));
}

/* [problem-ledger] optional CTA aligned with the heading */
.aos-s-head--split { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }

/* [parallax-statement] fluidity: composited transform + gentle smoothing */
.aos-s-parallax__pin img {
	transform: translate3d(0, calc(var(--p) * -9%), 0);
	transition: transform 0.12s linear;
}

/* [pin-phone] the screen changes with the story — three app screens
   crossfade on the same --p that paces the steps */
.aos-s-pinphone { --p: 0; }
.aos-s-pinphone .aos-phone { position: relative; }
.aos-s-pinphone .aos-phone img { position: absolute; inset: 9px; width: calc(100% - 18px); height: calc(100% - 18px); border-radius: 38px; }
.aos-s-pinphone .aos-phone img:nth-of-type(1) { opacity: clamp(0, 1 - (var(--p) - 0.26) * 10, 1); }
.aos-s-pinphone .aos-phone img:nth-of-type(2) { opacity: clamp(0, 1 - max((var(--p) - 0.62) * 10, (0.26 - var(--p)) * 10), 1); }
.aos-s-pinphone .aos-phone img:nth-of-type(3) { opacity: clamp(0, (var(--p) - 0.62) * 10, 1); }
@media (prefers-reduced-motion: reduce) {
	.aos-s-pinphone .aos-phone img { opacity: 0 !important; }
	.aos-s-pinphone .aos-phone img:first-of-type { opacity: 1 !important; }
}

/* [pin-manifesto] the light sibling */
.aos-s-pinman--light { background: hsl(var(--bg)); }
.aos-s-pinman--light .aos-s-pinman__pin::before {
	background: radial-gradient(55% 60% at 80% 10%, hsl(var(--aos-yellow-soft) / 0.7), transparent 62%);
}
.aos-s-pinman--light .aos-s-pinman__pin::after { background: linear-gradient(90deg, transparent, hsl(var(--aos-yellow-deep) / 0.4), transparent); }
.aos-s-pinman--light .aos-s-pinman__lines li { color: hsl(var(--fg)); }
.aos-s-pinman--light .aos-s-pinman__lines em { color: hsl(var(--aos-yellow-deep)); }
.aos-s-pinman--light .aos-s-pinman__progress { background: hsl(var(--fg) / 0.12); }
.aos-s-pinman--light .aos-s-pinman__progress::after { background: hsl(var(--aos-yellow-deep)); }

/* [compare-dark] the light sibling */
.aos-s-comparedark--light .aos-s-comparedark__board { background: hsl(var(--paper)); border: 0.5px solid hsl(var(--fg) / 0.14); }
.aos-s-comparedark--light .aos-s-title { color: hsl(var(--fg)); }
.aos-s-comparedark--light .aos-s-title em { color: hsl(var(--aos-yellow-deep)); }
.aos-s-comparedark--light .aos-s-comparedark__lede { color: hsl(var(--fg-muted)); }
.aos-s-comparedark--light .aos-s-comparedark__row { border-bottom-color: hsl(var(--fg) / 0.08); }
.aos-s-comparedark--light .aos-s-comparedark__row > :first-child { color: hsl(var(--fg)); }
.aos-s-comparedark--light .aos-s-comparedark__row--head > * { color: hsl(var(--fg-subtle)); }
.aos-s-comparedark--light .aos-s-comparedark__row--us { background: hsl(var(--aos-yellow-soft) / 0.6); border-color: hsl(var(--aos-yellow) / 0.45); }
.aos-s-comparedark--light .aos-s-comparedark__row--us > :first-child { color: hsl(var(--aos-yellow-deep)); }
.aos-s-comparedark--light .aos-s-comparedark__no { background: hsl(var(--fg) / 0.2); }

/* [hrail] card variety: a media card joins the rail */
.aos-s-hrail__card--media { padding: 0; }
.aos-s-hrail__card--media img, .aos-s-hrail__card--media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(0.4) contrast(1.04); }
.aos-s-hrail__card--media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, hsl(var(--aos-blue) / 0.25), hsl(var(--aos-navy-deep) / 0.45)); mix-blend-mode: multiply; }
.aos-s-hrail__cap {
	position: absolute;
	z-index: 1;
	left: 1.25rem; bottom: 1.25rem;
	padding: 7px 13px;
	border-radius: 999px;
	background: hsl(var(--aos-navy-deep) / 0.65);
	backdrop-filter: blur(6px);
	border: 0.5px solid hsl(var(--bg) / 0.2);
	font-family: var(--mono);
	font-size: 0.58rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--bg) / 0.85);
}

/* [growth-stories] a stat-card variation joins the rail */
.aos-s-stories__card--stat {
	justify-content: center;
	background:
		radial-gradient(70% 60% at 15% 10%, hsl(var(--aos-yellow-soft) / 0.8), transparent 70%),
		hsl(var(--paper));
}
.aos-s-stories__statnum {
	font-family: var(--display);
	font-size: clamp(3.2rem, 6vw, 4.6rem);
	font-weight: 600;
	line-height: 0.9;
	letter-spacing: -0.045em;
	color: hsl(var(--aos-yellow-deep));
	font-variant-numeric: tabular-nums;
}
.aos-s-stories__statline { margin: 1.1rem 0 0; font-size: 0.98rem; line-height: 1.55; color: hsl(var(--fg-muted)); max-width: 24ch; }

/* [story-split] left column recomposed: thumb leads, claim breathes, action follows */
.aos-s-story__thumb { width: clamp(150px, 16vw, 210px); border-radius: 16px; }
.aos-s-story__thumb img { aspect-ratio: 16 / 10; }
.aos-s-story h2 { margin-top: clamp(1.5rem, 3.5vh, 2.25rem); max-width: 22ch; }
.aos-s-story__act { margin-top: clamp(1.5rem, 3.5vh, 2rem); }

/* [device-switcher] tablet joins; the stage holds its center */
.aos-s-devices__stage { width: 100%; min-height: 540px; }
.aos-tablet {
	width: min(88%, 760px);
	aspect-ratio: 4 / 3;
	padding: 12px;
	border-radius: 26px;
	background: linear-gradient(155deg, hsl(var(--aos-navy-soft)) 0%, hsl(var(--aos-navy-deep)) 52%, hsl(var(--aos-navy)) 100%);
	box-shadow:
		0 2px 4px hsl(var(--aos-navy-deep) / 0.3),
		0 30px 60px hsl(var(--aos-navy-deep) / 0.32),
		inset 0 0 0 1px hsl(var(--paper) / 0.06);
}
.aos-tablet img { width: 100%; height: 100%; object-fit: cover; object-position: top; border-radius: 16px; display: block; }

/* [services-canvas] video cells welcome */
.aos-s-canvas__cell--media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* [code-window] "animate code like ai writing it" — line-wipe + caret */
.aos-s-code__window pre .aos-codeline { display: block; overflow: hidden; white-space: pre; max-width: 0; }
.aos-s-code__window pre.is-typing .aos-codeline { animation: aosCodeline 0.6s steps(24, end) forwards; animation-delay: var(--d, 0s); }
@keyframes aosCodeline { from { max-width: 0; } to { max-width: 100%; } }
.aos-s-code__caret { display: inline-block; width: 8px; height: 1em; translate: 0 0.15em; background: hsl(var(--aos-yellow)); animation: aosCaret 1s steps(2) infinite; }
@keyframes aosCaret { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
	.aos-s-code__window pre .aos-codeline { max-width: 100% !important; animation: none !important; }
	.aos-s-code__caret { display: none; }
}

/* [video-band] parallax within the panel, a real CTA, lightbox affordance */
.aos-s-videoband__panel { cursor: pointer; }
.aos-s-videoband__panel video { height: 124%; top: -12%; transform: translate3d(0, calc(var(--py, 0) * 8%), 0); transition: transform 0.12s linear; }
.aos-s-videoband__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	font-family: var(--mono);
	font-size: 0.64rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--bg));
	background: none;
	border: 0;
	cursor: pointer;
	padding: 0;
}
.aos-s-videoband__cta i {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 999px;
	border: 0.5px solid hsl(var(--bg) / 0.4);
	font-style: normal;
	transition: background-color 0.3s var(--ease-out), border-color 0.3s var(--ease-out), color 0.3s var(--ease-out);
}
.aos-s-videoband__panel:hover .aos-s-videoband__cta i { background: hsl(var(--aos-yellow)); border-color: hsl(var(--aos-yellow)); color: hsl(var(--aos-navy-deep)); }
.aos-lightbox {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: grid;
	place-items: center;
	padding: clamp(1rem, 4vw, 4rem);
	background: hsl(var(--aos-navy-deep) / 0.92);
	backdrop-filter: blur(10px);
}
.aos-lightbox video { width: min(100%, 1200px); max-height: 86vh; border-radius: 18px; box-shadow: 0 60px 120px -40px hsl(0 0% 0% / 0.7); }
.aos-lightbox__close {
	position: absolute;
	top: clamp(1rem, 3vw, 2rem);
	right: clamp(1rem, 3vw, 2rem);
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 999px;
	border: 0.5px solid hsl(var(--bg) / 0.3);
	background: transparent;
	color: hsl(var(--bg));
	font-size: 1.1rem;
	cursor: pointer;
}
.aos-lightbox__close:hover { border-color: hsl(var(--aos-yellow)); color: hsl(var(--aos-yellow)); }

/* ── TEAM CARDS — square duotone portraits, identity below, color on hover ── */
.aos-s-teamcards { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-teamcards .aos-s-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.aos-s-teamcards__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); }
.aos-s-teamcards__card { text-decoration: none; color: inherit; }
.aos-s-teamcards__photo { position: relative; display: block; aspect-ratio: 1 / 1; border-radius: 16px; overflow: hidden; border: 0.5px solid hsl(var(--fg) / 0.14); transform: translateZ(0); }
.aos-s-teamcards__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); transform: scale(1.03); transition: filter 0.5s var(--ease-out), transform 0.7s var(--ease-out); }
.aos-s-teamcards__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, hsl(var(--aos-blue) / 0.28), hsl(var(--aos-navy-deep) / 0.35)); mix-blend-mode: multiply; transition: opacity 0.5s var(--ease-out); }
.aos-s-teamcards__card:hover .aos-s-teamcards__photo img { filter: grayscale(0) contrast(1.02); transform: scale(1); }
.aos-s-teamcards__card:hover .aos-s-teamcards__photo::after { opacity: 0.35; }
.aos-s-teamcards__card h3 { margin: 0.9rem 0 0; font-family: var(--display); font-size: clamp(1.02rem, 1.5vw, 1.2rem); font-weight: 600; letter-spacing: -0.014em; color: hsl(var(--fg)); }
.aos-s-teamcards__role { display: block; margin-top: 0.3rem; font-family: var(--mono); font-size: 0.58rem; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
@media (max-width: 900px) { .aos-s-teamcards__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .aos-s-teamcards .aos-s-head { flex-direction: column; align-items: flex-start; } }

/* ── TEAM ROSTER — editorial rows: index, display name, role, headshot on the right ── */
.aos-s-teamroster { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-teamroster__rows { margin: 0; padding: 0; list-style: none; border-top: 1px solid hsl(var(--border-strong)); }
.aos-s-teamroster__row {
	display: grid;
	grid-template-columns: 3rem minmax(0, 1.4fr) minmax(0, 1fr) 56px;
	align-items: center;
	gap: clamp(1rem, 2.5vw, 2rem);
	padding-block: clamp(1.1rem, 2.6vh, 1.6rem);
	border-bottom: 1px solid hsl(var(--border-strong));
	transition: padding-left 0.3s var(--ease-out);
}
.aos-s-teamroster__row:hover { padding-left: 0.9rem; }
.aos-s-teamroster__num { font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.14em; color: hsl(var(--fg-subtle)); }
.aos-s-teamroster__row h3 { margin: 0; font-family: var(--display); font-size: clamp(1.4rem, 2.6vw, 2.2rem); font-weight: 500; letter-spacing: -0.022em; color: hsl(var(--fg)); }
.aos-s-teamroster__role { font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-teamroster__face { width: 56px; height: 56px; border-radius: 999px; overflow: hidden; border: 0.5px solid hsl(var(--fg) / 0.14); transform: translateZ(0); }
.aos-s-teamroster__face img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); transform: scale(1.05); transition: filter 0.45s var(--ease-out), transform 0.6s var(--ease-out); }
.aos-s-teamroster__row:hover .aos-s-teamroster__face img { filter: grayscale(0); transform: scale(1); }
@media (max-width: 720px) { .aos-s-teamroster__row { grid-template-columns: minmax(0, 1fr) 48px; } .aos-s-teamroster__num, .aos-s-teamroster__role { display: none; } .aos-s-teamroster__face { width: 48px; height: 48px; } }

/* ── EDITORIAL COLUMNS — two columns of running text, one drop cap ── */
.aos-s-edcols { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-edcols__grid { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 2fr); gap: clamp(2.5rem, 6vw, 6rem); align-items: start; }
.aos-s-edcols__aside { position: sticky; top: 6rem; }
.aos-s-edcols__aside .aos-s-title { font-size: clamp(1.7rem, 2.8vw, 2.5rem); }
.aos-s-edcols__note { margin: 1.4rem 0 0; font-family: var(--mono); font-size: 0.6rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
.aos-s-edcols__body { columns: 2; column-gap: clamp(2rem, 4vw, 3.5rem); column-rule: 0.5px solid hsl(var(--border-strong)); }
.aos-s-edcols__body p { margin: 0 0 1.2rem; font-size: clamp(0.98rem, 1.2vw, 1.08rem); line-height: 1.75; color: hsl(var(--fg-muted)); break-inside: avoid-column; }
.aos-s-edcols__body p:first-child::first-letter {
	float: left;
	padding-right: 0.12em;
	margin-top: 0.06em;
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: 4.1em;
	line-height: 0.78;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-edcols__body strong { font-weight: 600; color: hsl(var(--fg)); }
@media (max-width: 900px) { .aos-s-edcols__grid { grid-template-columns: 1fr; } .aos-s-edcols__aside { position: static; } .aos-s-edcols__body { columns: 1; } }

/* ── EDITORIAL FEATURE — running text with images set into the measure ── */
.aos-s-edfeat { border-top: 1px solid hsl(var(--border)); padding-block: var(--sp-band); }
.aos-s-edfeat__grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(2.5rem, 6vw, 6rem); align-items: start; }
.aos-s-edfeat__body p { margin: 0 0 1.2rem; max-width: 58ch; font-size: clamp(1rem, 1.25vw, 1.12rem); line-height: 1.75; color: hsl(var(--fg-muted)); }
.aos-s-edfeat__body p:first-of-type::first-letter {
	float: left;
	padding-right: 0.12em;
	margin-top: 0.06em;
	font-family: var(--editorial);
	font-style: italic;
	font-weight: 500;
	font-size: 4.1em;
	line-height: 0.78;
	color: hsl(var(--aos-yellow-deep));
}
.aos-s-edfeat__pull { margin: clamp(1.75rem, 4vh, 2.5rem) 0 0; padding-left: 1.4rem; border-left: 2px solid hsl(var(--aos-yellow)); font-family: var(--editorial); font-style: italic; font-weight: 500; font-size: clamp(1.25rem, 2vw, 1.7rem); line-height: 1.4; color: hsl(var(--fg)); }
.aos-s-edfeat__stack { display: flex; flex-direction: column; gap: clamp(1.25rem, 2.5vh, 2rem); }
.aos-s-edfeat__fig { margin: 0; }
.aos-s-edfeat__fig:nth-child(2) { margin-left: clamp(1.5rem, 4vw, 3rem); }
.aos-s-edfeat__fig span { display: block; border-radius: 16px; overflow: hidden; border: 0.5px solid hsl(var(--fg) / 0.14); transform: translateZ(0); }
.aos-s-edfeat__fig img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: grayscale(1) contrast(1.05); transition: filter 0.5s var(--ease-out); }
.aos-s-edfeat__fig:hover img { filter: grayscale(0); }
.aos-s-edfeat__fig figcaption { margin-top: 0.6rem; font-family: var(--mono); font-size: 0.56rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: hsl(var(--fg-subtle)); }
@media (max-width: 900px) { .aos-s-edfeat__grid { grid-template-columns: 1fr; } .aos-s-edfeat__fig:nth-child(2) { margin-left: 0; } }

/* ── CONTENT TABS — mono tab rail above one media-and-copy panel ── */
.aos-s-tabs { border-top: 1px solid hsl(var(--border)); background: hsl(var(--bg-alt)); padding-block: var(--sp-band); }
.aos-s-tabs .aos-s-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.aos-s-tabs__rail { display: flex; gap: 0.5rem; margin-bottom: clamp(1.75rem, 4vh, 2.5rem); border-bottom: 1px solid hsl(var(--border-strong)); }
.aos-s-tabs__rail button {
	position: relative;
	padding: 0.85rem 1.1rem;
	border: 0;
	background: transparent;
	font-family: var(--mono);
	font-size: 0.64rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: hsl(var(--fg-subtle));
	cursor: pointer;
	transition: color 0.25s var(--ease-out);
}
.aos-s-tabs__rail button::after { content: ""; position: absolute; left: 1.1rem; right: 1.1rem; bottom: -1px; height: 2px; background: hsl(var(--aos-yellow)); transform: scaleX(0); transform-origin: left; transition: transform 0.3s var(--ease-out); }
.aos-s-tabs__rail button[aria-selected="true"] { color: hsl(var(--fg)); }
.aos-s-tabs__rail button[aria-selected="true"]::after { transform: scaleX(1); }
.aos-s-tabs__rail button:focus-visible { outline: 2px solid hsl(var(--aos-yellow-deep)); outline-offset: 2px; }
.aos-s-tabs__panel[hidden] { display: none; }
.aos-s-tabs__split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; animation: aosTabIn 0.45s var(--ease-out); }
@keyframes aosTabIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.aos-s-tabs__media { position: relative; border-radius: 20px; overflow: hidden; isolation: isolate; aspect-ratio: 4 / 3; border: 0.5px solid hsl(var(--fg) / 0.14); transform: translateZ(0); }
.aos-s-tabs__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.aos-s-tabs__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, hsl(var(--aos-blue) / 0.3), hsl(var(--aos-navy-deep) / 0.4)); mix-blend-mode: multiply; }
.aos-s-tabs__copy h3 { margin: 0; font-family: var(--display); font-size: clamp(1.5rem, 2.4vw, 2.1rem); font-weight: 500; letter-spacing: -0.022em; color: hsl(var(--fg)); text-wrap: balance; }
.aos-s-tabs__copy h3 em { font-family: var(--editorial); font-style: italic; font-weight: 500; color: hsl(var(--aos-yellow-deep)); }
.aos-s-tabs__copy p { margin: 1rem 0 0; max-width: 44ch; font-size: 0.98rem; line-height: 1.65; color: hsl(var(--fg-muted)); }
.aos-s-tabs__copy .aos-ghost { margin-top: 1.5rem; }
@media (max-width: 900px) { .aos-s-tabs__split { grid-template-columns: 1fr; } .aos-s-tabs .aos-s-head { flex-direction: column; align-items: flex-start; } .aos-s-tabs__rail { overflow-x: auto; } }
@media (prefers-reduced-motion: reduce) { .aos-s-tabs__split { animation: none; } }

/* ── Native contact form ([aos_contact_form] inside the aos/form frame) ──── */
.aos-contact-form { display: grid; gap: 1.1rem; }
.aos-contact-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }
.aos-contact-form label { display: grid; gap: 0.4rem; }
.aos-contact-form__label { font-size: 0.78rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: hsl(var(--fg-muted)); }
.aos-contact-form select.aos-input { appearance: none; background-image: linear-gradient(45deg, transparent 50%, hsl(var(--fg-subtle)) 50%), linear-gradient(135deg, hsl(var(--fg-subtle)) 50%, transparent 50%); background-position: calc(100% - 18px) 55%, calc(100% - 13px) 55%; background-size: 5px 5px; background-repeat: no-repeat; }
.aos-contact-form__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.aos-contact-form button[type="submit"] { justify-self: start; }
.aos-contact-form__status { min-height: 1.4em; font-size: 0.92rem; color: hsl(var(--aos-blue)); margin: 0; }
@media (max-width: 640px) { .aos-contact-form__row { grid-template-columns: 1fr; } }

/* A2P consent rows on the contact form */
.aos-contact-form__consent { display: grid !important; grid-template-columns: auto 1fr; gap: 0.65rem; align-items: start; font-size: 0.8rem; line-height: 1.55; color: hsl(var(--fg-muted)); }
.aos-contact-form__consent input[type="checkbox"] { margin-top: 0.2rem; width: 16px; height: 16px; accent-color: hsl(var(--aos-yellow)); }
.aos-contact-form__consent a { color: hsl(var(--aos-blue)); text-decoration: underline; }