.solution-showcase .solution-motion{width:70px;height:58px;margin:20px 0 16px;border-radius:17px;background:color-mix(in srgb,var(--accent) 12%,#fff);border:1px solid color-mix(in srgb,var(--accent) 24%,#fff);box-shadow:none;color:var(--accent);overflow:visible}
.solution-motion svg{width:54px;height:42px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;overflow:visible}.solution-motion svg *{transform-box:fill-box;transform-origin:center}
.solution:hover .motion-auto .car-body,.solution:focus-within .motion-auto .car-body{animation:car-glide .9s cubic-bezier(.2,.75,.3,1)}.solution:hover .motion-auto .wheel,.solution:focus-within .motion-auto .wheel{animation:wheel-spin .8s linear}
.motion-street .route{stroke-dasharray:5 5}.solution:hover .motion-street .route,.solution:focus-within .motion-street .route{animation:route-run 1.15s linear infinite}.solution:hover .motion-street .pin,.solution:focus-within .motion-street .pin{animation:pin-bounce .8s ease}
.solution:hover .motion-trace .box,.solution:focus-within .motion-trace .box{animation:box-lift .9s ease}.motion-trace .scan-line{opacity:0}.solution:hover .motion-trace .scan-line,.solution:focus-within .motion-trace .scan-line{animation:scan-pass 1.15s ease infinite}
.motion-sales .check{stroke-dasharray:20;stroke-dashoffset:20}.solution:hover .motion-sales .sheet,.solution:focus-within .motion-sales .sheet{animation:sheet-tilt .7s ease}.solution:hover .motion-sales .check,.solution:focus-within .motion-sales .check{animation:check-draw .65s .15s ease forwards}
.solution:hover .motion-b2b .exchange-a,.solution:focus-within .motion-b2b .exchange-a{animation:exchange-right .8s ease infinite}.solution:hover .motion-b2b .exchange-b,.solution:focus-within .motion-b2b .exchange-b{animation:exchange-left .8s ease infinite}
.solution:hover .motion-green,.solution:focus-within .motion-green{animation:charge-pulse 1.1s ease infinite}.solution:hover .motion-green .bolt,.solution:focus-within .motion-green .bolt{animation:bolt-flash .65s ease infinite alternate}.solution:hover .motion-green .cable,.solution:focus-within .motion-green .cable{stroke-dasharray:6 4;animation:route-run .8s linear infinite}
@keyframes car-glide{0%{transform:translateX(-11px)}55%{transform:translateX(5px)}75%{transform:translateX(2px)}100%{transform:translateX(0)}}@keyframes wheel-spin{to{transform:rotate(360deg)}}@keyframes route-run{to{stroke-dashoffset:-20}}@keyframes pin-bounce{0%,100%{transform:translateY(0)}40%{transform:translateY(-7px)}65%{transform:translateY(2px)}}@keyframes box-lift{0%,100%{transform:translateY(0)}45%{transform:translateY(-5px)}}@keyframes scan-pass{0%{opacity:0;transform:translateY(-11px)}25%,75%{opacity:1}100%{opacity:0;transform:translateY(11px)}}@keyframes sheet-tilt{35%{transform:rotate(-4deg) scale(1.04)}70%{transform:rotate(2deg)}}@keyframes check-draw{to{stroke-dashoffset:0}}@keyframes exchange-right{50%{transform:translateX(4px)}}@keyframes exchange-left{50%{transform:translateX(-4px)}}@keyframes charge-pulse{50%{box-shadow:0 0 0 8px color-mix(in srgb,var(--accent) 10%,transparent)}}@keyframes bolt-flash{to{fill:currentColor;transform:scale(1.12)}}
@media(hover:none){.solution:active .solution-motion{transform:scale(.96)}.solution:active .motion-street .pin,.solution:active .motion-trace .box,.solution:active .motion-green .bolt{animation:pin-bounce .65s ease}}
@media(prefers-reduced-motion:reduce){.solution-motion *,.solution-motion{animation:none!important;transition:none!important}}

/* Whole-card interactive animation */
.solution-showcase .solution{--mx:82%;--my:18%;background:radial-gradient(circle 230px at var(--mx) var(--my),color-mix(in srgb,var(--accent) 17%,transparent),transparent 72%),linear-gradient(120deg,#fff 0 43%,color-mix(in srgb,var(--accent) 8%,#fff) 50%,#fff 57% 100%);background-size:auto,240% 100%;background-position:center,0 0;transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease,background-position .7s ease}
.solution-showcase .solution>.solution-top,.solution-showcase .solution>h3,.solution-showcase .solution>p,.solution-showcase .solution>ul{position:relative;z-index:2;transition:transform .35s ease}
.solution-showcase .solution:before{width:290px;height:290px;right:-155px;top:-155px;transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .35s}
.solution-showcase .solution:hover,.solution-showcase .solution:focus-within{transform:translateY(-8px) scale(1.012);border-color:color-mix(in srgb,var(--accent) 58%,#cbdceb);box-shadow:0 28px 64px color-mix(in srgb,var(--accent) 18%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--accent) 12%,transparent);background-position:center,100% 0}
.solution-showcase .solution:hover:before,.solution-showcase .solution:focus-within:before{transform:scale(1.45) rotate(38deg);opacity:1}.solution-showcase .solution:hover:after,.solution-showcase .solution:focus-within:after{color:color-mix(in srgb,var(--accent) 20%,#dce9f5)}
.solution-showcase .solution:hover>h3,.solution-showcase .solution:focus-within>h3{transform:translateX(5px)}.solution-showcase .solution:hover>p,.solution-showcase .solution:focus-within>p{transform:translateX(3px)}.solution-showcase .solution:hover>ul,.solution-showcase .solution:focus-within>ul{transform:translateY(-2px)}
.solution-showcase .solution:hover .solution-motion,.solution-showcase .solution:focus-within .solution-motion{transform:translateX(10px) scale(1.08);box-shadow:0 14px 32px color-mix(in srgb,var(--accent) 22%,transparent)}
html[dir=rtl] .solution-showcase .solution:before{right:auto;left:-155px}html[dir=rtl] .solution-showcase .solution:hover>h3,html[dir=rtl] .solution-showcase .solution:focus-within>h3{transform:translateX(-5px)}html[dir=rtl] .solution-showcase .solution:hover>p,html[dir=rtl] .solution-showcase .solution:focus-within>p{transform:translateX(-3px)}html[dir=rtl] .solution-showcase .solution:hover .solution-motion,html[dir=rtl] .solution-showcase .solution:focus-within .solution-motion{transform:translateX(-10px) scale(1.08)}
@media(hover:none){.solution-showcase .solution:active{transform:scale(.985);background-position:center,100% 0}}
@media(prefers-reduced-motion:reduce){.solution-showcase .solution,.solution-showcase .solution:before,.solution-showcase .solution>*{transition:none!important;transform:none!important}}