/* Original motion graphics, inspired by Jitter's masking and card choreography.
   This file belongs only to the isolated motion preview. */
:root{--mg-ease:cubic-bezier(.23,1,.32,1)}
.mg-enabled .hero-copy>h1{opacity:1;translate:none;animation:none}
.mg-hero-line{display:block;overflow:hidden;padding:.08em .1em;margin:-.08em -.1em;white-space:nowrap}
.mg-word{display:inline-block;transform-origin:50% 100%}
.mg-enabled .mg-word{animation:mg-word-in 1.25s var(--mg-ease) both;animation-delay:calc(180ms + var(--word)*75ms)}
@keyframes mg-word-in{from{transform:translateY(115%) rotate(5deg);opacity:0}to{transform:none;opacity:1}}
.mg-see{position:relative;color:#ffbd8e}
.mg-see::after{content:"";position:absolute;bottom:.025em;left:0;right:.04em;height:2px;background:linear-gradient(90deg,#cc550000,#ffbd8e,#cc550000);transform-origin:left}
.mg-enabled .mg-see::after{animation:mg-underline 1.1s 1s var(--mg-ease) both}
@keyframes mg-underline{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.mg-observatory{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;mask-image:linear-gradient(90deg,#000,transparent 37%,transparent 63%,#000)}
.mg-lens{position:absolute;width:clamp(310px,42vw,580px);height:auto;top:47%;left:9%;transform:translate(-50%,-50%);color:#f6b889;opacity:.48}
.mg-lens-secondary{left:92%;top:58%;width:clamp(260px,34vw,470px);opacity:.28}
.mg-lens svg{width:100%;overflow:visible;fill:none;stroke:currentColor;stroke-width:.7}
.mg-lens .mg-orbit{transform-origin:200px 200px}
.mg-enabled .mg-running .mg-orbit{animation:mg-orbit 42s linear infinite}
.mg-enabled .mg-running .mg-orbit-reverse{animation-direction:reverse;animation-duration:58s}
@keyframes mg-orbit{to{transform:rotate(360deg)}}
.mg-contour{stroke-opacity:.6;stroke-width:1;stroke-dasharray:1;stroke-dashoffset:0}
.mg-enabled .mg-contour{animation:mg-draw 2.4s .2s var(--mg-ease) both}
@keyframes mg-draw{from{stroke-dashoffset:1;opacity:0}to{stroke-dashoffset:0;opacity:1}}
.mg-enabled .mg-running .mg-tracer{stroke-dasharray:12 88;animation:mg-trace 9s linear infinite}
@keyframes mg-trace{to{stroke-dashoffset:-100}}
.mg-dot{fill:#ffcfac;stroke:none}
.mg-enabled .mg-running .mg-dot-pulse{animation:mg-dot-pulse 4s ease-in-out infinite}
@keyframes mg-dot-pulse{50%{opacity:.25}}
.mg-replay{position:absolute;bottom:26px;right:max(1.25rem,calc((100vw - 1120px)/2));z-index:3;background:none;border:0;padding:10px;color:#c4b0a1;font-size:.7rem;display:flex;align-items:center;gap:.5rem}
.mg-replay svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.5}
.mg-toggle{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#0a090880;border:1px solid #ffffff24;color:#ccb9ab;padding:0;transition:border-color .2s,color .2s}
.mg-toggle svg{width:13px;height:13px;fill:currentColor}
.mg-toggle:disabled{opacity:.45}
.mg-toggle[data-paused="true"] .mg-pause-icon,.mg-toggle:not([data-paused="true"]) .mg-play-icon{display:none}
.mg-scroll-progress{position:absolute;bottom:-1px;left:0;width:100%;height:2px;background:linear-gradient(90deg,#cc5500,#ffcfac);transform:scaleX(0);transform-origin:left;pointer-events:none}
.mg-reveal{opacity:1}
.mg-enabled .mg-reveal{opacity:0;transform:translateY(32px);transition:opacity .7s var(--mg-ease),transform .85s var(--mg-ease);transition-delay:var(--mg-delay,0ms)}
.mg-enabled .mg-reveal.mg-in{opacity:1;transform:none}
.mg-enabled .reel-product.mg-reveal .reel-product-cover img{scale:1.08;transition:scale 1.3s var(--mg-ease);transition-delay:var(--mg-delay,0ms)}
.mg-enabled .reel-product.mg-in .reel-product-cover img{scale:1}
.mg-enabled .segment-card{isolation:isolate}
.mg-enabled .segment-card>.segment-art::after{content:"";position:absolute;inset:0;z-index:4;background:#302117;transform:scaleY(0);transform-origin:top;pointer-events:none}
.mg-enabled .segment-card.mg-in>.segment-art::after{animation:mg-curtain 1.1s var(--mg-ease) both;animation-delay:var(--mg-delay,0ms)}
@keyframes mg-curtain{0%{transform:scaleY(1)}100%{transform:scaleY(0)}}
.mg-stack{perspective:900px;background:radial-gradient(ellipse at 50% 90%,#71412b,#17120f 80%)}
.mg-stack img{position:absolute;width:32%;height:auto;max-height:90%;object-fit:cover;top:39px;left:34%;border:1px solid #ffffff25;box-shadow:0 20px 32px #0008;transform:translateX(var(--fan-x)) rotate(var(--fan-r));transform-origin:50% 90%}
.mg-stack img:nth-child(1){--fan-x:-77%;--fan-r:-14deg;--float:-9px;z-index:1}
.mg-stack img:nth-child(2){--fan-x:77%;--fan-r:14deg;--float:9px;z-index:1}
.mg-stack img:nth-child(3){--fan-x:0%;--fan-r:0deg;--float:-6px;z-index:2;top:22px}
.mg-enabled .mg-running .mg-stack img{animation:mg-fan-float 7s ease-in-out infinite}
.mg-enabled .mg-running .mg-stack img:nth-child(2){animation-delay:-2s}
.mg-enabled .mg-running .mg-stack img:nth-child(3){animation-delay:-4s}
@keyframes mg-fan-float{0%,100%{transform:translate(var(--fan-x),0) rotate(var(--fan-r))}50%{transform:translate(var(--fan-x),var(--float)) rotate(calc(var(--fan-r)*1.15))}}
.mg-reel-loop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 33%;opacity:0;transition:opacity .6s;pointer-events:none}
.mg-reel-loop.mg-playing{opacity:.85}
.reel-segment-art .segment-play{z-index:3;width:58px;height:58px;background:#fff1dfda;backdrop-filter:blur(8px)}
.mg-play-orbit{position:absolute;inset:-12px;border:1px solid #fff5;border-radius:50%;border-right-color:transparent;border-bottom-color:transparent;pointer-events:none}
.mg-enabled .mg-running .mg-play-orbit{animation:mg-orbit 8s linear infinite}
.mg-film-track{position:absolute;bottom:17px;left:24px;right:24px;display:flex;gap:5px;z-index:3;pointer-events:none}
.mg-film-track i{height:3px;flex:1;background:#fff3;overflow:hidden;border-radius:3px}
.mg-film-track i::after{content:"";display:block;height:100%;background:#ffe6cb;transform:scaleX(.15);transform-origin:left}
.mg-enabled .mg-running .mg-film-track i::after{animation:mg-film 3s ease-in-out infinite;animation-delay:calc(var(--film)*250ms)}
@keyframes mg-film{50%{transform:scaleX(1)}100%{transform:scaleX(.15)}}
.mg-enabled .reel-product-play::before{content:"";position:absolute;inset:-7px;border:1px solid #fff5;border-radius:50%;opacity:0;transform:scale(.9);transition:opacity .22s,transform .22s var(--mg-ease)}
.mg-enabled .reel-product-cover:focus-visible .reel-product-play::before{opacity:1;transform:scale(1.1)}
@media(hover:hover) and (pointer:fine){
 .mg-toggle:hover{color:#ffceaa;border-color:#ffceaa80}
 .mg-replay:hover{color:#ffceaa}
 .mg-replay:hover svg{transform:rotate(-30deg);transition:transform .24s var(--mg-ease)}
 .segment-link>span{transition:translate .25s var(--mg-ease)}
 .segment-card:hover .segment-link>span{translate:4px 0}
 .reel-product-cover:hover .reel-product-play::before{opacity:1;transform:scale(1.1)}
 .mg-enabled .segment-card:hover .mg-stack img{animation-play-state:paused}
}
/* No looping work while hidden, offscreen, or explicitly paused. */
.mg-enabled .mg-observatory:not(.mg-running) *,.mg-enabled .segment-card:not(.mg-running) *{animation-play-state:paused!important}
.mg-idle *,.motion-paused *,.motion-paused *::before,.motion-paused *::after{animation-play-state:paused!important}
.motion-paused .mg-reveal,.motion-paused .m-reveal,.motion-paused .m-card{transition:none}
.motion-paused .mg-hero-line .mg-word{animation:none;transform:none;opacity:1}
.motion-paused .hero-copy>*{opacity:1;translate:none}
@media(max-width:760px){
 .mg-lens{left:-6%;top:40%;width:320px;opacity:.3}
 .mg-lens-secondary{left:112%;top:64%;width:300px}
 .mg-observatory{mask-image:linear-gradient(90deg,#000,transparent 35%,transparent 65%,#000)}
 .mg-replay{bottom:17px;right:15px;font-size:.65rem}
 .mg-toggle{width:32px;height:32px}
 .mg-stack img{width:30%;left:35%;top:40px}.mg-stack img:nth-child(3){top:23px}
}
@media(max-width:420px){
 .hero h1{font-size:clamp(2.8rem,15vw,3.8rem)}
 .nav-in{gap:.4rem}.brand{font-size:.95rem;gap:.4rem}.nav-tools{gap:.35rem}
 .nav-cart,.menu-toggle{padding:.4rem .6rem;font-size:.72rem}
 .mg-toggle{width:30px;height:30px;flex-shrink:0}
 .mg-replay-label{display:none}.mg-replay{padding:12px;bottom:16px;right:10px}
}
@media(prefers-reduced-motion:reduce){
 .mg-word,.mg-see::after,.mg-contour,.mg-orbit,.mg-tracer,.mg-dot-pulse,.mg-stack img,.mg-film-track i::after{animation:none!important}
 .mg-reveal{opacity:1!important;transform:none!important;transition:none!important}
 .mg-reel-loop,.mg-replay,.mg-scroll-progress{display:none}
 .mg-lens{opacity:.18}.mg-hero-line .mg-word{transform:none!important;opacity:1!important}
 .mg-enabled .reel-product.mg-reveal .reel-product-cover img{scale:1;transition:none}
}