/* ============================================================
   US DEMOLITION — TYPOGRAPHY TOKENS
   Display: Anton (heavy condensed, militant headlines)
   Heading: Oswald (uppercase eyebrows, section heads)
   Body:    Barlow (industrial humanist sans)
   Mono:    Geist Mono / fallback (specs, quotes, measurements)
   NOTE: The logo wordmark is custom hand-lettering, not these
   fonts. Anton/Oswald are the closest free stand-ins for headings.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Oswald:wght@400;500;600;700&family=Barlow:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Barlow+Semi+Condensed:wght@500;600;700&display=swap');

:root {
  /* --- Families --- */
  --font-display: 'Anton', 'Arial Narrow', sans-serif;
  --font-heading: 'Oswald', 'Barlow Semi Condensed', sans-serif;
  --font-body:    'Barlow', system-ui, -apple-system, sans-serif;
  --font-cond:    'Barlow Semi Condensed', 'Oswald', sans-serif;
  --font-mono:    ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* --- Type scale (1.5rem base, major-third-ish, industrial big) --- */
  --fs-2xs:  0.6875rem;  /* 11px micro labels */
  --fs-xs:   0.75rem;    /* 12px caption */
  --fs-sm:   0.875rem;   /* 14px small */
  --fs-base: 1rem;       /* 16px body */
  --fs-md:   1.125rem;   /* 18px lead body */
  --fs-lg:   1.375rem;   /* 22px */
  --fs-xl:   1.75rem;    /* 28px card title */
  --fs-2xl:  2.5rem;     /* 40px */
  --fs-3xl:  3.5rem;     /* 56px section head */
  --fs-4xl:  5rem;       /* 80px hero */
  --fs-5xl:  7rem;       /* 112px monster display */

  /* --- Weights --- */
  --fw-regular: 400;  /* @kind font */
  --fw-medium:  500;  /* @kind font */
  --fw-semibold:600;  /* @kind font */
  --fw-bold:    700;  /* @kind font */

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

  /* --- Letter spacing (industrial = wide caps) --- */
  --ls-tightest: -0.02em;  /* @kind font */
  --ls-tight:    -0.01em;  /* @kind font */
  --ls-normal:   0;        /* @kind font */
  --ls-wide:     0.06em;   /* @kind font */
  --ls-wider:    0.12em;   /* @kind font */
  --ls-widest:   0.22em;   /* @kind font */

  /* --- Semantic roles --- */
  --type-hero:    var(--fw-regular) var(--fs-4xl)/var(--lh-tight) var(--font-display);    /* @kind font */
  --type-display: var(--fw-regular) var(--fs-3xl)/var(--lh-tight) var(--font-display);    /* @kind font */
  --type-h1:      var(--fw-bold) var(--fs-2xl)/var(--lh-snug) var(--font-heading);        /* @kind font */
  --type-h2:      var(--fw-semibold) var(--fs-xl)/var(--lh-snug) var(--font-heading);     /* @kind font */
  --type-eyebrow: var(--fw-semibold) var(--fs-sm)/1 var(--font-heading);                  /* @kind font */
  --type-body:    var(--fw-regular) var(--fs-base)/var(--lh-normal) var(--font-body);     /* @kind font */
  --type-lead:    var(--fw-regular) var(--fs-md)/var(--lh-relaxed) var(--font-body);      /* @kind font */
  --type-button:  var(--fw-bold) var(--fs-sm)/1 var(--font-heading);                      /* @kind font */
}
