/* =========================================================
   AuraSync — entrada por scroll
   El estado final es el valor por defecto. Sin JS, todo visible.
   La animación solo se activa cuando el JS marca la página como capaz.
   ========================================================= */

/* Sin la clase, nada cambia: el sitio es legible tal cual */
.js-reveal [data-reveal]{
  opacity:0;
  transform:translateY(14px);
  transition:opacity .62s cubic-bezier(.22,.68,.24,1),
             transform .62s cubic-bezier(.22,.68,.24,1);
  transition-delay:var(--rd,0ms);
  will-change:opacity,transform;
}

.js-reveal [data-reveal].is-in{
  opacity:1;
  transform:none;
}

/* una vez dentro, se libera el hint de composición */
.js-reveal [data-reveal].is-done{will-change:auto;transition:none}

/* elementos que entran desde el lado — figuras, tablas, listas laterales */
.js-reveal [data-reveal="lado"]{transform:translateY(10px) translateX(12px)}
.js-reveal [data-reveal="lado"].is-in{transform:none}

/* bloques amplios: solo desvanecen, sin desplazamiento */
.js-reveal [data-reveal="suave"]{transform:none}

@media (prefers-reduced-motion:reduce){
  .js-reveal [data-reveal],
  .js-reveal [data-reveal].is-in{opacity:1;transform:none;transition:none}
}