/* =====================================================================
   type.css  ·  the type ramp
   ---------------------------------------------------------------------
   Single source of truth for every type size on the site. Loaded first on
   all five pages, before each page's own styles, so every font-size
   declaration can reference a token instead of inventing a value.

   WHY THIS EXISTS
   Before July 22, 2026 the site carried roughly thirty-eight distinct type
   sizes across five pages: six values inside a 2.5px band all doing the
   same job, 24px appearing as the max of three different clamps, and no
   step at all between 18px body and 38px display. The spacing scale
   (--sp-*) was rigorous and the type never joined it.

   THE SYSTEM
   Eight steps on the same 4px unit as --sp-*, so one unit governs space
   and type. One deliberate exception: --t-data sits at 14px rather than
   12px. Uppercase set with 0.18em tracking reads optically larger than the
   same pixel size set lowercase, so lowercase data gets 2px back to sit
   level with the labels beside it. That is optical correction, not drift.

   RULES
   - Never write a bare px value for font-size. Reference a token.
   - If a new size seems necessary, the ramp is wrong. Fix the ramp.
   - Body prose fills its grid well rather than carrying a ch cap. The
     measure falls out of the type size: at 20px in a six-column well that
     is about 57 characters per line.
   - The 52px vertical pitch is honoured at the block level via --sp-52 and
     --sp-104, not at the line level. Baseline grids break on the web the
     moment an image or a nested list appears.
   ===================================================================== */

:root {
  --t-micro:   12px;                                /* uppercase labels, tracked: nav, eyebrows, captions, footline */
  --t-data:    14px;                                /* lowercase data: years, URLs */
  --t-small:   16px;                                /* list descriptions, receipts */
  --t-body:    clamp(17px, 0.5vw + 15px, 20px);     /* running prose */
  --t-lede:    clamp(20px, 0.8vw + 16px, 24px);     /* intros, small headings */
  --t-sub:     clamp(24px, 1.2vw + 16px, 32px);     /* key lines, pull quotes, list headings */
  --t-head:    clamp(30px, 2.2vw + 12px, 44px);     /* section headlines */
  --t-display: clamp(44px, 5vw + 8px, 76px);        /* page headlines */

  /* Leading. Tighter as the type grows, which is why these are separate
     tokens rather than one ratio applied everywhere. */
  --lh-tight:  1.06;    /* display */
  --lh-head:   1.12;    /* headlines, key lines */
  --lh-lede:   1.35;    /* ledes */
  --lh-body:   1.55;    /* prose, lists */
}
