/* tokens.css — the design brief, compiled.
   Auto Evolution, North Logan UT. Source: brief.md v2 (approved 2026-08-20)
   §3.3 tokens, §2 fonts, §8 motion. Every value below is the brief's.
   This file is the only place raw values live (house-tech-spec §3). */

:root {

  /* Colour — brief §3.3 */

  --scheme: light;                    /* one deliberate mode, per design-rules §6 */

  /* ground + ink */
  --color-bg:               #f5f0ee;  /* chalk */
  --color-surface:          #ffffff;  /* editorial paper — review card, trust panel */
  --color-ink:              #241520;
  --color-ink-muted:        #5b4655;

  /* accent */
  --color-accent:           #5e2748;  /* aubergine — hue 324°, L* 24.6 */
  --color-accent-ink:       #f5f0ee;

  /* the one dark band + the hero field */
  --color-band:             #3a1a2c;
  --color-band-ink:         #f5f0ee;
  --color-band-ink-muted:   #d6c3ce;
  --color-field-top:        #4a2138;
  --color-field-bottom:     #26101c;

  /* clay — NON-TEXT ONLY on light grounds. Brief §4 hard rule F11: 1.58:1 on
     --color-bg. Legal as the wash, as field ornament, and as the band's
     numerals and focus ring, where it measures 8.63:1 (F10). */
  --color-clay:             #e8b98c;

  /* hero page-ground atmosphere (brief §5) */
  --color-atmos-warm:       #f0dfd2;

  /* lines + focus */
  --color-border:           #ded4d8;  /* decorative hairlines only — 1.28:1, N5 */
  --color-focus:            #5e2748;

  /* Dark-band-safe ring (brief §4 N3/N4): --color-focus is 1.36:1 on the
     band and fails 1.4.11; clay is 8.63:1 there, 6.99:1 at the radial's
     lightest. Scoped to the band in site.css, never global. */
  --color-focus-on-band:    #e8b98c;

  /* Selection: the accent pair the brief already sets (F7, 9.99:1). */
  --color-selection-bg:     var(--color-accent);
  --color-selection-ink:    var(--color-accent-ink);

  /* Composited layers — here because site.css may carry no literal. Every
     ratio is in brief §4.2. */
  --color-band-glow:        rgb(94 39 72 / 0.7);    /* band radial centre, G-B */
  --color-band-glow-out:    rgb(58 26 44 / 0);      /* band radial edge, G-B */
  --color-band-line:        rgb(214 195 206 / 0.45);/* the band's hairline, brief §5.1 */
  --color-field-glow:       rgb(232 185 140 / 0.25);/* clay heat glow inside the field */
  --color-field-ornament:   rgb(232 185 140 / 0.55);/* satellites + ticks, aria-hidden */
  --color-field-mote:       rgb(232 185 140 / 0.3);

  /* Typography — brief §2 */

  --font-display:  'Bricolage Grotesque', 'Bricolage Fallback', 'Helvetica Neue', Arial, sans-serif;
  --font-body:     'Bricolage Grotesque', 'Bricolage Fallback', 'Helvetica Neue', Arial, sans-serif;
  --font-emphasis: 'Source Serif 4', 'Source Serif Fallback', 'Iowan Old Style', Georgia, serif;

  --font-weight-body:        400;
  --font-weight-body-strong: 600;
  --font-weight-display:     500;

  /* Optical size per role (brief §2): h1 76, h2 40, h3 24, body 14. */
  --opsz-hero: 76;
  --opsz-h2:   40;
  --opsz-h3:   24;
  --opsz-body: 14;

  /* Type scale — brief §3.3 */
  --text-hero:    clamp(2.75rem, 8.5vw, 4.75rem);   /* hero, <64rem */
  --text-hero-split: clamp(3rem, 7.4vw - 1rem, 4.75rem); /* hero, >=64rem */
  --text-h2:      clamp(1.75rem, 5vw, 2.75rem);
  --text-quote:   clamp(1.25rem, 3.6vw, 2.75rem);   /* §V pull-quote */
  --text-h3:      clamp(1.125rem, 2.6vw, 1.4rem);
  --text-lead:    clamp(1.0625rem, 2.2vw, 1.25rem);
  --text-body:    clamp(1rem, 1.4vw, 1.0625rem);
  --text-small:   0.9375rem;
  --text-eyebrow: 0.75rem;

  /* marked lead row, brief §6 §II */
  --text-index-lead: clamp(1.4rem, 4vw, 1.9rem);

  --leading-tight: 0.94;
  --leading-snug:  1.16;
  --leading-body:  1.58;

  --tracking-tight:  -0.035em;
  --tracking-normal:  0em;
  --tracking-wide:    0.18em;

  /* wordmark, brief §6 §I */
  --tracking-wordmark: -0.02em;

  /* Space — brief §3.3 */

  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2.5rem;
  --space-xl:  4rem;
  --space-2xl: 6rem;
  --space-3xl: 9rem;

  /* Layout — brief §3.3, §5 */

  --layout-container: 74rem;
  --layout-measure:   60ch;
  --layout-gutter:    clamp(1.125rem, 4.5vw, 2.5rem);
  --layout-tap-min:   44px;

  /* Structural sizes the brief fixes */
  --bar-height:        3.5rem;   /* 56px sticky bar, brief §6 §I */
  --rule-tick:         0.75rem;  /* 12px tick height, brief §8 signature move */
  --panel-media-col:   26rem;    /* §III media column */
  --index-numeral-col: 1.5rem;   /* §II item column, every width — §5.2a */
  --hero-columns-lg:   1fr 1.05fr;
  --section-gap:       var(--space-xl);  /* inter-section rhythm, brief §5.7 */

  /* hero-field ornament, brief §8 */
  --ornament-dot:   0.4375rem;
  --ornament-ring:  2.5rem;
  --ornament-mote:  0.1875rem;
  --field-numeral:  clamp(2.5rem, 9vw, 4rem);

  /* Radius / border — brief §3.3, §5.6 */

  --radius-none: 0;
  --radius-sm:   2px;
  --radius-pill: 999px;          /* hero satellite dots and the mote only (site.css:384, :422) — no pill buttons ship */

  --border-hairline: 1px;
  --border-thick:    2px;
  --border-style:    solid;

  /* No --shadow-* group by design (brief §3.3): nothing casts a drop shadow.
     Separation is hairlines and 2px rules. */

  /* Motion — brief §3.3, §8 */

  --duration-base: 300ms;
  --duration-slow: 620ms;

  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  --reveal-shift:   1rem;
  --reveal-stagger: 60ms;
  --tick-stagger:   90ms;

  /* six non-synchronised hero loops, brief §8 */
  --orbit-subject: 11s;
  --orbit-sat-1:   15s;
  --orbit-sat-2:   18s;
  --orbit-sat-3:   23s;
  --orbit-tick:    28s;
  --orbit-mote:    37s;

  /* Loop travel — each loop oscillates around its rest position, so
     stopping it leaves the composed frame (brief §8). */
  --drift-sm: 0.375rem;
  --drift-md: 0.75rem;

  /* Z layers */
  --z-base: 0;
  --z-header: 100;
  --z-skip-link: 300;
}

/* Brief §8: the motion tokens collapse at their source. base.css collapses
   the durations and --reveal-shift; these are this site's own. The
   `animation: none` half is in site.css, at matching specificity so no
   !important is needed (house-tech-spec §12). */
@media (prefers-reduced-motion: reduce) {
  :root {
    --tick-stagger: 0ms;
    --drift-sm: 0;
    --drift-md: 0;
  }
}

/* @font-face — two families, two files (brief §2). Both SIL OFL 1.1;
   assets/fonts/OFL.txt carries the notices. Subset to the HOUSE declared
   safe range (house-tech-spec §8; measurement in brief §2). No CDN.

   Metrics-matched fallbacks first, so the swap costs no CLS (spec §8).
   size-adjust is measured in Chromium; overrides are the real face's
   hhea metrics divided by it. */

@font-face {
  font-family: 'Bricolage Fallback';
  src: local('Arial');
  size-adjust: 94.30%;        /* measured: Bricolage 2165px vs Arial 2295.95px */
  ascent-override: 98.62%;    /* 930/1000 ÷ 0.9430 */
  descent-override: 28.63%;   /* 270/1000 ÷ 0.9430 */
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Source Serif Fallback';
  src: local('Georgia');
  font-style: italic;
  size-adjust: 94.64%;        /* measured against the rendering serif — see README */
  ascent-override: 109.47%;   /* 1036/1000 ÷ 0.9464 */
  descent-override: 35.40%;   /* 335/1000 ÷ 0.9464 */
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Bricolage Grotesque';
  src: url('../assets/fonts/bricolage-grotesque-latin-var.woff2') format('woff2');
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
  unicode-range: U+20-7E, U+A0, U+A9, U+AE, U+B0, U+B7, U+BF, U+C0-FF, U+2010-2015, U+2018-201A, U+201C-201E, U+2026, U+2032-2033, U+2122;
}

@font-face {
  font-family: 'Source Serif 4';
  src: url('../assets/fonts/source-serif-4-italic-latin-var.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  unicode-range: U+20-7E, U+A0, U+A9, U+AE, U+B0, U+B7, U+BF, U+C0-FF, U+2010-2015, U+2018-201A, U+201C-201E, U+2026, U+2032-2033, U+2122;
}
