/* Motion pilot. Variables --mx/--my (−1…1) come from motion.js; at rest they are 0 and the page is unchanged. */

/* 1 · Product shots: tilt, counter-shadow and a soft light on the mat. */
.pv-stage{perspective:1400px}
.pv-stage picture{transform:rotateY(calc(var(--mx,0) * 3.2deg)) rotateX(calc(var(--my,0) * -2.6deg)) translate3d(calc(var(--mx,0) * -6px),calc(var(--my,0) * -5px),0);transform-origin:30% 40%;will-change:transform}
.pv-stage img{box-shadow:calc(var(--mx,0) * -16px) calc(34px + var(--my,0) * -10px) 70px -34px #1a221b70,0 0 0 1px #1a221b14}
.pv-stage:after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;background:radial-gradient(520px circle at calc(50% + var(--mx,0) * 42%) calc(45% + var(--my,0) * 40%),#ffffff4d,transparent 62%);opacity:0;transition:opacity .45s}
.pv-stage.is-tracking:after{opacity:1}

/* 2 · Hero A2 depth: individual `translate` composes with each card's own rotation. */
.evidence-object{transition:box-shadow .4s}

/* 3 · Executive plate: bars grow from zero once, in sequence; the 100 % mark stays put. */
.xp.motion-ready .xp-chart li b:before{transform:scaleX(0);transform-origin:left center;transition:transform .9s cubic-bezier(.2,.7,.2,1) calc(.15s + var(--i,0) * 70ms)}
.xp.motion-ready .xp-chart li em{opacity:0;transition:opacity .5s calc(.45s + var(--i,0) * 70ms)}
.xp.motion-ready.is-live .xp-chart li b:before{transform:none}
.xp.motion-ready.is-live .xp-chart li em{opacity:1}

@media(prefers-reduced-motion:reduce){
 .pv-stage picture{transform:none}
 .pv-stage:after{display:none}
 .xp .xp-chart li b:before{transform:none!important;transition:none!important}
 .xp .xp-chart li em{opacity:1!important;transition:none!important}
}