/* transitions.css — animaciones de entrada escalonadas y reduced-motion */

/* Elementos animables: entran con fade + leve desplazamiento al activarse la slide */
[data-animate] {
  opacity: 0;
  transform: translateY(18px);
}
.slide.is-active [data-animate] {
  opacity: 1;
  transform: none;
  transition: opacity 0.6s var(--ease), transform 0.6s var(--ease);
  transition-delay: calc(var(--i, 0) * 90ms + 120ms);
}

/* La cabecera entra primero, sin depender del índice de body */
.slide.is-active .slide-head [data-animate] { transition-delay: 60ms; }

/* Respeto por usuarios que prefieren menos movimiento */
@media (prefers-reduced-motion: reduce) {
  .slide, .slide.is-active,
  [data-animate], .slide.is-active [data-animate],
  .hm-cell, .is-active .hm-cell,
  #progress, .nav-btn {
    transition: none !important;
    transform: none !important;
    animation: none !important;
  }
  [data-animate] { opacity: 1 !important; }
  .hm-cell { opacity: 1 !important; }
}