/* A single, responsive story from information to action. */
.flow-section{padding:35px 35px 20px;border-radius:22px;border-color:#edf2f9;background:linear-gradient(135deg,#f8fbff,#fff 70%);margin-bottom:15px;overflow:hidden}.flow-heading{align-items:center}.flow-heading h2{font-size:30px;line-height:1.5;margin-top:12px;font-weight:500}.flow-heading .eyebrow{font-size:12px}#visual-toggle{padding:10px 12px;background:#fff;border:1px solid #edf2f9;border-radius:20px;font-size:12px;white-space:nowrap}.flow-rail{max-width:none;margin:35px 0 30px;align-items:center}.flow-node{position:relative;display:flex;flex-direction:column;gap:9px;text-align:center;flex:1 1 0;min-width:0;align-items:center;padding:25px 10px 22px;border-radius:18px;border:1px solid transparent;transition:background .5s,border-color .5s,box-shadow .5s}.flow-step{position:absolute;left:14px;top:12px;color:#b5c2d5;font-size:12px;font-family:Arial}.flow-symbol{width:58px;height:58px;padding:9px;margin-bottom:7px;background:#edf3fd;color:#86a5d3;border-radius:20px;transition:color .5s,background .5s,transform .5s,box-shadow .5s}.flow-node strong{font-size:16px;color:#6f839f;align-self:auto}.flow-node small{font-size:12px;color:#a1aec0;display:block;align-self:auto}.flow-chips{display:flex;gap:5px;justify-content:center;flex-wrap:wrap;margin-top:10px}.flow-chips>span{background:#fff;border:1px solid #e8eef7;border-radius:20px;padding:5px 8px;font-size:12px;color:#8f9fb6}.flow-node.active{background:white;border-color:#dce8fa;box-shadow:0 8px 35px #3b6db00a}.flow-node.active .flow-symbol{--icon-paper:#2866dd;transform:translateY(-3px);background:#2866dd;color:#fff;box-shadow:0 9px 20px #2866dd23}.flow-node:hover{background:#f3f7ff}.phase-link{flex:0 0 36px;min-width:0;margin:0 10px;background:#e0e9f6}.phase-link>i{animation-duration:2.8s}.flow-context{padding:18px 20px;background:#eef4ff80;border:1px solid #e7effc;border-radius:13px;display:flex;justify-content:space-between;gap:22px;align-items:center;min-height:78px}.flow-context>div{flex:1;min-width:0}#flow-current{font-size:12px;color:#7b9acd}#flow-description{text-align:left;font-size:14px;color:#7d8da6;margin-top:7px;min-height:0;line-height:1.7}.flow-context .text-link{font-size:12px;color:#6e91c9;white-space:nowrap}.flow-tail{display:flex;justify-content:space-between;gap:15px;margin-top:15px;font-size:12px;color:#aab7ca;line-height:1.6}.flow-context .text-link span{font-size:16px}.hero-art{border-radius:28px 12px 28px 12px}.use-cases>a{border-color:#edf1f7;box-shadow:0 10px 35px #597ba205}.case-icon{width:62px;height:62px;padding:9px;border-radius:20px;transition:transform .4s,background .4s}.use-cases>a:hover .case-icon{transform:translateY(-3px) rotate(-3deg);background:#eaf2ff}.stage-icon{width:48px;height:48px}.icon-toggle{font-size:12px;color:#8b9fbc;border:1px solid #edf1f7;border-radius:20px;background:#fff;padding:8px 11px;white-space:nowrap}.use-cases h3{font-size:17px}.hero-art figcaption{animation:note-arrive .8s .6s ease-out both}
/* Each movement describes a different job. SVGs remain static and legible when paused. */
.stock-a{animation:stock-check 4.8s ease-in-out infinite}.stock-b{animation:stock-replenish 4.8s ease-in-out infinite}.stock-c{animation:stock-check 4.8s .5s ease-in-out infinite}.stock-scan{animation:inventory-scan 4.8s ease-in-out infinite}.stock-check{animation:stock-confirm 4.8s ease-in-out infinite}.chart-bar{transform-box:fill-box;transform-origin:center bottom;animation:chart-collect 4.8s ease-in-out infinite}.bar-b{animation-delay:.35s}.bar-c{animation-delay:.7s}.chart-trend{stroke-dasharray:30;animation:trend-draw 4.8s ease-in-out infinite}.report-line{stroke-dasharray:16;animation:report-write 4.8s ease-in-out infinite}.line-b{animation-delay:.35s}.line-c{animation-delay:.7s}.report-check{stroke-dasharray:14;animation:report-complete 4.8s ease-in-out infinite}.connect-packet{animation:packet-send 3.2s ease-in-out infinite}.connect-path{animation:connection-dash 3.2s linear infinite}.ai-cell{animation:ai-process 3.2s ease-in-out infinite}.cell-b{animation-delay:.35s}.cell-c{animation-delay:.7s}.cell-d{animation-delay:1.05s}.human-check{stroke-dasharray:20;animation:decision-check 4.8s ease-in-out infinite}
.motion-icon svg *{animation-play-state:paused}.motion-icon.motion-visible svg *{animation-play-state:running}.icons-paused .motion-icon svg *{animation-play-state:paused!important}
@keyframes stock-check{0%,100%{opacity:1}30%,40%{opacity:.35}55%,85%{opacity:1}}
@keyframes stock-replenish{0%,20%{opacity:.2;translate:0 0}35%{opacity:0;translate:0 -7px}45%{opacity:0;translate:0 -7px}65%,100%{opacity:1;translate:0 0}}
@keyframes inventory-scan{0%,8%{translate:0 0;opacity:0}15%{opacity:.8}50%{translate:0 24px;opacity:.8}60%,100%{translate:0 24px;opacity:0}}
@keyframes stock-confirm{0%,58%{opacity:.1}70%,92%{opacity:1}100%{opacity:.1}}
@keyframes chart-collect{0%,8%{transform:scaleY(.25);opacity:.4}35%{transform:scaleY(.65);opacity:.8}55%,88%{transform:scaleY(1);opacity:1}100%{transform:scaleY(.25);opacity:.4}}
@keyframes trend-draw{0%,25%{stroke-dashoffset:30;opacity:.3}60%,90%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:30;opacity:.3}}
@keyframes report-write{0%,10%{stroke-dashoffset:16;opacity:.3}40%,85%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:16;opacity:.3}}
@keyframes report-complete{0%,50%{stroke-dashoffset:14;opacity:0}65%,90%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:14;opacity:0}}
@keyframes packet-send{0%,8%{translate:0 0;opacity:0}20%{opacity:1}80%{translate:10px 0;opacity:1}95%,100%{translate:10px 0;opacity:0}}
@keyframes connection-dash{to{stroke-dashoffset:-18}}
@keyframes ai-process{0%,100%{opacity:.25}40%,65%{opacity:1}}
@keyframes decision-check{0%,15%{stroke-dashoffset:20;opacity:.3}50%,85%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:20;opacity:.3}}
@keyframes note-arrive{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
@media(max-width:1150px){.flow-section{padding:30px 25px 20px}.flow-node{padding:24px 8px 20px}.flow-node strong{font-size:16px}.flow-node small{font-size:12px}.flow-chips>span{font-size:12px;padding:5px 7px}.phase-link{flex-basis:22px;margin:0 7px}.flow-context{gap:20px}#flow-description{font-size:14px}}
@media(max-width:850px){.flow-section{padding:27px 25px 20px}.flow-heading h2{font-size:29px}.flow-rail{flex-direction:column;align-items:stretch;max-width:580px;margin:28px auto}.flow-node{flex:none;width:auto;display:grid;grid-template-columns:54px 1fr;grid-template-rows:auto auto auto;text-align:left;align-items:center;gap:5px 20px;padding:19px 40px 19px 19px;border-radius:15px;background:#fff;border:1px solid #edf2f9}.flow-step{left:auto;right:16px;top:16px;font-size:12px}.flow-symbol{grid-column:1;grid-row:1/4;align-self:center;margin:0;width:54px;height:54px;padding:8px;border-radius:18px}.flow-node strong{grid-column:2;font-size:16px;align-self:auto}.flow-node small{grid-column:2;font-size:12px;align-self:auto;display:block}.flow-chips{grid-column:2;justify-content:flex-start;margin-top:5px;gap:5px}.flow-chips>span{font-size:12px;padding:4px 7px}.flow-node.active .flow-symbol{transform:none}.phase-link{flex:none;width:1px;height:27px;min-width:0;margin:0 0 0 46px}.phase-link:after{right:-2.5px;top:auto;bottom:1px;rotate:135deg;width:5px;height:5px}.phase-link>i{left:-3px;top:0;animation:overview-down 2.8s ease-in-out infinite}.flow-context{align-items:flex-start}.flow-context .text-link{font-size:12px;gap:12px;margin-top:14px}#flow-description{font-size:14px}.flow-tail{font-size:12px}.case-icon{width:54px;height:54px;padding:8px}.stage-icon{width:40px;height:40px}}
@media(max-width:520px){.flow-section{padding:23px 17px 18px}.flow-heading{align-items:flex-start;gap:12px}.flow-heading h2{font-size:25px;margin-top:10px}.flow-heading .eyebrow{font-size:12px}#visual-toggle{font-size:12px;padding:8px 10px;margin-top:3px}.flow-rail{margin:23px 0}.flow-node{grid-template-columns:47px 1fr;padding:17px 35px 17px 15px;gap:5px 15px}.flow-symbol{width:47px;height:47px;padding:7px;border-radius:15px}.flow-node strong{font-size:16px}.flow-node small{font-size:12px}.flow-step{top:13px;right:13px}.flow-chips{gap:4px}.flow-chips>span{font-size:12px;padding:4px 6px}.phase-link{height:24px;margin-left:38px}.flow-context{display:block;padding:15px 14px;border-radius:11px;min-height:102px}#flow-current{font-size:12px}#flow-description{font-size:12px;min-height:30px;line-height:1.8}.flow-context .text-link{margin-top:10px;font-size:12px}.flow-tail{display:block;margin-top:14px;font-size:12px}.flow-tail span{display:block}.flow-tail span+span{margin-top:4px}.case-icon{width:46px;height:46px;padding:6px}.use-cases>a{grid-template-columns:46px 1fr 45px;gap:6px 14px}.use-cases h3{font-size:15px}.stage-icon{width:34px;height:34px}.icon-toggle{font-size:12px;padding:7px 9px}.hero-art{border-radius:23px 10px 23px 10px}}
@keyframes overview-down{0%{top:0;opacity:0}15%{opacity:1}85%{opacity:1}100%{top:calc(100% - 6px);opacity:0}}
@media(prefers-reduced-motion:reduce){.motion-icon svg *,.phase-link>i,.hero-art figcaption{animation:none!important}.report-line,.report-check,.human-check,.chart-trend{stroke-dashoffset:0!important;opacity:1!important}.stock-check,.stock-item{opacity:1!important}.chart-bar{transform:none!important}.connect-packet{opacity:0!important}.flow-node.active .flow-symbol{transform:none}}
