/*
 * Swup page-transition styles (Amplifi)
 * Standalone file enqueued on every page so it is NEVER overwritten by the
 * on-server Tailwind rebuild of main.css. Container = #primary.
 */

/* The container fades + lifts during a Swup visit. Duration here is what
   Swup waits on before swapping content, so keep it in sync with the JS. */
.transition-main {
    transition: opacity 0.32s ease, transform 0.32s ease;
    will-change: opacity, transform;
}

html.is-animating .transition-main {
    opacity: 0;
    transform: translateY(10px);
}

/* Prevent a flash of un-transitioned content on the very first paint of a
   freshly swapped page (before GSAP re-runs the staggered reveal). */
html.is-rendering .transition-main {
    opacity: 0;
}

/* Respect reduced-motion users: no transform, near-instant fade. */
@media (prefers-reduced-motion: reduce) {
    .transition-main {
        transition: opacity 0.12s linear;
    }
    html.is-animating .transition-main {
        transform: none;
    }
}
