/* =========================================================
   TASING STHALYN — animations.css
   Todos los keyframes y clases de animación al scroll
   ========================================================= */

/* ---------- FONDO DINÁMICO ---------- */
@keyframes kenburns {
  0%   { transform: scale(1)    translate(0, 0); }
  50%  { transform: scale(1.10) translate(1.5%, -1%); }
  100% { transform: scale(1.20) translate(-2%, -1.8%); }
}

@keyframes floatOrb {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  33%      { transform: translate3d(28px, -34px, 0) scale(1.12); }
  66%      { transform: translate3d(-22px, 18px, 0) scale(.94); }
}

/* ---------- HERO ---------- */
@keyframes lineUp {
  from { transform: translateY(105%); }
  to   { transform: translateY(0); }
}

@keyframes scan {
  0%   { top: -5%;  opacity: 0; }
  10%  { opacity: 1; }
  90%  { opacity: 1; }
  100% { top: 105%; opacity: 0; }
}

@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}

@keyframes sweep {
  0%, 100% { transform: rotate(16deg) translateX(0); }
  50%      { transform: rotate(16deg) translateX(-40px); }
}

/* ---------- MARQUEE ---------- */
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ---------- MICRO INTERACCIONES ---------- */
@keyframes ring {
  0%   { box-shadow: 0 0 0 0   rgba(233,30,147,.6); }
  70%  { box-shadow: 0 0 0 9px rgba(233,30,147,0); }
  100% { box-shadow: 0 0 0 0   rgba(233,30,147,0); }
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50%      { opacity: .35; }
}

@keyframes popIn {
  0%   { transform: scale(.88); opacity: 0; }
  60%  { transform: scale(1.03); opacity: 1; }
  100% { transform: scale(1); }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes slideInRight {
  from { transform: translateX(24px); opacity: 0; }
  to   { transform: translateX(0);    opacity: 1; }
}

/* ---------- LOADER ---------- */
@keyframes loaderPulse {
  0%, 100% { transform: scale(1);    box-shadow: 0 12px 30px rgba(124,58,237,.35); }
  50%      { transform: scale(1.08); box-shadow: 0 18px 40px rgba(233,30,147,.45); }
}

@keyframes steam {
  0%   { transform: translateY(6px)  scaleY(.6); opacity: .2; }
  50%  { transform: translateY(-4px) scaleY(1);  opacity: .9; }
  100% { transform: translateY(-12px) scaleY(.7); opacity: 0; }
}

/* ---------- REVEAL AL HACER SCROLL ---------- */
.reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .8s cubic-bezier(.22,1,.36,1),
              transform .8s cubic-bezier(.22,1,.36,1);
  will-change: opacity, transform;
}
.reveal.in { opacity: 1; transform: translateY(0); }

.reveal-left  { opacity: 0; transform: translateX(-30px); transition: .8s cubic-bezier(.22,1,.36,1); }
.reveal-left.in  { opacity: 1; transform: translateX(0); }
.reveal-right { opacity: 0; transform: translateX(30px);  transition: .8s cubic-bezier(.22,1,.36,1); }
.reveal-right.in { opacity: 1; transform: translateX(0); }
.reveal-zoom  { opacity: 0; transform: scale(.94); transition: .8s cubic-bezier(.22,1,.36,1); }
.reveal-zoom.in  { opacity: 1; transform: scale(1); }

/* Retrasos escalonados */
.d-1 { transition-delay: .08s; }
.d-2 { transition-delay: .16s; }
.d-3 { transition-delay: .24s; }
.d-4 { transition-delay: .32s; }
.d-5 { transition-delay: .40s; }

/* ---------- ACCESIBILIDAD ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .reveal, .reveal-left, .reveal-right, .reveal-zoom { opacity: 1; transform: none; }
}