/* =========================================================
   1619 Studio – Motion system (based on the DEV.UN prototype)
   Add data-anim="…" to any element; motion.js adds .is-in
   when it scrolls into view. Optional: data-delay="0.3" (s)
   ========================================================= */
:root{--m-ease:cubic-bezier(.19,1,.22,1);--m-dur:1.2s}

/* Lenis smooth scroll */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}

[data-anim]{transition:transform var(--m-dur) var(--m-ease),opacity var(--m-dur) var(--m-ease),clip-path var(--m-dur) var(--m-ease);transition-delay:var(--d,0s)}

/* fades */
[data-anim="fade"]{opacity:0}
[data-anim="fade-down"]{opacity:0;transform:translateY(-20px)}
[data-anim="fade-up"]{opacity:0;transform:translateY(40px)}

/* slides from the side (copy, images, side lists) */
[data-anim="slide-left"]{opacity:0;transform:translateX(-70px)}
[data-anim="slide-right"]{opacity:0;transform:translateX(70px)}

/* big word emerging from the left edge of its own mask (hero brand word) */
[data-anim="emerge"]{overflow:hidden}
[data-anim="emerge"]>*{display:inline-block;transform:translateX(-102%);transition:transform 1.6s var(--m-ease) var(--d,0s)}

/* text line rising out of a mask */
[data-anim="mask-up"]{overflow:hidden}
[data-anim="mask-up"]>*{display:block;transform:translateY(105%);transition:transform 1.2s var(--m-ease) var(--d,0s)}

/* left-to-right wipe (CTA headline, gold buttons, images) */
[data-anim="wipe"]{clip-path:inset(0 100% 0 0)}

/* two-word heading: first word from the left, second from the right */
[data-anim="pair"]>*{display:block;opacity:0;transition:transform 1.4s var(--m-ease),opacity 1s var(--m-ease)}
[data-anim="pair"]>:first-child{transform:translateX(-12vw);transition-delay:var(--d,0s)}
[data-anim="pair"]>:last-child{transform:translateX(12vw);transition-delay:calc(var(--d,0s) + .12s)}

/* thin offset frame line drawing in from its top-left corner */
[data-anim="frame"]{clip-path:inset(0 100% 100% 0);transition-duration:1.8s}

/* image zooming out inside its mask */
[data-anim="zoom"]{overflow:hidden}
[data-anim="zoom"]>*{display:block;transform:scale(1.18);transition:transform 1.8s var(--m-ease) var(--d,0s)}

/* curtain: a brand-colour panel sweeps across, then the image is revealed */
[data-anim="curtain"]{position:relative;overflow:hidden}
[data-anim="curtain"]::after{content:"";position:absolute;inset:0;z-index:2;background:var(--curtain,#51372A);transform:scaleX(0);transform-origin:left;pointer-events:none}
[data-anim="curtain"]>*{opacity:0;transform:scale(1.15);transition:opacity .01s linear calc(var(--d,0s) + .7s),transform 1.8s var(--m-ease) calc(var(--d,0s) + .7s)}
[data-anim="curtain"].is-in::after{animation:m-curtain 1.4s cubic-bezier(.77,0,.18,1) var(--d,0s) both}
@keyframes m-curtain{0%{transform:scaleX(0);transform-origin:left}50%{transform:scaleX(1);transform-origin:left}50.01%{transform-origin:right}100%{transform:scaleX(0);transform-origin:right}}

/* image rising inside its mask */
[data-anim="rise"]{overflow:hidden}
[data-anim="rise"]>*{display:block;transform:translateY(101%) scale(1.2);transition:transform 1.5s var(--m-ease) var(--d,0s)}

/* hover: slow zoom + caption slide-up (no data-anim needed) */
.img-hover{position:relative;overflow:hidden;display:block}
.img-hover>.ph,.img-hover>img{transition:transform 1.4s var(--m-ease),filter .8s var(--m-ease)}
.img-hover:hover>.ph,.img-hover:hover>img,.img-hover:focus-visible>.ph{transform:scale(1.07);filter:brightness(.72)}
.img-hover .cap{position:absolute;left:0;right:0;bottom:0;padding:22px;color:#fff;transform:translateY(100%);transition:transform .8s var(--m-ease)}
.img-hover:hover .cap,.img-hover:focus-visible .cap{transform:none}

/* parallax inside a mask: add data-parallax-inner="0.08" to the frame (keep ≤ 0.1) */
[data-parallax-inner]{overflow:hidden;position:relative}
[data-parallax-inner]>*{position:absolute;left:0;right:0;top:-12%;height:124%;will-change:transform}

/* ---------- revealed ---------- */
[data-anim].is-in{opacity:1;transform:none;clip-path:inset(0 0 0 0)}
[data-anim="emerge"].is-in>*,[data-anim="mask-up"].is-in>*,[data-anim="pair"].is-in>*,[data-anim="zoom"].is-in>*,[data-anim="rise"].is-in>*,[data-anim="curtain"].is-in>*{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  [data-anim],[data-anim="emerge"]>*,[data-anim="mask-up"]>*,[data-anim="pair"]>*,[data-anim="zoom"]>*,[data-anim="rise"]>*,[data-anim="curtain"]>*{transition:none!important;opacity:1!important;transform:none!important;clip-path:none!important}
  [data-anim="curtain"]::after{animation:none!important;display:none}
}