/* Motion layer — only active when JS adds html.motion (so no-JS / reduced-motion = fully visible). */

/* Reveal: hidden only when motion is on; revealed on .in */
.motion .reveal { opacity: 0; transform: translateY(30px); transition: opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1); will-change: opacity, transform; }
.motion .reveal.in { opacity: 1; transform: none; }

/* Staggered children */
.motion .reveal-stagger > * { opacity: 0; transform: translateY(26px); transition: opacity .8s ease, transform .8s ease; }
.motion .reveal-stagger.in > * { opacity: 1; transform: none; }
.motion .reveal-stagger.in > *:nth-child(1) { transition-delay: 0s; }
.motion .reveal-stagger.in > *:nth-child(2) { transition-delay: .09s; }
.motion .reveal-stagger.in > *:nth-child(3) { transition-delay: .18s; }
.motion .reveal-stagger.in > *:nth-child(4) { transition-delay: .27s; }
.motion .reveal-stagger.in > *:nth-child(5) { transition-delay: .36s; }
.motion .reveal-stagger.in > *:nth-child(6) { transition-delay: .45s; }

/* Image clip-wipe reveal */
.motion .reveal-img { clip-path: inset(0 0 100% 0); transition: clip-path 1.1s cubic-bezier(.2,.8,.2,1); }
.motion .reveal-img.in { clip-path: inset(0 0 0 0); }

/* Gold foil divider draw-in */
.motion .foil-rule { transform: scaleX(0); transform-origin: left center; transition: transform 1s cubic-bezier(.2,.8,.2,1); }
.motion .foil-rule.in { transform: scaleX(1); }

@media (prefers-reduced-motion: reduce) {
    .motion .reveal, .motion .reveal-stagger > *, .motion .reveal-img, .motion .foil-rule {
        opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important;
    }
}