:root {
  color-scheme: light;
  --color-ink: #172838;
  --color-ink-deep: #101f2d;
  --color-ink-soft: #536273;
  --color-background: #f5f7f9;
  --color-surface: #ffffff;
  --color-surface-alt: #edf1f4;
  --color-border: #d8e0e7;
  --color-link: #185578;
  --color-focus: #0869bd;
  --color-brand-coral: #ef674b;
  --color-brand-orange: #ec923b;
  --color-brand-gold: #ebad2a;
  --gradient-brand: linear-gradient(112deg, var(--color-brand-coral) 0%, var(--color-brand-orange) 54%, var(--color-brand-gold) 100%);
  --gradient-wash: linear-gradient(135deg, rgba(239, 103, 75, 0.1), rgba(235, 173, 42, 0.13));
  --shadow-card: 0 1.25rem 3rem rgba(16, 31, 45, 0.08);
  --shadow-raised: 0 1.5rem 4rem rgba(16, 31, 45, 0.16);
  --font-sans: "Segoe UI", Arial, Helvetica, sans-serif;
  --font-display: "Segoe UI", Arial, Helvetica, sans-serif;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --container-width: 78rem;
  --radius-sm: 0.5rem;
  --radius-md: 0.875rem;
  --radius-lg: 1.25rem;
  --radius-pill: 999px;
  --transition-speed: 180ms;
  --focus-ring: 0 0 0 0.25rem rgba(8, 105, 189, 0.22);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-speed: 0ms;
  }
}