:root {
  /* Colors */
  --surface: #f9f9ff;
  --surface-dim: #dad9e0;
  --surface-bright: #f9f9ff;
  --surface-container-lowest: #ffffff;
  --surface-container-low: #f3f3f9;
  --surface-container: #eeedf4;
  --surface-container-high: #e8e7ee;
  --surface-container-highest: #e2e2e8;
  --on-surface: #1a1b20;
  --on-surface-variant: #434751;
  --inverse-surface: #2f3035;
  --inverse-on-surface: #f0f0f7;
  --outline: #737782;
  --outline-variant: #c3c6d2;
  --surface-tint: #345da2;
  --primary: #003472;
  --on-primary: #ffffff;
  --primary-container: #1e4b8f;
  --on-primary-container: #9dbdff;
  --inverse-primary: #acc7ff;
  --secondary: #b7102a;
  --on-secondary: #ffffff;
  --secondary-container: #db313f;
  --on-secondary-container: #fffbff;
  --tertiary: #582900;
  --on-tertiary: #ffffff;
  --tertiary-container: #7a3b00;
  --on-tertiary-container: #ffa96d;
  --error: #ba1a1a;
  --on-error: #ffffff;
  --error-container: #ffdad6;
  --on-error-container: #93000a;
  --primary-fixed: #d7e2ff;
  --primary-fixed-dim: #acc7ff;
  --on-primary-fixed: #001a40;
  --on-primary-fixed-variant: #154589;
  --secondary-fixed: #ffdad8;
  --secondary-fixed-dim: #ffb3b1;
  --on-secondary-fixed: #410007;
  --on-secondary-fixed-variant: #92001c;
  --tertiary-fixed: #ffdcc6;
  --tertiary-fixed-dim: #ffb785;
  --on-tertiary-fixed: #301400;
  --on-tertiary-fixed-variant: #723700;
  --background: #f9f9ff;
  --on-background: #1a1b20;
  --surface-variant: #e2e2e8;
  --ocean-dark: #0F2646;
  --sky-tint: #F1F5F9;
  --success-teal: #2A9D8F;
  --neutral-gray: #64748B;

  /* Fonts */
  --font-headline: 'Manrope', sans-serif;
  --font-body: 'Inter', sans-serif;

  /* Spacing */
  --container-max: 1280px;
  --gutter: 24px;
  --margin-mobile: 16px;
  --margin-desktop: 40px;
  --stack-sm: 8px;
  --stack-md: 16px;
  --stack-lg: 32px;

  /* Border Radii */
  --radius-sm: 0.25rem;
  --radius-default: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --radius-full: 9999px;
}