:root {
  /* === Colors === */
  --color-blue: #002D91;
  --color-gray: #F0F0F0;
  --color-teal: #5F87A5;
  --color-sage: #879B7D;
  --color-warm: #A08C7D;
  --color-gold: #B9A041;
  --color-black: #1A1A1A;
  --color-white: #F0F0F0;  /* Brand "white" = same as --color-gray; intentionally off-white, not #FFFFFF */
  --color-text-dark: #1A1A1A;
  --color-text-light: #F0F0F0;
  --color-text-muted: #666666;
  --color-border-light: #E0E0E0;

  /* === Typography === */
  --font-heading: 'Switzer', sans-serif;
  --font-body: 'JetBrains Mono', monospace;
  --tracking-heading: -0.025em;
  --tracking-label: 0.25em;
  --tracking-tagline: 0.25em;

  /* === Type Scale (1.25 ratio, bumped for readability) === */
  --text-xs: 0.8rem;
  --text-sm: 0.938rem;
  --text-base: 1.063rem;
  --text-lg: 1.375rem;
  --text-xl: 1.75rem;
  --text-2xl: 2.25rem;
  --text-3xl: 2.875rem;
  --text-4xl: 3.5rem;
  --text-5xl: 4.5rem;

  /* === Spacing (4px base) === */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* === Layout === */
  --max-width: 1320px;
  --content-padding: var(--space-8);
  --section-padding: var(--space-16) var(--space-8);
  --nav-height: 72px;

  /* === Animation === */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast: 200ms;
  --duration-normal: 300ms;
  --duration-slow: 800ms;
  --duration-breath: 6s;
}