/**
 * BRANDCLAW — Design System Tokens
 * v2.1
 *
 * Typography: FigTree (brand, 800) + DM Serif Display (display) + IBM Plex Sans (body) + IBM Plex Sans Condensed (labels/buttons) + IBM Plex Mono (code/data)
 * Color: warm-tinted neutrals, #b40303 critical red
 * Geometry: sharp corners (radius: 0), dense information display
 *
 * FigTree 800 loaded via @font-face (Fontsource CDN) for reliable display.
 * Font Awesome: <script src="https://kit.fontawesome.com/208e5375c5.js" crossorigin="anonymous"></script>
 */

@font-face {
  font-family: 'FigTree';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('https://cdn.jsdelivr.net/npm/@fontsource/figtree@5.2.8/files/figtree-latin-900-normal.woff2') format('woff2');
}

:root {
  /* Typography */
  --font-brand: 'FigTree', sans-serif;
  --font-brand-weight: 900;
  --font-brand-tracking: 0;
  --font-display: 'DM Serif Display', Georgia, serif;
  --display-tracking: -0.5px;
  --font-body: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --font-condensed: 'IBM Plex Sans Condensed', 'IBM Plex Sans', system-ui, sans-serif;
  --font-mono: 'IBM Plex Mono', 'JetBrains Mono', monospace;

  /* Backward compat alias */
  --mono: var(--font-mono);

  /* Type scale — fluid, compact */
  --text-xs: clamp(0.625rem, 0.6rem + 0.1vw, 0.6875rem);
  --text-sm: clamp(0.75rem, 0.72rem + 0.12vw, 0.8125rem);
  --text-base: clamp(0.875rem, 0.84rem + 0.15vw, 0.9375rem);
  --text-lg: clamp(1rem, 0.95rem + 0.2vw, 1.125rem);
  --text-xl: clamp(1.125rem, 1.05rem + 0.35vw, 1.375rem);
  --text-2xl: clamp(1.5rem, 1.3rem + 0.8vw, 1.875rem);
  --text-3xl: clamp(1.75rem, 1.5rem + 1.2vw, 2.5rem);

  /* Color — warm-tinted neutrals */
  --primary: #1A1615;
  --critical: #b40303;
  --bg: #FAF9F7;
  --bg-elevated: #F2F0ED;
  --border: #DDD9D5;
  --text: #1A1615;
  --text-muted: #7A7470;

  /* Extended palette */
  --critical-light: #fdf2f2;
  --critical-muted: #d4443e;
  --surface-warm: #EDE9E5;

  /* Geometry */
  --radius: 0;

  /* Button sizing — consistent across all CTAs */
  --btn-min-height: 44px;
  --btn-padding-y: 0.75rem;
  --btn-padding-x: 1.5rem;

  /* Spacing scale — compact */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 2.5rem;
  --space-3xl: 4rem;

  /* Layout */
  --max-width: 56rem;
  --max-width-wide: 68rem;
  --gutter: 1.5rem;
}