/* ==========================================================================
   Brand typography — the one place fonts are set, for every page.

   The brand guide's two typefaces, in three roles:

     --font-display  headings and titles          Lato
     --font-body     paragraphs, nav, buttons     Lato
     --font-label    small uppercase headers      Archivo
                     (the kickers above section titles, the section pill,
                     footer column headings, card and category labels)

   Every stylesheet — site.css, outro.css, menu.css — and the homepage read
   these tokens and name no font of their own, so changing a role here changes
   it everywhere. The font files are loaded by typeAssetsHtml() in
   src/lib/chrome.ts, next to the link to this file.

   Headings use each font's default letter-spacing. The tight negative tracking
   the site had was tuned for Sora, a much wider face, and crowded Lato.
   ========================================================================== */

:root{
  --font-display:"Lato",system-ui,sans-serif;
  --font-body:"Lato",system-ui,sans-serif;
  --font-label:"Archivo",system-ui,sans-serif;
  /* Type scale (Website Sync, 7 Oct 2026: Daniel wants the bold, direct type
     of Adrian's mockup on every page). Sizes only, no font names. The
     homepage (src/home/minimal.html) repeats these values in its :root. */
  --t-hero:clamp(46px,6.6vw,104px);     /* homepage hero */
  --t-hero-site:clamp(40px,6.8vw,100px);/* microsite and page heroes: kept above --t-h2 */
  --t-h2:clamp(34px,6.2vw,96px);        /* section headings */
  --t-h3:clamp(22px,1.9vw,26px);        /* card titles */
  --t-h4:clamp(19px,1.5vw,21px);        /* step and question titles */
  --t-lead:clamp(19px,1.6vw,22px);      /* lead paragraphs */
  --t-body:17px;                        /* body copy, card text */
  --t-label:13px;                       /* small uppercase labels */
}
