/* Motion stays inside projects. Original work is never clipped for an effect. */
.project-motion-toggle{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;font-size:12px;color:#d6beaa;padding:10px 0 10px 15px;border-left:1px solid #d6beaa35}
.project-motion-toggle:disabled{opacity:.6;cursor:default}.project-motion-toggle:focus-visible{outline:1px solid currentColor;outline-offset:5px}
.story-method-heading{display:flex;gap:5%;align-items:center;justify-content:space-between;margin:8px 0 28px}.story-method-heading h2{margin:10px 0;max-width:780px;flex:1}
.project-motif{width:clamp(145px,20vw,265px);flex:none;max-width:32%;color:#7d3120}.project-motif svg{display:block;width:100%;height:auto;overflow:visible}.project-motif path{stroke-dasharray:1;stroke-dashoffset:0}.project-motif.motion-entered path{animation:motif-draw 1.9s cubic-bezier(.2,.6,.3,1) both}.project-motif .motion-thread{opacity:.48}.motion-dot{fill:currentColor;stroke:none}.motion-halo{opacity:.25}
@keyframes motif-draw{from{stroke-dashoffset:1;opacity:.1}to{stroke-dashoffset:0}}
@keyframes quiet-orbit{to{transform:rotate(360deg)}}
@keyframes quiet-breathe{0%,100%{opacity:.28}50%{opacity:.8}}
@keyframes quiet-bubble{0%,100%{translate:0 0}50%{translate:var(--float-x,3px) var(--float-y,-7px)}}
@keyframes quiet-pulse{0%,100%{scale:1;opacity:.18}50%{scale:1.1;opacity:.5}}
@keyframes quiet-sweep{0%,55%{translate:-150% 0;opacity:0}65%{opacity:.32}90%,100%{translate:180% 0;opacity:0}}
.motion-orbit{transform-origin:130px 85px;animation:quiet-orbit 30s linear infinite}.motion-orbit-inner{animation-duration:21s;animation-direction:reverse}.motion-halo{transform-box:fill-box;transform-origin:center;animation:quiet-pulse 7s ease-in-out infinite}.motion-breathe{animation:quiet-breathe 5s ease-in-out infinite}
.motion-scene:not(.motion-in-view) *,.motion-scene:not(.motion-in-view) *:before,.motion-scene:not(.motion-in-view) *:after,.motion-scene:not(.motion-in-view):before,.motion-scene:not(.motion-in-view):after{animation-play-state:paused!important}#project-view[data-motion-paused=true] .motion-scene *,#project-view[data-motion-paused=true] .motion-scene *:before,#project-view[data-motion-paused=true] .motion-scene *:after,#project-view[data-motion-paused=true] .motion-scene:before,#project-view[data-motion-paused=true] .motion-scene:after{animation-play-state:paused!important}
.fx-system .fx-world-art{animation:quiet-bubble 8s ease-in-out infinite}.fx-system .fx-world:nth-child(3n+2) .fx-world-art{animation-delay:-3s;--float-y:4px}.fx-system .fx-world:nth-child(3n) .fx-world-art{animation-delay:-5s;--float-x:-2px}
.solar-intro-art .orbit-dot{animation:quiet-breathe 6s ease-in-out infinite}.solar-intro-art .orbit-dot:nth-child(even){animation-delay:-3s}
.ex-bank-offer-cards .ex-offer-one{animation:quiet-bubble 8s ease-in-out infinite}.ex-bank-offer-cards .ex-offer-two{animation:quiet-bubble 9s ease-in-out -4s infinite;--float-y:6px}
.making-strip{position:relative}.making-strip:before{content:'';position:absolute;left:0;right:0;top:-15px;border-top:1px dashed currentColor;opacity:.3;transform-origin:left;scale:0 1;transition:scale 1.5s ease}.making-strip.motion-entered:before{scale:1}
.connected-flow .flow-node,.mv-chain-number{position:relative}.connected-flow .flow-node:after,.mv-chain-number:after{content:'';position:absolute;inset:-6px;border:1px solid currentColor;border-radius:50%;opacity:0;animation:quiet-pulse 6s ease-in-out infinite}.connected-flow li:nth-child(2) .flow-node:after,.mv-chain li:nth-child(2) .mv-chain-number:after{animation-delay:-4.5s}.connected-flow li:nth-child(3) .flow-node:after,.mv-chain li:nth-child(3) .mv-chain-number:after{animation-delay:-3s}.connected-flow li:nth-child(4) .flow-node:after,.mv-chain li:nth-child(4) .mv-chain-number:after{animation-delay:-1.5s}
.mv-chain li:before{transition:opacity .8s,scale 1.2s;transform-origin:left}.mv-chain:not(.motion-entered) li:before{scale:0 1}.mv-ritual-step{position:relative}.mv-ritual-step:after{content:'';position:absolute;inset:-10px auto -10px -14px;width:100px;border:1px solid currentColor;border-radius:50%;opacity:.13;animation:quiet-pulse 7s ease-in-out infinite}
.ex-context-line{position:relative;padding-bottom:13px}.ex-context-line:after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;opacity:.22}.ex-context-line:before{content:'';position:absolute;width:5px;height:5px;bottom:-2px;left:0;border-radius:50%;background:currentColor;animation:signal-travel 6s ease-in-out infinite}@keyframes signal-travel{0%,10%{left:0;opacity:0}20%{opacity:.8}80%{opacity:.8}90%,100%{left:100%;opacity:0}}
.material-swatch{display:block;width:65px;height:65px;border-radius:50%;margin:0 0 30px;background:#6b190c}.material-satin{background:linear-gradient(135deg,#492021 4%,#bd8b80 42%,#602828 69%,#9d605a 100%)}.material-velvet{background:radial-gradient(ellipse at 30% 20%,#995b5a,#4e2428 73%)}.material-lace{background:radial-gradient(circle at 5px 5px,#f1eae0 1.8px,transparent 2.4px) 0 0/10px 10px,#762a35}.material-leather{background:repeating-linear-gradient(29deg,#562a24,#562a24 2px,#61362d 3px,#562a24 4px)}
@media(max-width:700px){.project-nav{flex-wrap:wrap;gap:12px}.project-motion-toggle{font-size:11px}.project-nav>span{margin-left:auto}.story-method-heading{gap:12px}.project-motif{width:115px;max-width:30%}.story-method-heading h2{font-size:29px}.material-swatch{width:45px;height:45px;margin-bottom:18px}.motion-orbit,.motion-halo,.fx-world-art,.ex-bank-offer,.connected-flow .flow-node:after,.mv-chain-number:after{animation:none!important}.ex-context-line:before{display:none}}
@media(prefers-reduced-motion:reduce){.motion-scene *,.motion-scene:before,.motion-scene:after{animation:none!important;transition:none!important}.project-motif path{stroke-dashoffset:0}.making-strip:before{scale:1}.mv-chain li:before{scale:1}}
