/* ==========================================================
   Keyframes & scroll-triggered active states
   ========================================================== */

/* ---- Intro line reveal (triggered by JS adding .is-visible) ---- */
.reveal-line.is-visible{
  animation: fade-up-blur .9s var(--ease) forwards;
}

@keyframes fade-up-blur{
  from{ opacity: 0; transform: translateY(16px); filter: blur(6px); }
  to{ opacity: 1; transform: translateY(0); filter: blur(0); }
}

/* ---- Generic scroll reveal, triggered by IntersectionObserver ---- */
.reveal-on-scroll.is-visible{
  animation: fade-up .8s var(--ease) forwards;
}

@keyframes fade-up{
  from{ opacity: 0; transform: translateY(28px); }
  to{ opacity: 1; transform: translateY(0); }
}

/* ---- Blur-to-sharp name reveal ---- */
.blur-in{
  filter: blur(14px);
  opacity: 0;
  transform: translateY(10px) scale(.96);
  letter-spacing: .3em;
}
.blur-in.is-visible{
  animation: blur-sharpen 1.4s var(--ease) forwards;
}
@keyframes blur-sharpen{
  0%{ filter: blur(14px); opacity: 0; transform: translateY(10px) scale(.96); letter-spacing: .3em; }
  60%{ opacity: 1; }
  100%{ filter: blur(0); opacity: 1; transform: translateY(0) scale(1); letter-spacing: .02em; }
}

/* ---- Rakhi ring rotation ---- */
@keyframes spin-slow{
  from{ transform: rotate(0deg); }
  to{ transform: rotate(360deg); }
}

/* ---- Scroll indicator dot ---- */
@keyframes scroll-dot{
  0%{ opacity: 1; transform: translate(-50%, 0); }
  70%{ opacity: 0; transform: translate(-50%, 18px); }
  100%{ opacity: 0; transform: translate(-50%, 18px); }
}

/* ---- Floating gift box ---- */
@keyframes float{
  0%, 100%{ transform: translateY(0); }
  50%{ transform: translateY(-14px); }
}

/* ---- Gift opening pop ---- */
@keyframes gift-pop{
  0%{ transform: scale(1); }
  35%{ transform: scale(1.12) rotate(-2deg); }
  60%{ transform: scale(.94) rotate(2deg); }
  100%{ transform: scale(1.06); filter: brightness(1.3); }
}

/* ---- Confetti fall ---- */
@keyframes confetti-fall{
  0%{ opacity: 1; transform: translate(var(--tx-start), var(--ty-start)) rotate(0deg); }
  100%{ opacity: 0; transform: translate(var(--tx-end), var(--ty-end)) rotate(var(--rot)); }
}
.confetti-piece.falling{
  animation: confetti-fall var(--dur, 1.6s) ease-out forwards;
}

/* ---- Particle drift ---- */
@keyframes drift{
  0%{ transform: translate(0,0); }
  50%{ transform: translate(var(--dx, 10px), var(--dy, -18px)); }
  100%{ transform: translate(0,0); }
}
.particle{
  animation: drift var(--dur, 8s) ease-in-out infinite;
}

/* ---- Intro glow pulse ---- */
.intro-glow{ animation: glow-pulse 6s ease-in-out infinite; }
@keyframes glow-pulse{
  0%, 100%{ opacity: .6; transform: scale(1); }
  50%{ opacity: 1; transform: scale(1.08); }
}

/* ---- Thread line subtle pulse ---- */
.thread-path{ animation: thread-pulse 5s ease-in-out infinite; }
@keyframes thread-pulse{
  0%, 100%{ opacity: .25; }
  50%{ opacity: .5; }
}