/* Sealed motion layer. Paste after the site's existing <style>. */
:root{
  --e-sink:cubic-bezier(.55,0,.25,1);      /* slow start, heavy settle */
  --e-press:cubic-bezier(.7,0,.84,0);      /* accelerate into the press */
  --e-settle:cubic-bezier(.22,1.4,.36,1);  /* small overshoot, wax rebound */
  --e-out:cubic-bezier(.16,1,.3,1);        /* calm exits, reveals */
  --e-hover:cubic-bezier(.3,.7,.4,1);
}
/* ---------- reveal base (IO adds .in) ---------- */
.js [data-sm]{transition:transform .9s var(--e-out),opacity .9s var(--e-out),clip-path 1.1s var(--e-sink)}
.js [data-sm="sink"]{opacity:0;transform:translateY(-28px)}                 /* drops INTO place, from above */
.js [data-sm="strata"]{clip-path:inset(0 0 100% 0)}                        /* uncovered top to bottom like a dig */
.js [data-sm="core"]{clip-path:inset(0 0 0 0 round 14px);transform:scaleY(.92);transform-origin:top;opacity:0}
.js [data-sm="press"]{opacity:0;transform:scale(1.06)}                     /* lowered onto the page */
.js [data-sm].sm-in{opacity:1;transform:none;clip-path:inset(0 0 0 0)}
.js .steps .st[data-sm]{transition-delay:calc(var(--i,0) * 110ms)}

/* ---------- hero strata parallax (scroll-driven, fallback via JS var) ---------- */
#s1{position:relative;overflow:clip}
.strata-bg{position:absolute;inset:auto 0 0 0;height:60%;pointer-events:none;z-index:0}
.strata-bg i{position:absolute;inset:0;background:url(/motion-strata-bands.svg) bottom/100% 100% no-repeat;will-change:transform;
  transform:translate3d(0,calc(var(--p,0) * var(--d) * -1px),0)}
.strata-bg i:nth-child(1){--d:40;opacity:.55}.strata-bg i:nth-child(2){--d:90;opacity:.75;height:80%;top:auto}.strata-bg i:nth-child(3){--d:150}
#s1 .wrap{position:relative;z-index:1}
@supports (animation-timeline:scroll()){
  .strata-bg i{animation:dig linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
  @keyframes dig{to{transform:translate3d(0,calc(var(--d) * -1px),0)}}
}

/* ---------- capsule depth rail (desktop) ---------- */
.depth-rail{position:fixed;right:28px;top:96px;bottom:40px;width:24px;z-index:5;pointer-events:none}
.depth-rail::before{content:"";position:absolute;left:11px;top:0;bottom:0;width:2px;
  background:repeating-linear-gradient(#4A4038 0 14px,transparent 14px 20px)}
.depth-rail .cap{position:absolute;left:0;top:0;width:24px;height:15px;background:url(/motion-capsule.svg) center/contain no-repeat;
  transform:translate3d(0,calc(var(--p,0) * (100cqh - 15px)),0);will-change:transform}
.depth-rail{container-type:size}
.depth-rail .tick{position:absolute;left:30px;font:500 10px var(--m,monospace);color:#9C8F7E;letter-spacing:.1em;white-space:nowrap;
  transform:translateY(-50%);opacity:.5;transition:opacity .3s,color .3s}
.depth-rail .tick.on{opacity:1;color:#E0A23B}
@supports (animation-timeline:scroll()){
  .depth-rail .cap{animation:descend linear both;animation-timeline:scroll(root)}
  @keyframes descend{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,calc(100cqh - 15px),0)}}
}
@media(max-width:860px){.depth-rail{display:none}}

/* ---------- seal press ---------- */
.press{position:relative;width:132px;height:132px;margin:0 auto 18px}
.press>*{position:absolute;inset:0;width:100%;height:100%}
.press .wax{transform:scale(.25,.25);opacity:0}
.press .ring,.press .imp{opacity:0}
.press .stamp{inset:-10% ;transform:translate3d(0,-160%,0);opacity:0}
.press.go .stamp{animation:stamp 900ms var(--e-press) forwards}
.press.go .wax{animation:spread 700ms 380ms var(--e-settle) forwards}
.press.go .ring{animation:show 300ms 560ms ease-out forwards}
.press.go .imp{animation:impress 600ms 600ms var(--e-settle) forwards}
@keyframes stamp{0%{opacity:0;transform:translate3d(0,-160%,0)}25%{opacity:1}42%{transform:translate3d(0,0,0) scale(1.04,.9)}
  60%{transform:translate3d(0,0,0) scale(1,1)}100%{opacity:0;transform:translate3d(0,-120%,0)}}
@keyframes spread{0%{opacity:1;transform:scale(.25)}55%{transform:scale(1.12,.94)}80%{transform:scale(.98,1.02)}100%{opacity:1;transform:scale(1)}}
@keyframes show{to{opacity:1}}
@keyframes impress{0%{opacity:0;transform:scale(1.08)}100%{opacity:1;transform:scale(1)}}

/* ---------- hover micro ---------- */
.btn{transition:transform .25s var(--e-hover),background-color .25s,border-color .25s}
.btn:hover{transform:translateY(1px)}                          /* buttons press DOWN, not up */
.btn:active{transform:translateY(2px) scale(.98)}
.btn.p img{transition:transform .35s var(--e-settle)}
.btn.p:hover img{transform:translateY(3px)}                     /* arrow sinks */
.st .n{transition:transform .4s var(--e-settle),color .3s}
.st:hover .n{transform:translateY(4px);color:#E0A23B}
.pv .card{transition:transform .5s var(--e-out),box-shadow .5s var(--e-out)}
.pv .card:hover{transform:translateY(2px);box-shadow:inset 0 -6px 0 #5F9488}
.wm img{transition:transform .5s var(--e-settle)}.wm:hover img{transform:rotate(-8deg) scale(1.04)}

/* ---------- unearth (#v-cap) ---------- */
.unearth{position:relative;width:132px;height:132px;margin:0 auto -132px;z-index:3;pointer-events:none}
.unearth>*{position:absolute;inset:0;width:100%;height:100%}
.unearth .half.l{clip-path:inset(0 50% 0 0)}.unearth .half.r{clip-path:inset(0 0 0 50%)}
.unearth.go .imp{animation:impout 500ms var(--e-out) forwards}
.unearth.go .half.l{animation:splitl 700ms 250ms var(--e-out) forwards}
.unearth.go .half.r{animation:splitr 700ms 250ms var(--e-out) forwards}
@keyframes impout{to{opacity:0;transform:scale(1.06)}}
@keyframes splitl{to{opacity:0;transform:translateX(-40px) rotate(-12deg)}}
@keyframes splitr{to{opacity:0;transform:translateX(40px) rotate(12deg)}}
#content.rise>:not(.unearth){clip-path:inset(100% 0 0 0);transform:translateY(24px)}
#content.rise.go>:not(.unearth){animation:riseup 1.1s 500ms var(--e-sink) forwards}
@keyframes riseup{to{clip-path:inset(0 0 0 0);transform:none}}
.depth-rail .tick{left:auto;right:30px}
@media(max-width:1399px){.depth-rail .tick{display:none!important}}
/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important;scroll-behavior:auto!important}
  .js [data-sm]{opacity:1!important;transform:none!important;clip-path:none!important}
  .strata-bg i,.depth-rail .cap{transform:none!important;animation:none!important}
  .depth-rail{display:none}
  .press .wax,.press .ring,.press .imp{opacity:1;transform:none}.press .stamp{display:none}
  .unearth{display:none}#content.rise>:not(.unearth){clip-path:none!important;transform:none!important}
}