/* =============================================================
   TOTONIK — animations.css
   Sistema de movimiento: solo transform / opacity / clip-path.
   Sin JavaScript (.js ausente) todo el contenido queda visible.
   ============================================================= */

@keyframes flicker { 0%, 100% { transform: translate(0, -55%) scale(1) rotate(0); } 30% { transform: translate(0, -58%) scale(1.08, .95) rotate(-4deg); } 60% { transform: translate(0, -54%) scale(.95, 1.06) rotate(3deg); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes marquee { to { transform: translateX(-50%); } }
@keyframes pulse { 0% { opacity: .9; transform: scale(.8); } 100% { opacity: 0; transform: scale(1.8); } }
@keyframes lidWipe { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes introOut { 0%, 55% { clip-path: inset(0 0 0 0); } 100% { clip-path: inset(0 0 100% 0); } }
@keyframes introFlame { 0% { opacity: 0; transform: translateY(20px) scale(.85); } 35%, 60% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(-30px) scale(1.05); } }
@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(6px); } }

/* Cortina de entrada (se retira sola, sin depender de JS) */
.intro { animation: introOut 1.25s var(--ease-io) forwards; }
.intro__flame { animation: introFlame 1.1s var(--ease-out) forwards; }
html.intro-seen .intro { display: none; }

/* Cambio de cubierta: barrido de color de arriba hacia abajo */
.lid__img.is-entering { animation: lidWipe .7s var(--ease-out) both; }

/* ---------- Reveal genérico ---------- */
.js .reveal { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--ease-out), transform 1.1s var(--ease-out); transition-delay: var(--d, 0s); }
.js .reveal.is-in { opacity: 1; transform: none; }
.js .reveal-scale { opacity: 0; transform: scale(.94) translateY(20px); transition: opacity 1.1s var(--ease-out), transform 1.4s var(--ease-out); transition-delay: var(--d, 0s); }
.js .reveal-scale.is-in { opacity: 1; transform: none; }

/* Titulares por líneas (máscara) */
.split .line { display: block; overflow: hidden; padding-bottom: .04em; margin-bottom: -.04em; }
.split .line__inner { display: inline-block; }
.js .split .line__inner { transform: translateY(108%); transition: transform 1.1s var(--ease-out); transition-delay: calc(var(--i, 0) * .09s + var(--d, 0s)); }
.js .split.is-in .line__inner { transform: none; }

/* Imágenes de galería: aparición con máscara */
.js .gitem.reveal { transform: none; opacity: 1; }
.js .gitem.reveal .gitem__link { clip-path: inset(12% 0 0 0); transition: clip-path 1.2s var(--ease-out); transition-delay: var(--d, 0s); }
.js .gitem.reveal .gitem__link img { transform: scale(1.12); transition: transform 1.6s var(--ease-out); transition-delay: var(--d, 0s); }
.js .gitem.reveal.is-in .gitem__link { clip-path: inset(0 0 0 0); }
.js .gitem.reveal.is-in .gitem__link img { transform: none; }
.js .gitem.reveal.is-in .gitem__link:hover img { transform: scale(1.045); }

.hero__scroll .icon { animation: bob 2s ease-in-out infinite; }

/* ---------- Movimiento reducido ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; transition-delay: 0s !important; scroll-behavior: auto !important; }
  .intro { display: none; }
  .js .reveal, .js .reveal-scale, .js .split .line__inner, .js .gitem.reveal .gitem__link, .js .gitem.reveal .gitem__link img { opacity: 1; transform: none; clip-path: none; }
  .parallax, .strip__track, .hero__product .lid, .hero__disc { transform: none !important; }
  .fire { height: auto; }
  .fire__sticky { position: relative; height: 80vh; }
  .fire__media { clip-path: none; }
  .fire__video { transform: none; }
  .fire__copy { opacity: 1; transform: none; }
  .fire__word { background-size: 100% 100%; }
  .words .w { opacity: 1 !important; }
  .qband__marquee > span, .hero__ring svg { animation: none; }
  .cursor { display: none; }
}