:root {
  --color-navy: #0b1426;
  --color-navy-light: #152238;
  --color-charcoal: #1e2a3a;
  --color-gold: #c9a227;
  --color-gold-light: #e4c04d;
  --color-white: #ffffff;
  --color-off-white: #f7f8fa;
  --color-muted: #6b7a8f;
  --color-border: rgba(11, 20, 38, 0.1);
  --color-border-light: rgba(255, 255, 255, 0.12);

  --color-header-glass: rgba(252, 253, 253, 0.65);
  --color-header-glass-scrolled: rgba(252, 253, 253, 0.82);
  --color-header-border: rgba(11, 20, 38, 0.06);
  --color-footer-bg: #fcfdfd;
  --color-footer-text: #3d4f66;
  --color-footer-heading: #0b1426;

  --font-sans: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;
  --font-serif: "Instrument Serif", Georgia, serif;
  --font-weight-heading: 600;

  --space-tight: 0.5rem;
  --space-group: 1.25rem;
  --space-block: 3rem;
  --space-section: 5.5rem;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;

  --shadow-sm: 0 2px 8px rgba(11, 20, 38, 0.06);
  --shadow-md: 0 4px 24px rgba(11, 20, 38, 0.08);
  --shadow-lg: 0 12px 40px rgba(11, 20, 38, 0.12);

  --header-height: 88px;
  --container: 1200px;
  --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

@media (max-width: 768px) {
  :root {
    --space-section: 4rem;
    --space-block: 2rem;
    --header-height: 72px;
  }
}