/* ============================================================
   CRUST News — TYPOGRAPHY TOKENS
   Three voices:
   - DISPLAY  (Anton)          condensed, all-caps, tight. Impact.
   - HEAD     (Libre Franklin) Franklin-Gothic grotesque. Article titles, UI.
   - MONO     (Spline Sans Mono) datelines, tags, data labels.
   ============================================================ */

:root {
  /* ---- Families ---- */
  --font-display: 'Anton', 'Oswald', 'Helvetica Neue', Impact, sans-serif;
  --font-head:    'Libre Franklin', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-body:    'Libre Franklin', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-mono:    'Spline Sans Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  /* ---- Weights (Libre Franklin axis) ---- */
  --fw-light:     300; /* @kind font */
  --fw-regular:   400; /* @kind font */
  --fw-medium:    500; /* @kind font */
  --fw-semibold:  600; /* @kind font */
  --fw-bold:      700; /* @kind font */
  --fw-extrabold: 800; /* @kind font */
  --fw-black:     900; /* @kind font */

  /* ---- Fluid display sizes (Anton, all-caps) ---- */
  --display-hero: clamp(3.5rem, 8.5vw, 7.5rem);  /* @kind font */
  --display-1:    clamp(2.75rem, 6vw, 5rem);     /* @kind font */
  --display-2:    clamp(2.25rem, 4.5vw, 3.5rem); /* @kind font */
  --display-3:    clamp(1.75rem, 3vw, 2.5rem);   /* @kind font */

  /* ---- Headline sizes (Libre Franklin, bold grotesque) ---- */
  --head-1:  2.5rem;     /* @kind font */
  --head-2:  2rem;       /* @kind font */
  --head-3:  1.5rem;     /* @kind font */
  --head-4:  1.25rem;    /* @kind font */
  --head-5:  1.0625rem;  /* @kind font */

  /* ---- Body sizes ---- */
  --body-lg:   1.25rem;    /* @kind font */
  --body-md:   1.0625rem;  /* @kind font */
  --body-sm:   0.9375rem;  /* @kind font */
  --body-xs:   0.8125rem;  /* @kind font */

  /* ---- Meta / mono ---- */
  --meta:      0.8125rem;  /* @kind font */
  --kicker-sz: 0.75rem;    /* @kind font */
  --micro:     0.6875rem;  /* @kind font */

  /* ---- Line heights ---- */
  --lh-display: 0.92; /* @kind other */
  --lh-tight:   1.04; /* @kind other */
  --lh-snug:    1.18; /* @kind other */
  --lh-head:    1.12; /* @kind other */
  --lh-body:    1.6;  /* @kind other */
  --lh-relaxed: 1.72; /* @kind other */

  /* ---- Tracking ---- */
  --track-display:  -0.01em; /* @kind other */
  --track-head:     -0.02em; /* @kind other */
  --track-normal:    0em;    /* @kind other */
  --track-kicker:    0.14em; /* @kind other */
  --track-mono:      0.02em; /* @kind other */
}

/* ---- Reusable type primitives (optional helpers) ---- */
.cn-kicker {
  font-family: var(--font-head);
  font-weight: var(--fw-bold);
  font-size: var(--kicker-sz);
  letter-spacing: var(--track-kicker);
  text-transform: uppercase;
  color: var(--kicker);
  line-height: 1;
}
.cn-dateline {
  font-family: var(--font-mono);
  font-size: var(--meta);
  letter-spacing: var(--track-mono);
  color: var(--text-subtle);
  text-transform: uppercase;
}
.cn-display {
  font-family: var(--font-display);
  font-weight: 400;            /* Anton ships at one weight */
  text-transform: uppercase;
  line-height: var(--lh-display);
  letter-spacing: var(--track-display);
}