/* Progressive-enhancement motion utilities. Content is visible until site-motion.js enables motion-ready. */
.motion-reveal { transition: opacity 620ms cubic-bezier(0.22, 1, 0.36, 1), transform 620ms cubic-bezier(0.22, 1, 0.36, 1); }
.motion-fade-up { --motion-transform: translate3d(0, 18px, 0); }
.motion-fade-left { --motion-transform: translate3d(-22px, 0, 0); }
.motion-fade-right { --motion-transform: translate3d(22px, 0, 0); }
.motion-scale-in { --motion-transform: scale(.985); }
.motion-stagger > .motion-reveal { transition-delay: var(--motion-delay, 0ms); }
.motion-delay-1 { --motion-delay: 80ms; }
.motion-delay-2 { --motion-delay: 160ms; }
.motion-delay-3 { --motion-delay: 240ms; }

.motion-ready .motion-reveal:not(.is-visible) { opacity: 0; transform: var(--motion-transform, translate3d(0, 18px, 0)); }
.motion-ready .motion-reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
    .motion-reveal,
    .motion-stagger > .motion-reveal { transition: none !important; transition-delay: 0ms !important; }

    .motion-ready .motion-reveal:not(.is-visible),
    .motion-ready .motion-reveal.is-visible { opacity: 1; transform: none; }
}
