/* ============================================================
   Brand guide type scale — local to this project.
   NOT imported from the website token set — the brand guide
   uses its own scale (per Oliver). Values mirror Figma frames
   as absolute px; the 16:9 canvas scales them uniformly.
   Populated per-frame during Phase B.
   ============================================================ */

:root {
  /* Font families */
  --ff-display: "Clash Grotesk Variable", "Clash Grotesk", system-ui, sans-serif;
  --ff-body:    "Clash Grotesk Variable", "Clash Grotesk", system-ui, sans-serif;

  /* Weights */
  --fw-light:    300;
  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  /* Sizes (absolute px to match Figma) */
  --fs-display-1:     125px;  /* Slide 01 title */
  --fs-section-head:  100px;  /* section intro headline (Slide 03 etc.) */
  --fs-summary-item:  87px;   /* Slide 02 numbered list */
  --fs-slide-head:    70px;   /* content-slide heading (Slide 05 etc.) */
  --fs-slide-label:   31px;   /* small top-left slide label */
  --fs-body:          23px;   /* long-form body copy */
  --fs-footer:        20px;   /* repeating footer text */
  --fs-caption:       16px;   /* color-block hex + tagline, small UI captions */
  --fs-swatch-name:   18px;   /* extended-palette swatch name + "Spectrum" label */
  --fs-swatch-meta:   15px;   /* extended-palette category + hex (uppercase) */
  --fs-card-head:     29px;   /* role-card / info-card titles */
  --fs-tick:          12px;   /* numeric axis tick labels (Slide 13 shades) */
  --fs-weight-tick:   13px;   /* weight-number labels beside Slide 16 weights */
  --fs-aa-glyph:      360px;  /* Slide 16 large "Aa" typeface sample */

  /* Line heights */
  --lh-none:  1;
  --lh-tight: 1.1;
  --lh-body:  1.5;
}
