/* Transitran · movimiento de apoyo (T-56). Solo transform/opacity; depende de los tokens de styles.css.
   Las entradas (.r1-.r3, .rv, .fi) y la línea de tiempo viven en styles.css. Aquí: progreso de lectura,
   mapas, menú móvil y respuesta al presionar. Todo se anula con prefers-reduced-motion. */
:root { --m-ease: cubic-bezier(.23, 1, .32, 1); }

/* Guías: barra de progreso de lectura (la crea motion.js) */
.motion-progress {
    position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 80; pointer-events: none;
    background: var(--accent-fill); transform: scaleX(0); transform-origin: left; opacity: 0;
    transition: opacity 160ms ease;
}
.motion-progress.is-on { opacity: 1; }

/* Mapa de sede: fundido al cargar (solo si motion.js lo marcó) */
.sede__map iframe.m-map-wait { opacity: 0; transition: opacity 400ms ease; }
.sede__map iframe.m-map-wait.m-map-ready { opacity: 1; }

@media (prefers-reduced-motion: no-preference) {
    /* Menú móvil: abre con escala y opacidad; opciones escalonadas */
    .mobile-menu:not([hidden]) { transform-origin: top right; animation: m-pop 220ms var(--m-ease) backwards; }
    .mobile-menu:not([hidden]) li { animation: m-in 300ms var(--m-ease) backwards; }
    .mobile-menu:not([hidden]) li:nth-child(2) { animation-delay: 30ms; }
    .mobile-menu:not([hidden]) li:nth-child(3) { animation-delay: 60ms; }
    .mobile-menu:not([hidden]) li:nth-child(4) { animation-delay: 90ms; }
    .mobile-menu:not([hidden]) li:nth-child(n+5) { animation-delay: 120ms; }

    /* Respuesta al presionar */
    .menu-toggle { transition: transform 120ms var(--m-ease); }
    .menu-toggle:active { transform: scale(.94); }
    .site-footer a { transition: transform 160ms var(--m-ease); }
    .site-footer a:active { transform: scale(.98); transition-duration: 70ms; }
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
    .site-footer a:hover { transform: translateX(2px); }
}
@keyframes m-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes m-pop { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
    .motion-progress { display: none; }
    .sede__map iframe.m-map-wait { transition-duration: 200ms; }
}
