/* ============================================================
   EFFECTS — gradients, shadows, motion
   The gold "leaf" gradient is core to both marks; the pink gradient
   powers hero fills and the crescent. Shadows are soft and warm.
   ============================================================ */
:root {
  /* --- Signature gradients --- */
  --grad-gold:      linear-gradient(135deg, #A67C1A 0%, #D4AF37 22%, #FBEFCB 50%, #D4AF37 74%, #A67C1A 100%); /* @kind color */
  --grad-gold-soft: linear-gradient(135deg, #E6C767 0%, #FBEFCB 50%, #D4AF37 100%); /* @kind color */
  --grad-pink:      linear-gradient(135deg, var(--pink-600) 0%, var(--pink-500) 45%, var(--pink-400) 100%);
  --grad-pink-gold: linear-gradient(120deg, var(--pink-600) 0%, var(--pink-500) 55%, var(--gold-400) 100%);
  --grad-blush:     linear-gradient(180deg, var(--blush) 0%, var(--pink-50) 100%);
  --grad-dusk:      linear-gradient(160deg, #55082D 0%, #A80556 45%, #ED0A78 100%); /* @kind color */

  /* Text-clip helper values (apply with background-clip:text) */
  --grad-gold-text: var(--grad-gold);

  /* --- Shadows — warm-tinted, soft --- */
  --shadow-xs:   0 1px 2px rgba(85, 8, 45, 0.06);
  --shadow-sm:   0 2px 8px rgba(85, 8, 45, 0.07);
  --shadow-md:   0 8px 24px rgba(85, 8, 45, 0.10);
  --shadow-lg:   0 18px 48px rgba(85, 8, 45, 0.14);
  --shadow-xl:   0 30px 80px rgba(85, 8, 45, 0.18);
  --shadow-gold: 0 6px 20px rgba(166, 124, 26, 0.28);
  --shadow-pink: 0 8px 24px rgba(237, 10, 120, 0.28);
  --shadow-inset:inset 0 1px 0 rgba(255,255,255,0.6);

  /* --- Rings & hairlines --- */
  --ring-focus:  0 0 0 4px var(--focus-ring);
  --hairline-gold: 1px solid var(--gold-300);

  /* --- Motion --- */
  --ease-out:   cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --ease-soft:  cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --dur-fast:   140ms; /* @kind other */
  --dur-base:   240ms; /* @kind other */
  --dur-slow:   420ms; /* @kind other */

  /* --- Blur (glass surfaces over imagery) --- */
  --blur-sm: 6px; /* @kind other */
  --blur-md: 14px; /* @kind other */
  --blur-lg: 28px; /* @kind other */
}