/* Self-hosted, because the privacy notice says the site's fonts come from our own domain. */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 800; font-display: swap; src: url("fonts/inter-latin-800-normal.woff2") format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/jetbrains-mono-latin-500-normal.woff2") format("woff2"); }

/* ==========================================================================
   Founders Alpha · fa.css · component library v1.0 (26 Oct 2026)
   Contract: founders-alpha-brand/DESIGN.md (Option C, "bold, not loud").
   One stylesheet for every FA web page, email-style HTML surface and the
   React app's public pages. Every class carries the fa- prefix; there is no
   bare .body class anywhere (an extension in Niklas's Chrome targets it).
   Square corners, no shadows, no gradients except the photo scrim.
   Manifest: components.json · Catalog: catalog.html · Lint: check_fa.py
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Variables: short names mapped to tokens/tokens.css, with hex fallbacks.
   They map to the theme-stable --fa-palette-* tokens on purpose: public brand
   pages are light only, and the semantic --fa-color-* tokens flip in dark mode.
   -------------------------------------------------------------------------- */
:root {
  --fa-green: var(--fa-palette-green-heritage, #084C3B);
  --fa-green-hover: var(--fa-palette-green-heritage-hover, #063D30);
  --fa-green-deep: #05291F; /* duotone shadow end; photo backdrop only, never a surface */
  --fa-ivory: var(--fa-palette-neutral-ivory, #FAF8F4);
  --fa-ink: var(--fa-palette-neutral-charcoal, #2A2724);
  --fa-soft: var(--fa-palette-neutral-soft, #706F65);
  --fa-on-green: var(--fa-palette-green-on-green, #D6DFCD);
  --fa-sage: var(--fa-palette-green-sage, #E6EBE1);
  --fa-line: var(--fa-palette-neutral-line, #E2E0D7);
  --fa-line-input: var(--fa-palette-neutral-input, #CACDBF);
  --fa-sunken: var(--fa-palette-neutral-muted, #EEEAE1);
  --fa-card: var(--fa-palette-neutral-card, #FCFAF6);
  --fa-chart: #CFD2C4; /* DESIGN.md chart neutral */
  --fa-placeholder: #8C8A80;
  --fa-draft-bg: #FFF7D6; /* DESIGN.md input cells: values still to fill */
  --fa-danger: var(--fa-palette-signal-danger, #A33624);
  --fa-danger-bg: var(--fa-palette-signal-err-bg, #F6E9DF);
  --fa-chip-ok-bg: var(--fa-palette-chip-green-bg, #D6EDD9);
  --fa-chip-ok-fg: var(--fa-palette-chip-green-fg, #0B5132);
  --fa-chip-next-bg: var(--fa-palette-chip-amber-bg, #FCEDCC);
  --fa-chip-next-fg: var(--fa-palette-chip-amber-fg, #7A5900);
  --fa-chip-off-bg: var(--fa-palette-chip-grey-bg, #F1F3F4);
  --fa-chip-off-fg: var(--fa-palette-chip-grey-fg, #5F6368);

  --fa-sans: var(--fa-font-family-display, Inter, Arial, sans-serif);
  --fa-mono: var(--fa-font-family-mono, "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace);

  /* layout */
  --fa-max: 1312px;                          /* content width at 1440 (64 px margins) */
  --fa-gutter: clamp(16px, 4.45vw, 64px);    /* 64 at 1440, 17 at 390 */
  --fa-gap: clamp(16px, 1.67vw, 24px);       /* grid gutter: 24 at 1440 */
  --fa-section: clamp(72px, 8.9vw, 128px);   /* section padding */
  --fa-header-h: clamp(64px, 5.56vw, 80px);
  --fa-rule: 3px;                            /* the green rule */
  --fa-ease: var(--fa-motion-easing-settle, cubic-bezier(.22, 1, .36, 1));

  /* type scale (web ladder, DESIGN.md section 3): value at 1440 -> value at 390 */
  --fa-size-display: clamp(52px, 7.8vw, 128px);   /* 112 -> 52 */
  --fa-size-h1: clamp(40px, 4.45vw, 64px);        /* 64 -> 40 */
  --fa-size-h2: clamp(30px, 3.06vw, 44px);        /* 44 -> 30 */
  --fa-size-h3: clamp(22px, 1.95vw, 28px);        /* 28 -> 22 */
  --fa-size-lead: clamp(20px, 2vw, 30px);         /* 29 -> 20 */
  --fa-size-text: clamp(17px, 1.39vw, 20px);      /* 20 -> 17 */
  --fa-size-small: 16px;                          /* the floor */
  --fa-size-label: clamp(16px, 1.25vw, 18px);     /* 18 -> 16 */
  --fa-size-number: clamp(88px, 12.2vw, 176px);   /* big figures */

  color-scheme: light;
}

/* --------------------------------------------------------------------------
   2. Base. Put class="fa-page" on <body>. Zero-specificity resets, so any
   component class wins.
   -------------------------------------------------------------------------- */
.fa-page {
  margin: 0;
  background: var(--fa-ivory);
  color: var(--fa-ink);
  font: 400 var(--fa-size-text)/1.45 var(--fa-sans);
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  overflow-x: clip;
}
:where(.fa-page), :where(.fa-page) *, :where(.fa-page) *::before, :where(.fa-page) *::after { box-sizing: border-box; }
:where(.fa-page) :where(h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote, fieldset) { margin: 0; padding: 0; }
:where(.fa-page) :where(ul, ol) { list-style: none; }
:where(.fa-page) :where(img, svg, video) { display: block; max-width: 100%; }
:where(.fa-page) :where(a) { color: inherit; }
:where(.fa-page) :where(button, input, select, textarea) { font: inherit; color: inherit; }
:where(.fa-page) ::selection { background: var(--fa-sage); }
:where(.fa-page) :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 3px solid var(--fa-green); outline-offset: 3px; }
html:has(.fa-page) { scroll-behavior: smooth; scroll-padding-top: calc(var(--fa-header-h) + 16px); }
.fa-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.fa-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.fa-skip { position: absolute; left: 16px; top: -100px; z-index: 100; background: var(--fa-green); color: var(--fa-ivory); padding: 12px 18px; font-weight: 800; }
.fa-skip:focus { top: 12px; }

/* --------------------------------------------------------------------------
   3. Type. Two weights per surface: 800 and 400. Sentence case.
   Capitals only in the mark and in .fa-label.
   -------------------------------------------------------------------------- */
.fa-display, .fa-h1, .fa-h2, .fa-h3 { font-family: var(--fa-sans); font-weight: 800; letter-spacing: -0.045em; line-height: 0.98; text-wrap: balance; }
.fa-display { font-size: var(--fa-size-display); letter-spacing: -0.05em; line-height: 0.94; }
.fa-h1 { font-size: var(--fa-size-h1); }
.fa-h2 { font-size: var(--fa-size-h2); line-height: 1.02; }
.fa-h3 { font-size: var(--fa-size-h3); letter-spacing: -0.03em; line-height: 1.12; }
.fa-lead { font-size: var(--fa-size-lead); font-weight: 400; line-height: 1.35; text-wrap: pretty; }
.fa-text { font-size: var(--fa-size-text); font-weight: 400; line-height: 1.45; text-wrap: pretty; }
.fa-small { font-size: var(--fa-size-small); line-height: 1.45; }
.fa-label { display: block; font: 500 var(--fa-size-label)/1.3 var(--fa-mono); letter-spacing: 0.16em; text-transform: uppercase; }
span.fa-label { display: inline-block; }
.fa-label--green { color: var(--fa-green); }
.fa-label--soft { color: var(--fa-soft); }
.fa-number { display: block; font: 800 var(--fa-size-number)/0.86 var(--fa-sans); letter-spacing: -0.05em; color: var(--fa-green); font-variant-numeric: tabular-nums; }
.fa-figure { font-variant-numeric: tabular-nums; } /* times and figures: Inter, the same size as the line */
.fa-muted { color: var(--fa-soft); }
.fa-strong { font-weight: 800; }
.fa-measure { max-width: 34ch; }
.fa-measure-wide { max-width: 56ch; }
.fa-center { text-align: center; }
.fa-center .fa-measure, .fa-center .fa-measure-wide { margin-inline: auto; }

/* on the green plate: ivory type, on-green secondary, on-green focus ring */
.fa-plate { background: var(--fa-green); color: var(--fa-ivory); }
.fa-plate .fa-muted, .fa-plate .fa-label, .fa-plate .fa-label--soft, .fa-plate .fa-label--green { color: var(--fa-on-green); }
.fa-plate .fa-number { color: var(--fa-ivory); }
.fa-plate :where(a, button, input, select, textarea, summary):focus-visible { outline-color: var(--fa-on-green); }

/* --------------------------------------------------------------------------
   4. Layout: container, 12-column grid, sections.
   -------------------------------------------------------------------------- */
.fa-container { width: 100%; max-width: calc(var(--fa-max) + 2 * var(--fa-gutter)); margin-inline: auto; padding-inline: var(--fa-gutter); }
.fa-container--text { max-width: calc(880px + 2 * var(--fa-gutter)); }
.fa-container--narrow { max-width: calc(720px + 2 * var(--fa-gutter)); }
.fa-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--fa-gap); }
.fa-span-2 { grid-column: span 2; } .fa-span-3 { grid-column: span 3; } .fa-span-4 { grid-column: span 4; }
.fa-span-5 { grid-column: span 5; } .fa-span-6 { grid-column: span 6; } .fa-span-7 { grid-column: span 7; }
.fa-span-8 { grid-column: span 8; } .fa-span-9 { grid-column: span 9; } .fa-span-12 { grid-column: 1 / -1; }
.fa-stack > * + * { margin-top: clamp(16px, 1.67vw, 24px); }
.fa-stack--loose > * + * { margin-top: clamp(24px, 2.8vw, 40px); }
.fa-section { padding-block: var(--fa-section); }
.fa-section--tight { padding-block: clamp(48px, 5.56vw, 80px); }
.fa-section--plate { background: var(--fa-green); color: var(--fa-ivory); }
.fa-section--sunken { background: var(--fa-sunken); }
.fa-section--rule { border-top: 1px solid var(--fa-line); }
.fa-narrow-page { padding-block: clamp(48px, 6.7vw, 96px) clamp(80px, 7.8vw, 112px); }
.fa-section--plate .fa-muted, .fa-section--plate .fa-label { color: var(--fa-on-green); }
.fa-section--plate .fa-number { color: var(--fa-ivory); }

/* --------------------------------------------------------------------------
   5. Components. One block each; docs in components/<name>/README.md.
   -------------------------------------------------------------------------- */

/* mark ------------------------------------------------------------------- */
.fa-mark { display: inline-block; flex: none; color: var(--fa-green); line-height: 0; }
.fa-mark svg { display: block; height: 100%; width: auto; }
.fa-mark--lockup { height: 28px; aspect-ratio: 11635.61 / 1452.15; min-width: 120px; }
.fa-mark--stack { height: 120px; aspect-ratio: 4040.09 / 2124.21; }
.fa-mark--box { height: 32px; aspect-ratio: 2225.68 / 1452.15; }
.fa-mark--alpha { height: 32px; aspect-ratio: 664.06 / 564.45; }
.fa-mark--lg { height: 48px; }
.fa-mark--ivory, .fa-plate .fa-mark { color: var(--fa-ivory); }
.fa-mark--ink { color: var(--fa-ink); }

/* header ----------------------------------------------------------------- */
.fa-header { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50; background: var(--fa-ivory); color: var(--fa-ink); border-bottom: 1px solid var(--fa-line); }
.fa-header-bar { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: var(--fa-header-h); }
.fa-header-home { display: block; color: var(--fa-green); line-height: 0; }
.fa-header-home .fa-mark { color: inherit; height: clamp(22px, 1.95vw, 28px); }
.fa-nav { display: flex; align-items: center; gap: clamp(20px, 2.8vw, 40px); }
.fa-nav-link { font-size: clamp(16px, 1.25vw, 18px); text-decoration: none; padding-block: 6px; border-bottom: 2px solid transparent; }
.fa-nav-link:hover, .fa-nav-link[aria-current] { border-bottom-color: var(--fa-green); }
.fa-header--green { background: var(--fa-green); color: var(--fa-ivory); border-bottom-color: transparent; }
.fa-header--green .fa-header-home { color: var(--fa-ivory); }
.fa-header--green .fa-nav-link:hover, .fa-header--green .fa-nav-link[aria-current] { border-bottom-color: var(--fa-on-green); }
.fa-header--static { position: relative; }

/* button ----------------------------------------------------------------- */
.fa-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: clamp(52px, 3.9vw, 60px); padding: 0 clamp(22px, 1.95vw, 32px);
  font: 800 clamp(17px, 1.25vw, 19px)/1 var(--fa-sans); letter-spacing: -0.01em; text-decoration: none; white-space: nowrap; cursor: pointer;
  border: 2px solid var(--fa-green); border-radius: 0; background: var(--fa-green); color: var(--fa-ivory);
  transition: background-color .2s var(--fa-ease), color .2s var(--fa-ease), border-color .2s var(--fa-ease); }
.fa-btn:hover { background: var(--fa-green-hover); border-color: var(--fa-green-hover); }
.fa-btn:disabled, .fa-btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.fa-btn--on-green { background: transparent; border-color: var(--fa-ivory); color: var(--fa-ivory); }
.fa-btn--on-green:hover { background: var(--fa-ivory); border-color: var(--fa-ivory); color: var(--fa-green); }
.fa-btn--ivory { background: var(--fa-ivory); border-color: var(--fa-ivory); color: var(--fa-green); }
.fa-btn--ivory:hover { background: var(--fa-sage); border-color: var(--fa-sage); }
.fa-btn--sm { min-height: 44px; padding: 0 18px; font-size: 16px; }
.fa-btn--block { display: flex; width: 100%; }
.fa-arrow { display: inline-block; font-weight: 400; transition: transform .2s var(--fa-ease); }
.fa-btn:hover .fa-arrow, .fa-link:hover .fa-arrow { transform: translateX(3px); }
.fa-link { color: var(--fa-green); font-weight: 800; text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 2px; }
.fa-link:hover { color: var(--fa-green-hover); }
.fa-plate .fa-link, .fa-section--plate .fa-link { color: var(--fa-ivory); }
.fa-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; }

/* label lives in section 3 (type); chip is status data, never brand color */
.fa-chip { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; font: 500 16px/1.2 var(--fa-mono); letter-spacing: 0.12em; text-transform: uppercase; border-radius: 0; white-space: nowrap;
  background: var(--fa-chip-off-bg); color: var(--fa-chip-off-fg); }
.fa-chip--open { background: var(--fa-chip-ok-bg); color: var(--fa-chip-ok-fg); }
.fa-chip--next { background: var(--fa-chip-next-bg); color: var(--fa-chip-next-fg); }
.fa-chip--soldout { background: var(--fa-chip-off-bg); color: var(--fa-chip-off-fg); }

/* section-head ----------------------------------------------------------- */
.fa-section-head { max-width: 1000px; margin-bottom: clamp(40px, 4.45vw, 64px); }
.fa-section-head > .fa-label { margin-bottom: clamp(16px, 1.4vw, 20px); }
.fa-section-head > .fa-lead { margin-top: clamp(16px, 1.67vw, 24px); max-width: 40ch; color: var(--fa-soft); }
.fa-section-head--center { margin-inline: auto; text-align: center; }
.fa-section-head--center > .fa-lead { margin-inline: auto; }
.fa-section-head--split { max-width: none; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--fa-gap); align-items: end; }
.fa-section-head--split > .fa-label { grid-column: 1 / -1; margin-bottom: 0; }
.fa-section-head--split > .fa-lead { margin-top: 0; }
.fa-plate .fa-section-head > .fa-lead, .fa-section--plate .fa-section-head > .fa-lead { color: var(--fa-on-green); }

/* hero: green plate + duotone photo, 60/40 (DESIGN.md: about 58/42) (cover template T01 at web scale) */
.fa-hero { container-type: inline-size; display: grid; grid-template-columns: minmax(0, 60fr) minmax(0, 40fr);
  min-height: clamp(560px, calc(100svh - var(--fa-header-h)), 860px); background: var(--fa-green); color: var(--fa-ivory); }
.fa-hero-plate { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding-block: clamp(56px, 6.7cqw, 104px);
  padding-inline: max(var(--fa-gutter), calc((100cqw - var(--fa-max)) / 2)) clamp(32px, 3.3cqw, 56px); }
.fa-hero-plate > .fa-label { color: var(--fa-on-green); }
.fa-hero-plate > .fa-display, .fa-hero-plate > .fa-h1 { margin-top: clamp(20px, 2.2cqw, 32px); max-width: 14ch; text-wrap: pretty; }
.fa-hero-plate > .fa-lead { margin-top: clamp(20px, 2.2cqw, 32px); color: var(--fa-on-green); max-width: 30ch; }
.fa-hero-plate > .fa-capture, .fa-hero-plate > .fa-actions { margin-top: clamp(32px, 3.3cqw, 48px); }
.fa-hero-photo { position: relative; overflow: hidden; background: var(--fa-green-deep); }
.fa-hero-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fa-hero--photo-left { grid-template-columns: minmax(0, 40fr) minmax(0, 60fr); }
.fa-hero--photo-left .fa-hero-photo { order: -1; }
.fa-hero--photo-left .fa-hero-plate { padding-inline: clamp(32px, 4.45cqw, 72px) max(var(--fa-gutter), calc((100cqw - var(--fa-max)) / 2)); }
.fa-hero--compact { min-height: clamp(440px, 42cqw, 600px); }

/* statement (T04) --------------------------------------------------------- */
.fa-statement { padding-block: clamp(96px, 11.1vw, 176px); }
.fa-statement-text { font: 800 clamp(40px, 6.67vw, 96px)/0.98 var(--fa-sans); letter-spacing: -0.045em; max-width: 16ch; text-wrap: balance; }
.fa-statement > .fa-container > .fa-label { margin-top: clamp(28px, 3.3vw, 48px); color: var(--fa-soft); }
.fa-statement--plate { background: var(--fa-green); color: var(--fa-ivory); }
.fa-statement--plate > .fa-container > .fa-label { color: var(--fa-on-green); }

/* cards-three (T09) ------------------------------------------------------- */
.fa-cards-three { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(40px, 2.8vw, 40px) var(--fa-gap); }
.fa-card-photo { aspect-ratio: 4 / 3; overflow: hidden; background: var(--fa-green-deep); margin-bottom: clamp(18px, 1.67vw, 24px); }
.fa-card-photo img { width: 100%; height: 100%; object-fit: cover; }
.fa-card > .fa-text { margin-top: 10px; color: var(--fa-soft); }
.fa-cards-three--ruled .fa-card { border-top: var(--fa-rule) solid var(--fa-green); padding-top: clamp(18px, 1.67vw, 24px); }

/* program (T13): four day columns under 3 px green rules ----------------- */
.fa-program { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--fa-gap); }
.fa-program--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fa-program-day { border-top: var(--fa-rule) solid var(--fa-green); padding-top: clamp(18px, 1.67vw, 24px); }
.fa-program-day > .fa-label { color: var(--fa-green); }
.fa-program-day > .fa-h2 { margin: clamp(12px, 1.25vw, 18px) 0 clamp(24px, 2.8vw, 40px); }
.fa-program-row { display: grid; grid-template-columns: 3.4em minmax(0, 1fr); gap: 12px; align-items: baseline; padding: 14px 0; border-top: 1px solid var(--fa-line); }
.fa-program-time { color: var(--fa-soft); font-variant-numeric: tabular-nums; }
/* photo: three treatments, frame, caption, full-bleed band with scrim ---- */
.fa-duo { filter: url(#fa-duo); }                         /* places, crowds, rooms, covers */
.fa-natural { filter: saturate(.72) contrast(1.03); }      /* faces and portraits */
.fa-bw { filter: grayscale(1) contrast(1.06); }            /* quotes, press, guests */
.fa-photo { display: block; min-width: 0; }
.fa-photo-frame { position: relative; overflow: hidden; aspect-ratio: 3 / 2; background: var(--fa-green-deep); }
.fa-photo-frame img { width: 100%; height: 100%; object-fit: cover; }
/* photo slot: a labelled empty frame until the real photograph exists (never stock or generated) */
.fa-photo-slot { display: grid; place-items: center; width: 100%; height: 100%; padding: 24px; background: var(--fa-sunken); border: 2px dashed var(--fa-line-input);
  color: var(--fa-soft); font: 500 16px/1.4 var(--fa-mono); letter-spacing: .12em; text-transform: uppercase; text-align: center; }
.fa-photo--wide .fa-photo-frame { aspect-ratio: 16 / 9; }
.fa-photo--portrait .fa-photo-frame { aspect-ratio: 4 / 5; }
.fa-photo--square .fa-photo-frame { aspect-ratio: 1; }
.fa-caption { margin-top: 12px; font-size: var(--fa-size-small); line-height: 1.4; color: var(--fa-soft); }
.fa-photo-band { position: relative; display: flex; align-items: flex-end; min-height: clamp(440px, 44.4vw, 720px); overflow: hidden; background: var(--fa-green-deep); color: var(--fa-ivory); }
.fa-photo-band > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fa-scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgb(5 41 31 / .35) 0%, rgb(5 41 31 / 0) 28%, rgb(5 41 31 / 0) 46%, rgb(5 41 31 / .82) 100%); } /* the only gradient allowed */
.fa-photo-band > .fa-container { position: relative; padding-block: clamp(40px, 5.56vw, 80px); }
.fa-photo-band .fa-h1, .fa-photo-band .fa-display { max-width: 16ch; }
.fa-photo-band .fa-label { margin-top: clamp(16px, 1.67vw, 24px); color: var(--fa-ivory); }

/* split: text beside a photo (T07) ---------------------------------------- */
.fa-split { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(40px, 6.67vw, 112px); align-items: center; }
.fa-split--photo-left { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.fa-split--photo-left > .fa-split-media { order: -1; }
.fa-split--even { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.fa-split-media { overflow: hidden; aspect-ratio: 4 / 5; background: var(--fa-green-deep); }
.fa-split-media img { width: 100%; height: 100%; object-fit: cover; }
.fa-split-media--square { aspect-ratio: 1; }
.fa-split-body > * + * { margin-top: clamp(20px, 2.2vw, 32px); }
.fa-split-body > .fa-lead { color: var(--fa-soft); }
.fa-plate .fa-split-body > .fa-lead, .fa-section--plate .fa-split-body > .fa-lead { color: var(--fa-on-green); }

/* big-number (T05) and figure rows --------------------------------------- */
.fa-big-number { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--fa-gap); align-items: end; }
.fa-big-number-take { border-top: var(--fa-rule) solid var(--fa-green); padding-top: clamp(18px, 1.67vw, 24px); font-size: var(--fa-size-lead); line-height: 1.3; }
.fa-plate .fa-big-number-take, .fa-section--plate .fa-big-number-take { border-top-color: var(--fa-on-green); }
.fa-number-unit { font-size: max(16px, .3em); letter-spacing: 0; margin-right: .2em; vertical-align: .95em; }
.fa-figures { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: clamp(32px, 2.8vw, 40px) var(--fa-gap); }
.fa-figure-item { border-top: var(--fa-rule) solid var(--fa-green); padding-top: clamp(16px, 1.67vw, 24px); }
.fa-figure-item > .fa-number { font-size: clamp(64px, 6.67vw, 104px); }
.fa-figure-item > .fa-text { margin-top: 12px; color: var(--fa-soft); }
.fa-plate .fa-figure-item, .fa-section--plate .fa-figure-item { border-top-color: var(--fa-on-green); }
.fa-plate .fa-figure-item > .fa-text, .fa-section--plate .fa-figure-item > .fa-text { color: var(--fa-on-green); }

/* price-ladder: releases, seats, price, status --------------------------- */
.fa-ladder { border-top: var(--fa-rule) solid var(--fa-green); }
.fa-ladder-row { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1.3fr) 9.5em; gap: 8px var(--fa-gap); align-items: center;
  padding: clamp(18px, 1.67vw, 26px) clamp(12px, 1.11vw, 16px); border-bottom: 1px solid var(--fa-line); }
.fa-ladder-row.is-open { background: var(--fa-sage); }
.fa-ladder-name > .fa-label { color: var(--fa-soft); margin-bottom: 6px; }
.fa-ladder-seats { color: var(--fa-soft); }
.fa-ladder-price { font-variant-numeric: tabular-nums; font: 800 clamp(30px, 3.06vw, 44px)/1 var(--fa-sans); letter-spacing: -0.05em; color: var(--fa-green); white-space: nowrap; }
.fa-ladder-cur { font-size: max(16px, .42em); letter-spacing: 0; margin-right: .3em; vertical-align: .55em; }
.fa-ladder-row > .fa-chip { justify-self: end; }
.fa-ladder-row.is-soldout .fa-ladder-price { color: var(--fa-soft); text-decoration: line-through; text-decoration-thickness: 2px; }

/* price-card: the release on sale now ------------------------------------ */
.fa-price-card { background: var(--fa-card); border: 1px solid var(--fa-line); border-top: var(--fa-rule) solid var(--fa-green); padding: clamp(28px, 3.06vw, 44px); }
.fa-price-card-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.fa-price { font-variant-numeric: tabular-nums; margin-top: clamp(20px, 1.95vw, 28px); font: 800 clamp(56px, 6.1vw, 88px)/1 var(--fa-sans); letter-spacing: -0.05em; color: var(--fa-green); white-space: nowrap; }
.fa-price-cur { font-size: max(16px, .3em); letter-spacing: 0; margin-right: .25em; vertical-align: 1.3em; }
.fa-price-per { margin-top: 10px; color: var(--fa-soft); }
.fa-meter { height: 8px; margin-top: clamp(24px, 2.2vw, 32px); background: var(--fa-line); overflow: hidden; }
.fa-meter-fill { display: block; height: 100%; background: var(--fa-green); }
.fa-meter-text { margin-top: 10px; }
.fa-price-card > .fa-btn { margin-top: clamp(24px, 2.2vw, 32px); }
.fa-price-next { margin-top: 14px; font-size: var(--fa-size-small); color: var(--fa-soft); }
.fa-price-card--plate { background: var(--fa-green); color: var(--fa-ivory); border-color: var(--fa-green); }
.fa-price-card--plate .fa-price { color: var(--fa-ivory); }
.fa-price-card--plate .fa-price-per, .fa-price-card--plate .fa-price-next { color: var(--fa-on-green); }
.fa-price-card--plate .fa-meter { background: rgb(250 248 244 / .2); }
.fa-price-card--plate .fa-meter-fill { background: var(--fa-on-green); }

/* table (T15): mono header, hairline rows, no zebra, no vertical grid ---- */
.fa-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.fa-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.fa-table th { text-align: left; vertical-align: bottom; padding: 0 20px 14px 0; border-bottom: var(--fa-rule) solid var(--fa-green);
  font: 500 var(--fa-size-label)/1.3 var(--fa-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--fa-soft); white-space: nowrap; }
.fa-table td { padding: clamp(14px, 1.39vw, 20px) 20px clamp(14px, 1.39vw, 20px) 0; border-bottom: 1px solid var(--fa-line); vertical-align: top; color: var(--fa-soft); }
.fa-table td:first-child { color: var(--fa-ink); }
.fa-table .fa-num { text-align: right; }
.fa-table td.is-ours { background: var(--fa-sage); color: var(--fa-ink); padding-left: 16px; }
.fa-table th.is-ours { background: var(--fa-green); color: var(--fa-on-green); padding: 14px 16px; }
.fa-table caption { caption-side: bottom; text-align: left; padding-top: 14px; font-size: var(--fa-size-small); color: var(--fa-soft); }

/* steps ------------------------------------------------------------------- */
.fa-steps { counter-reset: fa-step; border-top: var(--fa-rule) solid var(--fa-green); }
.fa-step { counter-increment: fa-step; display: grid; grid-template-columns: clamp(52px, 4.86vw, 72px) minmax(0, 1fr); align-items: baseline; padding: clamp(18px, 1.67vw, 26px) 0; border-bottom: 1px solid var(--fa-line); }
.fa-step::before { content: counter(fa-step, decimal-leading-zero); font: 800 clamp(28px, 2.5vw, 36px)/1 var(--fa-sans); letter-spacing: -0.05em; color: var(--fa-green); }
.fa-step .fa-text { margin-top: 6px; color: var(--fa-soft); }
.fa-steps--row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--fa-gap); border-top: 0; }
.fa-steps--row > .fa-step { display: block; border-top: var(--fa-rule) solid var(--fa-green); border-bottom: 0; padding-top: clamp(18px, 1.67vw, 24px); }
.fa-steps--row > .fa-step::before { display: block; margin-bottom: 14px; }

/* checklist: what is included -------------------------------------------- */
.fa-checklist { border-top: var(--fa-rule) solid var(--fa-green); }
.fa-checklist > li { display: flex; align-items: center; gap: 18px; padding: clamp(14px, 1.39vw, 20px) 0; border-bottom: 1px solid var(--fa-line);
  font: 800 var(--fa-size-h3)/1.15 var(--fa-sans); letter-spacing: -0.03em; }
.fa-checklist > li::before { content: ""; flex: 0 0 auto; width: clamp(24px, 1.95vw, 28px); aspect-ratio: 1; background: var(--fa-green)
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3L12.5 5' fill='none' stroke='%23FAF8F4' stroke-width='2'/%3E%3C/svg%3E") center / 72% no-repeat; }
.fa-checklist--text > li { font: 400 var(--fa-size-text)/1.4 var(--fa-sans); letter-spacing: 0; }
/* form ------------------------------------------------------------------- */
.fa-form { display: grid; gap: clamp(20px, 1.95vw, 28px); }
.fa-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 1.95vw, 28px) var(--fa-gap); }
.fa-field { display: grid; gap: 8px; align-content: start; }
.fa-field-label { font-weight: 800; font-size: var(--fa-size-text); letter-spacing: -0.01em; }
.fa-field-hint { font-size: var(--fa-size-small); color: var(--fa-soft); }
.fa-input, .fa-select, .fa-textarea { width: 100%; min-height: 56px; padding: 12px 16px; border: 1px solid var(--fa-line-input); border-radius: 0; background-color: var(--fa-card); color: var(--fa-ink);
  font: 400 max(17px, var(--fa-size-text))/1.3 var(--fa-sans); appearance: none; -webkit-appearance: none; }
.fa-input::placeholder, .fa-textarea::placeholder { color: var(--fa-placeholder); }
.fa-input:hover, .fa-select:hover, .fa-textarea:hover { border-color: var(--fa-soft); }
.fa-input:focus-visible, .fa-select:focus-visible, .fa-textarea:focus-visible { outline: 3px solid var(--fa-green); outline-offset: 0; border-color: var(--fa-green); }
.fa-textarea { min-height: 140px; resize: vertical; }
.fa-select { padding-right: 48px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='%23084C3B' stroke-width='2'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 16px center; background-size: 16px; }
.fa-field--error .fa-input, .fa-field--error .fa-select, .fa-field--error .fa-textarea, .fa-input[aria-invalid="true"] { border: 2px solid var(--fa-danger); background-color: var(--fa-danger-bg); }
.fa-field-error { color: var(--fa-danger); font-size: var(--fa-size-small); font-weight: 800; }
.fa-field-error:empty { display: none; }
.fa-form-note { font-size: var(--fa-size-small); color: var(--fa-soft); }
.fa-form-note a { color: var(--fa-green); }
.fa-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
/* radio cards */
.fa-choices { border: 0; display: grid; gap: 12px; min-width: 0; }
.fa-choices > legend { margin-bottom: 14px; padding: 0; font-weight: 800; font-size: var(--fa-size-text); }
.fa-choice { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 16px; padding: clamp(18px, 1.67vw, 24px); border: 1px solid var(--fa-line-input); background: var(--fa-card); cursor: pointer; }
.fa-choice:hover { border-color: var(--fa-ink); }
.fa-choice:has(input:checked) { border-color: var(--fa-green); outline: 2px solid var(--fa-green); outline-offset: -2px; }
.fa-choice input { accent-color: var(--fa-green); width: 22px; height: 22px; margin: 2px 0 0; }
.fa-choice-title { display: block; font-weight: 800; }
.fa-choice-text { display: block; margin-top: 4px; color: var(--fa-soft); font-size: var(--fa-size-small); }
/* choice chips (multi-select) */
.fa-choice-chips { display: flex; flex-wrap: wrap; gap: 10px; border: 0; min-width: 0; }
.fa-choice-chips > legend { margin-bottom: 12px; padding: 0; font-weight: 800; font-size: var(--fa-size-text); }
.fa-choice-chip { position: relative; display: inline-flex; }
.fa-choice-chip input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.fa-choice-chip span { display: inline-flex; align-items: center; min-height: 48px; padding: 0 18px; border: 1px solid var(--fa-line-input); background: var(--fa-card); font-size: var(--fa-size-small); cursor: pointer; }
.fa-choice-chip input:checked + span { background: var(--fa-green); border-color: var(--fa-green); color: var(--fa-ivory); font-weight: 800; }
.fa-choice-chip input:focus-visible + span { outline: 3px solid var(--fa-green); outline-offset: 3px; }

/* capture: the one-field email apply (hero and closing plate) ----------- */
.fa-capture { width: 100%; max-width: 640px; }
.fa-capture-row { display: flex; gap: 6px; padding: 6px; background: var(--fa-ivory); }
.fa-capture-row:focus-within { outline: 3px solid var(--fa-on-green); outline-offset: 2px; }
.fa-capture .fa-input { flex: 1; min-width: 0; min-height: 0; border: 0; background: transparent; padding: 0 14px; }
.fa-capture .fa-input:focus-visible { outline: none; }
.fa-capture-msg { margin-top: 12px; font-weight: 800; font-size: var(--fa-size-small); }
.fa-capture-msg:empty { display: none; }
.fa-capture-done { background: var(--fa-ivory); color: var(--fa-ink); padding: 20px 24px; font-weight: 800; font-size: var(--fa-size-text); text-align: left; }
.fa-capture-done span { display: block; margin-top: 4px; font-weight: 400; color: var(--fa-soft); font-size: var(--fa-size-small); }
.fa-capture-note { margin-top: 12px; font-size: var(--fa-size-small); color: var(--fa-on-green); }
.fa-capture--on-light .fa-capture-row { background: var(--fa-card); border: 1px solid var(--fa-line-input); }
.fa-capture--on-light .fa-capture-row:focus-within { outline-color: var(--fa-green); }
.fa-capture--on-light .fa-capture-note { color: var(--fa-soft); }

/* faq: native details/summary -------------------------------------------- */
.fa-faq { border-top: var(--fa-rule) solid var(--fa-green); }
.fa-faq details { border-bottom: 1px solid var(--fa-line); }
.fa-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: clamp(20px, 1.95vw, 28px) 0;
  font: 800 var(--fa-size-h3)/1.15 var(--fa-sans); letter-spacing: -0.03em; }
.fa-faq summary::-webkit-details-marker { display: none; }
.fa-faq summary::after { content: ""; flex: 0 0 auto; width: clamp(32px, 2.5vw, 36px); aspect-ratio: 1; background: var(--fa-sage)
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 3v10M3 8h10' stroke='%23084C3B' stroke-width='2'/%3E%3C/svg%3E") center / 44% no-repeat;
  transition: transform .3s var(--fa-ease); }
.fa-faq details[open] summary::after { transform: rotate(45deg); }
.fa-faq summary:hover { color: var(--fa-green); }
.fa-faq-answer { max-width: 60ch; padding: 0 64px clamp(22px, 1.95vw, 30px) 0; color: var(--fa-soft); }
.fa-faq-answer > * + * { margin-top: 12px; }

/* quote (T08): black-and-white portrait ---------------------------------- */
.fa-quote { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(32px, 4.45vw, 64px); align-items: center; }
.fa-quote-photo { aspect-ratio: 4 / 5; overflow: hidden; background: var(--fa-green-deep); }
.fa-quote-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 25%; }
.fa-quote-text { font: 800 clamp(30px, 3.9vw, 56px)/1.04 var(--fa-sans); letter-spacing: -0.04em; text-wrap: balance; }
.fa-quote-cite { display: block; margin-top: clamp(28px, 2.8vw, 40px); padding-top: 18px; border-top: var(--fa-rule) solid var(--fa-green); font-style: normal; }
.fa-quote-cite > .fa-label { display: block; margin-top: 6px; color: var(--fa-soft); }
.fa-quote--text-only { grid-template-columns: minmax(0, 1fr); max-width: 1000px; }

/* people / speakers: natural portraits ------------------------------------ */
.fa-people { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(32px, 3.3vw, 48px) var(--fa-gap); }
.fa-people--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fa-person-photo { aspect-ratio: 1; overflow: hidden; margin-bottom: clamp(14px, 1.25vw, 18px); background: var(--fa-sunken); }
.fa-person-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--fa-ease); }
.fa-person:hover .fa-person-photo img { transform: scale(1.03); }
.fa-person-slot { display: grid; place-items: center; width: 100%; height: 100%; border: 2px dashed var(--fa-line-input); color: var(--fa-soft); font: 500 16px/1 var(--fa-mono); letter-spacing: .12em; text-transform: uppercase; }
.fa-person-name { font: 800 clamp(20px, 1.67vw, 24px)/1.15 var(--fa-sans); letter-spacing: -0.025em; }
.fa-person-role { margin-top: 6px; font: 500 16px/1.3 var(--fa-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fa-green); }
.fa-plate .fa-person-role, .fa-section--plate .fa-person-role { color: var(--fa-on-green); }

/* logo-wall and logo-marquee: monochrome, equal optical height ---------- */
/* The supplied partner files are ivory on transparent. On ivory they are
   flattened to a dark monochrome; on the green plate they show as supplied. */
.fa-logo { display: block; width: auto; max-width: none; height: clamp(26px, 2.36vw, 34px); filter: brightness(0); opacity: .82; }
.fa-logo--tall { height: clamp(40px, 3.6vw, 52px); }
.fa-logo--short { height: clamp(20px, 1.8vw, 26px); }
.fa-logos { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: clamp(32px, 4.45vw, 56px) clamp(40px, 5vw, 72px); }
.fa-logos--grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); justify-items: center; }
/* files whose mark has reversed detail (an ivory icon inside a dark square) lose it when flattened: keep them grayscale */
.fa-logo--keep { filter: grayscale(1); opacity: .9; }
/* logo slot: a sponsor named in place until its approved file is in Drive 02 Sponsors */
.fa-logo-slot { display: inline-flex; align-items: center; justify-content: center; height: clamp(40px, 3.6vw, 52px); padding: 0 18px; border: 2px dashed var(--fa-line-input);
  color: var(--fa-soft); font: 500 16px/1.2 var(--fa-mono); letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
.fa-logos--on-green .fa-logo, .fa-plate .fa-logo, .fa-section--plate .fa-logo { filter: none; opacity: .92; }
.fa-marquee { overflow: hidden; }
.fa-section > .fa-marquee { margin-top: clamp(48px, 5.56vw, 80px); }
.fa-marquee-track { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: clamp(32px, 4.45vw, 56px) clamp(40px, 5vw, 72px); }
.fa-marquee-list { display: contents; }
.fa-marquee-list[aria-hidden="true"] { display: none; }
.fa-marquee.is-ready .fa-marquee-track { flex-wrap: nowrap; justify-content: flex-start; gap: 0; width: max-content; animation: fa-marquee 60s linear infinite; }
.fa-marquee.is-ready .fa-marquee-list { display: flex; align-items: center; gap: clamp(48px, 5.56vw, 96px); padding-right: clamp(48px, 5.56vw, 96px); }
.fa-marquee:hover .fa-marquee-track { animation-play-state: paused; }
@keyframes fa-marquee { to { transform: translateX(-50%); } }

/* cta-plate: the closing green plate, one call to action (T16) ---------- */
.fa-cta-plate { background: var(--fa-green); color: var(--fa-ivory); padding-block: clamp(96px, 11.1vw, 176px); text-align: center; }
.fa-cta-plate .fa-display, .fa-cta-plate .fa-h1 { max-width: 13ch; margin-inline: auto; }
.fa-cta-plate .fa-label { margin-bottom: clamp(16px, 1.67vw, 24px); color: var(--fa-on-green); }
.fa-cta-plate .fa-lead { margin-top: clamp(16px, 1.67vw, 24px); color: var(--fa-on-green); }
.fa-cta-plate .fa-capture { margin: clamp(32px, 3.3vw, 48px) auto 0; }
.fa-cta-plate .fa-actions { margin-top: clamp(32px, 3.3vw, 48px); justify-content: center; }
.fa-cta-plate--left { text-align: left; }
.fa-cta-plate--left .fa-display, .fa-cta-plate--left .fa-h1 { margin-inline: 0; }
.fa-cta-plate--left .fa-capture { margin-inline: 0; }
.fa-cta-plate--left .fa-actions { justify-content: flex-start; }

/* footer ------------------------------------------------------------------ */
.fa-footer { border-top: 1px solid var(--fa-line); background: var(--fa-ivory); color: var(--fa-soft); }
.fa-footer-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; padding-block: clamp(28px, 2.5vw, 40px); font-size: var(--fa-size-small); }
.fa-footer-bar .fa-mark { height: 22px; }
.fa-footer-links { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.fa-footer-links a { text-decoration: none; }
.fa-footer-links a:hover { color: var(--fa-ink); text-decoration: underline; }

/* notice: prototype / mock banner ---------------------------------------- */
.fa-notice { background: var(--fa-ink); color: var(--fa-ivory); text-align: center; padding: 10px var(--fa-gutter); font: 500 var(--fa-size-small)/1.35 var(--fa-sans); }
.fa-notice[hidden] { display: none; }
.fa-notice--inline { background: var(--fa-sunken); color: var(--fa-ink); text-align: left; padding: 16px 20px; border-top: var(--fa-rule) solid var(--fa-ink); }

/* summary: order details on pay and thanks pages ------------------------- */
.fa-summary { border-top: var(--fa-rule) solid var(--fa-green); }
.fa-summary-row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--fa-line); }
.fa-summary-row > dt { color: var(--fa-soft); }
.fa-summary-row > dd { margin: 0; text-align: right; }
.fa-total { font-variant-numeric: tabular-nums; font: 800 clamp(40px, 4.17vw, 60px)/1 var(--fa-sans); letter-spacing: -0.05em; color: var(--fa-green); }

/* status: the square mark on a thanks page ------------------------------- */
.fa-status { display: grid; place-items: center; width: 72px; aspect-ratio: 1; background: var(--fa-green); color: var(--fa-ivory); font: 800 32px/1 var(--fa-sans); }
.fa-status--wait { background: var(--fa-sage); color: var(--fa-green); animation: fa-pulse 1.6s ease-in-out infinite; }
.fa-status--bad { background: var(--fa-danger-bg); color: var(--fa-danger); }
@keyframes fa-pulse { 50% { opacity: .45; } }

/* sticky-bar: phone apply bar after the first form scrolls away ---------- */
.fa-sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: none; padding: 12px var(--fa-gutter) calc(12px + env(safe-area-inset-bottom)); background: var(--fa-green);
  transform: translateY(110%); visibility: hidden; transition: transform .35s var(--fa-ease), visibility 0s linear .35s; }
.fa-sticky.is-on { transform: none; visibility: visible; transition: transform .35s var(--fa-ease); }

/* carousel: large slides in one row that scroll sideways (draft) -------- */
/* The track bleeds to the right edge and lines its first slide up with the
   container. Swipe, scroll or use the two square buttons (fa.js). */
.fa-carousel { position: relative; min-width: 0; }
.fa-carousel-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px var(--fa-gap); margin-bottom: clamp(32px, 3.3vw, 48px); }
.fa-carousel-head > .fa-section-head { margin-bottom: 0; }
.fa-carousel-controls { display: flex; gap: 8px; }
.fa-carousel-btn { display: grid; place-items: center; width: 56px; height: 56px; padding: 0; border: 2px solid var(--fa-green); background: transparent; color: var(--fa-green);
  font: 400 24px/1 var(--fa-sans); cursor: pointer; transition: background .2s var(--fa-ease), color .2s var(--fa-ease); }
.fa-carousel-btn:hover { background: var(--fa-green); color: var(--fa-ivory); }
.fa-carousel-btn:disabled { opacity: .3; cursor: default; background: transparent; color: var(--fa-green); }
.fa-carousel-track { --fa-carousel-pad: max(var(--fa-gutter), calc((100% - var(--fa-max)) / 2)); display: grid; grid-auto-flow: column; grid-auto-columns: min(80%, 760px);
  gap: var(--fa-gap); margin: 0; padding: 0 var(--fa-carousel-pad) 8px; list-style: none; overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scroll-padding-inline: var(--fa-carousel-pad); scrollbar-width: none; }
.fa-carousel-track::-webkit-scrollbar { display: none; }
.fa-carousel-track:focus-visible { outline: 3px solid var(--fa-green); outline-offset: -3px; }
.fa-slide { min-width: 0; scroll-snap-align: start; }
.fa-slide-media { position: relative; aspect-ratio: 3 / 2; overflow: hidden; margin-bottom: clamp(18px, 1.67vw, 24px); background: var(--fa-green-deep); }
.fa-slide-media img { width: 100%; height: 100%; object-fit: cover; }
.fa-slide-media--top img { object-position: center top; }
.fa-slide > .fa-label { margin-bottom: 10px; }
.fa-slide > .fa-h2 { max-width: 24ch; text-wrap: balance; }
.fa-slide-text { margin-top: 12px; max-width: 46ch; color: var(--fa-soft); }

/* draft marker: a value still to fill, in [brackets] on the input yellow -- */
/* Internal drafts only. check before shipping: none may remain in anything sent. */
.fa-draft { padding: 0 .18em; background: var(--fa-draft-bg); color: var(--fa-chip-next-fg); outline: 2px dashed var(--fa-chip-next-fg); outline-offset: -2px; white-space: nowrap; font-style: normal; }

/* --------------------------------------------------------------------------
   6. Responsive. Tablet up to 1000, phone up to 720. QA at 1440 and 390.
   -------------------------------------------------------------------------- */
@media (max-width: 1000px) {
  .fa-split, .fa-split--photo-left, .fa-split--even, .fa-big-number, .fa-section-head--split { grid-template-columns: minmax(0, 1fr); }
  .fa-split--photo-left > .fa-split-media { order: 0; }
  .fa-split-media { aspect-ratio: 3 / 2; }
  .fa-split-media--square { aspect-ratio: 1; max-width: 480px; }
  .fa-program { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: clamp(40px, 5vw, 56px); }
  .fa-people { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fa-ladder-row { grid-template-columns: minmax(0, 1fr) auto; }
  .fa-ladder-row > .fa-chip { grid-row: 1; grid-column: 2; }
  .fa-ladder-seats { grid-column: 1; }
  .fa-ladder-price { grid-column: 2; justify-self: end; }
}
@media (max-width: 900px) {
  .fa-grid > [class*="fa-span-"] { grid-column: 1 / -1; }
  .fa-hero, .fa-hero--photo-left { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .fa-hero-plate, .fa-hero--photo-left .fa-hero-plate { padding: clamp(48px, 12cqw, 72px) var(--fa-gutter) clamp(48px, 12cqw, 64px); }
  .fa-hero-photo, .fa-hero--photo-left .fa-hero-photo { order: 2; aspect-ratio: 4 / 3; }
}
@media (max-width: 720px) {
  .fa-nav > .fa-nav-link { display: none; }
  .fa-cards-three, .fa-steps--row, .fa-program, .fa-program--three, .fa-form-row { grid-template-columns: minmax(0, 1fr); }
  .fa-people, .fa-people--three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fa-quote { grid-template-columns: minmax(0, 1fr); }
  .fa-quote-photo { max-width: 280px; }
  .fa-capture-row { flex-direction: column; }
  .fa-capture .fa-input { min-height: 54px; }
  .fa-capture .fa-btn { width: 100%; }
  .fa-faq-answer { padding-right: 0; }
  .fa-sticky { display: block; }
  .fa-page:has(.fa-sticky) .fa-footer-bar { padding-bottom: 104px; }
  .fa-table th, .fa-table td { padding-right: 14px; }
  .fa-ladder-row { padding-inline: 10px; }
  .fa-carousel-track { grid-auto-columns: 86%; }
  .fa-carousel-btn { width: 48px; height: 48px; }
}

/* --------------------------------------------------------------------------
   7. Motion: hover only, nothing bounces; reduced motion turns it all off.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  html:has(.fa-page) { scroll-behavior: auto; }
  .fa-page *, .fa-page *::before, .fa-page *::after { animation: none !important; transition: none !important; }
  .fa-marquee.is-ready .fa-marquee-track { flex-wrap: wrap; justify-content: center; width: auto; gap: clamp(32px, 4.45vw, 56px) clamp(40px, 5vw, 72px); }
  .fa-marquee.is-ready .fa-marquee-list { display: contents; }
  .fa-marquee.is-ready .fa-marquee-list[aria-hidden="true"] { display: none; }
}

/* tone: muted category colors for internal pages (draft, 30 Oct 2026). Data colors, never brand colors. */
.fa-tone--1 { --fa-tone: #8F6B22; }
.fa-tone--2 { --fa-tone: #A34E3A; }
.fa-tone--3 { --fa-tone: #33688F; }
.fa-tone--4 { --fa-tone: #557030; }
.fa-tone--5 { --fa-tone: #6F5590; }
.fa-tone--6 { --fa-tone: #4E5456; }
.fa-tone--7 { --fa-tone: #257472; }
.fa-swatch { display: inline-block; flex: none; width: 12px; height: 12px; margin-right: 10px; background: var(--fa-tone); }

/* org-chart: a reporting tree, roles only (draft, 30 Oct 2026). Internal pages. */
.fa-org { --fa-org-cols: 5; --fa-org-stem: 24px; --fa-org-gap: var(--fa-gap); }
.fa-org-top { display: flex; justify-content: center; }
.fa-org-top > .fa-org-node { width: min(100%, 300px); }
.fa-org-stem { width: 1px; height: var(--fa-org-stem); margin-inline: auto; background: var(--fa-green); }
.fa-org-staff { display: grid; grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr); column-gap: var(--fa-org-gap); }
.fa-org-through { background: var(--fa-green); }
.fa-org-staff > .fa-org-node { position: relative; width: min(100%, 300px); }
.fa-org-staff > .fa-org-node:first-child { justify-self: end; }
.fa-org-staff > .fa-org-node:last-child { justify-self: start; }
.fa-org-staff > .fa-org-node:first-child::after, .fa-org-staff > .fa-org-node:last-child::after { content: ""; position: absolute; top: 50%; width: var(--fa-org-gap); height: 1px; background: var(--fa-green); }
.fa-org-staff > .fa-org-node:first-child::after { left: 100%; }
.fa-org-staff > .fa-org-node:last-child::after { right: 100%; }
.fa-org-row { position: relative; display: grid; grid-template-columns: repeat(var(--fa-org-cols), minmax(0, 1fr)); column-gap: var(--fa-org-gap); padding-top: var(--fa-org-stem); }
.fa-org-row::before { content: ""; position: absolute; top: 0; --fa-org-inset: calc((100% - (var(--fa-org-cols) - 1) * var(--fa-org-gap)) / (2 * var(--fa-org-cols))); left: var(--fa-org-inset); right: var(--fa-org-inset); height: 1px; background: var(--fa-green); }
.fa-org-branch { position: relative; min-width: 0; }
.fa-org-branch::before { content: ""; position: absolute; top: calc(-1 * var(--fa-org-stem)); left: 50%; width: 1px; height: var(--fa-org-stem); background: var(--fa-green); }
.fa-org-node { display: block; padding: 14px 16px; background: var(--fa-card); border: 1px solid var(--fa-line-input); text-decoration: none; }
.fa-org-node:hover { border-color: var(--fa-green); }
.fa-org-node[class*="fa-tone--"] { background: color-mix(in srgb, var(--fa-tone) 22%, var(--fa-card)); border-color: var(--fa-tone); }
.fa-org-node--lead, .fa-org-node--lead[class*="fa-tone--"] { background: var(--fa-green); border-color: var(--fa-green); border-top: 6px solid var(--fa-tone, var(--fa-green)); color: var(--fa-ivory); }
.fa-org-node--lead:hover { background: var(--fa-green-hover); }
.fa-org-node--second, .fa-org-node--second[class*="fa-tone--"] { background: var(--fa-card); border: 2px solid var(--fa-green); border-top: 6px solid var(--fa-tone, var(--fa-green)); }
.fa-org-node--open, .fa-org-node--open[class*="fa-tone--"] { border-style: dashed; }
.fa-org-role { display: block; font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; }
.fa-org-person { display: block; margin-top: 4px; font-size: var(--fa-size-small); color: var(--fa-soft); line-height: 1.3; }
.fa-org-node[class*="fa-tone--"] .fa-org-person { color: var(--fa-ink); }
.fa-org-node--lead .fa-org-person, .fa-org-node--lead[class*="fa-tone--"] .fa-org-person { color: var(--fa-on-green); }
.fa-org-node.fa-org-node--frac, .fa-org-node[class*="fa-tone--"].fa-org-node--frac { background: var(--fa-card); }
.fa-org-block { margin-top: clamp(40px, 4.45vw, 64px); }
.fa-org-dept { display: flex; flex-direction: column; gap: 6px; }
.fa-org-dept-head { padding: 8px 12px; background: var(--fa-tone); color: var(--fa-ivory); font-weight: 800; line-height: 1.2; }
.fa-org-dept .fa-org-node { padding: 10px 12px; }
.fa-org-dept .fa-org-role { font-size: var(--fa-size-small); }
.fa-org-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; margin-top: 16px; font-size: var(--fa-size-small); }
.fa-org-key { display: inline-block; width: 28px; height: 16px; margin-right: 8px; vertical-align: -3px; border: 1px solid var(--fa-tone); background: color-mix(in srgb, var(--fa-tone) 22%, var(--fa-card)); }
.fa-org-key--frac { background: var(--fa-card); }
.fa-org-sub { position: relative; padding-top: 12px; }
.fa-org-sub::before { content: ""; position: absolute; top: 0; left: 50%; width: 1px; height: 12px; background: var(--fa-green); }
.fa-org-sub > .fa-org-node + .fa-org-node { margin-top: 8px; }
@media (max-width: 1040px) {
  .fa-org-row { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 24px; padding-top: 16px; }
  .fa-org-row::before, .fa-org-branch::before, .fa-org-staff > .fa-org-node::after { display: none; }
  .fa-org-staff { grid-template-columns: minmax(0, 1fr); }
  .fa-org-staff > .fa-org-node, .fa-org-staff > .fa-org-node:first-child, .fa-org-staff > .fa-org-node:last-child { justify-self: stretch; width: 100%; }
  .fa-org-through { display: none; }
  .fa-org-staff { row-gap: 8px; }
}
@media (max-width: 560px) { .fa-org-row { grid-template-columns: minmax(0, 1fr); } }

/* stream-map: how the parts of a business connect, in layers around a core (draft, 30 Oct 2026). Internal pages. */
.fa-map { position: relative; width: 100%; aspect-ratio: 1312 / 806; }
.fa-map-lines { position: absolute; inset: 0; width: 100%; height: 100%; color: var(--fa-soft); }
.fa-map-node, .fa-map-label, .fa-map-core { position: absolute; transform: translate(-50%, -50%); transition: opacity .15s var(--fa-ease); }
.fa-map-line, .fa-map-band { transition: opacity .15s var(--fa-ease); }
.fa-map-node { display: block; width: 280px; padding: 12px 10px; text-align: center; text-decoration: none; background: color-mix(in srgb, var(--fa-tone) 22%, var(--fa-card)); border: 1px solid var(--fa-tone); border-top: 6px solid var(--fa-tone); }
.fa-map-node:hover, .fa-map-band[href]:hover, .fa-map-base:hover { background: color-mix(in srgb, var(--fa-tone) 32%, var(--fa-card)); }
.fa-map-core { width: 340px; padding: 18px 20px; text-align: center; background: var(--fa-green); color: var(--fa-ivory); }
.fa-map-core .fa-map-what { color: var(--fa-on-green); }
.fa-map-name { display: block; font-size: var(--fa-size-h3); font-weight: 800; letter-spacing: -0.03em; line-height: 1.12; }
.fa-map-what { display: block; margin-top: 4px; font-size: var(--fa-size-small); line-height: 1.3; }
.fa-map-label { width: 190px; text-align: center; font-size: var(--fa-size-small); line-height: 1.25; color: var(--fa-soft); }
.fa-map-pair { display: none; }
.fa-map-band { position: absolute; left: 0; right: 0; display: block; padding: 12px 16px; text-align: center; text-decoration: none; background: var(--fa-card); border: 1px solid var(--fa-line-input); }
.fa-map-band[class*="fa-tone--"] { background: color-mix(in srgb, var(--fa-tone) 18%, var(--fa-card)); border-color: var(--fa-tone); }
.fa-map-node--parent { width: 340px; }
.fa-map-node--sub { width: 290px; padding: 10px 12px; }
.fa-map-node--sub .fa-map-name { font-size: var(--fa-size-text); letter-spacing: -0.02em; }
.fa-map-tags { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 8px; }
.fa-pay { display: inline-block; padding: 2px 8px; font-size: var(--fa-size-small); line-height: 1.3; border: 1px solid var(--fa-green); }
.fa-pay--now { background: var(--fa-green); color: var(--fa-ivory); }
.fa-pay--later { border-style: dashed; color: var(--fa-green); }
.fa-pay--free { color: var(--fa-green); background: var(--fa-card); }
.fa-map-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; margin-top: 16px; font-size: var(--fa-size-small); }
.fa-map-base { position: absolute; left: 0; right: 0; bottom: 0; display: block; padding: 12px 16px; text-align: center; text-decoration: none; background: color-mix(in srgb, var(--fa-tone) 22%, var(--fa-card)); border: 1px solid var(--fa-tone); border-top: 6px solid var(--fa-tone); }
.fa-map.is-hover .is-dim { opacity: .15; }
@media (max-width: 1040px) {
  .fa-map { aspect-ratio: auto; display: grid; gap: 8px; }
  .fa-map-lines { display: none; }
  .fa-map-node, .fa-map-label, .fa-map-core, .fa-map-band, .fa-map-base { position: static; transform: none; width: 100%; }
  .fa-map-label { text-align: left; padding: 2px 0; color: var(--fa-ink); }
  .fa-map-pair { display: inline; font-weight: 800; }
  .fa-map-base { order: 1; }
}

/* gantt: one lane per workstream, weekly then quarterly columns, click to focus a lane (draft, 30 Oct 2026). Internal pages. */
.fa-gantt-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.fa-gantt { --fa-gantt-task: 400px; --fa-gantt-cols: repeat(10, minmax(0, 1fr)) repeat(4, minmax(0, 2.6fr)); min-width: 1040px; font-size: var(--fa-size-small); }
.fa-gantt-head, .fa-gantt-row { display: grid; grid-template-columns: var(--fa-gantt-task) minmax(0, 1fr); }
.fa-gantt-head { border-bottom: var(--fa-rule) solid var(--fa-green); padding-bottom: 6px; }
.fa-gantt-scale { display: grid; grid-template-columns: var(--fa-gantt-cols); row-gap: 2px; font-variant-numeric: tabular-nums; }
.fa-gantt-period { font-weight: 800; }
.fa-gantt-week { color: var(--fa-soft); }
.fa-gantt-lane { padding-block: 12px; border-bottom: 1px solid var(--fa-line); transition: opacity .2s var(--fa-ease); scroll-margin-top: calc(var(--fa-header-h) + 16px); }
.fa-gantt-lane-name { display: inline-flex; align-items: center; font-weight: 800; text-decoration: none; padding-bottom: 4px; cursor: pointer; }
.fa-gantt-lane-name:hover { text-decoration: underline; }
.fa-gantt-row { align-items: center; min-height: 26px; }
.fa-gantt-task { padding-right: 16px; line-height: 1.25; }
.fa-gantt-track { display: grid; grid-template-columns: var(--fa-gantt-cols); align-items: center; height: 26px; }
.fa-gantt-cell { grid-row: 1; height: 100%; border-left: 1px solid var(--fa-line); }
.fa-gantt-cell--break { border-left: 2px solid var(--fa-line-input); }
.fa-gantt-bar { grid-row: 1; height: 13px; background: var(--fa-tone, color-mix(in srgb, var(--fa-soft) 55%, var(--fa-ivory))); }
.fa-gantt-bar--proposed { background: color-mix(in srgb, var(--fa-tone, var(--fa-soft)) 30%, var(--fa-ivory)); outline: 1px dashed var(--fa-tone, var(--fa-soft)); outline-offset: -1px; }
.fa-gantt-reset { margin-top: 12px; }
.fa-gantt-reset[hidden] { display: none; }
.fa-gantt.is-focused .fa-gantt-lane:not(.is-focus) { opacity: .25; }

/* role: one role card with plain bullets, per stream (draft, 30 Oct 2026). Internal pages. */
.fa-role-sub { margin-top: 8px; color: var(--fa-soft); }
.fa-role-body { margin-top: clamp(16px, 1.67vw, 24px); }
.fa-role-row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 10fr); gap: 8px var(--fa-gap); padding-block: 14px; border-top: 1px solid var(--fa-line); }
.fa-role-row > dt { font-weight: 800; }
.fa-role-row > dd { margin: 0; min-width: 0; }
.fa-role-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(32px, 3.3vw, 48px) clamp(32px, 4.4vw, 64px); }
.fa-role-card { padding: 16px 0 0; border-top: var(--fa-rule) solid var(--fa-green); scroll-margin-top: calc(var(--fa-header-h) + 16px); }
.fa-role-card:target { background: var(--fa-sage); box-shadow: 0 0 0 12px var(--fa-sage); }
.fa-role-note { margin-top: 8px; font-size: var(--fa-size-small); color: var(--fa-soft); }
.fa-role-list { margin-top: 12px; }
.fa-role-list > li { position: relative; padding-left: 20px; font-size: var(--fa-size-text); line-height: 1.4; }
.fa-role-list > li + li { margin-top: 6px; }
.fa-role-list > li::before { content: ""; position: absolute; left: 0; top: 0.5em; width: 8px; height: 8px; background: var(--fa-tone, var(--fa-green)); }
@media (max-width: 720px) { .fa-role-row, .fa-role-grid { grid-template-columns: minmax(0, 1fr); } }

/* header--site: a multi-page site. Phones keep the links, in a second row, so every page stays reachable (draft, 31 Oct 2026). */
.fa-nav-links { display: flex; align-items: center; gap: clamp(20px, 2.8vw, 40px); }
@media (max-width: 720px) {
  html:has(.fa-header--site) { scroll-padding-top: 16px; }
  .fa-header--site { position: relative; top: auto; }
  .fa-header--site .fa-header-bar { flex-wrap: wrap; height: auto; gap: 0 16px; padding-block: 12px 2px; }
  .fa-header--site .fa-nav { display: contents; }
  .fa-header--site .fa-nav-links { order: 3; flex: 1 0 100%; justify-content: space-between; gap: 12px; margin-top: 6px; }
  .fa-header--site .fa-nav-link { padding-block: 10px; white-space: nowrap; }
}

/* deck: click-through slides on the 1280 by 720 canvas, inside any page (draft, 31 Oct 2026). fa.js scales and steps it. */
.fa-deck { display: block; max-width: calc((100vh - 260px) * 16 / 9); margin-inline: auto; outline-offset: 8px; }
.fa-deck-stage { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: var(--fa-ivory); border: 1px solid var(--fa-line-input); cursor: pointer; }
.fa-deck-canvas { position: absolute; left: 0; top: 0; width: 1280px; height: 720px; transform-origin: 0 0; }
.fa-slide { position: absolute; inset: 0; display: none; overflow: hidden; background: var(--fa-ivory); color: var(--fa-ink); }
.fa-slide.is-on { display: block; }
.fa-slide-part { position: absolute; min-width: 0; }
.fa-slide-photo { overflow: hidden; background: var(--fa-green-deep); }
.fa-slide-photo img { width: 100%; height: 100%; object-fit: cover; }
.fa-slide-scrim { background: linear-gradient(to top, rgba(5, 41, 31, .82), rgba(5, 41, 31, .1) 62%); }
.fa-slide-mark .fa-mark { height: 24px; min-width: 0; }
.fa-slide-mark--lg .fa-mark { height: 48px; }
.fa-slide--plate { background: var(--fa-green); color: var(--fa-ivory); }
.fa-sl-plate { background: var(--fa-green); }
.fa-sl-plate ~ .fa-slide-part { color: var(--fa-ivory); }
.fa-sl-plate ~ .fa-sl-rule { color: var(--fa-ink); }
.fa-sl-display, .fa-sl-h1, .fa-sl-title, .fa-sl-h3 { font-weight: 800; letter-spacing: -0.045em; line-height: 1.02; }
.fa-sl-display { font-size: 96px; line-height: .98; }
.fa-sl-h1 { font-size: 64px; }
.fa-sl-title { font-size: 44px; }
.fa-sl-h3 { font-size: 28px; letter-spacing: -0.03em; line-height: 1.12; }
.fa-sl-lead { font-size: 32px; line-height: 1.25; }
.fa-sl-body { font-size: 24px; line-height: 1.32; }
.fa-sl-small { font-size: 20px; line-height: 1.32; }
.fa-sl-soft { color: var(--fa-soft); }
.fa-sl-ivory { color: var(--fa-ivory); }
.fa-sl-ongreen { color: var(--fa-on-green); }
.fa-sl-next { margin-top: 12px; }
.fa-sl-pay { margin-top: 6px; }
.fa-sl-bottom { display: flex; flex-direction: column; justify-content: flex-end; }
.fa-sl-center { display: flex; flex-direction: column; justify-content: center; }
.fa-sl-rule { border-top: var(--fa-rule) solid var(--fa-green); padding-top: 14px; }
.fa-sl-box { padding: 14px 18px; background: var(--fa-card); border: 1px solid var(--fa-line-input); }
.fa-sl-box .fa-sl-small { margin-top: 6px; }
.fa-sl-box--core { background: var(--fa-green); border-color: var(--fa-green); color: var(--fa-ivory); }
.fa-sl-box--sage { background: var(--fa-sage); border-color: var(--fa-sage); }
.fa-sl-rung { padding: 16px; background: var(--fa-sage); border-top: var(--fa-rule) solid var(--fa-green); }
.fa-sl-rung--top { background: var(--fa-green); color: var(--fa-ivory); }
.fa-sl-ink { color: var(--fa-ink); }
.fa-sl-bullets { font-size: 24px; line-height: 1.3; }
.fa-sl-bullets > li { position: relative; padding-left: 22px; }
.fa-sl-bullets > li + li { margin-top: 12px; }
.fa-sl-bullets > li::before { content: ""; position: absolute; left: 0; top: 0.48em; width: 8px; height: 8px; background: var(--fa-green); }
.fa-sl-bullets--sm { font-size: 21px; line-height: 1.26; }
.fa-sl-bullets--sm > li + li { margin-top: 8px; }
.fa-sl-list { margin-top: 12px; font-size: 20px; line-height: 1.28; }
.fa-sl-list > li + li { margin-top: 8px; }
.fa-sl-right { text-align: right; }
.fa-sl-row { display: grid; grid-template-columns: 540px minmax(0, 1fr); align-items: baseline; gap: 24px; }
.fa-sl-grid4 { display: grid; grid-template-columns: 300px minmax(0, 1fr) 170px 170px; align-items: baseline; gap: 24px; }
.fa-sl-num { text-align: right; font-variant-numeric: tabular-nums; }
.fa-sl-agenda { display: flex; justify-content: flex-end; gap: 22px; font: 500 16px/1 var(--fa-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fa-soft); }
.fa-sl-agenda > span { padding-bottom: 7px; border-bottom: 3px solid transparent; white-space: nowrap; }
.fa-sl-agenda > .is-current { color: var(--fa-green); border-bottom-color: var(--fa-green); }
.fa-slide--plate .fa-sl-agenda, .fa-sl-agenda--ongreen { color: var(--fa-on-green); }
.fa-slide--plate .fa-sl-agenda > .is-current, .fa-sl-agenda--ongreen > .is-current { color: var(--fa-ivory); border-bottom-color: var(--fa-ivory); }
.fa-sl-matrix { display: grid; grid-template-columns: 250px repeat(4, minmax(0, 1fr)); font-size: 20px; line-height: 1.22; }
.fa-sl-matrix > * { padding: 9px 12px; border-top: 1px solid var(--fa-line); }
.fa-sl-matrix > .is-head { border-top: 0; font-weight: 800; font-size: 24px; letter-spacing: -0.02em; }
.fa-sl-matrix > .is-ours { background: var(--fa-sage); }
.fa-sl-matrix > .is-row { color: var(--fa-soft); }
.fa-sl-matrix > .is-price { font-weight: 800; border-top: var(--fa-rule) solid var(--fa-green); font-variant-numeric: tabular-nums; }
.fa-sl-tick { color: var(--fa-green); font-weight: 800; }
.fa-sl-dash { color: var(--fa-line-input); }
.fa-sl-bars { display: grid; grid-template-columns: 140px minmax(0, 1fr) 60px; gap: 14px 16px; align-items: center; font-size: 22px; }
.fa-sl-bar { height: 34px; background: var(--fa-green); }
.fa-sl-cells { display: grid; grid-template-columns: repeat(20, minmax(0, 1fr)); gap: 6px; }
.fa-sl-cells > span { height: 44px; background: var(--fa-sage); }
.fa-sl-cells > .is-on { background: var(--fa-green); }
.fa-sl-video { width: 100%; height: 100%; object-fit: cover; background: var(--fa-green-deep); display: block; }
.fa-sl-logobox { padding: 14px 16px; border-top: var(--fa-rule) solid var(--fa-green); background: var(--fa-card); }
.fa-sl-logobox { overflow: hidden; }
.fa-sl-logobox .fa-logos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); justify-items: start; align-items: center; gap: 14px 18px; margin-top: 14px; }
.fa-sl-logobox .fa-logo { height: auto; max-height: 26px; max-width: 100%; }
.fa-sl-logorow { display: flex; flex-wrap: wrap; align-items: center; gap: 22px 34px; }
.fa-sl-logorow .fa-logo { height: 30px; }
.fa-deck-bar { display: flex; align-items: center; gap: 16px; margin-top: 12px; }
.fa-deck-count { font-size: var(--fa-size-small); font-variant-numeric: tabular-nums; color: var(--fa-soft); }
.fa-deck-full { margin-left: auto; font-size: var(--fa-size-small); background: none; border: 0; padding: 0; cursor: pointer; }
.fa-deck:fullscreen { max-width: none; display: flex; flex-direction: column; justify-content: center; align-items: center; background: var(--fa-green-deep); }
.fa-deck:fullscreen .fa-deck-stage { width: min(100vw, calc((100vh - 64px) * 16 / 9)); border: 0; }
.fa-deck:fullscreen .fa-deck-bar { width: min(100vw, calc((100vh - 64px) * 16 / 9)); padding-inline: 16px; }
.fa-deck:fullscreen .fa-deck-count, .fa-deck:fullscreen .fa-deck-full { color: var(--fa-ivory); }
.fa-deck-page { min-height: 100vh; display: grid; align-content: center; padding-block: 24px; }
.fa-deck-page .fa-deck { width: 100%; max-width: calc((100vh - 110px) * 16 / 9); }

/* carousel: keep its slides visible next to the deck's own .fa-slide rule; pair shows two tiles at a time (31 Oct 2026). */
.fa-carousel-track > .fa-slide { position: static; display: block; overflow: visible; background: none; color: inherit; }
.fa-carousel-track--pair { grid-auto-columns: calc(50% - var(--fa-gap) / 2); }
.fa-slide-cta { margin-top: clamp(16px, 1.67vw, 24px); }
@media (max-width: 720px) {
  .fa-carousel-track--pair { grid-auto-columns: 86%; }
}

/* header--site on the smallest phones: the lockup stays above its 120 px minimum and the button stays beside it. */
@media (max-width: 360px) {
  .fa-header--site .fa-header-home .fa-mark { height: 18px; }
  .fa-header--site .fa-header-bar { gap: 0 8px; }
}

/* ==== HK27 page additions (v5, 27 Oct 2026) · fold into the library once approved ==== */
/* hero with the photo behind the plate */
.fa-hero2 { position: relative; overflow: hidden; background: var(--fa-green); color: var(--fa-ivory); isolation: isolate; text-align: center; }
.fa-hero2-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.fa-hero2::after, .fa-cta-photo::after { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--fa-green); opacity: .82; }
.fa-hero2-body { display: flex; flex-direction: column; align-items: center; padding-block: clamp(80px, 11vw, 176px) clamp(72px, 9vw, 144px); }
.fa-hero2-body > .fa-display { max-width: 15ch; text-wrap: balance; }
.fa-hero2-body > .fa-lead { margin-top: clamp(20px, 2.2vw, 32px); color: var(--fa-on-green); max-width: 38ch; text-wrap: balance; }
.fa-hero2-body > .fa-capture { margin-top: clamp(32px, 3.3vw, 48px); width: 100%; max-width: 640px; }
.fa-cta-photo { position: relative; overflow: hidden; isolation: isolate; }

/* centered section heads */
.fa-section-head--center { text-align: center; margin-inline: auto; }
.fa-section-head--center .fa-h1 { text-wrap: balance; }
.fa-section-head--center .fa-lead { margin-inline: auto; max-width: 46ch; text-wrap: balance; }

/* KPI boxes */
.fa-proof { padding-bottom: clamp(56px, 6vw, 88px); }
.fa-kpis { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); gap: var(--fa-gap); }
.fa-kpi { background: var(--fa-card); border: 1px solid var(--fa-line); border-top: var(--fa-rule) solid var(--fa-green); padding: clamp(24px, 2.2vw, 32px); text-align: center; }
.fa-kpi-num { margin: 0; font: 800 clamp(44px, 6vw, 96px)/.9 var(--fa-sans); letter-spacing: -.055em; color: var(--fa-green); font-variant-numeric: tabular-nums; }
.fa-kpi-num span { font-size: .5em; letter-spacing: -.02em; margin-right: 2px; vertical-align: .62em; }
.fa-kpi-text { margin: 14px 0 0; font-size: var(--fa-size-text); color: var(--fa-ink); }

/* green logo rails with white logos */
.fa-rail-green { background: var(--fa-green); padding-block: clamp(32px, 3.6vw, 52px); }
.fa-rail-green .fa-logo { filter: none; opacity: .95; }
.fa-rail--partners { background: var(--fa-green-deep); }
.fa-rail--partners .fa-logo { filter: brightness(0) invert(1); opacity: .85; height: clamp(24px, 2.2vw, 32px); width: auto; max-width: 150px; object-fit: contain; }
.fa-rail--partners .fa-logo[alt="AppLovin"] { height: clamp(34px, 3vw, 44px); max-width: 180px; }

/* Shenzhen photo grid */
.fa-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: repeat(2, clamp(180px, 20vw, 300px)); gap: var(--fa-gap); }
.fa-gallery figure { margin: 0; overflow: hidden; background: var(--fa-green-deep); }
.fa-gallery figure:first-child { grid-column: span 2; grid-row: span 2; }
.fa-gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--fa-ease); }
.fa-gallery figure:hover img { transform: scale(1.04); }

/* program: expandable cards */
.fa-sessions { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr)); gap: var(--fa-gap); align-items: start; }
.fa-session { background: var(--fa-card); border: 1px solid var(--fa-line); }
.fa-session[open] { border-color: var(--fa-green); }
.fa-session summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 64px minmax(0, 1fr) 28px; gap: 16px; align-items: center; padding: 14px; }
.fa-session summary::-webkit-details-marker { display: none; }
.fa-session-face { margin: 0; width: 64px; height: 64px; overflow: hidden; background: var(--fa-green); color: var(--fa-ivory); display: grid; place-items: center; font: 800 20px/1 var(--fa-sans); }
.fa-session-face img { width: 100%; height: 100%; object-fit: cover; }
.fa-session-talk { display: block; font: 800 clamp(18px, 1.4vw, 21px)/1.2 var(--fa-sans); letter-spacing: -.02em; }
.fa-session-who { display: block; margin-top: 5px; font-size: var(--fa-size-small); color: var(--fa-soft); }
.fa-session-plus { width: 28px; height: 28px; position: relative; }
.fa-session-plus::before, .fa-session-plus::after { content: ""; position: absolute; left: 7px; right: 7px; top: 13px; height: 2px; background: var(--fa-green); transition: transform .3s var(--fa-ease); }
.fa-session-plus::after { transform: rotate(90deg); }
.fa-session[open] .fa-session-plus::after { transform: rotate(0deg); }
.fa-session-detail { margin: 0; padding: 0 18px 18px 94px; font-size: var(--fa-size-text); line-height: 1.5; color: var(--fa-ink); }

/* release cards, SaaS style */
.fa-releases { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: var(--fa-gap); align-items: stretch; }
.fa-release { display: flex; flex-direction: column; background: var(--fa-card); border: 1px solid var(--fa-line); padding: clamp(28px, 2.6vw, 40px) clamp(24px, 2.2vw, 32px); }
.fa-release.is-open { background: var(--fa-green); border-color: var(--fa-green); color: var(--fa-ivory); }
.fa-release-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 30px; }
.fa-release-name { margin: 0; font: 800 20px/1.2 var(--fa-sans); letter-spacing: -.02em; }
.fa-release-tag { font: 800 16px/1 var(--fa-sans); padding: 7px 12px; background: var(--fa-on-green); color: var(--fa-green-deep); }
.fa-release-price { margin: clamp(20px, 2vw, 28px) 0 0; font: 800 clamp(48px, 4.4vw, 68px)/1 var(--fa-sans); letter-spacing: -.05em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fa-release-price span { font-size: .55em; vertical-align: .55em; margin-right: 2px; }
.fa-release:not(.is-open) .fa-release-price { color: var(--fa-ink); }
.fa-release-line { margin: 10px 0 0; font-size: var(--fa-size-text); color: var(--fa-soft); flex: 1; }
.fa-release.is-open .fa-release-line { color: var(--fa-on-green); }
.fa-release .fa-btn, .fa-release-later { margin-top: clamp(24px, 2.2vw, 32px); }
.fa-release-later { display: grid; place-items: center; min-height: 56px; border: 1px solid var(--fa-line); color: var(--fa-soft); font: 800 17px/1 var(--fa-sans); }
.fa-releases-note { margin: clamp(24px, 2.2vw, 32px) 0 0; text-align: center; color: var(--fa-soft); font-size: var(--fa-size-text); }

/* v6: proof lead, rail title, merged "What we did" section, release meter */
.fa-kpi-num .fa-draft { font: inherit; color: inherit; }
.fa-rail-title { margin: 0 0 clamp(24px, 2.6vw, 36px); text-align: center; color: var(--fa-ivory); font: 800 clamp(26px, 2.6vw, 40px)/1.05 var(--fa-sans); letter-spacing: -.04em; padding-inline: var(--fa-gutter); }
.fa-subhead { margin: clamp(48px, 5vw, 72px) 0 clamp(20px, 2vw, 28px); font: 800 clamp(26px, 2.4vw, 36px)/1.05 var(--fa-sans); letter-spacing: -.04em; }
/* v11: headline talks as a bento on the green band: first talk large, two stacked beside it; name on a plate over the photo */
.fa-features { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); grid-template-rows: auto auto; gap: var(--fa-gap); }
.fa-feature { position: relative; min-width: 0; overflow: hidden; background: var(--fa-green-deep); }
.fa-feature:first-child { grid-row: span 2; }
.fa-feature-media { margin: 0; height: 100%; aspect-ratio: 16 / 10; }
.fa-feature:first-child .fa-feature-media { aspect-ratio: auto; min-height: 100%; }
.fa-feature-media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: var(--fa-focus, 50% 50%); transition: transform .8s var(--fa-ease); }
.fa-feature-media picture { display: contents; }
@media (max-width: 1100px) {
  .fa-feature-media--tight img { object-position: 50% 50%; }
}
.fa-feature-cap { position: absolute; left: 0; bottom: 0; max-width: min(88%, 520px); padding: clamp(16px, 1.8vw, 28px) clamp(18px, 2vw, 32px); background: var(--fa-green-deep); color: var(--fa-ivory); }
.fa-feature-name { margin: 0; font: 800 clamp(26px, 2.6vw, 40px)/1 var(--fa-sans); letter-spacing: -.045em; }
.fa-feature:first-child .fa-feature-name { font-size: clamp(34px, 4vw, 64px); }
.fa-feature-co { margin: 8px 0 0; font: 800 clamp(17px, 1.3vw, 20px)/1.2 var(--fa-sans); color: var(--fa-on-green); }
.fa-feature-talk { margin: 6px 0 0; font-size: var(--fa-size-text); line-height: 1.35; color: var(--fa-on-green); text-wrap: balance; }
.fa-feature:not(:first-child) { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); aspect-ratio: 16 / 10; }
.fa-feature:not(:first-child) .fa-feature-media { aspect-ratio: auto; min-height: 100%; }
.fa-feature:not(:first-child) .fa-feature-cap { position: static; max-width: none; display: flex; flex-direction: column; justify-content: flex-end; }
/* v18: one left-aligned programme section on ivory; Roman's photo larger */
.fa-hero2 > .fa-hero2-bg { object-position: 50% 62%; }  /* real photo, Unsplash licence: unsplash.com/photos/5IV6_am62dg */
.fa-hero2::after { opacity: .72; background: var(--fa-green); }  /* the brand green, transparent, over the skyline */
#program { padding-top: clamp(48px, 5vw, 72px); }
.fa-program-h { margin: 0 0 clamp(24px, 2.6vw, 36px); max-width: 32ch; text-wrap: balance; }
.fa-program-h--next { margin-top: clamp(64px, 7vw, 112px); }
.fa-hk-next { padding-block: clamp(56px, 6vw, 96px); }
.fa-hk-next .fa-lead { margin-top: clamp(16px, 1.6vw, 24px); color: var(--fa-on-green); }
/* v22: design pass. Hero and the partner rail are centred; every other section starts on the same left edge. */
.fa-section-head .fa-h1 { max-width: 32ch; text-wrap: balance; }
.fa-section-head > .fa-lead { max-width: none; }
.fa-rail--brands { background: var(--fa-green-deep); }
.fa-hero2-body > .fa-display { max-width: 19ch; }
.fa-releases-note { text-align: left; }
.fa-faq-split { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(32px, 5vw, 88px); align-items: start; }
.fa-apply { padding-block: clamp(64px, 7vw, 112px); }
.fa-apply .fa-display { font-size: clamp(52px, 6vw, 88px); }
.fa-host { padding-block: clamp(40px, 4.4vw, 64px); }
.fa-host .fa-split { gap: clamp(32px, 5vw, 88px); }
/* v8: workshop cards with photos, "Beyond the stage" slider, sticky email bar */
#program { overflow-x: clip; }
/* v17: workshops in blocks of one large card and three smaller ones; descriptions open on hover, click or tap */
.fa-wgroup { margin: clamp(28px, 3vw, 44px) 0 clamp(14px, 1.4vw, 20px); font: 800 clamp(22px, 1.9vw, 28px)/1.1 var(--fa-sans); letter-spacing: -.03em; }
.fa-features--3 { grid-template-rows: repeat(3, auto); }
.fa-features--3 .fa-feature:first-child { grid-row: span 3; }
.fa-features--3 .fa-feature:first-child .fa-feature-name { font-size: clamp(30px, 3.2vw, 48px); }
.fa-features--3 .fa-feature:not(:first-child) { grid-template-columns: minmax(0, 4fr) minmax(0, 5fr); aspect-ratio: auto; min-height: clamp(190px, 16vw, 224px); }
.fa-features--3 .fa-feature:not(:first-child) .fa-feature-name { font-size: clamp(20px, 1.7vw, 25px); line-height: 1.05; }
.fa-features--3 .fa-feature:not(:first-child) .fa-feature-co { font-size: 16px; }
.fa-features--3 .fa-feature:not(:first-child) .fa-feature-talk { font-size: var(--fa-size-small); }
.fa-features--3 .fa-feature:not(:first-child) .fa-feature-cap { padding: 16px; }
/* v21: a calm plate (name, company, title). On hover the plate swaps those for fuller, larger bullets; the photo is never covered.
   Without hover (phones, tablets) the bullets simply sit in the plate under the title. */
.fa-feature-co { margin-top: 6px; font-weight: 500; }
.fa-feature-talk { margin-top: 10px; color: var(--fa-ivory); font-weight: 500; line-height: 1.35; letter-spacing: 0; }
.fa-feature-points { list-style: none; margin: 10px 0 0; padding: 0; color: var(--fa-on-green); font-size: var(--fa-size-small); line-height: 1.35; letter-spacing: 0; }
.fa-feature-points li { position: relative; padding-left: 14px; }
.fa-feature-points li + li { margin-top: 5px; }
.fa-feature-points .fa-echo { display: none; }
.fa-feature-points li::before { content: ""; position: absolute; left: 0; top: .5em; width: 6px; height: 6px; background: currentColor; }
@media (hover: hover) and (min-width: 721px) {
  .fa-feature .fa-feature-cap, .fa-feature:not(:first-child) .fa-feature-cap { display: grid; align-items: end; }
  .fa-feature-front, .fa-feature-points { grid-area: 1 / 1; transition: opacity .25s var(--fa-ease), visibility .25s; }
  .fa-feature-points { margin: 0; color: var(--fa-ivory); font-size: 18px; line-height: 1.3; opacity: 0; visibility: hidden; }
  .fa-feature:first-child .fa-feature-points { font-size: clamp(19px, 1.5vw, 21px); }
  .fa-feature-points .fa-echo { display: block; }
  .fa-feature-points li { padding-left: 17px; }
  .fa-feature-points li + li { margin-top: 8px; }
  .fa-feature-points li::before { width: 7px; height: 7px; }
  .fa-feature:hover .fa-feature-front { opacity: 0; }
  .fa-feature:hover .fa-feature-points { opacity: 1; visibility: visible; }
}
.fa-feature:first-child .fa-feature-cap { max-width: min(92%, 620px); }
.fa-feature:first-child .fa-feature-name { font-size: clamp(30px, 3.2vw, 48px); }
/* The plates now carry more text, so small cards grow with it instead of holding a fixed shape. */
.fa-feature:not(:first-child) { grid-template-columns: minmax(0, 4fr) minmax(0, 5fr); aspect-ratio: auto; min-height: clamp(200px, 17vw, 250px); }
.fa-nights { margin-top: clamp(16px, 2vw, 24px); }
.fa-nights .fa-carousel-head { margin-bottom: 0; }
.fa-nights-track { display: flex; gap: var(--fa-gap); }
.fa-nslide { flex: 0 0 auto; height: clamp(280px, 30vw, 460px); scroll-snap-align: start; overflow: hidden; background: var(--fa-sunken); }
.fa-nslide img { height: 100%; width: auto; max-width: none; display: block; }
.fa-stickybar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; background: var(--fa-green); color: var(--fa-ivory);
  padding: 12px 0 calc(12px + env(safe-area-inset-bottom, 0px)); box-shadow: 0 -8px 30px rgb(5 41 31 / 18%);
  transform: translateY(110%); visibility: hidden; transition: transform .35s var(--fa-ease), visibility 0s linear .35s; }
.fa-stickybar.is-on { transform: none; visibility: visible; transition: transform .35s var(--fa-ease); }
.fa-stickybar-in { display: flex; align-items: center; justify-content: space-between; gap: 16px 32px; }
.fa-stickybar-text { margin: 0; display: flex; flex-direction: column; gap: 2px; }
.fa-stickybar-text b { font: 800 clamp(17px, 1.3vw, 20px)/1.2 var(--fa-sans); letter-spacing: -.02em; }
.fa-stickybar-text span { color: var(--fa-on-green); font-size: var(--fa-size-small); }
.fa-stickybar-btn { flex: 0 0 auto; min-width: 200px; }
.fa-sticky { display: none !important; }
.fa-footer { padding-bottom: 96px; }
.fa-ws-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); column-gap: clamp(32px, 4vw, 64px); border-top: var(--fa-rule) solid var(--fa-green); }
.fa-ws { display: grid; grid-template-columns: clamp(44px, 4vw, 60px) minmax(0, 1fr); gap: 12px; align-items: baseline; padding-block: clamp(18px, 1.8vw, 24px); border-bottom: 1px solid var(--fa-line); min-width: 0; }
.fa-ws-n { font: 800 clamp(20px, 1.7vw, 26px)/1 var(--fa-sans); letter-spacing: -.03em; color: var(--fa-green); font-variant-numeric: tabular-nums; }
.fa-ws-talk { margin: 0; font: 800 clamp(19px, 1.6vw, 23px)/1.2 var(--fa-sans); letter-spacing: -.02em; }
.fa-ws-who { margin: 6px 0 0; color: var(--fa-soft); font-size: var(--fa-size-small); }
.fa-release-meter { height: 6px; margin-top: 20px; background: rgb(250 248 244 / 22%); }
.fa-release-meter i { display: block; height: 100%; background: var(--fa-on-green); }
.fa-release-taken { margin: 10px 0 0; font-size: var(--fa-size-small); color: var(--fa-on-green); }
.fa-release-taken .fa-draft { color: var(--fa-ink); }
/* v17: photo slider arrows sit on the photos, left and right, instead of above the slider */
.fa-nights-stage { position: relative; }
.fa-nights-btn { position: absolute; top: 50%; z-index: 2; transform: translateY(-50%); background: var(--fa-ivory); border-color: var(--fa-ivory); color: var(--fa-green); box-shadow: 0 6px 24px rgb(5 41 31 / 22%); transition: opacity .25s var(--fa-ease), background .25s var(--fa-ease), color .25s var(--fa-ease); }
.fa-nights-btn:hover { background: var(--fa-green); border-color: var(--fa-green); color: var(--fa-ivory); }
.fa-nights-btn:disabled { opacity: 0; pointer-events: none; }
.fa-nights-btn--prev { left: max(16px, calc((100vw - var(--fa-max, 1312px)) / 2 + 16px)); }
.fa-nights-btn--next { right: max(16px, calc((100vw - var(--fa-max, 1312px)) / 2 + 16px)); }
/* v10: guest videos */
.fa-tgrid { list-style: none; margin: 0 auto; padding: 0; max-width: 1040px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(32px, 3vw, 48px) var(--fa-gap); }
.fa-tcard { min-width: 0; }
.fa-tcard-media { position: relative; aspect-ratio: 1; overflow: hidden; background: var(--fa-green-deep); }
.fa-tcard-media video { display: block; width: 100%; height: 100%; object-fit: cover; }
.fa-tcard-media video::cue { font: 600 18px/1.3 var(--fa-sans); color: #FAF8F4; background: rgb(5 41 31 / 82%); }
.fa-tcard-play { position: absolute; inset: 0; width: 100%; border: 0; padding: 0; cursor: pointer; background: transparent; display: grid; place-items: center; }
.fa-tcard-play svg { width: clamp(64px, 6vw, 84px); height: clamp(64px, 6vw, 84px); padding: 18px; background: var(--fa-green); color: var(--fa-ivory); transition: transform .3s var(--fa-ease), background .3s var(--fa-ease); }
.fa-tcard-play:hover svg, .fa-tcard-play:focus-visible svg { transform: scale(1.08); background: var(--fa-green-deep); }
.fa-tcard-play:focus-visible { outline: 3px solid var(--fa-on-green); outline-offset: -3px; }
.fa-tcard-len { position: absolute; right: 0; bottom: 0; padding: 8px 12px; background: var(--fa-green); color: var(--fa-ivory); font: 800 16px/1 var(--fa-sans); font-variant-numeric: tabular-nums; pointer-events: none; }
.fa-tcard.is-playing .fa-tcard-play, .fa-tcard.is-playing .fa-tcard-len { display: none; }
.fa-tcard-quote { margin: clamp(18px, 1.8vw, 24px) 0 0; }
.fa-tcard-quote p { margin: 0; font: 800 clamp(22px, 1.9vw, 28px)/1.15 var(--fa-sans); letter-spacing: -.03em; text-wrap: balance; }
.fa-tcard-who { margin: 12px 0 0; color: var(--fa-soft); font-size: var(--fa-size-small); }
/* v16: Shenzhen trailer in the proof section */
.fa-film { margin: 0 0 clamp(40px, 4.4vw, 64px); }
.fa-film .fa-tcard-media { aspect-ratio: 16 / 9; }
.fa-film .fa-tcard-play { background: rgb(5 41 31 / 14%); }
.fa-film .fa-tcard-play svg { width: clamp(76px, 9vw, 128px); height: clamp(76px, 9vw, 128px); padding: clamp(16px, 1.8vw, 26px); background: var(--fa-ivory); color: var(--fa-green); box-shadow: 0 6px 24px rgb(5 41 31 / 22%); }
.fa-film .fa-tcard-play:hover svg, .fa-film .fa-tcard-play:focus-visible svg { background: var(--fa-green); color: var(--fa-ivory); }
/* v15: hero button instead of the email bar; the one application form on the closing plate (#apply) */
.fa-hero2-body > .fa-hero2-cta { margin-top: clamp(32px, 3.3vw, 48px); min-width: min(100%, 240px); }
.fa-hero2-note { margin: 16px 0 0; color: var(--fa-on-green); font-size: var(--fa-size-small); }
.fa-apply { text-align: left; }
.fa-apply-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 5vw, 96px); align-items: start; }
.fa-apply .fa-display { margin-inline: 0; }
.fa-apply-steps { margin: clamp(20px, 2vw, 28px) 0 0; max-width: 30ch; color: var(--fa-on-green); font-size: var(--fa-size-text); line-height: 1.45; }
.fa-apply-card { background: var(--fa-ivory); color: var(--fa-ink); padding: clamp(24px, 3.3vw, 48px); }
.fa-apply-card .fa-capture-done { padding: 0; }
.fa-apply-done:focus { outline: none; }
.fa-consent { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 14px; align-items: start; cursor: pointer; font-size: var(--fa-size-small); line-height: 1.45; }
.fa-consent input { appearance: none; -webkit-appearance: none; width: 24px; height: 24px; margin: 0; border: 2px solid var(--fa-green); background: var(--fa-card); cursor: pointer; }
.fa-consent input:checked { background: var(--fa-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3L12.5 5' fill='none' stroke='%23FAF8F4' stroke-width='2'/%3E%3C/svg%3E") center / 80% no-repeat; }
.fa-consent input:focus-visible { outline: 3px solid var(--fa-green); outline-offset: 2px; }
.fa-apply-msg { margin: 0; color: var(--fa-danger); font-weight: 800; font-size: var(--fa-size-small); }
.fa-apply-msg:empty { display: none; }

@media (max-width: 1100px) {
  .fa-apply-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .fa-tgrid { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 82%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 8px; }
  .fa-tgrid::-webkit-scrollbar { display: none; }
  .fa-tcard { scroll-snap-align: start; }
  .fa-nslide { height: 300px; }
  .fa-nslide img { max-width: 86vw; object-fit: cover; }
  .fa-stickybar-text { display: none; }
  .fa-stickybar-btn { flex: 1 1 auto; min-height: 48px; }
  .fa-apply-grid { grid-template-columns: minmax(0, 1fr); }
  .fa-faq-split { grid-template-columns: minmax(0, 1fr); }
  .fa-apply-card { padding: 24px 20px; }
  .fa-features { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
  .fa-feature:first-child { grid-row: auto; }
  .fa-feature .fa-feature-media, .fa-feature:first-child .fa-feature-media { aspect-ratio: 4 / 3; height: auto; min-height: 0; }
  .fa-feature-cap { position: static; max-width: none; }
  .fa-feature:first-child .fa-feature-cap { max-width: none; }
  .fa-feature:not(:first-child) { display: block; aspect-ratio: auto; min-height: 0; }
  .fa-feature:not(:first-child) .fa-feature-media { aspect-ratio: 4 / 3; height: auto; min-height: 0; }
  .fa-features--3 .fa-feature:not(:first-child) { display: grid; grid-template-columns: 34% minmax(0, 1fr); min-height: 0; }
  .fa-features--3 .fa-feature:not(:first-child) .fa-feature-media { height: auto; aspect-ratio: auto; min-height: 100%; }
  .fa-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; grid-auto-rows: 160px; }
  .fa-gallery figure:first-child { grid-column: span 2; grid-row: span 2; }
  .fa-session-detail { padding-left: 18px; }
}
/* ==== end HK27 additions ==== */
