/* Shared success-story template: results band, challenge, solution, how-it-works stepper, analysis, benefits */
.st-eyebrow-note{font-size:12.5px;color:var(--muted);margin-top:8px}
.sz-cover img{width:100%;height:auto!important;aspect-ratio:1600/430;object-fit:contain!important;display:block;border-radius:var(--radius);box-shadow:0 24px 60px rgba(11,36,56,.22)}

/* results */
.st-results{background:var(--paper)}
.st-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.st-tile{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px 22px;position:relative;overflow:hidden}
.st-tile:before{content:"";position:absolute;left:0;top:0;width:100%;height:4px;background:linear-gradient(90deg,var(--green),var(--blue))}
.st-tile b{display:block;font-size:clamp(26px,2.6vw,36px);line-height:1.05;color:var(--ink);letter-spacing:-.01em;margin-bottom:10px}
.st-tile span{display:block;color:var(--muted);font-size:15px;line-height:1.5}

/* challenge */
.st-pains{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px}
.st-pain{background:var(--paper);border-radius:var(--radius);padding:22px 20px;border:1px solid var(--line)}
.st-pain .ic,.st-comp .ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:#D8483E14;color:#c93a31;margin-bottom:14px}
.st-pain .ic svg,.st-comp .ic svg,.st-ben .ic svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.st-pain h3{font-size:17px;margin:0 0 6px;color:var(--navy)}
.st-pain p{margin:0;font-size:14.5px;color:var(--muted);line-height:1.5}
.st-constraint{margin-top:26px;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;background:#FFF7E6;border:1px solid #E0A03055;border-radius:var(--radius);padding:18px 22px;color:#6b4a07;font-size:15.5px;line-height:1.5}
.st-constraint svg{width:30px;height:30px;stroke:#b87b10;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.st-photos{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:12px;margin-top:26px}
.st-photos figure{margin:0;position:relative;border-radius:14px;overflow:hidden;background:#dfe7ee}
.st-photos img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.st-photos figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 10px;color:#fff;font-size:12.5px;font-weight:600;background:linear-gradient(180deg,transparent,rgba(11,36,56,.82))}

/* solution components */
.st-comps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px}
.st-comp{background:#ffffff12;border:1px solid #ffffff2e;border-radius:var(--radius);padding:22px 20px;color:#fff}
.st-comp .ic{background:#3C974C;color:#fff}
.st-comp h3{margin:0 0 6px;font-size:17px;color:#fff}
.st-comp p{margin:0;font-size:14.5px;line-height:1.5;color:#cfe3f0}
.st-comp small{display:block;margin-top:10px;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--mint);font-weight:700}
.st-arch{margin-top:26px;display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:12px;align-items:stretch}
.st-arch .box{background:#fff;color:var(--navy);border-radius:14px;padding:16px 18px}
.st-arch .box h4{margin:0 0 8px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}
.st-arch .box ul{margin:0;padding:0;list-style:none;display:grid;gap:5px;font-size:14px;font-weight:600}
.st-arch .box li:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--blue);margin-right:9px;vertical-align:middle}
.st-arch .arrow{display:grid;place-items:center;color:var(--mint);font-size:13px;font-weight:700;text-align:center;line-height:1.2;min-width:70px}
.st-arch .arrow i{display:block;font-style:normal;font-size:22px}

/* how it works */
.st-how{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:24px;align-items:start}
.st-scene{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:10px;box-shadow:0 18px 50px #234E7014}
.st-scene svg{display:block;width:100%;height:auto}
.st-steps{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.st-steps button{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:grid;grid-template-columns:auto 1fr;gap:14px;padding:13px 16px;border-radius:14px;border:1px solid var(--line);background:#fff;transition:background .25s,border-color .25s,box-shadow .25s}
.st-steps button:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.st-steps .n{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#234E7014;color:var(--ink);font-weight:800;font-size:13px;transition:background .25s,color .25s}
.st-steps b{display:block;font-size:15.5px;color:var(--navy)}
.st-steps span.d{display:none;font-size:14px;color:var(--muted);line-height:1.5;margin-top:4px}
.st-steps li.on button{background:#EAF4EC;border-color:#3C974C77;box-shadow:0 8px 24px #3C974C22}
.st-steps li.on .n{background:var(--green);color:#fff}
.st-steps li.on span.d{display:block}
.st-ctl{display:flex;align-items:center;gap:12px;margin-top:12px;flex-wrap:wrap}
.st-bar{flex:1;height:4px;border-radius:2px;background:#234E7020;overflow:hidden;min-width:80px}
.st-bar i{display:block;height:100%;width:0;background:var(--green)}
.st-log{margin-top:20px;background:var(--navy);color:#fff;border-radius:var(--radius);padding:18px 22px}
.st-log h4{margin:0 0 10px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mint);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.st-log h4 em{font-style:normal;color:#9fc3dc;letter-spacing:0;text-transform:none;font-weight:500}
.st-log ol{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:14px;font-variant-numeric:tabular-nums}
.st-log li{display:grid;grid-template-columns:auto 1fr;gap:12px;opacity:0;max-height:0;overflow:hidden;transition:opacity .4s,max-height .4s}
.st-log li.show{opacity:1;max-height:40px}
.st-log li i{font-style:normal;color:var(--mint);font-weight:700;min-width:22px}
.st-log li.cur{color:#fff}
.st-log li:not(.cur){color:#cfe3f0}

/* scene states (SVG) */
.sz .dev{transition:filter .4s}
.sz[data-step="1"] .d-tablet,.sz[data-step="1"] .d-scale,.sz[data-step="1"] .d-cloud,
.sz[data-step="2"] .d-staff,.sz[data-step="2"] .d-mgr,.sz[data-step="2"] .d-cloud,
.sz[data-step="3"] .d-staff,.sz[data-step="3"] .d-lock,.sz[data-step="3"] .d-cab,
.sz[data-step="4"] .d-scale,.sz[data-step="4"] .d-tablet,.sz[data-step="4"] .d-cloud,
.sz[data-step="5"] .d-scale,.sz[data-step="5"] .d-tablet,.sz[data-step="5"] .d-cloud,
.sz[data-step="6"] .d-lock,.sz[data-step="6"] .d-cloud,.sz[data-step="6"] .d-staff{filter:drop-shadow(0 0 9px #3C974Cbb)}
.sz .lk{fill:none;stroke:#8fa3b3;stroke-width:2.4;stroke-dasharray:5 5;opacity:.5;transition:stroke .3s,opacity .3s}
.sz[data-step="1"] .l-st,.sz[data-step="1"] .l-tc,
.sz[data-step="2"] .l-sc,.sz[data-step="2"] .l-cm,
.sz[data-step="3"] .l-sc,.sz[data-step="3"] .l-bt,
.sz[data-step="4"] .l-st,.sz[data-step="4"] .l-tc,
.sz[data-step="5"] .l-st,.sz[data-step="5"] .l-tc,.sz[data-step="5"] .l-bt,
.sz[data-step="6"] .l-bt,.sz[data-step="6"] .l-tc{stroke:#3C974C;opacity:1;animation:dash 1s linear infinite}
@keyframes dash{to{stroke-dashoffset:-20}}
.sz .doorL,.sz .doorR{transition:transform .7s var(--ease);transform-box:fill-box}
.sz .doorL{transform-origin:left center}.sz .doorR{transform-origin:right center}
.sz[data-step="3"] .doorL,.sz[data-step="4"] .doorL,.sz[data-step="5"] .doorL{transform:scaleX(.16)}
.sz[data-step="3"] .doorR,.sz[data-step="4"] .doorR,.sz[data-step="5"] .doorR{transform:scaleX(.16)}
.sz .shackle{transition:transform .5s var(--ease)}
.sz[data-step="3"] .shackle,.sz[data-step="4"] .shackle,.sz[data-step="5"] .shackle{transform:translateY(-7px)}
.sz .lockbody{transition:fill .4s;fill:#234E70}
.sz[data-step="3"] .lockbody,.sz[data-step="4"] .lockbody,.sz[data-step="5"] .lockbody{fill:#3C974C}
.sz .bottle{transition:transform .9s var(--ease),opacity .5s}
.sz[data-step="1"] .bottle{transform:translate(400px,290px);opacity:1}
.sz[data-step="2"] .bottle{transform:translate(122px,248px) scale(.5);opacity:0}
.sz[data-step="3"] .bottle{transform:translate(122px,248px) scale(.5);opacity:1}
.sz[data-step="4"] .bottle{transform:translate(400px,290px);opacity:1}
.sz[data-step="5"] .bottle{transform:translate(400px,290px);opacity:1}
.sz[data-step="6"] .bottle{transform:translate(122px,248px) scale(.5);opacity:0}
.sz .liq{transition:transform .6s}
.sz[data-step="5"] .liq{transform:translateY(3px)}
.sz .interior{opacity:0;transition:opacity .5s}
.sz[data-step="3"] .interior,.sz[data-step="4"] .interior,.sz[data-step="5"] .interior{opacity:1}
.sz .tagdot{opacity:.0;transition:opacity .4s}
.sz[data-step="1"] .tagdot{opacity:1;animation:tagpop 1.2s ease-out 1}
.sz[data-step="4"] .tagdot,.sz[data-step="5"] .tagdot{opacity:1}
@keyframes tagpop{0%{transform:translateY(-26px) scale(.4);opacity:0}60%{transform:translateY(2px) scale(1.2);opacity:1}100%{transform:none}}
.sz .tagdot{transform-box:fill-box;transform-origin:center}
.sz .rd{fill:none;stroke:#3C974C;stroke-width:2;opacity:0;transform-box:fill-box;transform-origin:center}
.sz[data-step="1"] .rd,.sz[data-step="4"] .rd,.sz[data-step="5"] .rd{animation:rdp 1.8s ease-out infinite}
.sz .rd.b{animation-delay:.9s!important}
@keyframes rdp{0%{transform:scale(.6);opacity:.9}100%{transform:scale(1.6);opacity:0}}
.sz .scr,.sz .ph{opacity:0;transition:opacity .35s}
.sz[data-step="1"] .scr1,.sz[data-step="2"] .scr2,.sz[data-step="3"] .scr3,.sz[data-step="4"] .scr4,.sz[data-step="5"] .scr5,.sz[data-step="6"] .scr6{opacity:1}
.sz[data-step="2"] .ph-s2,.sz[data-step="3"] .ph-s3,.sz[data-step="6"] .ph-s6,.sz[data-step="2"] .ph-m2{opacity:1}
.sz .wt{opacity:0;transition:opacity .35s}
.sz[data-step="1"] .wt1,.sz[data-step="4"] .wt1,.sz[data-step="5"] .wt5{opacity:1}
.sz .cl-ok{opacity:0;transition:opacity .3s}
.sz[data-step="6"] .cl-ok,.sz[data-step="2"] .cl-ok{opacity:1}

/* analysis */
.st-an{background:var(--paper)}
.st-an-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.st-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;display:flex;flex-direction:column;gap:12px}
.st-card h3{margin:0;font-size:18px;color:var(--navy)}
.st-card p{margin:0;font-size:14.5px;color:var(--muted);line-height:1.5}
.st-card svg{width:100%;height:auto;display:block;background:#F4F7F9;border-radius:10px}
.st-card small{font-size:11.5px;color:var(--muted)}

/* benefits */
.st-bens{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.st-ben{border-radius:var(--radius);padding:24px 22px;border:1px solid var(--line);background:#fff}
.st-ben .ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:#3C974C18;color:var(--green);margin-bottom:14px}
.st-ben h3{margin:0 0 4px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}
.st-ben h4{margin:0 0 8px;font-size:18px;line-height:1.25;color:var(--navy)}
.st-ben p{margin:0;font-size:14.5px;line-height:1.55;color:var(--muted)}

@media(max-width:1000px){
 .st-tiles,.st-pains,.st-comps,.st-bens{grid-template-columns:repeat(2,1fr)}
 .st-how{grid-template-columns:1fr}
 .st-an-grid{grid-template-columns:1fr}
 .st-photos{grid-template-columns:1fr 1fr}.st-photos figure:first-child{grid-column:span 2}
 .st-arch{grid-template-columns:1fr}.st-arch .arrow{min-width:0;padding:4px}.st-arch .arrow i{transform:rotate(90deg)}
}
@media(max-width:560px){.st-tiles,.st-pains,.st-comps,.st-bens{grid-template-columns:1fr}.st-photos{grid-template-columns:1fr}.st-photos figure:first-child{grid-column:auto}}
@media(prefers-reduced-motion:reduce){.sz .bottle,.sz .doorL,.sz .doorR,.sz .shackle{transition:none}.sz .lk{animation:none!important}.sz .rd{animation:none!important}}

.bf-btn{appearance:none;border:1px solid var(--line);background:#fff;color:var(--ink);font:inherit;font-weight:700;font-size:13px;padding:8px 16px;border-radius:999px;cursor:pointer}
.bf-btn:hover{background:var(--paper)}
.bf-btn:focus-visible{outline:3px solid var(--sky);outline-offset:2px}

/* ---- BASF Caojing scene ---- */
.cj .cell .pb,.cj .newc{transition:opacity .4s}
.cj .shut{transition:transform 1s var(--ease);transform:translate(60px,277px)}
.cj[data-step="2"] .shut{transform:translate(412px,218px)}
.cj[data-step="3"] .shut,.cj[data-step="4"] .shut{transform:translate(456px,218px)}
.cj[data-step="5"] .shut{animation:cjscan 6s ease-in-out forwards;transform:translate(114px,102px)}
.cj[data-step="6"] .shut{transform:translate(114px,276px)}
@keyframes cjscan{0%{transform:translate(114px,102px)}18%{transform:translate(264px,102px)}25%{transform:translate(264px,160px)}43%{transform:translate(114px,160px)}50%{transform:translate(114px,218px)}68%{transform:translate(264px,218px)}75%{transform:translate(264px,276px)}93%,100%{transform:translate(114px,276px)}}
.cj .inc{transition:opacity .5s,transform .8s var(--ease)}
.cj:not([data-step="1"]) .inc{opacity:0}
.cj[data-step="2"] .inc{transform:translate(340px,-170px)}
.cj .newc,.cj .newhl{opacity:0}
.cj[data-step="2"] .newc,.cj[data-step="3"] .newc,.cj[data-step="4"] .newc,.cj[data-step="5"] .newc,.cj[data-step="6"] .newc{opacity:1;transition-delay:.7s}
.cj[data-step="2"] .newhl{opacity:1;animation:cjpop 1.4s ease-out .7s 2}
@keyframes cjpop{0%,100%{opacity:.2}50%{opacity:1}}
.cj .rd{fill:none;stroke:#3C974C;stroke-width:2;opacity:0;transform-box:fill-box;transform-origin:center}
.cj[data-step="1"] .rd{animation:rdp 1.8s ease-out infinite}
.cj .rd.b{animation-delay:.9s!important}
.cj .wv{fill:none;stroke:#3C974C;stroke-width:2.4;stroke-linecap:round;opacity:0}
.cj[data-step="2"] .wv,.cj[data-step="5"] .wv{animation:cjw 1.2s ease-out infinite}
.cj .wv.w2{animation-delay:.6s!important}
@keyframes cjw{0%{opacity:.9}100%{opacity:0}}
.cj .zone,.cj .flag{opacity:0;transition:opacity .4s}
.cj[data-step="5"] .zone,.cj[data-step="6"] .zone{opacity:1}
.cj[data-step="6"] .flag{opacity:1}
.cj .cell.z .pb{stroke:#3C974C;stroke-width:0}
.cj[data-step="5"] .cell.z .pb{animation:cjrd .5s ease-out forwards;animation-delay:var(--d)}
@keyframes cjrd{0%{stroke-width:0}40%{stroke-width:4;stroke:#3C974C}100%{stroke-width:2;stroke:#2d7a3c}}
.cj[data-step="6"] .cell.z .pb{stroke-width:2;stroke:#2d7a3c}
.cj[data-step="6"] .cell.z.bad .pb{stroke:#D8483E;stroke-width:3}
.cj .cap{opacity:0;transition:opacity .35s}
.cj[data-step="1"] .cap1,.cj[data-step="2"] .cap2,.cj[data-step="3"] .cap3,.cj[data-step="4"] .cap4,.cj[data-step="5"] .cap5,.cj[data-step="6"] .cap6{opacity:1}
.cj .pnl{opacity:0;transition:opacity .4s}
.cj[data-step="1"] .pnl-bill,.cj[data-step="2"] .pnl-bill,.cj[data-step="3"] .pnl-bill,.cj[data-step="4"] .pnl-bill,.cj[data-step="5"] .pnl-inv,.cj[data-step="6"] .pnl-inv{opacity:1}
.cj .bar{transform-box:fill-box;transform-origin:left center;transform:scaleX(0);transition:transform 1s var(--ease)}
.cj[data-step="3"] .bar{transform:scaleX(.35)}
.cj[data-step="4"] .bar{transform:scaleX(1)}
.cj .bv,.cj .d14{opacity:0;transition:opacity .4s}
.cj[data-step="4"] .bv,.cj[data-step="3"] .d14{opacity:1}
.cj .prog{transform-box:fill-box;transform-origin:left center;transform:scaleX(0)}
.cj[data-step="5"] .prog{animation:cjprog 5.6s linear forwards}
.cj[data-step="6"] .prog{transform:scaleX(1)}
@keyframes cjprog{to{transform:scaleX(1)}}
.cj .scan,.cj .done{opacity:0;transition:opacity .4s}
.cj[data-step="5"] .scan,.cj[data-step="6"] .done{opacity:1}
.cj .lk{fill:none;stroke:#8fa3b3;stroke-width:2.4;stroke-dasharray:5 5;opacity:.45}
.cj[data-step="3"] .lk,.cj[data-step="4"] .lk,.cj[data-step="5"] .lk,.cj[data-step="6"] .lk{stroke:#3C974C;opacity:1;animation:dash 1s linear infinite}
@media(prefers-reduced-motion:reduce){.cj .shut,.cj .inc{transition:none}.cj .shut{animation:none!important}.cj .rd,.cj .wv,.cj .lk,.cj .prog,.cj .cell .pb{animation:none!important}}

/* ---- Baosteel Gas cylinder scene ---- */
.cg .node circle{fill:#fff;stroke:#b8c6d1;stroke-width:3;transition:fill .4s,stroke .4s}
.cg .node .nic{fill:none;stroke:#5b7387;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.cg .node text{fill:#5b7387}
.cg .tok{transition:transform .9s var(--ease)}
.cg .prog{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .9s var(--ease)}
.cg .stg,.cg .cap{opacity:0;transition:opacity .4s}
.cg .wv{fill:none;stroke:#3C974C;stroke-width:2.6;stroke-linecap:round;opacity:0}
.cg .g1 .ring{transform-box:fill-box;transform-origin:center}
.cg .truck,.cg .truckin,.cg .truckout{transition:transform 1s var(--ease)}
.cg .dot{transition:transform 1.4s var(--ease);transform:translate(180px,330px)}
.cg .cpin,.cg .route{opacity:.35;transition:opacity .4s}
.cg .chip{opacity:0;transition:opacity .4s .8s}
.cg .fillbar{transform-box:fill-box;transform-origin:left center;transform:scaleX(0)}
.cg .truckin{transform:translate(-330px,0)}
.cg .truckout{transform:translate(0,0)}
@keyframes cgw{0%{opacity:.9}100%{opacity:0}}
@keyframes cgfill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes cgring{0%{transform:scale(.8);opacity:.9}100%{transform:scale(2.4);opacity:0}}
.cg[data-step="1"] .tok{transform:translate(70px,106px)}
.cg[data-step="1"] .prog{stroke-dashoffset:1.000}
.cg[data-step="1"] .cap1{opacity:1}
.cg[data-step="1"] .n1 circle{fill:#0B2438;stroke:#3C974C}
.cg[data-step="1"] .n1 .nic{stroke:#fff}
.cg[data-step="1"] .n1 text{fill:#0B2438}
.cg[data-step="2"] .tok{transform:translate(194px,106px)}
.cg[data-step="2"] .prog{stroke-dashoffset:0.800}
.cg[data-step="2"] .cap2{opacity:1}
.cg[data-step="2"] .n2 circle{fill:#0B2438;stroke:#3C974C}
.cg[data-step="2"] .n2 .nic{stroke:#fff}
.cg[data-step="2"] .n2 text{fill:#0B2438}
.cg[data-step="2"] .n1 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="2"] .n1 .nic{stroke:#2d7a3c}
.cg[data-step="3"] .tok{transform:translate(318px,106px)}
.cg[data-step="3"] .prog{stroke-dashoffset:0.600}
.cg[data-step="3"] .cap3{opacity:1}
.cg[data-step="3"] .n3 circle{fill:#0B2438;stroke:#3C974C}
.cg[data-step="3"] .n3 .nic{stroke:#fff}
.cg[data-step="3"] .n3 text{fill:#0B2438}
.cg[data-step="3"] .n1 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="3"] .n1 .nic{stroke:#2d7a3c}
.cg[data-step="3"] .n2 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="3"] .n2 .nic{stroke:#2d7a3c}
.cg[data-step="4"] .tok{transform:translate(442px,106px)}
.cg[data-step="4"] .prog{stroke-dashoffset:0.400}
.cg[data-step="4"] .cap4{opacity:1}
.cg[data-step="4"] .n4 circle{fill:#0B2438;stroke:#3C974C}
.cg[data-step="4"] .n4 .nic{stroke:#fff}
.cg[data-step="4"] .n4 text{fill:#0B2438}
.cg[data-step="4"] .n1 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="4"] .n1 .nic{stroke:#2d7a3c}
.cg[data-step="4"] .n2 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="4"] .n2 .nic{stroke:#2d7a3c}
.cg[data-step="4"] .n3 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="4"] .n3 .nic{stroke:#2d7a3c}
.cg[data-step="5"] .tok{transform:translate(566px,106px)}
.cg[data-step="5"] .prog{stroke-dashoffset:0.200}
.cg[data-step="5"] .cap5{opacity:1}
.cg[data-step="5"] .n5 circle{fill:#0B2438;stroke:#3C974C}
.cg[data-step="5"] .n5 .nic{stroke:#fff}
.cg[data-step="5"] .n5 text{fill:#0B2438}
.cg[data-step="5"] .n1 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="5"] .n1 .nic{stroke:#2d7a3c}
.cg[data-step="5"] .n2 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="5"] .n2 .nic{stroke:#2d7a3c}
.cg[data-step="5"] .n3 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="5"] .n3 .nic{stroke:#2d7a3c}
.cg[data-step="5"] .n4 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="5"] .n4 .nic{stroke:#2d7a3c}
.cg[data-step="6"] .tok{transform:translate(690px,106px)}
.cg[data-step="6"] .prog{stroke-dashoffset:0.000}
.cg[data-step="6"] .cap6{opacity:1}
.cg[data-step="6"] .n6 circle{fill:#0B2438;stroke:#3C974C}
.cg[data-step="6"] .n6 .nic{stroke:#fff}
.cg[data-step="6"] .n6 text{fill:#0B2438}
.cg[data-step="6"] .n1 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="6"] .n1 .nic{stroke:#2d7a3c}
.cg[data-step="6"] .n2 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="6"] .n2 .nic{stroke:#2d7a3c}
.cg[data-step="6"] .n3 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="6"] .n3 .nic{stroke:#2d7a3c}
.cg[data-step="6"] .n4 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="6"] .n4 .nic{stroke:#2d7a3c}
.cg[data-step="6"] .n5 circle{fill:#E3F2E7;stroke:#3C974C}
.cg[data-step="6"] .n5 .nic{stroke:#2d7a3c}
.cg[data-step="1"] .g1,.cg[data-step="2"] .g2,.cg[data-step="3"] .g3,.cg[data-step="4"] .g4,.cg[data-step="5"] .g5,.cg[data-step="6"] .g5{opacity:1}
.cg[data-step="1"] .g1 .ring{animation:cgring 1.6s ease-out infinite}
.cg[data-step="2"] .truckin{transform:translate(0,0)}
.cg[data-step="2"] .g2 .chip,.cg[data-step="4"] .g4 .chip{opacity:1}
.cg[data-step="2"] .wv,.cg[data-step="3"] .wv,.cg[data-step="4"] .wv,.cg[data-step="1"] .wv{animation:cgw 1.3s ease-out infinite}
.cg .wv.w2{animation-delay:.65s!important}
.cg[data-step="3"] .fillbar{animation:cgfill 5.5s linear forwards}
.cg[data-step="4"] .truckout{transform:translate(0,0)}
.cg[data-step="5"] .dot{transform:translate(560px,280px)}
.cg[data-step="5"] .cpin,.cg[data-step="5"] .route,.cg[data-step="6"] .cpin,.cg[data-step="6"] .route{opacity:1}
.cg[data-step="6"] .dot{transform:translate(180px,330px)}
@media(prefers-reduced-motion:reduce){.cg .wv,.cg .ring,.cg .fillbar{animation:none!important}.cg .tok,.cg .truckin,.cg .dot{transition:none}}
/* ---- tested-at-the-gate proof ---- */
.st-proof{background:var(--paper)}
.st-proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.st-proof figure{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.st-proof img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.st-proof figcaption{padding:16px 18px 20px}
.st-proof figcaption b{display:block;font-size:17px;color:var(--navy);margin-bottom:6px}
.st-proof figcaption span{font-size:14.5px;color:var(--muted);line-height:1.5}
@media(max-width:820px){.st-proof-grid{grid-template-columns:1fr}}

/* ---- Air Products cabinet scene ---- */
.cb .tok,.cb .truck{transition:transform 1.1s var(--ease)}
.cb .tok{transform:translate(110px,368px)}
.cb .truck{transform:translate(262px,358px)}
.cb .tg{opacity:0;transition:opacity .4s}
.cb .cap,.cb .scr,.cb .dchip,.cb .okb,.cb .bad,.cb .nb{opacity:0;transition:opacity .4s}
.cb .truck,.cb .road{opacity:0;transition:opacity .4s,transform 1.1s var(--ease)}
.cb .wv{fill:none;stroke:#3C974C;stroke-width:2.6;stroke-linecap:round;opacity:0}
.cb .hh{transition:opacity .4s}
.cb .bad{transform:translate(470px,368px)}
@keyframes cbw{0%{opacity:.9}100%{opacity:0}}
.cb[data-step="2"] .tg,.cb[data-step="3"] .tg,.cb[data-step="4"] .tg,.cb[data-step="5"] .tg,.cb[data-step="6"] .tg{opacity:1}
.cb[data-step="1"] .hh .wv,.cb[data-step="3"] .hh .wv{animation:cbw 1.2s ease-out infinite}
.cb .wv.w2{animation-delay:.6s!important}
.cb[data-step="3"] .dchip{opacity:1}
.cb[data-step="4"] .truck,.cb[data-step="4"] .road{opacity:1}
.cb[data-step="4"] .tok{transform:translate(330px,358px)}
.cb[data-step="4"] .truck{transform:translate(262px,358px)}
.cb[data-step="5"] .tok,.cb[data-step="6"] .tok{transform:translate(630px,368px) scale(1.1)}
.cb[data-step="5"] .cab .wv,.cb[data-step="6"] .cab .wv{animation:cbw 1.2s ease-out infinite}
.cb[data-step="5"] .scr5,.cb[data-step="6"] .scr6{opacity:1}
.cb[data-step="5"] .nb,.cb[data-step="6"] .nb{opacity:1}
.cb[data-step="6"] .okb,.cb[data-step="6"] .bad{opacity:1}
.cb[data-step="6"] .bad{transform:translate(470px,368px)}
.cb[data-step="1"] .cap1{opacity:1}
.cb[data-step="2"] .cap2{opacity:1}
.cb[data-step="3"] .cap3{opacity:1}
.cb[data-step="4"] .cap4{opacity:1}
.cb[data-step="5"] .cap5{opacity:1}
.cb[data-step="6"] .cap6{opacity:1}
@media(prefers-reduced-motion:reduce){.cb .wv{animation:none!important}.cb .tok,.cb .truck{transition:none}}

/* customer voice */
.st-voice{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.7fr);gap:28px;align-items:start}
.st-voice figure{margin:0}
.st-voice video{display:block;width:100%;border-radius:14px;background:#0b1f2e;box-shadow:0 10px 30px rgba(8,50,80,.16)}
.st-voice .portrait video{max-width:260px;margin:0 auto}
.st-voice figcaption{margin-top:10px;font-size:14px;color:#5b7387;line-height:1.5}
.st-voice figcaption b{display:block;color:#0b2a3f;font-size:15px}
.st-voice-pts{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 0;padding:0;list-style:none}
.st-voice-pts li{background:#eef6fb;color:#0b4d75;border-radius:999px;padding:8px 16px;font-size:14px;font-weight:600}
@media(max-width:820px){.st-voice{grid-template-columns:1fr}}
