:root {
  color-scheme: light;

  --color-navy-950: #07142e;
  --color-navy-900: #0b1533;
  --color-navy-850: #14224a;
  --color-navy-800: #1e315f;
  --color-red-600: #e1261c;
  --color-red-700: #c81e16;
  --color-red-500-muted: #cf463d;
  --color-white: #ffffff;
  --color-bg: #f5f7fb;
  --color-surface: #ffffff;
  --color-surface-soft: #f8fafc;
  --color-border: #d8e0ed;
  --color-border-strong: #b9c6db;
  --color-text: #0f172a;
  --color-muted: #475569;
  --color-muted-soft: #64748b;
  --color-success: #15803d;
  --color-danger: #b91c1c;
  --color-overlay: rgba(7, 20, 46, 0.76);

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 2.5rem;
  --space-8: 3rem;
  --space-9: 4rem;
  --space-10: 5rem;
  --space-11: 6.5rem;
  --space-12: 7.5rem;

  --radius-sm: 14px;
  --radius-md: 20px;
  --radius-lg: 28px;
  --radius-xl: 36px;
  --radius-pill: 999px;

  --shadow-soft: 0 18px 40px rgba(15, 23, 42, 0.08);
  --shadow-medium: 0 24px 60px rgba(7, 20, 46, 0.14);
  --shadow-strong: 0 30px 80px rgba(7, 20, 46, 0.24);

  --container-max: 1200px;
  --container-wide: 1320px;
  --header-height: 92px;

  --transition-fast: 180ms ease;
  --transition-base: 220ms cubic-bezier(0.22, 1, 0.36, 1);
  --transition-slow: 320ms cubic-bezier(0.22, 1, 0.36, 1);

  --breakpoint-xl: 1200px;
  --breakpoint-lg: 1024px;
  --breakpoint-md: 880px;
  --breakpoint-sm: 720px;
  --breakpoint-xs: 560px;
}