/* ===========================================================
   Merchiamo — Reveal on scroll SOBRIO (alineado al Wix real)
   El Wix de Merchiamo anima de forma discreta: fade simple + un
   leve ascenso, y movimiento sutil en los fondos. NO usa glide
   lateral, zoom ni giros 3D. Esta versión reproduce esa sobriedad:
     - efecto único: fade + rise muy leve (20px)  · curva firma Wix
     - todas las clases heredadas (.float/.glide/.expand/.fold) se
       unifican a ese mismo fade-rise (se quitaron los efectos
       llamativos que el agente anterior había exagerado).
   El estado oculto SOLO aplica bajo .js-anim (lo pone anim.js):
   sin JS o con reduce-motion, TODO queda visible.
   No toca tamaños ni object-fit; el estado final es transform:none.
   Backup de la versión llamativa: anim.css.prellamativas.bak
   =========================================================== */

@keyframes mch-fadeIn {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes mch-rise {
  0%   { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: no-preference) {
  /* Estado inicial: oculto, listo para animar (solo con JS activo). */
  .js-anim .reveal {
    opacity: 0;
    backface-visibility: hidden;
  }

  /* Al entrar en viewport, anim.js agrega .is-visible -> fade + leve ascenso.
     fill-mode backwards = respeta el estado del 0% durante el delay. */
  .js-anim .reveal.is-visible {
    animation: mch-rise 900ms cubic-bezier(.445,.05,.55,.95) backwards;
    opacity: 1;
  }

  /* Todas las variantes heredadas se comportan igual: fade + rise sutil.
     (Antes: float 100px / glide lateral / expand zoom / fold 3D — removidos
     por no corresponder al Wix, que es sobrio.) Se listan para que cualquier
     clase ya presente en el HTML quede unificada a este efecto. */
  .js-anim .reveal.float.is-visible,
  .js-anim .reveal.float-sm.is-visible,
  .js-anim .reveal.glide-left.is-visible,
  .js-anim .reveal.glide-right.is-visible,
  .js-anim .reveal.expand.is-visible,
  .js-anim .reveal.fold.is-visible {
    animation-name: mch-rise;
    animation-timing-function: cubic-bezier(.445,.05,.55,.95);
    transform-origin: center;
  }

  /* Stagger: escalonado leve para listas/grillas. */
  .js-anim .reveal.d1.is-visible { animation-delay: .08s; }
  .js-anim .reveal.d2.is-visible { animation-delay: .16s; }
  .js-anim .reveal.d3.is-visible { animation-delay: .24s; }
  .js-anim .reveal.d4.is-visible { animation-delay: .32s; }
  .js-anim .reveal.d5.is-visible { animation-delay: .40s; }
  .js-anim .reveal.d6.is-visible { animation-delay: .48s; }
}

/* Accesibilidad: reduce-motion -> todo visible, sin animar. */
@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}
