/* Cyber Legends — frontend animation enhancements (link after main stylesheet) */

/* Scroll reveal */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .7s ease, transform .7s cubic-bezier(.16,1,.3,1); }
.reveal.visible { opacity: 1; transform: none; }
.reveal-left { opacity: 0; transform: translateX(-36px); transition: opacity .7s ease, transform .7s cubic-bezier(.16,1,.3,1); }
.reveal-left.visible { opacity: 1; transform: none; }
.reveal-right { opacity: 0; transform: translateX(36px); transition: opacity .7s ease, transform .7s cubic-bezier(.16,1,.3,1); }
.reveal-right.visible { opacity: 1; transform: none; }
.reveal-scale { opacity: 0; transform: scale(.94); transition: opacity .6s ease, transform .6s cubic-bezier(.16,1,.3,1); }
.reveal-scale.visible { opacity: 1; transform: scale(1); }

/* Stagger children */
.stagger > * { opacity: 0; transform: translateY(20px); transition: opacity .6s ease, transform .6s cubic-bezier(.16,1,.3,1); }
.stagger.visible > *:nth-child(1) { transition-delay: 0s; }
.stagger.visible > *:nth-child(2) { transition-delay: .08s; }
.stagger.visible > *:nth-child(3) { transition-delay: .16s; }
.stagger.visible > *:nth-child(4) { transition-delay: .24s; }
.stagger.visible > *:nth-child(5) { transition-delay: .32s; }
.stagger.visible > *:nth-child(6) { transition-delay: .4s; }
.stagger.visible > * { opacity: 1; transform: none; }

/* Card hover lift */
.card-lift { transition: transform .35s ease, box-shadow .35s ease; }
.card-lift:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(0,0,0,.14); }

/* Button micro-interaction */
.btn-anim { transition: transform .2s ease, box-shadow .2s ease, filter .2s ease; }
.btn-anim:hover { transform: translateY(-2px); filter: brightness(1.06); box-shadow: 0 10px 24px rgba(0,0,0,.16); }
.btn-anim:active { transform: translateY(0) scale(.98); }

/* Animated gradient headline accent */
.grad-text { background: linear-gradient(90deg, #2563eb, #06b6d4, #2563eb); background-size: 200% auto;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: gradShift 6s linear infinite; }
@keyframes gradShift { to { background-position: 200% center; } }

/* Floating hero decoration */
.float-slow { animation: floatY 6s ease-in-out infinite; }
@keyframes floatY { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }

/* Pulse for CTA badges */
.pulse-dot { animation: pulseDot 2s ease-in-out infinite; }
@keyframes pulseDot { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .55; transform: scale(.82); } }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-left, .reveal-right, .reveal-scale, .stagger > *,
  .float-slow, .grad-text, .pulse-dot { opacity: 1 !important; transform: none !important; animation: none !important; transition: none !important; }
}
