/* ============================================================
   SOUTH ZONE — TYPOGRAPHY TOKENS
   ============================================================ */

:root {
  /* ---- Families ---- */
  --font-display: "Archivo Black", "Arial Black", system-ui, sans-serif;
  --font-body:    "Montserrat", system-ui, -apple-system, sans-serif;
  --font-script:  "Caveat", "Segoe Script", cursive;

  /* ---- Weights (Montserrat) ---- */
  --fw-regular:   400; /* @kind font */
  --fw-medium:    500; /* @kind font */ /* default UI / sub-headings */
  --fw-semibold:  600; /* @kind font */ /* body emphasis, dish names, info lines */
  --fw-bold:      700; /* @kind font */
  --fw-black:     800; /* @kind font */

  /* ---- Type scale (px) ---- */
  --fs-h1:        64px;  /* Archivo Black 48–72 */
  --fs-h2:        40px;  /* Archivo Black 32–48 */
  --fs-h3:        24px;  /* Montserrat 600, 22–28 */
  --fs-body-lg:   18px;
  --fs-body:      16px;  /* Montserrat 500, line-height 1.6 */
  --fs-caption:   14px;
  --fs-micro:     12px;
  --fs-kicker:    20px;  /* Caveat 700, 16–20 */

  /* ---- Line heights ---- */
  --lh-tight:     1.02; /* @kind other */ /* display headlines */
  --lh-snug:      1.2;  /* @kind other */
  --lh-body:      1.6;  /* @kind other */

  /* ---- Tracking ---- */
  --ls-display:   0.01em; /* @kind other */
  --ls-label:     0.08em; /* @kind other */ /* wide tracking for short caps labels */
  --ls-body:      0;      /* @kind other */

  /* ============================================================
     SEMANTIC TEXT ROLES
     ============================================================ */
  --text-h1:      var(--fw-regular) var(--fs-h1)/var(--lh-tight) var(--font-display);
  --text-h2:      var(--fw-regular) var(--fs-h2)/var(--lh-tight) var(--font-display);
  --text-h3:      var(--fw-semibold) var(--fs-h3)/var(--lh-snug) var(--font-body);
  --text-body:    var(--fw-medium) var(--fs-body)/var(--lh-body) var(--font-body);
  --text-emph:    var(--fw-semibold) var(--fs-body)/var(--lh-body) var(--font-body);
  --text-label:   var(--fw-semibold) var(--fs-caption)/1.2 var(--font-body);
  --text-kicker:  var(--fw-bold) var(--fs-kicker)/1 var(--font-script);
}
