:root {
  /* Brand colours (from design-tokens.css) */
  --violet: #322056;
  --violet-dark: #201238;
  --lilac: #f5f1fa;
  --mint: #bdf5d2;
  --gold: #f0c56a;
  --ink: #201238;

  /* Derived */
  --white: #ffffff;
  --muted: #5c5570;
  --border: #e4dff0;
  --violet-tint: #efeaf7;
  --mint-tint: #e4faec;
  --gold-tint: #fdf3de;

  --radius: 16px;
  --radius-sm: 10px;
  --radius-pill: 999px;
  --content: 1200px;

  --shadow-card: 0 1px 2px rgba(32, 18, 56, 0.06), 0 8px 24px rgba(32, 18, 56, 0.06);
  --shadow-header: 0 1px 0 rgba(32, 18, 56, 0.06);

  --font-heading: "Plus Jakarta Sans", "Inter", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  --header-height: 76px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}