/* ============================================
   TOKENS — variables de design
   ============================================ */
:root {
  --cream: #FAF6F0;
  --cream-deep: #F0E9DD;
  --espresso: #2C1F0E;
  --espresso-soft: #6B5D4C;
  --terracotta: #C97B63;
  --terracotta-dark: #A85F49;
  --gold: #C4A882;
  --sage: #7C9473;
  --sage-soft: #EAF1E9;
  --rose: #B97B76;
  --rose-soft: #F5E9E7;

  --font-display: 'Fraunces', Georgia, serif;
  --font-body: 'Inter', -apple-system, sans-serif;

  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-base: 0.9375rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-3xl: 2.5rem;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;

  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 999px;

  --shadow-card: 0 2px 12px rgba(44, 31, 14, 0.06);
  --shadow-raised: 0 8px 24px rgba(44, 31, 14, 0.12);
  --shadow-float: 0 4px 16px rgba(44, 31, 14, 0.14);

  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}