.intervention-scene{margin:0;color:#172039;--it-blue:#3349dc;--it-slate:#7986a1;--it-teal:#277f7c}
.it-field{height:650px;position:relative;border-top:1px solid #cfd8e9;border-bottom:1px solid #cfd8e9;background:linear-gradient(0deg,#edf2fb66,transparent 45%)}
.it-route{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;pointer-events:none}
.it-route-base{stroke:#d0d9eb;stroke-width:3}
.it-draw{stroke-dasharray:1;stroke-dashoffset:0;fill:none}
.it-config-line,.it-connect-line,.it-assist-line{stroke:#3349dc;stroke-width:3}
.it-human-line{stroke:#277f7c;stroke-width:3}
.it-route-directions{stroke:#6577b8;stroke-width:1.4}
.it-leader{stroke:#a9b7d6;stroke-width:1.2}
.it-arrival{fill:#3349dc;opacity:0}
.it-anchor{position:absolute;top:calc(46.1538% - 7px);transform:translateX(-50%);width:160px;text-align:center}
.it-anchor-order{left:8.0357%}
.it-anchor-erp{left:27.6786%}
.it-anchor-production{left:47.7679%}
.it-anchor-packet{left:67.8571%}
.it-anchor-human{left:89.7321%;top:calc(46.1538% - 22px)}
.it-station{display:block;width:14px;height:14px;border:3px solid #eef2fa;box-shadow:0 0 0 1px #7185c2;border-radius:50%;background:#3349dc;margin:0 auto 19px;position:relative;z-index:1}
.it-anchor h4{font-size:18px;letter-spacing:-.035em;font-weight:500;line-height:1.25;margin:0 0 7px}
.it-anchor p{font-size:15px;color:#586983;line-height:1.35;margin:0}
.it-human-seal{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#e0eeeb;border:1px solid #91b7b0;box-shadow:0 0 0 7px #edf2f9;margin:0 auto 18px}
.it-human-seal svg{width:32px;height:32px;overflow:visible;fill:none;stroke:#277f7c;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.it-check-draw{stroke-dasharray:1;stroke-dashoffset:0}
.it-anchor-human h4{color:#236e6a}
.it-treatment{position:absolute;max-width:350px}
.it-treatment h3{font-size:25px;line-height:1.17;letter-spacing:-.045em;font-weight:500;margin:0 0 12px}
.it-treatment>p{font-size:16px;line-height:1.6;color:#66728b;margin:0;max-width:330px}
.it-configure{left:2.5%;top:34px;width:29%}
.it-connect{left:20%;top:422px;width:29%}
.it-assist{left:50.5%;top:34px;width:31%}
.it-build{left:64%;top:422px;width:32%}
.it-mobile-number{display:none}
.it-mini{height:52px;width:210px;margin-top:18px}
.it-intake-mini{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;width:210px}
.it-field-line{display:flex;flex-direction:column;justify-content:center;gap:8px;border-bottom:1px solid #acbbdb;padding:0 5px 10px}
.it-field-line i{display:block;height:3px;background:#8ea0c9;width:80%;border-radius:2px}
.it-field-line b{display:block;height:5px;background:#3349dc;width:65%;border-radius:3px;transform-origin:left}
.it-field-line:nth-child(2) b{width:95%}
.it-field-line:nth-child(3) b{width:45%}
.it-connect-mini{overflow:visible;fill:none}
.it-mini-track{stroke:#c7d2e8;stroke-width:2}
.it-mini-join{stroke:#3349dc;stroke-width:2}
.it-connect-mini circle{fill:#eef2fa;stroke:#6f85c0;stroke-width:1.5}
.it-assist-mini{display:flex;align-items:center;gap:20px}
.it-paper{border:1px solid #b4c1dd;display:flex;flex-direction:column;justify-content:center;gap:6px;height:51px;width:45px;padding:9px;border-radius:2px;transform:rotate(-5deg)}
.it-paper i{height:2px;background:#b2bfda;width:100%}
.it-paper i:last-child{width:60%}
.it-extract-arrow{font-size:25px;color:#94a5cf;line-height:1}
.it-extracted{display:grid;grid-template-columns:60px 24px;gap:8px;align-items:center}
.it-extracted i{height:5px;background:#5e77c3;border-radius:3px}
.it-extracted i:nth-child(2){width:40px;grid-column:1;grid-row:2}
.it-extracted b{grid-column:2;grid-row:1/3;display:grid;place-items:center;border:1px solid #7d98ba;border-radius:50%;width:22px;height:22px;font-size:14px;font-weight:500;color:#5e769a}
.it-queue-mini{display:flex;flex-direction:column;gap:6px;height:61px;width:210px}
.it-queue-mini>span{display:flex;align-items:center;gap:10px;height:15px}
.it-queue-mini i{height:6px;width:6px;border-radius:50%;background:#5370ba}
.it-queue-mini b{height:4px;background:#a7b7d9;width:140px;border-radius:3px}
.it-queue-mini>span:nth-child(2) b{width:112px}
.it-queue-mini>span:nth-child(3) b{width:155px}
.it-human-note{display:flex;align-items:center;gap:17px;padding:25px 0;border-bottom:1px solid #cfd8e9}
.it-note-check{display:grid;place-items:center;border-radius:50%;width:29px;height:29px;min-width:29px;color:#287d77;background:#dcece8;font-size:17px}
.it-human-note p{font-size:19px;letter-spacing:-.025em;line-height:1.5;color:#5c6d84}
.it-human-note strong{color:#172039;font-weight:500}
.it-figure-foot{display:flex;align-items:center;justify-content:space-between;gap:28px;padding-top:23px}
.it-figure-foot p{font-size:14px;line-height:1.6;color:#586983;max-width:680px}
.it-figure-foot .scene-control{flex-shrink:0}
.intervention-scene.motion-ready:not(.is-playing):not(.has-played) .it-config-line,
.intervention-scene.motion-ready:not(.is-playing):not(.has-played) .it-connect-line,
.intervention-scene.motion-ready:not(.is-playing):not(.has-played) .it-assist-line,
.intervention-scene.motion-ready:not(.is-playing):not(.has-played) .it-human-line,
.intervention-scene.motion-ready:not(.is-playing):not(.has-played) .it-mini-join,
.intervention-scene.motion-ready:not(.is-playing):not(.has-played) .it-check-draw{stroke-dashoffset:1}
.intervention-scene.motion-ready:not(.is-playing):not(.has-played) .it-field-line b,
.intervention-scene.motion-ready:not(.is-playing):not(.has-played) .it-extracted,
.intervention-scene.motion-ready:not(.is-playing):not(.has-played) .it-queue-mini>span,
.intervention-scene.motion-ready:not(.is-playing):not(.has-played) .it-human-note{opacity:.15}
.intervention-scene.is-playing .it-field-line b{animation:it-field-fill .75s cubic-bezier(.2,.7,.2,1) .35s both}
.intervention-scene.is-playing .it-field-line:nth-child(2) b{animation-delay:.55s}
.intervention-scene.is-playing .it-field-line:nth-child(3) b{animation-delay:.75s}
.intervention-scene.is-playing .it-config-line{animation:it-route-draw 1.2s ease .65s both}
.intervention-scene.is-playing .it-config-leader{animation:it-leader-emphasis 1.6s ease .2s both}
.intervention-scene.is-playing .it-mini-join{animation:it-route-draw 1.25s ease 1.8s both}
.intervention-scene.is-playing .it-connect-line{animation:it-route-draw 1.25s ease 2s both}
.intervention-scene.is-playing .it-connect-leader{animation:it-leader-emphasis 1.5s ease 1.75s both}
.intervention-scene.is-playing .it-paper{animation:it-paper-ready 1.1s ease 3.35s both}
.intervention-scene.is-playing .it-extracted{animation:it-field-reveal .9s ease 3.8s both}
.intervention-scene.is-playing .it-assist-line{animation:it-route-draw 1.2s ease 3.8s both}
.intervention-scene.is-playing .it-assist-leader{animation:it-leader-emphasis 1.5s ease 3.35s both}
.intervention-scene.is-playing .it-queue-mini>span{animation:it-queue-align .7s cubic-bezier(.2,.8,.2,1) 5.05s both}
.intervention-scene.is-playing .it-queue-mini>span:nth-child(2){animation-delay:5.3s}
.intervention-scene.is-playing .it-queue-mini>span:nth-child(3){animation-delay:5.55s}
.intervention-scene.is-playing .it-build-leader{animation:it-leader-emphasis 1.5s ease 5s both}
.intervention-scene.is-playing .it-human-line{animation:it-route-draw 1.1s ease 6.2s both}
.intervention-scene.is-playing .it-human-seal{animation:it-human-confirm 1s ease 6.9s both}
.intervention-scene.is-playing .it-check-draw{animation:it-route-draw .6s ease 7.15s both}
.intervention-scene.is-playing .it-human-note{animation:it-note-reveal .8s ease 7.2s both}
.intervention-scene.is-playing .it-arrival-one{animation:it-node-arrive .75s ease 1.6s both}
.intervention-scene.is-playing .it-arrival-two{animation:it-node-arrive .75s ease 2.9s both}
.intervention-scene.is-playing .it-arrival-three{animation:it-node-arrive .75s ease 4.7s both}
.intervention-scene.is-paused *{animation-play-state:paused!important}
@keyframes it-route-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes it-field-fill{from{transform:scaleX(.05);opacity:.15}to{transform:scaleX(1);opacity:1}}
@keyframes it-field-reveal{from{opacity:.15;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}
@keyframes it-queue-align{from{opacity:.15;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}
@keyframes it-paper-ready{0%{transform:rotate(-8deg);border-color:#b4c1dd}60%{transform:rotate(0deg);border-color:#3349dc}100%{transform:rotate(-5deg);border-color:#b4c1dd}}
@keyframes it-leader-emphasis{0%,100%{stroke:#a9b7d6}40%,70%{stroke:#3349dc}}
@keyframes it-human-confirm{0%{box-shadow:0 0 0 7px #edf2f9;transform:scale(.92)}55%{box-shadow:0 0 0 15px #277f7c15;transform:scale(1.07)}100%{box-shadow:0 0 0 7px #edf2f9;transform:scale(1)}}
@keyframes it-note-reveal{from{opacity:.15;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes it-node-arrive{0%{opacity:0;r:9px}25%{opacity:.18;r:17px}100%{opacity:0;r:24px}}
@media(max-width:1100px){
  .it-treatment h3{font-size:22px}
  .it-treatment>p{font-size:15px}
  .it-anchor{width:145px}
  .it-anchor h4{font-size:17px}
  .it-anchor p{font-size:15px}
  .it-configure{width:31%}
  .it-assist{width:33%}
  .it-connect{left:18%;width:33%}
  .it-build{left:63%;width:34%}
}
@media(max-width:800px){
  .it-field{height:auto;display:grid;grid-template-columns:1fr 1fr;gap:38px 35px;padding:35px 0 45px}
  .it-route,.it-workflow{display:none}
  .it-treatment{position:relative;inset:auto;width:auto;max-width:none;padding-left:39px}
  .it-mobile-number{display:grid;place-items:center;position:absolute;left:0;top:0;width:25px;height:25px;border-radius:50%;border:1px solid #bac8e3;font-size:14px;color:#5d74ac}
  .it-treatment h3{font-size:23px;margin-bottom:12px}
  .it-treatment>p{font-size:16px}
  .it-mini{max-width:100%}
  .it-human-note p{font-size:18px}
  .it-figure-foot{align-items:flex-start}
  .it-figure-foot p{font-size:14px}
}
@media(max-width:540px){
  .it-field{grid-template-columns:1fr;gap:0;padding-top:5px;padding-bottom:25px;background:none}
  .it-treatment{padding:29px 0 28px 45px;max-width:none}
  .it-treatment:not(:last-child):after{content:"";position:absolute;left:12px;top:60px;bottom:-23px;width:1px;background:#c8d3e8}
  .it-mobile-number{top:30px}
  .it-treatment h3{font-size:25px;max-width:290px}
  .it-treatment>p{font-size:16px;max-width:310px}
  .it-mini{margin-top:20px}
  .it-human-note{align-items:flex-start;gap:14px}
  .it-human-note p{font-size:18px;max-width:290px}
  .it-human-note strong{display:block;margin-top:4px}
  .it-figure-foot{flex-direction:column;gap:16px;padding-top:21px}
  .it-figure-foot p{font-size:14px}
  .intervention-scene.is-playing .it-configure .it-mobile-number{animation:it-mobile-emphasis 1.2s ease .35s both}
  .intervention-scene.is-playing .it-connect .it-mobile-number{animation:it-mobile-emphasis 1.2s ease 2s both}
  .intervention-scene.is-playing .it-assist .it-mobile-number{animation:it-mobile-emphasis 1.2s ease 3.8s both}
  .intervention-scene.is-playing .it-build .it-mobile-number{animation:it-mobile-emphasis 1.2s ease 5.3s both}
}
@keyframes it-mobile-emphasis{0%,100%{background:transparent;color:#5d74ac;border-color:#bac8e3}40%,80%{background:#3349dc;color:#fff;border-color:#3349dc}}
@media(prefers-reduced-motion:reduce){
  .intervention-scene *{animation:none!important}
  .intervention-scene.motion-ready .it-draw,.intervention-scene.motion-ready .it-check-draw{stroke-dashoffset:0!important}
  .intervention-scene.motion-ready .it-field-line b,.intervention-scene.motion-ready .it-extracted,.intervention-scene.motion-ready .it-queue-mini>span,.intervention-scene.motion-ready .it-human-note{opacity:1!important;transform:none!important}
}