/* ============================================================================
   tokens.css — the SHARED structural design system (oomny website design system)
   Copied verbatim into every site; re-skinned per app by theme.css. Keep this
   file identical across template + all app sites (sync-check.sh enforces it).

   CONSTRAINT (brand axiom A3): SYSTEM FONTS ONLY — no webfonts anywhere.
   The visual craft comes from layout, a modular type scale, spacing rhythm,
   dark mode, device framing and motion — never from a downloaded font.

   This file defines only structure (scales, spacing, radii, easing, leading,
   elevation geometry, the accent-text / chip-bg / rot token contract).
   All COLOUR lives in theme.css.

   2026-06 refinement pass (see ENHANCEMENT-SPEC.md / TOKEN-DIFF.md):
     · type scale re-tuned to a steadier ~1.25 modular ratio; body bumped to
       17→19px for the older/non-technical audience (legibility floor).
     · spacing ramp made more generous at the section end + a new --sp-0 hair gap.
     · leading tokens (--lh-*) extracted so type rhythm is tunable in one place.
     · radii tokenised: --radius-lg derives from --radius so a brand's squareness
       (Kestrove → 12px) now cascades to cards/pricing that used to hardcode 24px;
       --radius-pill replaces magic 99px.
     · motion tokens (--dur-*, --ease-out) extracted for one-place motion control.
     · achromatic ELEVATION scale (--shadow-1..3) unifies the ad-hoc shadows.
       NOTE: these are neutral/black depth, not brand colour — kept structural in
       the spirit of C4 (no *palette* colour here). To go strictly pure, move the
       rgb to a theme --shadow-rgb token; left structural for simplicity.
   ============================================================================ */

:root {
  /* fluid modular type scale (clamp = no media-query breakpoints needed).
     Steadier ~1.25 ratio; --step-0 body raised to 17→19px for legibility. */
  --step--1: clamp(.84rem, .81rem + .14vw, .94rem);
  --step-0:  clamp(1.0625rem, 1.02rem + .2vw, 1.1875rem);
  --step-1:  clamp(1.27rem, 1.18rem + .42vw, 1.5rem);
  --step-2:  clamp(1.6rem, 1.4rem + .95vw, 2.1rem);
  --step-3:  clamp(2.1rem, 1.72rem + 1.85vw, 3.05rem);
  --step-4:  clamp(2.7rem, 2.06rem + 3.05vw, 4.55rem);

  /* leading (line-height) — extracted so vertical rhythm tunes in one place */
  --lh-tight: 1.07;          /* display headings */
  --lh-snug:  1.32;          /* large leads / manifesto */
  --lh-body:  1.62;          /* body copy (older-reader comfortable) */

  /* spacing ramp + reading measure */
  --sp-0: .25rem;            /* NEW — hairline gaps (chip rows, inline marks) */
  --sp-1: .5rem; --sp-2: 1rem; --sp-3: 1.5rem; --sp-4: 2.75rem; --sp-5: 4.5rem; --sp-6: 7rem;
  --measure: 34rem;          /* ~66ch body reading width (tuned for older audiences) */
  --measure-wide: 46rem;     /* NEW — section heads / leads that want more room */

  /* radii — --radius-lg derives from --radius so brand squareness cascades */
  --radius: 18px; --radius-sm: 12px;
  --radius-lg: calc(var(--radius) + 6px);   /* cards / pricing (was hardcoded 24px) */
  --radius-pill: 999px;                      /* buttons / badges (was magic 99px)   */

  /* motion */
  --ease: cubic-bezier(.16,.84,.44,1);       /* signature ease-out */
  --ease-out: cubic-bezier(.22,.61,.36,1);   /* gentler, for hovers */
  --dur-1: .15s;             /* micro: hover, focus      */
  --dur-2: .3s;              /* theme/colour transitions */
  --dur-3: .7s;              /* entrance reveals         */
  --rot: .6deg;              /* device tilt — calm, not jaunty (review §2.6) */

  /* achromatic elevation (neutral depth, not brand colour — see header note) */
  --shadow-1: 0 1px 2px -1px rgba(0,0,0,.12), 0 2px 6px -3px rgba(0,0,0,.10);
  --shadow-2: 0 6px 16px -10px rgba(0,0,0,.30), 0 2px 6px -4px rgba(0,0,0,.18);
  --shadow-3: 0 30px 70px -40px rgba(0,0,0,.55), 0 8px 22px -14px rgba(0,0,0,.30);

  /* system font stacks (no webfonts — axiom A3) */
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, Roboto, Helvetica, Arial, sans-serif;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
  --rounded: ui-rounded, "SF Pro Rounded", -apple-system, system-ui, sans-serif; /* big reassurance numbers (Kestrove total, Tallybook timer) */
  --mono: ui-monospace, "SF Mono", "SFMono-Regular", Menlo, Consolas, monospace;  /* tabular numerics / code */

  /* token contract the brands inherit unless they override (review §5):
     --accent-text : accent tuned for AA on small text/links (defaults to --accent)
     --chip-bg     : floating-chip surface (lightened per dark theme)
     --display     : heading font (sans by default; Aida overrides to serif)
     --display-tracking : heading letter-spacing (sans wants tighter; serif ~0) */
  --accent-text: var(--accent);
  --chip-bg: var(--surface);
  --display: var(--sans);
  --display-tracking: -.018em;
}
