/* ===== WardenCraft — todas as animações ===== */
@keyframes barflow{to{background-position:300% 0}}
@keyframes kenburns{from{transform:scale(1.02) translate(0,0)}to{transform:scale(1.14) translate(-2%,-1.5%)}}
@keyframes sonic{0%{transform:scale(.15);opacity:.9;border-width:5px}100%{transform:scale(2.4);opacity:0;border-width:1px}}
@keyframes float{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-18px) rotate(1.5deg)}}
@keyframes shine{to{background-position:-250% 0}}
@keyframes ringpulse{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.25,1.6);opacity:0}}
@keyframes wheel{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(16px)}}
@keyframes glitch{0%{clip-path:inset(10% 0 60% 0)}25%{clip-path:inset(55% 0 10% 0)}50%{clip-path:inset(30% 0 40% 0)}75%{clip-path:inset(75% 0 5% 0)}100%{clip-path:inset(5% 0 80% 0)}}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes ping{0%{box-shadow:0 0 0 0 currentColor}70%{box-shadow:0 0 0 12px transparent}100%{box-shadow:0 0 0 0 transparent}}
.dot{color:var(--ok)}
@keyframes bump{0%{transform:scale(1)}35%{transform:scale(1.6) rotate(-8deg)}100%{transform:scale(1)}}
@keyframes ripple{to{transform:scale(40);opacity:0}}
@keyframes shake{20%,60%{translate:-6px 0}40%,80%{translate:6px 0}}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes fadeDown{from{opacity:0;translate:0 -12px}to{opacity:1;translate:0 0}}
@keyframes lineOut{to{opacity:0;translate:60px 0;height:0;padding:0}}
@keyframes toastIn{from{opacity:0;translate:0 30px;scale:.9}to{opacity:1;translate:0 0;scale:1}}
@keyframes toastOut{to{opacity:0;translate:0 14px}}
@keyframes skel{to{background-position:-200% 0}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pageIn{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
@keyframes popIn{0%{opacity:0;scale:.6}70%{scale:1.08}100%{opacity:1;scale:1}}

/* entrada da página e saída ao trocar */
body{animation:pageIn .7s var(--ease) both}
body.leaving{opacity:0;translate:0 -10px;transition:opacity .22s ease,translate .22s ease}

/* aparecer ao rolar (só quando o JS está ativo) */
.js [data-reveal]{opacity:0;translate:0 38px;scale:.97;transition:opacity .9s var(--ease),translate .9s var(--ease),scale .9s var(--ease);transition-delay:var(--d,0s)}
.js [data-reveal=left]{translate:-50px 0}
.js [data-reveal=right]{translate:50px 0}
.js [data-reveal=zoom]{translate:0 0;scale:.8}
.js [data-reveal].in{opacity:1;translate:0 0;scale:1}

/* sem movimento para quem prefere */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .js [data-reveal]{opacity:1;translate:none;scale:1}
  #fx,#cursor-glow{display:none}
}

/* celular: sem deslocamento lateral (evita rolagem horizontal) */
@media(max-width:860px){.js [data-reveal=left],.js [data-reveal=right]{translate:0 38px}}