/* Design tokens — generated from DESIGN.md */
:root {
  /* Colors — Neutrals */
  --color-neutral-100: #ffffff;
  --color-neutral-200: #f1f4ff;
  --color-neutral-300: #ebedf8;
  --color-neutral-400: #d9dbe9;
  --color-neutral-500: #8a8f9b;
  --color-neutral-600: #4f5462;
  --color-neutral-700: #212c47;
  --color-neutral-800: #04102e;

  /* Colors — Brand */
  --color-primary: #274690;
  --color-secondary: #5299d3;
  --color-accent-red: #eb5160;
  --color-accent-amber: #ffc147;
  --color-accent-lavender: #e1e4ff;
  --color-accent-green: #00da22;

  /* Colors — Surfaces */
  --color-header-bg: rgba(255, 255, 255, 0.749);
  --color-section-tinted: #f1f4ff;
  --color-transparent: #fff0;

  /* Colors — Text */
  --color-on-primary: #ffffff;
  --color-on-dark: #ffffff;
  --color-body-text: #4f5462;
  --color-heading-text: #04102e;
  --color-link: #274690;
  --color-link-hover: #5299d3;

  /* Border radius */
  --rounded-sm: 0.5rem;
  --rounded-md: 1rem;
  --rounded-lg: 1.5rem;
  --rounded-pill: 6.25rem;
  --rounded-full: 9999px;

  /* Spacing */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 2rem;
  --spacing-xl: 4rem;
  --spacing-section-v: 6rem;
  --spacing-gutter: 2rem;
  --spacing-container-max: 80rem;
  --spacing-card-padding: 1.5rem;
  --spacing-card-gap: 1rem;

  /* Elevation */
  --elevation-subtle: 1px 1px 3px rgba(0, 0, 0, 0.19);
  --elevation-card: 0 24px 44px rgba(20, 20, 43, 0.039);
  --elevation-card-colored: 1px 3px 5px 0 #5299d3;
  --elevation-image-overlay: 0 20px 20px rgba(32, 36, 138, 0.09);
  --elevation-image-soft: 9px 8px 12px rgba(32, 36, 138, 0.059);
  --elevation-logo-loop: 1px 1px 5px rgba(0, 0, 0, 0.19);

  /* Motion */
  --motion-fast: 0.15s;
  --motion-base: 0.2s;
  --motion-slow: 0.3s;
  --motion-easing: ease;
  --motion-easing-bounce: cubic-bezier(0.075, 0.82, 0.165, 1);
  --motion-nav: 400ms;
}