/* ===== 内页通用 ===== */
.inner-banner{position:relative;padding:120px 0 70px;background-size:cover;background-position:center;background-color:var(--ink-850);overflow:hidden}
.inner-banner:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(5,5,5,.92),rgba(5,5,5,.6))}
.inner-banner .container{position:relative;z-index:2}
.ib-inner{max-width:820px}
.ib-inner .kicker{display:inline-block;color:var(--teal);font-size:13px;letter-spacing:2px;font-weight:700;margin-bottom:10px}
.ib-inner h1{font-size:38px;line-height:1.2;color:#fff;margin:0 0 12px}
.ib-inner p{color:var(--muted);font-size:16px;max-width:680px}
.crumb{margin-top:18px;font-size:13px;color:var(--muted)}
.crumb a{color:var(--muted)}
.crumb a:hover{color:var(--teal)}

/* 列表页：复用 prod-card，加统一间距 */
.section .prod-grid{margin-top:8px}

/* 详情页 */
.detail-wrap{max-width:920px;margin:0 auto}
.detail-body{font-size:16px;line-height:1.9;color:var(--text)}
.detail-body h2,.detail-body h3,.detail-body h4{color:#fff;margin:28px 0 12px}
.detail-body p{margin:0 0 16px;color:var(--text)}
.detail-body img{max-width:100%;height:auto;border-radius:10px;margin:14px 0}
.detail-body ul,.detail-body ol{padding-left:22px;margin:0 0 16px}
.detail-body li{margin:6px 0;color:var(--text)}
.detail-body a{color:var(--teal)}
.detail-nav{display:flex;justify-content:space-between;gap:16px;margin-top:40px;padding-top:24px;border-top:1px solid rgba(255,255,255,.08)}
.detail-nav a{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:14px;max-width:48%}
.detail-nav a:hover{color:var(--teal)}
.detail-nav .dn-next{justify-content:flex-end;text-align:right}
.detail-nav span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 关于页 */
.about-body{max-width:920px;margin:0 auto;font-size:16px;line-height:1.9;color:var(--text)}
.about-body h2,.about-body h3{color:#fff;margin:26px 0 12px}
.about-body img{max-width:100%;border-radius:10px;margin:14px 0}

/* 联系页 */
.contact-wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.contact-info h3{color:#fff;margin:0 0 14px}
.contact-info p{color:var(--muted);margin:8px 0;display:flex;align-items:center;gap:10px}
.contact-info .ci-ico{width:34px;height:34px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:rgba(44,229,184,.12);color:var(--teal)}
.contact-form{background:var(--ink-850);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:28px}
.contact-form .fld{margin-bottom:16px}
.contact-form label{display:block;font-size:13px;color:var(--muted);margin-bottom:6px}
.contact-form input,.contact-form textarea{width:100%;padding:12px 14px;background:var(--ink-900);border:1px solid rgba(255,255,255,.1);border-radius:8px;color:var(--text);font-size:14px;outline:none}
.contact-form input:focus,.contact-form textarea:focus{border-color:var(--teal)}
.contact-form textarea{min-height:120px;resize:vertical}
.contact-form .btn{width:100%;justify-content:center;margin-top:4px}
.contact-form .form-note{font-size:12px;color:var(--muted);margin-top:10px}
.contact-code{margin-top:18px;display:flex;gap:18px;align-items:center}
.contact-code img{width:120px;height:120px;border-radius:10px;background:#fff;padding:6px}
@media(max-width:768px){.contact-wrap{grid-template-columns:1fr;gap:24px}}

/* ===== 内页工艺动画 Banner (comm/hero-process) ===== */
.process-hero{
  --ph-bg:#050505; --ph-cyan:#12b3c9; --ph-cyan-d:#0a8fa3; --ph-amber:#2ce5b8; --ph-amber-d:#18c99e;
  --ph-ink:#ffffff; --ph-muted:#c5cdd1; --ph-line:rgba(18,179,201,.25);
  position:relative; min-height:480px; overflow:hidden;
  padding-top:var(--nav-h); padding-bottom:70px;
  background:
    linear-gradient(120deg,#050505 0%,#070707 55%,#050505 100%);
}
.process-hero .ph-grid{position:relative;z-index:2;display:grid;grid-template-columns:fit-content(520px) 1fr;max-width:var(--maxw);margin:0 auto;padding:0 24px;min-height:480px;align-items:center;gap:0}
.process-hero .ph-text{padding:44px 32px 44px 0}
.header.ph-header{border-bottom:1px solid var(--line);transition:.4s var(--ease)}
.header.ph-header.scrolled{background:rgba(5,5,5,.92);backdrop-filter:blur(14px);box-shadow:0 10px 30px -18px #000}
.process-hero .ph-title-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
.process-hero .ph-text h1{font-size:32px;margin:0;font-weight:700;color:var(--ph-ink)}
.process-hero .ph-text h1 .accent{background:linear-gradient(120deg,var(--teal-l),var(--mint));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.process-hero .ph-desc{color:var(--ph-muted);line-height:1.7;margin:0 0 18px;font-size:15px}
.process-hero .ph-specs{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:0 0 20px}
.process-hero .spec{background:rgba(44,229,184,.08);border:1px solid var(--ph-line);border-radius:10px;padding:10px 12px}
.process-hero .spec strong{display:block;color:var(--ph-amber);font-size:16px;margin-bottom:2px}
.process-hero .spec span{font-size:12px;color:var(--ph-muted)}
.process-hero .ph-cta{display:inline-flex;align-items:center;padding:11px 22px;border-radius:999px;background:linear-gradient(120deg,var(--ph-cyan),var(--ph-amber));color:#000;font-weight:700;text-decoration:none;font-size:14px;white-space:nowrap;position:relative;overflow:hidden;box-shadow:0 10px 24px -8px rgba(44,229,184,.35);transition:.25s}
.process-hero .ph-cta:hover{transform:translateY(-2px);box-shadow:0 14px 32px -8px rgba(44,229,184,.5)}
.process-hero .ph-cta::after{content:"";position:absolute;top:0;left:0;width:45%;height:100%;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:translateX(-160%);animation:shineSweep 3.4s ease-in-out infinite}
.process-hero .ph-tabs{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:5;padding:5px;border:1px solid var(--ph-line);background:rgba(255,255,255,.06);border-radius:999px}
.process-hero .ph-tab{padding:7px 15px;border:none;background:transparent;color:var(--ph-muted);cursor:pointer;font-size:13px;font-weight:700;border-radius:999px}
.process-hero .ph-tab.active{background:linear-gradient(120deg,rgba(18,179,201,.25),rgba(44,229,184,.25));color:#fff}
.process-hero .ph-scene-wrap{position:relative;min-height:480px;display:flex;align-items:center;justify-content:center;padding:10px}
.process-hero .ph-scene{display:none;width:100%;max-width:680px}
.process-hero .ph-scene.active{display:block}
.process-hero svg{width:100%;height:auto;overflow:visible}
.process-hero .label{font-size:12px;fill:var(--ph-muted)}
.process-hero .pipe{fill:none;stroke:var(--ph-line);stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.process-hero .pipe-inner{fill:none;stroke:var(--ph-cyan);stroke-width:2;opacity:.5}
.process-hero .particle{fill:var(--ph-amber)}
.process-hero .air{fill:var(--ph-cyan)}
.process-hero .siloshell{fill:rgba(44,229,184,.10);stroke:var(--ph-cyan);stroke-width:2}
.process-hero .machine{fill:rgba(44,229,184,.08);stroke:var(--ph-cyan);stroke-width:2}
.process-hero .gas{fill:var(--ph-cyan);opacity:.55}
.process-hero .leg{stroke:var(--ph-cyan);stroke-width:2;fill:none}
/* 料仓物料：用 transform:scaleY 走 GPU 合成层，避免逐帧重绘整块 SVG 造成卡顿 */
.process-hero .siloFill,.process-hero .siloFillUp{transform-box:fill-box;transform-origin:50% 100%;will-change:transform;animation-timing-function:ease-in-out;animation-iteration-count:infinite}
.process-hero .siloFill{animation-name:siloFill}
.process-hero .siloFillUp{animation-name:siloFillUp}
@keyframes siloFill{0%{transform:scaleY(1)}50%{transform:scaleY(0)}100%{transform:scaleY(1)}}
@keyframes siloFillUp{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(0)}}
@media (max-width:980px){
  .process-hero{padding-top:calc(var(--nav-h) + 20px)}
  .process-hero .ph-grid{grid-template-columns:1fr}
  .process-hero .ph-text{background:rgba(5,5,5,.9);padding:26px 20px}
  .process-hero .ph-scene-wrap{min-height:280px}
  .process-hero .ph-text h1{font-size:24px}
  .process-hero .ph-title-row{flex-wrap:wrap;gap:12px}
  .process-hero .ph-cta{padding:9px 16px;font-size:13px}
  /* 移动端：切换按钮固定悬浮在底部导航条之上，保证任何屏宽都完整露出 */
  .process-hero .ph-tabs{position:fixed;left:50%;transform:translateX(-50%);bottom:64px;z-index:1035;opacity:1;box-shadow:0 10px 30px -12px rgba(0,0,0,.65);transition:opacity .3s,transform .3s}
  .process-hero .ph-tabs.tabs-hidden{opacity:0;visibility:hidden;transform:translateX(-50%) translateY(16px)}
}
@media (max-width:640px){
  .process-hero{padding-top:calc(var(--nav-h) + 16px)}
}
