/**
 * BAIRS — View Transitions globales
 * Asigna nombres a regiones que comparten todas las páginas para que
 * la API haga crossfade nativo al navegar entre ellas.
 *
 * Cargado en TODAS las páginas como complemento a `view-transitions.js`,
 * que es el que dispara `document.startViewTransition()` en clicks internos.
 *
 * Si el browser no soporta `view-transition-name`, las reglas se ignoran (no-op).
 */

@supports (view-transition-name: none) {
    /* Header y footer compartidos: misma región anclada entre páginas. */
    .site-header { view-transition-name: bairs-header; }
    .site-footer,
    footer.site-footer { view-transition-name: bairs-footer; }

    /* Main: todas las plantillas tienen un `<main id="main">`. Comparte nombre. */
    .site-main { view-transition-name: bairs-main; }

    /* Heroes — todos los heroes del sitio comparten nombre, así el video/imagen
       de fondo hace crossfade limpio al cambiar de página. */
    .hero-section,
    .cobertura-hero,
    .cyberseguridad-hero,
    .tpa-hero,
    .nosotros-hero,
    .aseguradoras-hero,
    .servicios-hero-parallax,
    .side-image-page { view-transition-name: bairs-hero; }

    /* Curva consistente con el resto del sistema de movimiento. */
    ::view-transition-old(root),
    ::view-transition-new(root) {
        animation-duration: 320ms;
        animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
    }

    ::view-transition-old(bairs-hero),
    ::view-transition-new(bairs-hero) {
        animation-duration: 420ms;
        animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
    }
}

@media (prefers-reduced-motion: reduce) {
    @supports (view-transition-name: none) {
        ::view-transition-old(root),
        ::view-transition-new(root),
        ::view-transition-old(bairs-hero),
        ::view-transition-new(bairs-hero) {
            animation: none !important;
        }
    }
}