/* Design tokens — single source of truth for color, spacing, type, etc.
   Kept separate from style.css so the visual language can be tuned in one place. */
:root {
  /* Color */
  --color-bg: #fff;
  --color-surface: #f5f7fa;
  --color-surface-2: #eaf0f7;
  --color-text: #1a2230;
  --color-muted: #586577;
  --color-border: #dde3ea;
  --color-accent: #0b5cab;
  --color-accent-dark: #08406f;
  --color-on-accent: #fff;
  --color-highlight: #f4a300;
  --color-footer-bg: #0f1b2d;
  --color-footer-text: #c8d2e0;
  --color-footer-head: #fff;

  /* Spacing scale */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;

  /* Radius + elevation */
  --radius: 0.6rem;
  --radius-sm: 0.35rem;
  --shadow: 0 1px 2px rgb(15 27 45 / 6%), 0 8px 24px rgb(15 27 45 / 8%);

  /* Typography — fluid scale with clamp() */
  --font-body: system-ui, -apple-system, "Segoe UI", roboto, "Helvetica Neue", arial, sans-serif;
  --step-xs: clamp(0.85rem, 0.82rem + 0.15vw, 0.95rem);
  --step-0: clamp(1rem, 0.95rem + 0.25vw, 1.13rem);
  --step-1: clamp(1.2rem, 1.1rem + 0.5vw, 1.45rem);
  --step-2: clamp(1.5rem, 1.3rem + 1vw, 2rem);
  --step-3: clamp(1.9rem, 1.5rem + 2vw, 2.9rem);

  /* Layout */
  --container: 64rem;
}