/* * Swup page transition styles. * * Hand-authored (NOT compiled from SCSS) so it can be edited without running the * SCSS build. Swup adds `is-animating` to during the transition and waits * for the CSS transition on the matched container (#swup, via its * `swup-transition-*` class) to finish before swapping content. * * Current effect: simple crossfade. Swappable — replace the rules below to change * the transition feel (wipe, slide, etc.) without touching any JS. */ #swup.swup-transition-fade { transition: opacity 0.35s ease; will-change: opacity; } html.is-animating #swup.swup-transition-fade { opacity: 0; } /* Respect reduced-motion: still swap, but with no animation. */ @media (prefers-reduced-motion: reduce) { #swup.swup-transition-fade { transition: none; } html.is-animating #swup.swup-transition-fade { opacity: 1; } }