:root {
  --color-bg: #f9fbff;
  --color-surface: #ffffff;
  --color-surface-soft: #edf3ff;
  --color-primary: #1b5fd1;
  --color-primary-strong: #0f47ab;
  --color-text: #193154;
  --color-text-muted: #5f7393;
  --color-border: rgba(27, 95, 209, 0.16);
  --color-shadow: rgba(12, 44, 106, 0.12);
  --font-display: "Cormorant Garamond", Georgia, serif;
  --font-body: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --shell-width: min(1120px, calc(100vw - 2rem));
  --radius-sm: 0.75rem;
  --radius-md: 1.5rem;
  --radius-lg: 2.5rem;
  --space-2xs: 0.375rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 5rem;
  --shadow-card: 0 22px 60px -28px var(--color-shadow);
  --transition-fast: 180ms ease;
  --transition-base: 320ms ease;
}

@media (min-width: 48rem) {
  :root {
    --space-xl: 4rem;
    --space-2xl: 7rem;
  }
}