/* Entrance choreography uses individual transform axes to preserve layout rotations. */
.motion-enter{transition:opacity .8s ease var(--motion-delay,0ms),translate 1s cubic-bezier(.16,1,.3,1) var(--motion-delay,0ms),scale 1.1s cubic-bezier(.16,1,.3,1) var(--motion-delay,0ms),rotate 1.1s cubic-bezier(.16,1,.3,1) var(--motion-delay,0ms)}
.motion-enter.motion-pending{opacity:0;translate:0 24px}
.motion-nav.motion-pending{translate:0 -12px}
.motion-capture.motion-pending{translate:0 42px;scale:.94;rotate:3deg}
.motion-capture:nth-child(even).motion-pending{rotate:-3deg}
/* Ambient movement starts only when its scene is in view. */
.motion-float:not(.motion-pending){animation:capture-breathe var(--float-duration,8s) ease-in-out var(--float-phase,0s) infinite;animation-play-state:paused}
.motion-active .motion-float:not(.motion-pending){animation-play-state:running}
@keyframes capture-breathe{0%,100%{translate:0 0}50%{translate:0 -11px}}
.inspect-art,.scenePhoto,.downloadArtwork{scale:1.06;translate:0 var(--scene-depth,0px)}
.motion-enhanced .floating-type span{animation:font-wander var(--wander-time,25s) ease-in-out var(--wander-phase,0s) infinite;animation-play-state:paused}
.motion-active .floating-type span{animation-play-state:running}
@keyframes font-wander{
  0%,100%{transform:translate3d(0,0,0) rotate(var(--tilt))}
  28%{transform:translate3d(var(--wander-x),var(--wander-y),0) rotate(calc(var(--tilt) + 18deg))}
  56%{transform:translate3d(calc(var(--wander-x) * -.55),calc(var(--wander-y) * 1.25),0) rotate(calc(var(--tilt) - 12deg))}
  80%{transform:translate3d(calc(var(--wander-x) * -.8),calc(var(--wander-y) * -.35),0) rotate(calc(var(--tilt) + 8deg))}
}
/* Give the product's decorative specimen a slow, separate orbit. */
.motion-enhanced .stage-letter{animation:specimen-orbit 18s ease-in-out infinite alternate;animation-play-state:paused}
.motion-enhanced .motion-active .stage-letter{animation-play-state:running}
@keyframes specimen-orbit{from{transform:translate(-8px,5px) rotate(-14deg)}to{transform:translate(18px,-12px) rotate(-7deg)}}
@media(max-width:700px){.motion-capture.motion-pending{translate:0 26px}}
@media(prefers-reduced-motion:reduce){
  .motion-enter,.motion-enter.motion-pending{opacity:1;translate:none;scale:none;rotate:none;transition:none}
  .motion-float:not(.motion-pending),.floating-type span,.stage-letter{animation:none!important}
  .inspect-art,.scenePhoto,.downloadArtwork{scale:none;translate:none}
}
