/* ============================================================
   DESIGN TOKENS
   All colours, type scale, spacing, and misc vars live here.
   Change a value once — it updates everywhere.
   ============================================================ */
:root {
  /* --- Colours --- */
  --color-bg:       #ffffff;
  --color-surface:  #f5f5f5;
  --color-text:     #111111;
  --color-muted:    #666666;
  --color-border:   #e0e0e0;
  --color-accent:   #111111;   /* swap for a brand colour later */

  /* --- Typography --- */
  --font-base:   'Inter', system-ui, -apple-system, sans-serif;
  --text-xs:     0.75rem;
  --text-sm:     0.875rem;
  --text-base:   1rem;
  --text-lg:     1.125rem;
  --text-xl:     1.25rem;
  --text-2xl:    1.5rem;
  --text-3xl:    2rem;
  --text-4xl:    2.75rem;
  --text-5xl:    3.75rem;

  /* --- Spacing --- */
  --space-xs:   0.5rem;
  --space-sm:   1rem;
  --space-md:   1.5rem;
  --space-lg:   2.5rem;
  --space-xl:   4rem;
  --space-2xl:  6rem;
  --space-3xl:  8rem;

  /* --- Layout --- */
  --max-width:  1100px;
  --nav-height: 64px;

  /* --- Misc --- */
  --radius:     8px;
  --transition: 0.2s ease;
}