/* ============================================================
   02-ANIMATIONS.CSS — Todos los @keyframes de la web
   dimonix.gg
   ============================================================ */

/* ── GENERAL ── */
@keyframes pulse {
    0%, 100% { opacity: 1; box-shadow: 0 0 5px currentColor; }
    50%       { opacity: 0.6; box-shadow: 0 0 15px currentColor; }
}

/* ── SPONSORS CAROUSEL ── */
@keyframes scroll-left {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* ── SPONSORS MARQUEE (3 grupos) ── */
@keyframes marquee-scroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-33.33333%); }
}

/* ── NIEVE (HEADER) ── */
@keyframes fall {
    0%   { top: -20px; }
    100% { top: 110%; }
}
@keyframes sway {
    0%   { transform: translateX(0px)  rotate(0deg); }
    50%  { transform: translateX(15px) rotate(180deg); }
    100% { transform: translateX(0px)  rotate(360deg); }
}

/* ── HERO TITLE ENTRADA ── */
@keyframes slideInDown {
    0%   { opacity: 0; transform: translateY(-50px); }
    100% { opacity: 1; transform: translateY(0); }
}
@keyframes slideInLeft {
    0%   { opacity: 0; transform: translateX(-50px); }
    100% { opacity: 1; transform: translateX(0); }
}
@keyframes slideInRight {
    0%   { opacity: 0; transform: translateX(50px) scale(0.9); }
    100% { opacity: 1; transform: translateX(0) scale(1); }
}

/* ── ROSTER FLOATING LIST ── */
@keyframes rosterEnter {
    to { opacity: 1; transform: translateX(0); }
}

/* ── COOKIE ── */
@keyframes cookiePulse {
    0%, 100% { transform: scale(1); }
    50%       { transform: scale(1.15); }
}

/* ── TYPEWRITER ── */
@keyframes typing {
    from { width: 0; }
    to   { width: 100%; }
}
@keyframes blink {
    from, to { border-color: transparent; }
    50%       { border-color: var(--brand-primary, #00ccff); }
}

/* ── LOL FONDO ── */
@keyframes drift {
    from { background-position: 0 0; }
    to   { background-position: 1000px 1000px; }
}

/* ── TECH HUD ── */
@keyframes hologram-flicker {
    0%   { opacity: 0.8; text-shadow: 0 0 5px var(--brand-primary); }
    5%   { opacity: 1;   text-shadow: 0 0 15px var(--brand-primary), 0 0 5px #fff; }
    10%  { opacity: 0.8; text-shadow: 0 0 5px var(--brand-primary); }
    50%  { opacity: 0.9; text-shadow: 0 0 8px var(--brand-primary); }
    55%  { opacity: 1;   text-shadow: 0 0 20px var(--brand-primary); }
    100% { opacity: 0.9; text-shadow: 0 0 8px var(--brand-primary); }
}

/* ── ARCOÍRIS (TEXTO) ── */
@keyframes moverArcoiris {
    to { background-position: 200% center; }
}

/* ── ERROR PAGE ── */
@keyframes impact-appear {
    0%   { transform: scale(1.5); opacity: 0; }
    100% { transform: scale(1);   opacity: 1; }
}
@keyframes shake-hard {
    0%   { transform: translate(0,   0); }
    25%  { transform: translate(5px, 5px); }
    50%  { transform: translate(-5px, -5px); }
    75%  { transform: translate(5px, -5px); }
    100% { transform: translate(0, 0); }
}