/* ============================================================
   CRATER — Typography tokens
   Display = Bebas Expanded · Headline = Bebas condensed
   Body/UI = Nexa · Alt = Typogotika
   ============================================================ */
:root {
  /* ---- Families ----
     Titles  → Bebas Neue Pro (Bold, condensed)        — --font-display / --font-headline
     Body/UI → Nexa                                     — --font-body
     Wordmark→ Bebas Neue Pro Expanded (matches the     — --font-logo
               real CRATER artwork)
     Accent  → Typogotika (high-contrast serif, for     — --font-editorial / --font-alt
               editorial pull-quotes & numerals)        */
  --font-display:  "Bebas Neue Pro", "Oswald", "Arial Narrow", sans-serif; /* main titles & hero — use 700 */
  --font-headline: "Bebas Neue Pro", "Oswald", "Arial Narrow", sans-serif; /* titles / section heads */
  --font-body:     "Nexa", "Futura", "Century Gothic", system-ui, sans-serif; /* UI + prose */
  --font-logo:     "Bebas Neue Pro Expanded", "Arial Narrow", sans-serif; /* the wordmark letterforms */
  --font-editorial:"Typogotika", Georgia, serif; /* high-contrast serif accent */
  --font-alt:      "Typogotika", Georgia, serif; /* alias of editorial */
  --font-mono:     "Nexa", ui-monospace, "SF Mono", monospace;

  /* ---- Weights ---- */
  --fw-light: 300;   /* @kind font */
  --fw-book:  400;   /* @kind font */
  --fw-regular: 500; /* @kind font */
  --fw-bold:  700;   /* @kind font */
  --fw-black: 900;   /* @kind font */

  /* ---- Display & headline sizes (condensed caps run large) ---- */
  --t-hero:     clamp(56px, 9vw, 132px);  /* @kind font */
  --t-display:  clamp(40px, 6vw, 88px);   /* @kind font */
  --t-h1:       56px;  /* @kind font */
  --t-h2:       40px;  /* @kind font */
  --t-h3:       28px;  /* @kind font */
  --t-h4:       22px;  /* @kind font */

  /* ---- Body / UI sizes ---- */
  --t-lead:     20px;  /* @kind font */
  --t-body:     16px;  /* @kind font */
  --t-sm:       14px;  /* @kind font */
  --t-xs:       12px;  /* @kind font */
  --t-micro:    11px;  /* @kind font */

  /* ---- Line heights ---- */
  --lh-tight:   0.92;  /* @kind font */
  --lh-snug:    1.05;  /* @kind font */
  --lh-normal:  1.5;   /* @kind font */
  --lh-relaxed: 1.65;  /* @kind font */

  /* ---- Tracking (brand uses wide-spaced caps in labels) ---- */
  --track-mega:   0.02em;   /* @kind font */
  --track-label:  0.22em;   /* @kind font */
  --track-tag:    0.34em;   /* @kind font */
  --track-body:   0.005em;  /* @kind font */
}

/* ---- Ready-made type roles (optional helpers) ---- */
.crater-hero {
  font-family: var(--font-display);
  font-weight: var(--fw-bold);
  font-size: var(--t-hero);
  line-height: var(--lh-tight);
  letter-spacing: var(--track-mega);
  text-transform: uppercase;
}
.crater-headline {
  font-family: var(--font-headline);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
  text-transform: uppercase;
  letter-spacing: 0.01em;
}
.crater-eyebrow {
  font-family: var(--font-body);
  font-weight: var(--fw-bold);
  font-size: var(--t-xs);
  letter-spacing: var(--track-tag);
  text-transform: uppercase;
}
.crater-body {
  font-family: var(--font-body);
  font-weight: var(--fw-book);
  font-size: var(--t-body);
  line-height: var(--lh-relaxed);
  letter-spacing: var(--track-body);
}
