/* MaMITs software pages: shared motion layer (2026-11-04). Loaded on all 8 pages after the page CSS.
   Everything is opt-in through html.mo (added by motion.js), so without JS nothing is hidden. */

/* ---------- hero stage ---------- */
.mo .mx .hero{isolation:isolate}
.mo .mx .hero>.in{position:relative;z-index:2}
.mo-aura{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.mo-aura .b{position:absolute;border-radius:50%;opacity:.55;will-change:transform}
.mo-aura .b1{width:62vw;height:62vw;max-width:900px;max-height:900px;right:-18vw;top:-30vw;background:radial-gradient(closest-side,rgba(205,33,34,.16),transparent 70%);animation:moDrift1 22s ease-in-out infinite alternate}
.mo-aura .b2{width:52vw;height:52vw;max-width:760px;max-height:760px;left:-20vw;bottom:-26vw;background:radial-gradient(closest-side,rgba(34,54,204,.13),transparent 70%);animation:moDrift2 26s ease-in-out infinite alternate}
.mo-aura .b3{width:30vw;height:30vw;max-width:440px;max-height:440px;left:38%;top:12%;background:radial-gradient(closest-side,rgba(251,236,236,.9),transparent 70%);animation:moDrift3 18s ease-in-out infinite alternate}
@keyframes moDrift1{to{transform:translate(-8vw,6vw) scale(1.12)}}
@keyframes moDrift2{to{transform:translate(9vw,-5vw) scale(1.08)}}
@keyframes moDrift3{to{transform:translate(-6vw,8vw) scale(.9)}}
.mo-aura .spot{position:absolute;inset:0;background:radial-gradient(520px circle at var(--mx,70%) var(--my,30%),rgba(205,33,34,.07),transparent 60%);transition:background-position .2s}
.mo-aura .mtf{position:absolute;inset:0;width:100%;height:100%;opacity:.9;-webkit-mask-image:linear-gradient(90deg,transparent 0 38%,#000 72%);mask-image:linear-gradient(90deg,transparent 0 38%,#000 72%)}
.x-ai .mo-aura .mtf{opacity:.55;-webkit-mask-image:linear-gradient(180deg,transparent 0 30%,#000 60%),linear-gradient(90deg,transparent 0 45%,#000 80%);mask-image:linear-gradient(90deg,transparent 0 45%,#000 80%)}
.mo .mx .hero.mo-off .mo-aura *{animation-play-state:paused!important}

/* ---------- hero entrance ---------- */
.mo .mx .hero .crumb,.mo .mx .hero .eb,.mo .mx .hero .lead,.mo .mx .hero .pts>li,.mo .mx .hero .btns>*,.mo .mx .hero .jump{opacity:0;translate:0 18px;transition:opacity .8s cubic-bezier(.2,.7,.2,1),translate .8s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--d,0) * 1ms)}
.mo-go .mx .hero .crumb,.mo-go .mx .hero .eb,.mo-go .mx .hero .lead,.mo-go .mx .hero .pts>li,.mo-go .mx .hero .btns>*,.mo-go .mx .hero .jump{opacity:1;translate:0 0}
.mw{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.12em;margin-bottom:-.12em}
.mwi{display:inline-block;translate:0 108%;transition:translate .9s cubic-bezier(.16,.84,.24,1);transition-delay:calc(var(--d,0) * 1ms)}
.mo-go .mx .hero h1 .mwi,.mx h2.mo-in .mwi,.mx .sh.mo-in h2 .mwi{translate:0 0}
/* h1 highlighter wipes in after the words land */
.mo .mx .hero h1 em{background-size:0% 100%;background-repeat:no-repeat;transition:background-size 1.1s cubic-bezier(.7,0,.2,1) 1.2s}
.mo-go .mx .hero h1 em{background-size:100% 100%}
.mo .mx.x-ai .hero h1 em{background-size:100% 100%;transition:none}
/* hero visual: tilts in from depth, then follows the pointer */
.mo .mx .hero .hg{perspective:1600px}
.mo .mx .hero .mo-vis{opacity:0;scale:.92;rotate:1 -.6 0 14deg;filter:blur(6px);transition:opacity 1.1s cubic-bezier(.2,.7,.2,1) .35s,scale 1.3s cubic-bezier(.16,.84,.24,1) .35s,rotate 1.3s cubic-bezier(.16,.84,.24,1) .35s,filter 1s ease .35s;transform-style:preserve-3d}
.mo-go .mx .hero .mo-vis{opacity:1;scale:1;rotate:none;filter:none}
.mo-go .mx .hero .mo-vis.mo-live{transition:rotate .5s cubic-bezier(.2,.7,.2,1),translate .1s linear,opacity .6s,scale .6s,filter .6s;transition-delay:0s}
.mo-glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:30;background:radial-gradient(420px circle at var(--gx,50%) var(--gy,0%),rgba(255,255,255,.38),transparent 55%);mix-blend-mode:soft-light;opacity:0;transition:opacity .4s}
.mo-vis:hover>.mo-glare{opacity:1}
/* primary button: light sweep + magnetic pull */
.mo .mx .btn.wa{position:relative;overflow:hidden}
.mo-shine{position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-18deg);animation:moShine 4.2s ease-in-out 1.8s infinite;pointer-events:none}
@keyframes moShine{0%{left:-60%}38%,100%{left:130%}}
.mo .mx .hero .btn{transition:transform .2s,box-shadow .2s,background .2s,translate .35s cubic-bezier(.2,.7,.2,1),opacity .8s cubic-bezier(.2,.7,.2,1)}
/* scroll cue */
.mo-cue{position:absolute;left:50%;bottom:18px;z-index:3;width:26px;height:42px;margin-left:-13px;border:2px solid rgba(13,15,20,.22);border-radius:14px;opacity:0;transition:opacity .6s 1.6s}
.mo-cue:after{content:"";position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:#cd2122;animation:moCue 1.8s ease-in-out infinite}
@keyframes moCue{0%{opacity:0;translate:0 0}30%{opacity:1}100%{opacity:0;translate:0 14px}}
.mo-go .mo-cue{opacity:1}.mo-scrolled .mo-cue{opacity:0!important;transition-delay:0s}

/* ---------- scroll layer ---------- */
.mo .mx .sh .k,.mo .mx .k.mo-k{opacity:0;translate:-14px 0;transition:opacity .7s,translate .7s cubic-bezier(.2,.7,.2,1)}
.mo .mx .mo-in.k,.mo .mx .sh.mo-in .k{opacity:1;translate:0 0}
.mo .mx .sh .intro{opacity:0;translate:0 14px;transition:opacity .8s .25s,translate .8s cubic-bezier(.2,.7,.2,1) .25s}
.mo .mx .sh.mo-in .intro{opacity:1;translate:0 0}
/* figures: clip reveal + settle */
.mo .mx .fg picture{display:block;overflow:hidden}
.mo .mx .fg img{clip-path:inset(0 0 100% 0);scale:1.08;transition:clip-path 1.1s cubic-bezier(.7,0,.2,1),scale 1.6s cubic-bezier(.16,.84,.24,1)}
.mo .mx .fg.mo-in img{clip-path:inset(0 0 0 0);scale:1}
/* counters keep their width while counting */
.mo-num{font-variant-numeric:tabular-nums}

/* ---------- per-page motifs ---------- */
.mtf .ln{fill:none;stroke:rgba(34,54,204,.18);stroke-width:1}
.mtf .pulse{fill:none;stroke:#cd2122;stroke-width:2;stroke-linecap:round;stroke-dasharray:28 600;animation:moRun 4.5s linear infinite}
.mtf .node{fill:#fff;stroke:rgba(34,54,204,.45);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:moTw 3.2s ease-in-out infinite}
.mtf .node.r{stroke:rgba(205,33,34,.55)}
@keyframes moRun{from{stroke-dashoffset:628}to{stroke-dashoffset:0}}
@keyframes moTw{50%{scale:1.6;opacity:.5}}
.mtf .ecg{fill:none;stroke:#cd2122;stroke-width:2.2;stroke-linejoin:round;stroke-dasharray:420 2200;animation:moEcg 5s linear infinite;filter:drop-shadow(0 0 6px rgba(205,33,34,.45))}
.mtf .ecg0{fill:none;stroke:rgba(205,33,34,.12);stroke-width:1.5;stroke-linejoin:round}
@keyframes moEcg{from{stroke-dashoffset:2620}to{stroke-dashoffset:0}}
.mtf .gear{fill:none;stroke:rgba(13,15,20,.13);stroke-width:2;transform-box:fill-box;transform-origin:center;animation:moSpin 24s linear infinite}
.mtf .gear.g2{animation-direction:reverse;animation-duration:16s;stroke:rgba(205,33,34,.22)}
@keyframes moSpin{to{rotate:360deg}}
.mtf .route{fill:none;stroke:rgba(34,54,204,.28);stroke-width:2.5;stroke-dasharray:10 9;animation:moDash 1.6s linear infinite}
@keyframes moDash{to{stroke-dashoffset:-19}}
.mtf .pin{fill:#cd2122}
.mtf .dotc{fill:#2236cc;stroke:rgba(34,54,204,.2);stroke-width:10;paint-order:stroke}
.mo-dot{position:absolute;width:14px;height:14px;margin:-7px;border-radius:50%;background:#2236cc;box-shadow:0 0 0 6px rgba(34,54,204,.15),0 0 22px rgba(34,54,204,.5);offset-rotate:0deg;animation:moAlong 9s cubic-bezier(.45,0,.55,1) infinite}
@keyframes moAlong{from{offset-distance:0%}to{offset-distance:100%}}
.mo-scan{position:absolute;left:58%;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,#cd2122 30%,#cd2122 70%,transparent);box-shadow:0 0 18px 2px rgba(205,33,34,.45);animation:moScan 5.5s ease-in-out infinite;opacity:.6}
@keyframes moScan{0%,100%{top:8%}50%{top:88%}}
.mtf .bar{fill:rgba(13,15,20,.07)}
.mtf .dev{fill:none;stroke:rgba(34,54,204,.22);stroke-width:2;transform-box:fill-box;transform-origin:center;animation:moFloat 9s ease-in-out infinite}
.mtf .dev.d2{animation-duration:11s;animation-delay:-3s;stroke:rgba(205,33,34,.22)}
.mtf .dev.d3{animation-duration:13s;animation-delay:-6s}
@keyframes moFloat{50%{translate:0 -18px;rotate:4deg}}
.mtf .pkt{fill:#cd2122;animation:moPkt 6s linear infinite}
.mtf .pkt.b{fill:#2236cc;animation-duration:8s;animation-delay:-2s}
@keyframes moPkt{from{translate:-80px 0}to{translate:1600px 0}}
.mtf .plane{fill:#2236cc;opacity:.55}
.mtf .trail{fill:none;stroke:rgba(34,54,204,.25);stroke-width:2;stroke-dasharray:3 9;stroke-linecap:round}

@media (max-width:900px){
 .mo-aura .mtf{opacity:.45}.mo-cue{display:none}
 .mo .mx .hero .mo-vis{rotate:none;filter:none}
}
@media (prefers-reduced-motion:reduce){
 .mo-aura *,.mo-shine,.mo-cue:after,.mo-dot,.mo-scan{animation:none!important}
 .mo .mx .hero :is(.crumb,.eb,.lead,.btns>*,.jump,.mo-vis),.mo .mx .hero .pts>li,.mo .mx .mwi,.mo .mx .fg img,.mo .mx .sh :is(.k,.intro),.mo .mx .k.mo-k{transition:none!important;opacity:1!important;translate:none!important;clip-path:none!important;scale:none!important;rotate:none!important;filter:none!important}
}