/* ============================================================
   THE UPGRADE — Typography tokens
   Display/headlines: Bricolage Grotesque (brand specimen face;
     stands in for commercial "PP Neue Montreal")
   Body / UI: Inter   ·   Signature: Caveat
   Scale mirrors the brand spec: Display/H1 · Headline/H2 ·
   Subhead/H3 · Lead · Body · Eyebrow.
   ============================================================ */

:root {
  /* ---- Families ---- */
  --font-display:   "Bricolage Grotesque", "PP Neue Montreal", "Inter", system-ui, sans-serif;
  --font-heading:   "Bricolage Grotesque", "PP Neue Montreal", "Inter", system-ui, sans-serif;
  --font-body:      "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-signature: "Caveat", "Segoe Script", cursive;
  --font-mono:      ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* ---- Weights ---- */
  --fw-regular:  400; /* @kind other */
  --fw-medium:   500; /* @kind other */
  --fw-semibold: 600; /* @kind other */
  --fw-bold:     700; /* @kind other */
  --fw-extra:    800; /* @kind other */

  /* ---- Fluid type scale (clamp: mobile to desktop) ---- */
  --fs-display:  clamp(3rem, 1.4rem + 5.6vw, 5.5rem); /* @kind other */
  --fs-h1:       clamp(2.5rem, 1.5rem + 3.4vw, 4rem); /* @kind other */
  --fs-h2:       clamp(2rem, 1.4rem + 2.1vw, 3rem); /* @kind other */
  --fs-h3:       clamp(1.5rem, 1.2rem + 1vw, 1.875rem); /* @kind other */
  --fs-lead:     clamp(1.125rem, 1rem + 0.5vw, 1.375rem); /* @kind other */
  --fs-body-lg:  1.125rem; /* @kind other */
  --fs-body:     1rem; /* @kind other */
  --fs-body-sm:  0.9375rem; /* @kind other */
  --fs-caption:  0.8125rem; /* @kind other */
  --fs-eyebrow:  0.8125rem; /* @kind other */

  /* ---- Line heights ---- */
  --lh-tight:    1.02; /* @kind other */
  --lh-snug:     1.12; /* @kind other */
  --lh-heading:  1.18; /* @kind other */
  --lh-body:     1.6; /* @kind other */
  --lh-relaxed:  1.7; /* @kind other */

  /* ---- Letter spacing ---- */
  --ls-display:  -0.03em; /* @kind other */
  --ls-heading:  -0.02em; /* @kind other */
  --ls-body:     0em; /* @kind other */
  --ls-eyebrow:  0.18em; /* @kind other */
}
