#products-industry{isolation:isolate;overflow:hidden;background:#fff}
#products-industry::before{content:"";position:absolute;z-index:0;inset:0;background:var(--page-image-0b843f6a74, url("../assets/optimized/industry-chain-bg-gpt-image-792d7901506e.webp")) center top/cover no-repeat;opacity:.5;pointer-events:none}
#products-industry>.slide-inner{position:relative;z-index:1}
#products-industry>.slide-bottom{position:absolute;z-index:1;width:auto}
#products-industry .slide-inner{overflow:hidden}
#products-industry .catalog-panel{display:flex;flex:1 1 auto;min-height:0;flex-direction:column}
#products-industry h2{margin:0;color:#081a42;font-size:clamp(38px,3vw,54px);font-weight:700;line-height:1.12;letter-spacing:-.04em}
#products-industry h2 span{color:#075bd4}
.chain-intro{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:8px 0 6px}
.chain-intro p{margin:0;color:#1e3554;font-size:clamp(15px,1.15vw,20px);line-height:1.5}
.chain-intro>span{color:#385474;font-size:11px;letter-spacing:.3em;white-space:nowrap}
.chain-global-hint{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 7px;color:#4e6c91;font-size:10px;line-height:1.4}
.chain-global-hint b{padding:3px 8px;border-radius:999px;background:linear-gradient(90deg,#0b6ee6,#20bea8);color:#fff;font-weight:600;letter-spacing:.08em}
.hydrogen-flow{position:relative;display:flex;flex:1 1 auto;min-height:0;flex-direction:column}
.chain-supply-row{display:grid;grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr) 42px minmax(0,1fr);grid-template-rows:minmax(190px,1.1fr) minmax(145px,.9fr);gap:10px 14px;align-items:stretch;min-height:385px;height:auto;flex:1 1 auto}
.chain-supply-row>.chain-stage-card:nth-of-type(1){grid-column:1;grid-row:1}
.chain-supply-row>.chain-arrow:nth-of-type(1){grid-column:2;grid-row:1}
.chain-supply-row>.chain-stage-card:nth-of-type(2){grid-column:3;grid-row:1}
.chain-supply-row>.chain-arrow:nth-of-type(2){grid-column:4;grid-row:1}
.chain-supply-row>.chain-stage-card:nth-of-type(3){grid-column:5;grid-row:1}
.chain-supply-row>.chain-arrow:nth-of-type(3){display:none}
.chain-supply-row>.chain-app-stage{grid-column:1/-1;grid-row:2}
.chain-stage-card,.chain-app-stage{min-width:0;border:1px solid #cfe0f4;border-radius:11px;background:rgba(255,255,255,.84);box-shadow:0 9px 22px rgba(38,96,162,.06);overflow:hidden;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease,background .28s ease}
.chain-stage-card{display:grid;grid-template-rows:auto minmax(120px,1fr) auto;padding:0;text-align:left}
.chain-stage-card:hover,.chain-app-stage:hover{transform:translateY(-3px);border-color:#63adff;box-shadow:0 14px 28px rgba(22,102,196,.14)}
.chain-stage-card[aria-pressed=true],.chain-app-stage[aria-pressed=true],.chain-scene-grid button[aria-pressed=true]{border-color:#1687ef;background:rgba(240,249,255,.94);box-shadow:0 0 0 2px rgba(24,135,239,.11),0 14px 28px rgba(22,102,196,.14)}
.chain-stage-head{display:flex;align-items:center;gap:12px;padding:12px 14px 10px}
.chain-stage-head>i{display:grid;width:48px;height:48px;flex:0 0 48px;place-items:center;border-radius:50%;background:linear-gradient(145deg,#147bf1,#13bca8);color:#fff;box-shadow:0 6px 14px rgba(7,103,200,.2)}
.chain-stage-head svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chain-stage-head>span{display:flex;min-width:0;flex-direction:column;gap:3px}
.chain-stage-head b{color:#075bc9;font-size:clamp(20px,1.6vw,28px);font-weight:700;white-space:nowrap}
.chain-stage-head small{color:#536d8f;font-size:12px;white-space:nowrap}
.chain-stage-card>img{width:calc(100% - 10px);height:100%;min-height:0;margin:0 5px;border-radius:8px;object-fit:cover}
.chain-stage-card ul{margin:8px 14px 10px;padding-left:18px;color:#23415f;font-size:12px;line-height:1.65}
.chain-stage-card li::marker{color:#00a997}
.chain-arrow{position:relative;display:grid;place-items:center;color:#0b6fde;font:700 56px/1 Arial;font-style:normal;overflow:hidden}
.chain-arrow::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:#52bdff;box-shadow:0 0 12px #1b8cff;animation:chain-arrow-pulse 1.5s ease-in-out infinite}
.chain-app-stage{display:grid;grid-template-columns:225px minmax(0,1fr);padding:0;cursor:pointer}
.chain-app-stage>.chain-stage-head{align-self:stretch;border-right:1px solid #d5e7f7;background:linear-gradient(135deg,#e8f9f6,#f5fbff)}
.chain-app-stage>.chain-stage-head>i{background:linear-gradient(145deg,#0db08d,#0ac7a9)}
.chain-app-stage>.chain-stage-head b{color:#09967f}
.chain-scene-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;min-width:0;padding:8px}
.chain-scene-grid button{display:grid;grid-template-rows:auto auto 1fr;min-width:0;padding:9px 0 0;border:1px solid #d6e6f7;border-radius:9px;background:rgba(244,249,255,.9);overflow:hidden;text-align:center;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.chain-scene-grid button:hover{transform:translateY(-3px);border-color:#48a5ff;box-shadow:0 8px 18px rgba(29,110,207,.14)}
.chain-scene-grid b{color:#0754bd;font-size:15px;white-space:nowrap}
.chain-scene-grid small{margin:3px 3px 7px;color:#607794;font-size:10px;line-height:1.35}
.chain-scene-grid img{width:100%;height:100%;min-height:76px;object-fit:cover;background:#edf5fd}
.chain-feedback-loop{position:relative;height:58px;margin:2px 8% 0}
.chain-feedback-line{position:absolute;top:0;width:42%;height:50px;border-bottom:3px dashed #00b69c}
.chain-feedback-left{left:0;border-left:3px dashed #1689ef;border-radius:0 0 0 50px;background:linear-gradient(90deg,#1689ef,#00b69c) bottom/100% 2px no-repeat}
.chain-feedback-right{right:0;border-right:3px dashed #00ad91;border-radius:0 0 50px 0;background:linear-gradient(90deg,#1689ef,#00b69c) bottom/100% 2px no-repeat}
.chain-feedback-card{position:relative;z-index:2;display:flex;width:min(440px,42%);min-height:62px;align-items:center;justify-content:center;gap:14px;margin:-49px auto 0;padding:8px 24px;border:1px solid #5ea6fb;border-radius:999px;background:rgba(244,249,255,.96);box-shadow:0 10px 24px rgba(29,104,192,.1);color:#0b5ec6;text-align:left;transition:transform .25s ease,box-shadow .25s ease}
.chain-feedback-card:hover,.chain-feedback-card[aria-pressed=true]{transform:translateY(-3px);box-shadow:0 14px 30px rgba(29,104,192,.18)}
.chain-feedback-card>i{display:grid;width:46px;height:46px;flex:0 0 46px;place-items:center;border-radius:50%;background:linear-gradient(145deg,#1f8ef7,#0f60d5);color:#fff;font:700 13px/1 Arial;font-style:normal;letter-spacing:-2px}
.chain-feedback-card>span{display:flex;min-width:0;flex-direction:column;gap:2px}
.chain-feedback-card b{font-size:19px;white-space:nowrap}
.chain-feedback-card small{color:#516b8d;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hydrogen-flow.is-running .chain-arrow::after{animation:chain-arrow-run 1.3s linear infinite}
.hydrogen-flow.is-running .chain-feedback-line{animation:chain-feedback-flow 1.2s linear infinite}
.hydrogen-flow.chain-change [aria-pressed=true]{animation:chain-stage-focus .48s ease both}
@keyframes chain-arrow-pulse{50%{transform:scale(1.7);opacity:.45}}
@keyframes chain-arrow-run{from{transform:translateX(-10px);opacity:0}35%{opacity:1}to{transform:translateX(10px);opacity:0}}
@keyframes chain-feedback-flow{to{border-bottom-color:#1689ef;filter:drop-shadow(0 0 4px rgba(0,145,255,.45))}}
@keyframes chain-stage-focus{from{transform:scale(.97);opacity:.7}to{transform:none;opacity:1}}
#products-industry button:focus-visible,#products-industry [role=button]:focus-visible{outline:3px solid #4c9aff;outline-offset:3px}
@media(min-width:1600px) and (min-height:850px){
 .chain-supply-row{min-height:430px;height:auto}
 .chain-stage-card ul{font-size:14px}
 .chain-scene-grid b{font-size:17px}.chain-scene-grid small{font-size:11px}
 .chain-feedback-card{min-height:68px}.chain-feedback-card b{font-size:22px}.chain-feedback-card small{font-size:13px}
}
@media(min-width:901px) and (max-height:820px){
 #products-industry h2{font-size:34px}
 .chain-intro{margin:4px 0}.chain-intro p{font-size:14px}
 .chain-global-hint{margin-bottom:4px}
 .chain-supply-row{min-height:390px;height:auto;grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr) 34px minmax(0,1fr);grid-template-rows:minmax(230px,1.35fr) minmax(150px,.9fr);gap:10px 10px}
 .chain-stage-head{gap:8px;padding:8px 10px 7px}.chain-stage-head>i{width:38px;height:38px;flex-basis:38px}.chain-stage-head svg{width:23px;height:23px}.chain-stage-head b{font-size:19px}.chain-stage-head small{font-size:10px}
 .chain-stage-card ul{margin:5px 10px 7px;font-size:10px;line-height:1.5}
 .chain-app-stage{grid-template-columns:190px minmax(0,1fr)}.chain-app-stage>.chain-stage-head{padding:12px}
 .chain-scene-grid{gap:5px;padding:6px}.chain-scene-grid button{padding-top:6px}.chain-scene-grid b{font-size:12px}.chain-scene-grid small{font-size:8px;margin-bottom:4px}.chain-scene-grid img{min-height:68px}
 .chain-feedback-loop{height:48px}.chain-feedback-card{min-height:52px;margin-top:-42px}.chain-feedback-card>i{width:38px;height:38px;flex-basis:38px}.chain-feedback-card b{font-size:16px}.chain-feedback-card small{font-size:9px}
}
@media(max-width:900px),(max-height:620px){
 #products-industry{overflow-x:clip;overflow-y:visible}
 #products-industry .slide-inner{overflow:visible}
 #products-industry::before{background-position:70% top;opacity:.34}
 #products-industry h2{font-size:clamp(28px,8vw,36px)}
 .chain-intro{display:block}.chain-intro p{font-size:15px}.chain-intro>span{display:block;margin-top:8px}
 .chain-global-hint{align-items:flex-start;justify-content:flex-start;margin:12px 0;font-size:12px}
 .chain-supply-row{display:flex;min-height:0;height:auto;flex:none;flex-direction:column;gap:12px}
 .chain-stage-card{grid-template-rows:auto 190px auto}.chain-stage-card ul{font-size:14px}
 .chain-arrow{height:34px;transform:rotate(90deg);font-size:44px}
 .chain-app-stage{display:flex;padding-bottom:8px}.chain-app-stage>.chain-stage-head{border-right:0;background:transparent}.chain-scene-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.chain-scene-grid img{height:150px}.chain-scene-grid b{font-size:14px}
 .chain-feedback-loop{height:70px;margin:0 18px}.chain-feedback-card{width:calc(100% - 20px);margin:-57px auto 0;padding:10px 14px}.chain-feedback-card b{font-size:16px}.chain-feedback-card small{white-space:normal;line-height:1.4}
}
@media(prefers-reduced-motion:reduce){.hydrogen-flow *{animation:none!important;transition:none!important}}

/* 反馈连接线置于左右两侧，自上而下连接产业链与应用层。 */
@media(min-width:901px) and (min-height:621px){
 .chain-supply-row,.chain-feedback-card{position:relative;z-index:2}
 .chain-feedback-loop{position:absolute;z-index:1;top:18px;right:-15px;bottom:34px;left:-15px;height:auto;margin:0;pointer-events:none}
 .chain-feedback-line{top:0;bottom:0;width:0;height:auto;border-bottom:0;background:none}
 .chain-feedback-left{left:0;border-left:3px dashed #1689ef;border-radius:30px 0 0 30px}
 .chain-feedback-right{right:0;border-right:3px dashed #00ad91;border-radius:0 30px 30px 0}
 .chain-feedback-line::after{content:'↓';position:absolute;bottom:-4px;color:#0789dc;font:700 22px/1 Arial}
 .chain-feedback-left::after{left:-11px}.chain-feedback-right::after{right:-11px;color:#00a98f}
 .chain-feedback-card{margin:10px auto 0}
 .hydrogen-flow.is-running .chain-feedback-line{animation:chain-side-flow 1.2s ease-in-out infinite}
}
@keyframes chain-side-flow{50%{filter:drop-shadow(0 0 5px rgba(0,145,255,.7));border-color:#19aee7}}

/* Screenshot-faithful desktop artwork, fitted without cropping or distortion. */
.chain-reference-frame{display:none}
@media(min-width:901px) and (min-height:621px){
 #products-industry::before{display:none}
 #products-industry>.slide-inner{display:none}
 #products-industry{background:#f8fcff}
 #products-industry>.chain-reference-frame{position:absolute;top:calc(var(--header-height) + 16px);bottom:76px;left:var(--content-inline,var(--space));right:var(--content-inline,var(--space));display:flex;align-items:center;justify-content:center}
 .chain-reference-art{position:relative;flex:none;aspect-ratio:1833/713}
 .chain-reference-art>img{display:block;width:100%;height:100%;object-fit:contain}
 #products-industry .chain-reference-hotspot{position:absolute;padding:0;border:1px solid transparent;border-radius:10px;background:transparent;cursor:pointer;transition:box-shadow .2s,border-color .2s}
 #products-industry .chain-reference-hotspot:hover{border-color:#399afa;box-shadow:0 0 0 2px #258fff18}
 #products-industry .chain-reference-hotspot:focus-visible{outline:3px solid #087af0;outline-offset:3px}
 #products-industry .chain-reference-hotspot[data-chain-key=feedback]{border-radius:999px}
}
@media(max-width:900px),(max-height:620px){
 .chain-app-stage{flex-direction:column}
 .chain-global-hint,.chain-intro>span{display:none}
}
/* 运行数据由右向左回流，需求反馈沿左侧向上返回制氢。 */
.chain-feedback-motion{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.chain-feedback-motion .feedback-erase{stroke:#f8fcff;stroke-width:8}
.chain-feedback-motion .feedback-dashes{stroke:url(#feedback-motion-gradient);stroke-width:3.5;stroke-dasharray:10 7;animation:chain-feedback-travel .85s linear infinite;animation-play-state:paused}
#products-industry.active .chain-feedback-motion .feedback-dashes{animation-play-state:running}
@keyframes chain-feedback-travel{from{stroke-dashoffset:0}to{stroke-dashoffset:-17}}
@media(prefers-reduced-motion:reduce){.chain-feedback-motion .feedback-dashes{animation:none}}
/* 四角环绕与中央反馈，让供氢链与数据回流共同形成闭环。 */
#products-industry{background:radial-gradient(ellipse at center,#eaf6ff,#f8fcff 70%)}
#products-industry>.slide-inner{display:flex;flex-direction:column;height:calc(100% - 64px);padding-bottom:24px;overflow:visible}
.closed-chain-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;flex:none;margin-bottom:20px}
#products-industry .closed-chain-heading h2{font-size:clamp(28px,2.7vw,46px)}
.closed-chain-heading p{margin:10px 0 0;color:#52677e;font-size:clamp(12px,1vw,17px)}
.closed-chain-legend{display:flex;flex-direction:column;gap:6px;flex:none;font-size:12px;font-weight:600;color:#116ed0;white-space:nowrap}
.closed-chain-legend span:last-child{color:#048c77}
.closed-chain-board{position:relative;flex:1;min-height:420px;isolation:isolate}
.closed-chain-routes{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1;overflow:visible}
.closed-supply{stroke:#1681ed;stroke-width:3;stroke-dasharray:10 7;marker-end:url(#closed-blue);animation:closed-supply-flow .9s linear infinite;animation-play-state:paused}
.closed-return{stroke:#0aac93;stroke-width:3;stroke-dasharray:8 6;marker-end:url(#closed-green);animation:closed-return-flow 1s linear infinite;animation-play-state:paused}
#products-industry.active :is(.closed-supply,.closed-return){animation-play-state:running}
@keyframes closed-supply-flow{to{stroke-dashoffset:-34}}
@keyframes closed-return-flow{to{stroke-dashoffset:-28}}
.closed-stage{position:absolute;width:42%;height:40%;display:grid;grid-template-columns:43% 1fr;text-align:left;padding:12px;gap:18px;background:#fff;border:1px solid #c6def7;border-radius:16px;box-shadow:0 10px 28px #2259930c;overflow:hidden;color:#132e54}
.closed-use{left:0;top:0}.closed-production{right:0;top:0}.closed-storage{right:0;bottom:0}.closed-transport{left:0;bottom:0}
.closed-stage>img{width:100%;height:100%;object-fit:cover;min-height:0;border-radius:10px}
.closed-stage>div:not(.closed-apps){min-width:0;display:flex;flex-direction:column;justify-content:center}
.closed-step{color:#497ba9;font:600 clamp(9px,.7vw,13px)/1.3 Arial,sans-serif;letter-spacing:.06em}
#products-industry .closed-stage h3{font-size:clamp(22px,2vw,34px);line-height:1.2;margin:8px 0;color:#075ec8;font-weight:750}
.closed-stage p{font-size:clamp(11px,.9vw,16px);color:#637b93;margin:0}
.closed-stage ul{margin:12px 0 0;padding-left:16px;color:#38526e;font-size:clamp(11px,.85vw,15px);line-height:1.8}
.closed-stage li::marker{color:#08a691}
.closed-stage:hover{border-color:#79b6ef}
.closed-use{display:flex;flex-direction:column;gap:10px;background:linear-gradient(130deg,#f2fffb,#fff);border:2px solid #09aa91;box-shadow:0 0 0 5px rgba(9,170,145,.08),0 12px 30px rgba(9,170,145,.16);animation:closed-use-highlight 2.4s ease-in-out infinite}
@keyframes closed-use-highlight{50%{border-color:#25d2b5;box-shadow:0 0 0 9px rgba(9,170,145,.12),0 16px 34px rgba(9,170,145,.22)}}
.closed-use .closed-use-heading{flex-direction:row!important;justify-content:space-between!important;align-items:center;gap:8px}
#products-industry .closed-use h3{color:#008e78;margin-bottom:0;font-size:clamp(21px,1.8vw,31px)}
.closed-apps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;flex:1;min-height:0}
.closed-apps>div{display:flex;flex-direction:column;min-height:0;background:#eef6fc;border-radius:8px;overflow:hidden}
.closed-apps img{width:100%;height:0;flex:1;min-height:0;object-fit:cover}
.closed-apps b{font-size:clamp(10px,.8vw,14px);text-align:center;padding:6px 2px;color:#145687;white-space:nowrap}
.closed-feedback{position:absolute;left:33%;top:44%;width:34%;height:12%;min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:1px solid #75cbbc;border-radius:999px;background:linear-gradient(115deg,#0879d8,#06a88e);box-shadow:0 6px 20px #048c7725;color:#fff;padding:7px 16px;text-align:center}
.closed-feedback strong{font-size:clamp(15px,1.25vw,22px);line-height:1.3;white-space:nowrap}
.closed-feedback span{font-size:clamp(9px,.8vw,14px);line-height:1.3;color:#e8fff9}
.closed-route-label{position:absolute;color:#3f79b5;font-size:clamp(10px,.85vw,15px);background:#f2f9ff;padding:3px 6px}
.closed-label-top{left:50%;top:12%;transform:translateX(-50%);color:#048c77}.closed-label-left{right:82%;top:49%;transform:translateY(-50%)}
.closed-label-right{left:82%;top:49%;transform:translateY(-50%)}
.closed-label-bottom{left:50%;bottom:12%;transform:translateX(-50%)}
@media(min-width:901px) and (max-height:820px){
 .closed-chain-heading{margin-bottom:14px}.closed-chain-board{min-height:400px}
 .closed-stage{padding:9px;gap:12px}.closed-stage ul{margin-top:8px;line-height:1.65}
 #products-industry .closed-stage h3{margin:5px 0;font-size:24px}
 .closed-use{gap:7px}.closed-feedback{min-height:46px}
}
@media(max-width:900px),(max-height:620px){
 #products-industry>.slide-inner{height:auto;display:block;padding-bottom:80px}
 .closed-chain-heading{display:block}.closed-chain-legend{flex-direction:row;margin-top:12px;gap:20px}
 .closed-chain-board{display:flex;flex-direction:column;gap:32px;min-height:0}
 .closed-chain-routes,.closed-route-label,.closed-feedback-label{display:none}
 .closed-stage,.closed-feedback{position:relative;inset:auto;width:100%;height:auto;min-height:0}
 .closed-stage{min-height:190px;padding:12px;grid-template-columns:42% 1fr;overflow:visible}
 .closed-stage>img{height:170px}
 .closed-stage::after{content:'↓';position:absolute;bottom:-29px;left:50%;color:#1681ed;font-size:24px}
 .closed-use{min-height:220px}.closed-use::after{color:#0aac93}
 .closed-apps img{height:110px;flex:none}.closed-feedback{padding:18px;gap:7px}
 .closed-feedback::after{content:'↺ 反馈至制氢，持续优化供给';display:block;font-size:12px;color:#e7fff8}
 .closed-stage ul{font-size:12px}.closed-stage p{font-size:12px}.closed-use .closed-use-heading{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){.closed-supply,.closed-return,.closed-use{animation:none}}