/* ==========================================================================
   ANIMATIONS
   ========================================================================== */

[data-reveal] {
  opacity: 0;
  transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
  will-change: transform, opacity;
}
[data-reveal="fade-up"] { transform: translateY(28px); }
[data-reveal="fade-left"] { transform: translateX(-32px); }
[data-reveal="fade-right"] { transform: translateX(32px); }
[data-reveal="scale"] { transform: scale(0.94); }
[data-reveal].is-visible { opacity: 1; transform: none; }

[data-stagger] > * {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
}
[data-stagger].is-visible > * { opacity: 1; transform: none; }
[data-stagger].is-visible > *:nth-child(1) { transition-delay: 0.05s; }
[data-stagger].is-visible > *:nth-child(2) { transition-delay: 0.15s; }
[data-stagger].is-visible > *:nth-child(3) { transition-delay: 0.25s; }
[data-stagger].is-visible > *:nth-child(4) { transition-delay: 0.35s; }
[data-stagger].is-visible > *:nth-child(5) { transition-delay: 0.45s; }
[data-stagger].is-visible > *:nth-child(6) { transition-delay: 0.55s; }

/* Hero load sequence */
.hero-logo-in { opacity: 0; animation: fadeIn 0.6s var(--ease) forwards; }
.hero-copy h1 { opacity: 0; animation: revealUp 0.8s var(--ease) forwards; animation-delay: 0.15s; }
.hero-copy p.lead { opacity: 0; animation: slideUp 0.8s var(--ease) forwards; animation-delay: 0.35s; }
.hero-actions { opacity: 0; animation: fadeUp 0.7s var(--ease) forwards; animation-delay: 0.5s; }
.hero-note { opacity: 0; animation: fadeUp 0.7s var(--ease) forwards; animation-delay: 0.62s; }
.hero-visual { opacity: 0; animation: scaleFade 0.9s var(--ease) forwards; animation-delay: 0.3s; }
.hv-card { opacity: 0; animation: cardFloat 0.7s var(--ease) forwards; }
.hv-identity { animation-delay: 0.55s; }
.hv-payment { animation-delay: 0.7s; }
.hv-risk { animation-delay: 0.85s; }
.hv-upi { animation-delay: 0.65s; }
.hv-consent { animation-delay: 0.95s; }

@keyframes fadeIn { to { opacity: 1; } }
@keyframes revealUp { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes scaleFade { from { opacity: 0; transform: scale(0.96); } to { opacity: 1; transform: scale(1); } }
@keyframes cardFloat { from { opacity: 0; transform: translateY(18px) scale(0.96); } to { opacity: 1; transform: translateY(0) scale(1); } }

/* Ambient float for hero cards, post-entrance */
.hv-card.ambient { animation: ambientFloat 6s ease-in-out infinite; }
.hv-identity.ambient { animation-delay: 0s; }
.hv-payment.ambient { animation-delay: 1.2s; }
.hv-risk.ambient { animation-delay: 0.6s; }
.hv-upi.ambient { animation-delay: 1.8s; }
.hv-consent.ambient { animation-delay: 0.3s; }
@keyframes ambientFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

/* Circular risk indicator sweep */
@keyframes ringSweep {
  from { background: conic-gradient(var(--mint) 0 0%, var(--border) 0% 100%); }
}
.hv-ring { animation: none; }

/* Payment glow path */
.flow-line { animation: flowGlow 2.4s linear infinite; }
@keyframes flowGlow { from { background-position: 200% 0; } to { background-position: 0 0; } }

/* Marquee for trust logos (subtle, not looping motion by default) */
.trust-row span { transition: opacity 0.4s var(--ease); }
.trust-row span:hover { opacity: 1; }

/* Cursor glow (desktop only, opt-in via JS) */
.cursor-glow {
  position: fixed; width: 260px; height: 260px; border-radius: 50%;
  background: radial-gradient(circle, var(--primary-glow), transparent 70%);
  pointer-events: none; z-index: 5; opacity: 0; transition: opacity 0.3s ease;
  transform: translate(-50%, -50%);
  mix-blend-mode: screen;
}
.cursor-glow.active { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  [data-reveal], [data-stagger] > * { opacity: 1 !important; transform: none !important; }
  .hero-copy h1, .hero-copy p.lead, .hero-actions, .hero-note, .hero-visual, .hv-card { animation: none !important; opacity: 1 !important; transform: none !important; }
  .hv-card.ambient, .flow-line { animation: none !important; }
}