:root {
  --color-bg: hsl(35, 30%, 97%);
  --color-text: hsl(30, 10%, 20%);
  --color-accent: hsl(140, 20%, 50%);
  --color-secondary: hsl(260, 15%, 70%);
  --color-surface: hsl(35, 30%, 100%);
  --color-border: hsl(30, 10%, 85%);
  
  --font-title: 'Cormorant Garamond', serif;
  --font-body: 'Inter', sans-serif;
  
  --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 2rem;
  --spacing-xl: 4rem;
  --border-radius: 8px;
  --max-width: 1200px;
}

[data-theme="dark"] {
  --color-bg: hsl(30, 10%, 15%);
  --color-text: hsl(35, 30%, 95%);
  --color-accent: hsl(140, 30%, 60%);
  --color-secondary: hsl(260, 20%, 60%);
  --color-surface: hsl(30, 10%, 20%);
  --color-border: hsl(30, 10%, 30%);
}