:root {
  /* Brand colors */
  --pink:        #E8498A;
  --pink-light:  #F5A8C8;
  --pink-pale:   #FDE8F2;
  --charcoal:    #1A1A1A;
  --charcoal-60: rgba(26,26,26,0.6);
  --cream:       #FFF8F5;
  --gold:        #C9A96E;
  --gold-light:  #E8D5B0;
  --white:       #FFFFFF;
  --grey-soft:   #F5F0EE;
  --grey-mid:    #A89B96;

  /* Typography */
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-script:  'Great Vibes', cursive;
  --font-body:    'Outfit', system-ui, sans-serif;

  /* Scale */
  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.375rem;
  --text-2xl:  1.75rem;
  --text-3xl:  2.25rem;
  --text-4xl:  3rem;
  --text-5xl:  4rem;
  --text-6xl:  5.5rem;

  /* Spacing */
  --sp-1:   0.25rem;
  --sp-2:   0.5rem;
  --sp-3:   0.75rem;
  --sp-4:   1rem;
  --sp-6:   1.5rem;
  --sp-8:   2rem;
  --sp-12:  3rem;
  --sp-16:  4rem;
  --sp-24:  6rem;
  --sp-32:  8rem;

  /* Radius */
  --r-sm:   0.375rem;
  --r-md:   0.75rem;
  --r-lg:   1.25rem;
  --r-xl:   2rem;
  --r-full: 9999px;

  /* Shadows */
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.08);
  --shadow-md:  0 4px 16px rgba(232,73,138,0.12);
  --shadow-lg:  0 8px 32px rgba(232,73,138,0.18);
  --shadow-xl:  0 16px 48px rgba(0,0,0,0.14);

  /* Motion */
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:   cubic-bezier(0.4, 0, 1, 1);
  --duration:  320ms;
}