:root {
  /* Colors — Amalfi Coast palette */
  --color-cream: #F8F6F0;
  --color-cream-dark: #EDE9E0;
  /* Primary — Azure blue (the Tyrrhenian sea) */
  --color-azure: #1577C2;
  --color-azure-light: #3D9BE0;
  --color-azure-dark: #0E5894;
  /* Secondary — Lemon yellow (Amalfi sun & lemons) */
  --color-yellow: #F2B705;
  --color-yellow-light: #FFD23F;
  --color-yellow-dark: #B5830C;
  --color-charcoal: #121212;
  --color-charcoal-light: #2A2A2A;
  --color-text: #1A1A1A;
  --color-text-muted: #6B6B6B;
  --color-white: #FFFFFF;

  /* Typography */
  --font-serif: 'Playfair Display', 'Georgia', serif;
  --font-mono: 'Space Mono', 'Courier New', monospace;
  --font-sans: system-ui, -apple-system, sans-serif;

  /* Fluid type scale */
  --text-xs: clamp(0.7rem, 0.65rem + 0.25vw, 0.8rem);
  --text-sm: clamp(0.8rem, 0.75rem + 0.3vw, 0.95rem);
  --text-base: clamp(0.95rem, 0.9rem + 0.3vw, 1.1rem);
  --text-lg: clamp(1.15rem, 1rem + 0.5vw, 1.4rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1vw, 2rem);
  --text-2xl: clamp(2rem, 1.5rem + 2vw, 3.5rem);
  --text-3xl: clamp(3rem, 2rem + 3.5vw, 6rem);
  --text-hero: clamp(4rem, 3rem + 5vw, 9rem);

  /* Spacing scale */
  --space-xs: clamp(0.25rem, 0.2rem + 0.2vw, 0.5rem);
  --space-sm: clamp(0.5rem, 0.4rem + 0.4vw, 1rem);
  --space-md: clamp(1rem, 0.8rem + 0.8vw, 1.5rem);
  --space-lg: clamp(2rem, 1.5rem + 1.5vw, 3rem);
  --space-xl: clamp(3rem, 2rem + 3vw, 6rem);
  --space-2xl: clamp(5rem, 3rem + 5vw, 10rem);

  /* Layout */
  --container-max: 1400px;
  --container-padding: clamp(1rem, 3vw, 3rem);
  --grid-gap: clamp(1rem, 2vw, 2rem);

  /* Transitions */
  --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: 400ms;
  --duration-slow: 800ms;

  /* Borders */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
}