/* Noir Couture motion layer — slow, editorial, cinematic.
   All animation scoped under html.motion (added by motion.js only when JS runs).
   Without JS, or under reduced-motion, everything is fully visible. */

.motion .reveal { opacity: 0; transform: translateY(30px); transition: opacity 1s cubic-bezier(.22,.8,.3,1), transform 1s cubic-bezier(.22,.8,.3,1); }
.motion .reveal.in { opacity: 1; transform: none; }

.motion .reveal-stagger > * { opacity: 0; transform: translateY(26px); transition: opacity .85s cubic-bezier(.22,.8,.3,1), transform .85s cubic-bezier(.22,.8,.3,1); }
.motion .reveal-stagger.in > * { opacity: 1; transform: none; }
.motion .reveal-stagger.in > *:nth-child(1) { transition-delay: .00s; }
.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; }
.motion .reveal-stagger.in > *:nth-child(7) { transition-delay: .54s; }
.motion .reveal-stagger.in > *:nth-child(8) { transition-delay: .63s; }

/* curtain clip-wipe for feature images */
.motion .reveal-img { clip-path: inset(0 100% 0 0); transition: clip-path 1.15s cubic-bezier(.76,0,.24,1); }
.motion .reveal-img.in { clip-path: inset(0 0 0 0); }

/* gold foil rule draw-in */
.motion .foil-rule { transform: scaleX(0); transform-origin: left; transition: transform .9s ease .15s; }
.motion .foil-rule.in { transform: scaleX(1); }

/* hero Ken-Burns */
@keyframes kenburns { from { transform: scale(1.001); } to { transform: scale(1.09); } }
.motion .hero-slide.active img { animation: kenburns 16s ease-out forwards; }

@media (prefers-reduced-motion: reduce) {
    .motion .reveal,
    .motion .reveal-stagger > *,
    .motion .reveal-img { opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important; }
    .motion .foil-rule { transform: none !important; }
    .motion .hero-slide.active img { animation: none !important; }
    html { scroll-behavior: auto; }
}