/* Each business has its own motion language. Existing artwork transforms stay intact. */
.business-heading-meta{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.business-heading-meta p{font-size:12px;line-height:1.85;color:#92a0a8}
.motion-toggle{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:5px 10px;background:#b0f5d106;border:1px solid var(--line);border-radius:4px;color:#9eb7ad;font-size:9px;letter-spacing:.25px;transition:border-color .2s,color .2s}
.motion-toggle:hover{border-color:#b0f5d14d;color:var(--mint)}
.motion-toggle-icon{width:9px;height:10px;position:relative;border-inline:2px solid currentColor}
.motion-toggle[aria-pressed=true] .motion-toggle-icon{width:0;height:0;border:0;border-block:5px solid transparent;border-left:8px solid currentColor}
.motion-toggle:disabled{cursor:default;opacity:.7}
.motion-toggle:disabled .motion-toggle-icon{width:10px;height:10px;border:1px solid currentColor;border-radius:50%}

/* Imports: containers in transit, a traveling route light and a shipping scan. */
.import-art::before,.import-art::after,.pos-window::after,.bot-art::before{content:'';position:absolute;pointer-events:none}
.import-art::before{width:240px;height:105px;left:50%;top:54%;border:1px dashed #a8e9cb2e;border-radius:50%;translate:-50% -50%;rotate:-18deg}
.import-art::after{width:5px;height:5px;left:50%;top:54%;border-radius:50%;background:#c2ffe0;box-shadow:0 0 13px 3px #b0f5d160;animation:trade-route 8s linear infinite}
.trade-visual{animation:cargo-drift 5.5s ease-in-out infinite}
.trade-visual>g{animation:cargo-arrive 7s ease-in-out infinite}

/* POS: staggered sales bars and a soft scan across the dashboard. */
.pos-window{animation:pos-float 6s ease-in-out infinite}
.pos-window::after{inset:0;background:linear-gradient(110deg,transparent 25%,#b0f5d113 48%,transparent 70%);translate:-120% 0;animation:pos-scan 7s ease-in-out infinite}
.pos-chart i{transform-origin:center bottom;animation:sales-build 4.8s cubic-bezier(.22,.8,.3,1) infinite;animation-delay:calc(var(--bar-index,0)*90ms)}
.pos-chart i:nth-child(2){--bar-index:1}.pos-chart i:nth-child(3){--bar-index:2}.pos-chart i:nth-child(4){--bar-index:3}.pos-chart i:nth-child(5){--bar-index:4}.pos-chart i:nth-child(6){--bar-index:5}.pos-chart i:nth-child(7){--bar-index:6}.pos-chart i:nth-child(8){--bar-index:7}.pos-chart i:nth-child(9){--bar-index:8}.pos-chart i:nth-child(10){--bar-index:9}.pos-chart i:nth-child(11){--bar-index:10}
.mini-badge{animation:ai-signal 4s ease-in-out infinite}

/* Max AI: three tilted orbits, a breathing intelligence core and a live cursor. */
.bot-art::before{inset:15% 15%;border-radius:50%;background:radial-gradient(circle,#b0f5d115,transparent 65%);animation:max-aura 5s ease-in-out infinite}
.ring-one{animation:max-orbit-one 16s linear infinite}
.ring-two{animation:max-orbit-two 20s linear infinite reverse}
.ring-three{animation:max-orbit-three 23s linear infinite}
.bot-core{animation:max-core 4.5s ease-in-out infinite}
.bot-core svg{animation:max-spark 12s ease-in-out infinite}
.orbit-point{left:50%;top:50%;right:auto;animation:max-particle 9s linear infinite}
.point-two{animation-duration:13s;animation-direction:reverse;animation-delay:-5s}
.bot-cursor{animation:max-cursor 1.5s steps(1,end) infinite}

/* Only visible scenes play, and a single control can pause every scene. */
.motion-scene *,.motion-scene::before,.motion-scene::after,.motion-scene *::before,.motion-scene *::after{animation-play-state:paused!important}
.motion-scene.is-in-view *,.motion-scene.is-in-view::before,.motion-scene.is-in-view::after,.motion-scene.is-in-view *::before,.motion-scene.is-in-view *::after{animation-play-state:running!important}
html.motion-paused .motion-scene *,html.motion-paused .motion-scene::before,html.motion-paused .motion-scene::after,html.motion-paused .motion-scene *::before,html.motion-paused .motion-scene *::after{animation-play-state:paused!important}
html.motion-paused .motion-scene{animation-play-state:paused!important}

@keyframes trade-route{0%{transform:translate(-50%,-50%) rotate(-18deg) translateX(-120px);opacity:0}8%{opacity:.9}50%{transform:translate(-50%,-50%) rotate(-18deg) translateX(120px);opacity:.9}58%,100%{transform:translate(-50%,-50%) rotate(-18deg) translateX(120px);opacity:0}}
@keyframes cargo-drift{0%,100%{translate:0 0}50%{translate:0 -6px}}
@keyframes cargo-arrive{0%,100%{translate:0 0}45%,65%{translate:5px -3px}}
@keyframes pos-float{0%,100%{translate:0 0}50%{translate:0 -4px}}
@keyframes pos-scan{0%,25%{translate:-120% 0}65%,100%{translate:120% 0}}
@keyframes sales-build{0%,100%{scale:1 .35;opacity:.55}25%,65%{scale:1 1;opacity:1}85%{scale:1 .75;opacity:.85}}
@keyframes ai-signal{0%,100%{opacity:.6}50%{opacity:1}}
@keyframes max-aura{0%,100%{opacity:.4;scale:.9}50%{opacity:1;scale:1.12}}
@keyframes max-orbit-one{from{transform:rotateZ(0deg) rotateX(60deg) rotateZ(-30deg)}to{transform:rotateZ(360deg) rotateX(60deg) rotateZ(-30deg)}}
@keyframes max-orbit-two{from{transform:rotateZ(0deg) rotateX(60deg) rotateZ(45deg)}to{transform:rotateZ(360deg) rotateX(60deg) rotateZ(45deg)}}
@keyframes max-orbit-three{from{transform:rotateZ(0deg) rotateY(60deg) rotateZ(-40deg)}to{transform:rotateZ(360deg) rotateY(60deg) rotateZ(-40deg)}}
@keyframes max-core{0%,100%{translate:0 0;box-shadow:0 0 25px #a6efc615}50%{translate:0 -4px;box-shadow:0 0 45px #a6efc63c}}
@keyframes max-spark{0%,35%,100%{rotate:0deg}65%,85%{rotate:180deg}}
@keyframes max-particle{from{transform:rotate(0deg) translateX(67px) scale(.8)}50%{transform:rotate(180deg) translateX(67px) scale(1.2)}to{transform:rotate(360deg) translateX(67px) scale(.8)}}
@keyframes max-cursor{0%,65%{opacity:1}66%,100%{opacity:0}}

@media(max-width:760px){.business-heading-meta{gap:10px}.business-heading-meta p{font-size:11px}.motion-toggle{min-height:38px;padding-inline:12px}}
@media(prefers-reduced-motion:reduce){.motion-scene,.motion-scene *,.motion-scene::before,.motion-scene::after,.motion-scene *::before,.motion-scene *::after{animation:none!important;transition:none!important}.import-art::after,.pos-window::after,.blueprint::after{display:none}.orbit-point{animation:none!important}.point-one{left:5px;top:68px}.point-two{left:auto;right:30px;top:16px}}
@media print{.motion-toggle{display:none}.motion-scene,.motion-scene *,.motion-scene::before,.motion-scene::after,.motion-scene *::before,.motion-scene *::after{animation:none!important}}
