/* Align Sales Group — Typography Tokens
   --------------------------------------------------------------
   Three roles:
     Display  (Big Shoulders Display Bold) — big, ALL-CAPS condensed
                         poster headlines. Tight, punchy.
     Heading  (Figtree) — section titles, card titles, eyebrows, labels,
                         buttons. Humanist geometric sans; uppercase +
                         tracked for eyebrows/labels, sentence case for
                         card titles.
     Body     (Roboto) — paragraphs, UI, captions. Sentence case.
     Logo     (Klutch) — the ALIGN wordmark ONLY. Never set live text. */

:root {
  --font-display: 'Big Shoulders ASG', 'Big Shoulders Display', 'Arial Narrow', sans-serif;
  --font-heading: 'Figtree', system-ui, sans-serif;
  --font-body:    'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-logo:    'Klutch', 'Figtree', system-ui, sans-serif; /* wordmark only */

  /* ---- Type scale (rem; 1rem = 16px) ---- */
  --fs-display-2xl: 5.25rem;  /* 84 — hero poster */
  --fs-display-xl:  4rem;     /* 64 */
  --fs-display-lg:  3rem;     /* 48 */
  --fs-h1:          2.5rem;   /* 40 */
  --fs-h2:          2rem;     /* 32 */
  --fs-h3:          1.5rem;   /* 24 */
  --fs-h4:          1.25rem;  /* 20 */
  --fs-eyebrow:     0.8125rem;/* 13 — uppercase Figtree label */
  --fs-lg:          1.125rem; /* 18 — lead paragraph */
  --fs-body:        1rem;     /* 16 */
  --fs-sm:          0.875rem; /* 14 */
  --fs-xs:          0.75rem;  /* 12 */

  /* ---- Line heights ---- */
  --lh-tight:   1.02;  /* @kind other */
  --lh-snug:    1.12;  /* @kind other */
  --lh-normal:  1.5;   /* @kind other */
  --lh-relaxed: 1.65;  /* @kind other */

  /* ---- 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 */

  /* ---- Tracking ---- */
  --tracking-display: -0.01em;
  --tracking-eyebrow: 0.18em;   /* wide for Figtree caps eyebrows */
  --tracking-heading: 0.01em;
  --tracking-body:    0;
}
