/* ganfamily.life — design tokens.
   Change a typeface or a colour HERE and it changes everywhere.
   Contrast ratios below were computed with the WCAG 2.1 formula and are
   recorded so nobody re-introduces an unreadable pairing by accident. */

:root {
  /* Typefaces — swap these two lines to change the whole site */
  --font-display: "League Spartan", "Century Gothic", "Avant Garde", Futura, sans-serif;
  --font-body: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-thai-display: "Noto Sans Thai", var(--font-display);
  --font-thai-body: "Noto Sans Thai", var(--font-body);

  /* Colour — dark theme, chosen by Gerry 2026-09-12.
     Four warm surfaces forming a ladder. Sections are told apart by DEPTH, not
     by boxes, which is what made the old design look pasted on.
     Steps measured in perceptual lightness (CIE L*), not WCAG ratio — the WCAG
     formula compresses near black and wrongly calls these steps invisible:
       band  L* 3.5  ->  page L* 11.7  ->  card L* 20.4  ->  hairline L* 29.5
     Each step is 8-9 L*, comfortably above the ~4 where a step becomes visible. */
  --band:      #100C08;  /* deepest — the Beyond Success band */
  --ground:    #241E17;  /* the page itself */
  --raised:    #383026;  /* cards and panels sitting on the page */
  --rule:      #4E4437;  /* hairlines */

  --heading:   #FAF5EC;  /* 15.2:1 on ground */
  --body:      #D3C9B6;  /* 10.1:1 on ground */
  --muted:     #B3A895;  /*  7.0:1 on ground */
  --gold:      #E6B357;  /*  8.6:1 on ground — on dark, gold IS safe as text */

  /* On this dark ground gold reads at 8.6:1, so the old rule banning gold text
     is lifted here. The one rule that still holds: never white text on gold
     (1.92:1). A gold button carries near-black text at 7.8:1. */
  --on-gold:   #2A2622;

  /* The inside of a box people type into. A fixed dark overlay was used here,
     which turned muddy grey the moment a light theme was applied to a form. */
  --field-bg:  rgba(0,0,0,.28);
  --field-soft: rgba(0,0,0,.18);

  /* Type scale, 1.25 from 16px */
  --t-xs: 0.8125rem; --t-s: 0.875rem;  --t-base: 1rem;
  --t-m: 1.25rem;    --t-l: 1.5625rem; --t-xl: 1.953rem;
  --t-2xl: 2.441rem; --t-3xl: 3.052rem; --t-4xl: 3.815rem;

  /* Spacing, 4px grid */
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px; --s5: 24px;
  --s6: 32px; --s7: 48px; --s8: 64px; --s9: 96px; --s10: 128px;

  --measure: 62ch;
  --page: 1180px;
}