:root{
  --ink:#12212e; --ink2:#3d4f5f; --ink3:#6b7c8c;
  --line:#e2e8ee; --bg:#ffffff; --bg2:#f6f8fa; --bg3:#eef2f6;
  --blue:#0b4f8a; --blue2:#0d6cb8; --accent:#c8452d;
  --max:1180px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:17px/1.78 -apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC",sans-serif;
  font-feature-settings:"kern" 1;
}
img{max-width:100%; height:auto; display:block}
a{color:var(--blue2); text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:var(--max); margin:0 auto; padding:0 24px}

/* ---------- header ---------- */
.top{background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:50}
.top .bar{display:flex; align-items:center; gap:20px; height:66px}
.logo{display:flex; align-items:baseline; gap:9px; font-weight:700; font-size:20px; color:var(--ink); letter-spacing:.3px; white-space:nowrap}
.logo span{font-size:12px; font-weight:400; color:var(--ink3); letter-spacing:1.4px}
.logo b{color:var(--blue)}
.nav{display:flex; gap:0; margin-left:auto; flex-wrap:wrap; flex-shrink:0}
.nav a{color:var(--ink2); font-size:15px; padding:8px 7px; border-radius:6px; white-space:nowrap}
.nav a:hover{background:var(--bg3); text-decoration:none; color:var(--ink)}
.nav a.on{color:var(--blue); font-weight:600; background:var(--bg3)}
.tel{margin-left:8px; font-size:15px; color:var(--ink2); white-space:nowrap; padding-left:14px; border-left:1px solid var(--line)}
.tel b{color:var(--ink); font-size:16.5px}

/* ---------- breadcrumb ---------- */
.crumb{font-size:14.5px; color:var(--ink3); padding:18px 0 0}
.crumb a{color:var(--ink3)}
.crumb em{font-style:normal; margin:0 7px; color:#b9c4cd}

/* ---------- hero ---------- */
.hero{padding:34px 0 40px; border-bottom:1px solid var(--line)}
.hero-tight{padding:26px 0 22px}
.hero-tight h1{margin:0}
.hero .kicker{font-size:14.5px; color:var(--accent); font-weight:600; letter-spacing:1px; margin-bottom:10px}
.hero h1{font-size:36.5px; line-height:1.32; margin:0 0 16px; letter-spacing:-.3px}
.hero .lede{font-size:18px; color:var(--ink2); max-width:860px; margin:0 0 26px}
.hero .lede strong{color:var(--ink)}
.spec-row{display:flex; flex-wrap:wrap; gap:0; border-top:1px solid var(--line); padding-top:0}
.spec-row div{flex:1 1 150px; padding:16px 20px 4px 0; border-right:1px solid var(--line); margin-right:20px}
.spec-row div:last-child{border-right:0}
.spec-row b{display:block; font-size:22px; color:var(--blue); letter-spacing:-.4px}
.spec-row span{font-size:14px; color:var(--ink3)}

/* ---------- body sections ---------- */
main{padding-bottom:10px}
.sec{padding:44px 0 6px}
.sec h2{font-size:24px; margin:0 0 6px; letter-spacing:-.2px; display:flex; align-items:center; gap:12px}
.sec h2 i{font-style:normal; font-size:13.5px; color:#fff; background:var(--blue); width:26px; height:26px; border-radius:5px; display:inline-flex; align-items:center; justify-content:center; font-weight:600}
.sec h2.nonum i{display:none}
.sec h3{font-size:18.5px; margin:28px 0 8px; color:var(--ink)}
.sec p{margin:0 0 15px; color:var(--ink2)}
.sec p strong{color:var(--ink)}
.sec ul,.sec ol{margin:0 0 16px; padding-left:22px; color:var(--ink2)}
.sec li{margin-bottom:7px}
.sec li strong{color:var(--ink)}

/* ---------- table ---------- */
.tbl-wrap{overflow-x:auto; margin:18px 0 22px; border:1px solid var(--line); border-radius:8px}
table{border-collapse:collapse; width:100%; font-size:15.5px; background:#fff}
th,td{padding:11px 14px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top}
th{background:var(--bg2); font-weight:600; color:var(--ink); white-space:nowrap; font-size:15px}
tr:last-child td{border-bottom:0}
td code{background:var(--bg3); padding:1px 5px; border-radius:3px; font-size:14.5px}
.hl{background:#fff8f6}
.tbl-note{font-size:14px; color:var(--ink3); margin:-14px 0 20px}

/* ---------- cards ---------- */
.cards{display:grid; gap:16px; margin:20px 0 10px}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.g5{grid-template-columns:repeat(5,1fr)}
.card{border:1px solid var(--line); border-radius:9px; padding:20px; background:#fff; transition:.15s}
.card:hover{border-color:#c3d2df; box-shadow:0 2px 10px rgba(18,33,46,.05)}
.card h4{margin:0 0 7px; font-size:16.5px}
.card h4 a{color:var(--ink)}
.card p{margin:0; font-size:15px; color:var(--ink3); line-height:1.65}
.card .tagline{font-size:13.5px; color:var(--blue); font-weight:600; margin-bottom:6px; letter-spacing:.4px}

/* ---------- note boxes ---------- */
.note{border-left:3px solid var(--blue); background:var(--bg2); padding:15px 20px; margin:20px 0; border-radius:0 6px 6px 0}
.note p{margin:0; font-size:15.5px}
.note.warn{border-left-color:var(--accent); background:#fdf6f4}
.note.warn p{color:#7a2b22}

/* ---------- faq ---------- */
.faq{margin:18px 0 8px}
.faq details{border-bottom:1px solid var(--line); padding:15px 0}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{cursor:pointer; font-weight:600; font-size:16.5px; color:var(--ink); list-style:none; display:flex; justify-content:space-between; gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; color:var(--ink3); font-weight:400; font-size:20px; line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:11px 0 2px; font-size:15.5px; color:var(--ink2)}

/* ---------- gallery ---------- */
.gal{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:14px; margin:22px 0}
.gal figure{margin:0; border:1px solid var(--line); border-radius:8px; overflow:hidden; background:var(--bg2)}
.gal img{width:100%; height:158px; object-fit:cover}
.gal figcaption{font-size:13.5px; color:var(--ink3); padding:8px 10px; background:#fff}

/* ---------- article figure ---------- */
figure.fig{margin:24px 0 26px; border:1px solid var(--line); border-radius:8px; background:#fff; padding:16px 16px 12px; text-align:center}
figure.fig img{display:block; width:auto; max-width:100%; max-height:520px; height:auto; margin:0 auto}
figure.fig figcaption{font-size:14px; color:var(--ink3); margin-top:12px; line-height:1.65; text-align:left}
figure.fig figcaption b{color:var(--ink2); font-weight:600}
.fig-row{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:24px 0 26px}
.fig-row figure.fig{margin:0}
.fig-row figure.fig img{max-height:430px}
@media(max-width:760px){.fig-row{grid-template-columns:1fr}}

/* ---------- cta ---------- */
.cta{background:var(--ink); color:#fff; border-radius:10px; padding:36px 38px; margin:52px 0 40px; display:flex; align-items:center; gap:28px; flex-wrap:wrap}
.cta h3{margin:0 0 7px; font-size:21px; color:#fff}
.cta p{margin:0; font-size:15.5px; color:#b9c8d4; max-width:640px}
.cta .btn{margin-left:auto; background:#fff; color:var(--ink); padding:13px 26px; border-radius:7px; font-weight:600; font-size:16px; white-space:nowrap}
.cta .btn:hover{text-decoration:none; background:#eef2f6}

/* ---------- footer ---------- */
footer{background:var(--bg2); border-top:1px solid var(--line); padding:44px 0 30px; font-size:15px; color:var(--ink3)}
footer .cols{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:36px; margin-bottom:32px}
footer h5{margin:0 0 12px; font-size:14.5px; color:var(--ink); letter-spacing:.5px}
footer a{color:var(--ink3); display:block; margin-bottom:7px}
footer .about p{margin:0 0 10px; line-height:1.7}
footer .bottom{border-top:1px solid var(--line); padding-top:20px; display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; font-size:14px; color:#8b9aa8}
footer .bottom a{display:inline; color:#8b9aa8}

/* ---------- responsive ---------- */
@media(max-width:920px){
  .g3,.g2,.g4,.g5{grid-template-columns:1fr 1fr}
  footer .cols{grid-template-columns:1fr 1fr}
  .hero h1{font-size:29.5px}
}
@media(max-width:640px){
  .wrap{padding:0 18px}
  .top .bar{height:auto; padding:12px 0; flex-wrap:wrap; gap:10px}
  .nav{width:100%; margin-left:0; gap:0; overflow-x:auto; flex-wrap:nowrap; padding-bottom:2px}
  .nav a{padding:7px 9px; font-size:15px}
  .tel{display:none}
  .hero{padding:22px 0 28px}
  .hero h1{font-size:25px}
  .hero .lede{font-size:16.5px}
  .spec-row div{flex:1 1 45%; border-right:0; padding:12px 0 0; margin-right:0}
  .sec{padding:32px 0 4px}
  .sec h2{font-size:21px}
  .g3,.g2,.g4,.g5{grid-template-columns:1fr}
  .cta{padding:26px 22px}
  .cta .btn{margin-left:0; width:100%; text-align:center}
  footer .cols{grid-template-columns:1fr; gap:24px}
}

/* ---------- hero 图片 ---------- */
.hero-banner{margin:0 0 30px; border-radius:11px; overflow:hidden; border:1px solid var(--line); background:#0b1520}
.hero-banner img{width:100%; height:420px; object-fit:cover; object-position:center 42%; display:block}
.hero-grid{display:grid; grid-template-columns:1fr 430px; gap:48px; align-items:center}
.hero-fig{border:1px solid var(--line); border-radius:10px; background:#fff; padding:20px; display:flex; align-items:center; justify-content:center; min-height:260px}
.hero-fig img{max-height:290px; width:auto; max-width:100%; object-fit:contain}
@media(max-width:920px){
  .hero-grid{grid-template-columns:1fr; gap:24px}
  .hero-fig{min-height:180px; padding:14px}
  .hero-fig img{max-height:200px}
}

.hero-grid .spec-row{flex-wrap:wrap; gap:0}
.hero-grid .spec-row div{flex:1 1 46%; border-right:0; padding:14px 14px 4px 0; margin-right:0}
.hero-grid .spec-row div:nth-child(even){padding-right:0}
.hero-fig{align-self:center}
@media(max-width:920px){.hero-banner img{height:230px}}

/* ---------- 产品选型表：手机端转为卡片 ---------- */
@media(max-width:760px){
  .tbl-cards{overflow:visible; border:0; border-radius:0; margin:16px 0 18px}
  .tbl-cards table{display:block; background:none; font-size:15.5px}
  .tbl-cards thead{display:none}
  .tbl-cards tbody{display:block}
  .tbl-cards tr{display:block; border:1px solid var(--line); border-radius:10px; background:#fff; padding:13px 15px 5px; margin-bottom:11px}
  .tbl-cards td{display:block; border:0; padding:0 0 9px}
  .tbl-cards td:last-child{padding-bottom:2px}
  .tbl-cards td::before{content:attr(data-l); display:block; font-size:12px; line-height:1.5; color:var(--ink3); letter-spacing:.5px; margin-bottom:1px}
  .tbl-cards td:first-child{font-size:16.5px}
  .tbl-cards tr:last-child td{border:0}
  .hero-fig img{max-height:150px}
}

/* ---------- 三级下拉菜单（品类 → 产品线 → 型号） ---------- */
.nav-item{display:block}
.nav-item>a{display:block}
.nav-item:hover>a{color:var(--blue); background:var(--bg3); text-decoration:none}
.mega{display:none; position:absolute; left:0; right:0; top:100%; background:#fff;
  border-top:1px solid var(--line); box-shadow:0 16px 30px rgba(16,32,48,.10); z-index:60}
.nav-item:hover>.mega{display:block}
/* 下拉与导航之间隔着 header 的内边距，鼠标向下移动时会掉出 hover 区导致菜单消失。
   ::before 用一块透明区域把这段空隙补上；同时支持点击展开（.open）。 */
.mega::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px}
.nav-item.open>.mega{display:block}
.nav-item.open>a{color:var(--blue); background:var(--bg3); text-decoration:none}
.mega-in{display:flex; padding:24px 24px 26px; align-items:flex-start}
.mcol{flex:1 1 auto; min-width:126px; padding-right:16px}
.mcol h6{margin:0 0 8px; font-size:14.5px; font-weight:600; color:var(--blue);
  padding-left:9px; border-left:3px solid var(--blue2); line-height:1.55}
.mcol h6 a{color:var(--blue); text-decoration:none; white-space:normal}
.mcol h6.dim{color:var(--ink3); border-left-color:#c9d4de; font-weight:500}
.mcol a{display:block; font-size:15px; color:var(--ink); padding:5px 8px 5px 12px; border-radius:4px; line-height:1.55; white-space:nowrap; cursor:pointer;
  text-decoration:underline; text-decoration-color:#cbd8e3; text-decoration-thickness:1px; text-underline-offset:3px}
.mcol a:hover{color:var(--blue); background:var(--bg2); text-decoration-color:currentColor;
  text-decoration-thickness:1px}
.mcol a.more{font-size:14px; color:var(--ink3); padding-top:7px; text-decoration:none}
.mall{flex:0 0 auto; padding-right:0; text-align:right}
.allbtn{display:inline-block; font-size:14px; color:#fff; background:var(--blue);
  padding:8px 12px; border-radius:5px; line-height:1.5; white-space:nowrap}
.allbtn:hover{background:var(--blue2); color:#fff; text-decoration:none}
@media(max-width:900px){.mega{display:none!important}}

/* ---------- 产品详情页 ---------- */
.pd-top{display:grid; grid-template-columns:1fr 430px; gap:44px; padding:24px 0 8px; align-items:start}
.pd-main{border:1px solid var(--line); border-radius:10px; padding:22px; background:#fff; display:flex; align-items:center; justify-content:center; min-height:380px}
.pd-main img{max-height:420px; width:auto; max-width:100%; object-fit:contain}
.pd-thumbs{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:12px}
.pd-th{border:1px solid var(--line); border-radius:8px; padding:6px; background:#fff; min-height:64px; display:flex; align-items:center; justify-content:center}
.pd-th img{max-height:52px; width:auto; object-fit:contain}
.pd-info .kicker{margin-bottom:6px}
.pd-info h1{font-size:32.5px; line-height:1.32; margin:4px 0 10px}
.pd-sub{color:var(--ink3); font-size:15px; margin:0 0 14px; line-height:1.7}
.pd-badges{display:flex; flex-wrap:wrap; gap:7px; margin-bottom:15px}
.pd-badges span{font-size:14px; color:var(--blue); background:#eef5fb; border:1px solid #d9e7f5; border-radius:20px; padding:4px 11px}
.pd-lead{font-size:15.5px; color:var(--ink2); line-height:1.85; margin:0 0 20px}
.pd-actions{display:flex; gap:12px; flex-wrap:wrap}
.pd-actions .btn{display:inline-block; background:var(--blue); color:#fff; padding:11px 26px; border-radius:6px; font-size:16px}
.pd-actions .btn:hover{background:var(--blue2); text-decoration:none; color:#fff}
.pd-actions .btn.ghost{background:#fff; color:var(--blue); border:1px solid var(--blue)}

.tabs{margin:22px 0 40px}
.tabs>input{display:none}
.tabs>div.pane{display:none}
#tab1:checked~.p1,#tab2:checked~.p2,#tab3:checked~.p3,#tab4:checked~.p4,
#tab5:checked~.p5,#tab6:checked~.p6{display:block}
.tab-head{display:flex; gap:36px; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  position:sticky; top:66px; z-index:30; background:#fff; box-shadow:0 10px 16px -16px rgba(9,40,66,.55)}
.tab-head label{padding:15px 2px; font-size:17px; color:var(--ink2); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px}
.tab-head label:hover{color:var(--blue)}
#tab1:checked~.tab-head label[for=tab1],
#tab2:checked~.tab-head label[for=tab2],
#tab3:checked~.tab-head label[for=tab3],
#tab4:checked~.tab-head label[for=tab4],
#tab5:checked~.tab-head label[for=tab5],
#tab6:checked~.tab-head label[for=tab6]{color:var(--blue); font-weight:600; border-bottom-color:var(--blue)}
.pane{padding:28px 0 0}
.pd-h3{font-size:20px; margin:0 0 16px}
.sell-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-bottom:34px}
.sell{border:1px solid var(--line); border-radius:10px; padding:18px 20px; background:#fff}
.sell i{display:inline-flex; width:23px; height:23px; border-radius:50%; background:var(--blue); color:#fff; font-size:13.5px; font-style:normal; align-items:center; justify-content:center; margin-bottom:7px}
.sell h4{font-size:16.5px; margin:0 0 7px; line-height:1.5}
.sell p{font-size:15px; color:var(--ink2); margin:0; line-height:1.8}
.spec2 td.sk{color:var(--ink3); width:32%; background:var(--bg2)}
.spec2 td{font-size:15px}
.app-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}
.app{border:1px solid var(--line); border-radius:9px; padding:15px 17px; background:#fff}
.app h4{font-size:16px; margin:0 0 5px; color:var(--blue)}
.app p{font-size:15px; color:var(--ink2); margin:0}
.docs{display:grid; gap:12px}
.doc{display:block; border:1px solid var(--line); border-radius:9px; padding:14px 18px; background:#fff}
.doc b{display:block; font-size:16px; color:var(--blue)}
.doc span{font-size:15px; color:var(--ink3)}
.doc:hover{border-color:var(--blue2); text-decoration:none}
@media(max-width:920px){
  .pd-top{grid-template-columns:1fr; gap:20px}
  .pd-main{min-height:230px; padding:14px}
  .pd-main img{max-height:250px}
  .pd-info h1{font-size:25px}
  .sell-grid{grid-template-columns:1fr}
  .app-grid{grid-template-columns:1fr 1fr}
  .tab-head{gap:10px; overflow-x:auto; white-space:nowrap; top:0}
  .tab-head label{font-size:14px; padding:13px 1px}
}
.nav .allbtn{color:#fff}
.nav .allbtn:hover{color:#fff; text-decoration:none}

/* ---------- 品类页：产品线 / 型号导航 ---------- */
.cat-lines{display:flex; border:1px solid var(--line); border-radius:10px; background:#fff; padding:22px 24px 20px; margin:20px 0 26px}
.cat-lines .mcol h6{font-size:15px}
.cat-lines .mcol a{font-size:15.5px}
@media(max-width:860px){
  .cat-lines{display:block; padding:18px}
  .cat-lines .mcol{padding:0 0 14px; border-bottom:1px dashed var(--line); margin-bottom:14px}
  .cat-lines .mcol:last-child{border-bottom:0; margin-bottom:0; padding-bottom:0}
}
.cat-lines .dim-item, .mega .dim-item{display:block; font-size:14.5px; color:#9aa9b6; padding:5px 0 5px 12px}

/* ---------- 系列页：在售型号列表 ---------- */
.prod-list{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:18px 0 20px}
.prod-item{display:flex; gap:16px; border:1px solid var(--line); border-radius:10px; padding:14px; background:#fff}
.prod-item:hover{border-color:var(--blue2); box-shadow:0 5px 16px rgba(11,79,138,.09); text-decoration:none}
.pi-img{flex:0 0 112px; display:flex; align-items:center; justify-content:center; background:var(--bg2); border-radius:7px; min-height:92px}
.pi-img img{max-height:82px; width:auto; max-width:100%; object-fit:contain}
.pi-txt{min-width:0}
.pi-txt h3{font-size:17.5px; margin:0 0 6px; color:var(--blue); line-height:1.4}
.pi-spec{font-size:14px; color:var(--ink3); margin:0 0 5px; line-height:1.65}
.pi-use{font-size:15px; color:var(--ink2); margin:0 0 6px}
.pi-more{font-size:14px; color:var(--blue2)}
@media(max-width:760px){.prod-list{grid-template-columns:1fr}.pi-img{flex:0 0 84px; min-height:74px}.pi-img img{max-height:66px}}

/* 窄屏（≤1180）导航再紧一档，保证 9 项单行不换行 */
@media(max-width:1180px){
  .nav a{font-size:15px; padding:8px 7px}
  .tel{font-size:14.5px; padding-left:12px; margin-left:8px}
  .tel b{font-size:15.5px}
}

/* ---------- 详情页 v2：正文 / 来源标注 ---------- */
.pd-text{font-size:16px; line-height:1.95; color:var(--ink2); margin:0 0 12px}
.src{font-size:13.5px; color:var(--ink3); margin:-4px 0 26px; letter-spacing:.2px}
.src::before{content:"◇ "; color:#b8c8d6}

/* ---------- 主图缩略图 ---------- */
.pd-thumbs{display:flex; gap:8px; margin-top:10px; flex-wrap:wrap}
.pd-thumb{width:76px; height:58px; padding:4px; border:1px solid var(--line); border-radius:6px;
  background:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center}
.pd-thumb img{max-width:100%; max-height:100%; object-fit:contain}
.pd-thumb.on{border-color:var(--blue); box-shadow:0 0 0 2px rgba(26,111,181,.12)}

/* ---------- 曲线图（QE / 光谱响应） ---------- */
.curve-fig{border:1px solid var(--line); border-radius:10px; background:#fff; padding:14px 10px 6px; margin:6px 0 12px}
.curve-fig img{max-width:100%; height:auto; display:block; margin:0 auto}
.curve-svg{width:100%; height:auto; display:block}
.curve-cap{font-size:14.5px; color:var(--ink2); line-height:1.8; margin:0 0 18px;
  padding:10px 14px; background:#f6f9fc; border-left:3px solid #cfe0ee; border-radius:0 6px 6px 0}
.curve-tbl td, .curve-tbl th{font-size:14px}
.curve-tbl td:nth-child(2){white-space:nowrap; color:var(--blue); font-weight:600}

/* ---------- 选型要点 ---------- */
.sel-list{display:grid; gap:14px; margin:8px 0 30px}
.sel{border:1px solid var(--line); border-left:3px solid var(--blue2); border-radius:0 9px 9px 0;
  padding:16px 20px; background:#fff}
.sel h4{margin:0 0 9px; font-size:17px; line-height:1.6; display:flex; gap:9px; align-items:baseline}
.sel h4 i{flex:0 0 auto; font-style:normal; width:20px; height:20px; line-height:20px; text-align:center;
  background:var(--blue); color:#fff; border-radius:50%; font-size:13.5px; transform:translateY(-1px)}
.sel-a{margin:0 0 10px; font-size:15.5px; color:var(--ink2); line-height:1.9}
.sel-pick{margin:0; font-size:15.5px; background:var(--bg2); border-radius:6px; padding:10px 13px; line-height:1.85}
.sel-pick b{color:var(--blue); margin-right:8px; font-weight:600}
.sel-pick b::after{content:"｜"; color:#c3d3e0; margin-left:8px}

/* ---------- FAQ 折叠 ---------- */
.faq{border-top:1px solid var(--line); margin-bottom:10px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{padding:15px 30px 15px 0; cursor:pointer; font-size:16.5px; font-weight:500; color:var(--ink);
  position:relative; list-style:none; line-height:1.65}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; position:absolute; right:6px; top:13px; font-size:20px; color:var(--blue2); font-weight:400}
.faq details[open] summary::after{content:"−"}
.faq summary:hover{color:var(--blue)}
.faq-a{padding:0 0 17px; font-size:15.5px; color:var(--ink2); line-height:1.95}

/* ---------- 应用案例（文献） ---------- */
.case{border:1px solid var(--line); border-radius:10px; padding:20px 22px; background:#fff; margin-bottom:14px; position:relative}
.case-grid{display:grid; gap:14px}
.case-top{display:flex; align-items:center; gap:9px; margin:0 0 9px}
.case-no{font-size:13.5px; font-weight:700; color:#fff; background:var(--blue); border-radius:5px; padding:2px 7px; letter-spacing:.5px}
.case-kw{font-size:13.5px; color:var(--blue2); background:#eef5fb; border:1px solid #d8e8f5; border-radius:999px; padding:3px 10px; letter-spacing:.2px}
.case-share{margin:10px 0 0; font-size:13px; color:var(--ink3); border-top:1px dashed var(--line); padding-top:9px}
.case h4{margin:0 0 5px; font-size:17px; line-height:1.55; color:var(--ink)}
.case-en{margin:0 0 9px; font-size:14px; color:var(--ink3); line-height:1.6; font-style:italic}
.case-meta{margin:0 0 13px; font-size:14px; color:var(--blue2); padding-bottom:11px; border-bottom:1px dashed var(--line)}
.case-meta a{color:var(--blue2); word-break:break-all}
/* 方法出处：自研与整机型号没有「指名使用」的论文，挂的是该测量方法的原始文献 */
.case-ref{margin:12px 0 0; font-size:13.5px; line-height:1.75; color:var(--ink3); border-top:1px dashed var(--line); padding-top:9px}
.case-ref b{display:inline-block; color:#7a6a2f; font-weight:600; margin-right:8px; background:#fdf6e3;
  border:1px solid #efe3c2; border-radius:4px; padding:1px 7px; font-size:13px}
.case-ref a{color:var(--blue2); word-break:break-all}
.case-row{margin:0 0 8px; font-size:15px; color:var(--ink2); line-height:1.9}
.case-row b{display:inline-block; color:var(--blue); font-weight:600; margin-right:9px;
  background:#eef5fb; border-radius:4px; padding:1px 7px; font-size:14px}

/* ---------- 产品手册 ---------- */
.man-box{border:1px solid var(--line); border-radius:10px; padding:20px 22px; background:var(--bg2); margin:4px 0 28px}
.man-box h4{margin:0 0 6px; font-size:17.5px; color:var(--ink)}
.man-meta{margin:0 0 12px; font-size:14.5px; color:var(--ink3)}
.man-toc{margin:0 0 13px; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:7px}
.man-toc li{font-size:14px; color:var(--ink2); background:#fff; border:1px solid var(--line);
  border-radius:20px; padding:4px 12px}
.man-note{margin:0; font-size:15px; color:var(--ink2); line-height:1.85}

/* ---------- 留资表单 ---------- */
.lead-form{border:1px solid var(--line); border-radius:10px; padding:24px 26px 22px; background:#fff; max-width:660px}
.lf-row{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px}
.lead-form label{display:block}
.lead-form label>span{display:block; font-size:14.5px; color:var(--ink2); margin-bottom:5px}
.lead-form label>span em{color:#c0392b; font-style:normal; margin-left:2px}
.lead-form input[type=text],.lead-form input[type=email],.lead-form input[type=tel],.lead-form textarea{
  width:100%; border:1px solid #d5dee7; border-radius:6px; padding:9px 11px; font-size:15.5px;
  font-family:inherit; color:var(--ink); background:#fff; transition:border-color .15s}
.lead-form input:focus,.lead-form textarea:focus{outline:0; border-color:var(--blue2); box-shadow:0 0 0 3px rgba(26,111,181,.08)}
.lead-form textarea{resize:vertical}
.lf-full{margin-bottom:16px}
.hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0}
.lf-submit{display:inline-block; background:var(--blue); color:#fff; border:0; border-radius:6px;
  padding:12px 30px; font-size:16.5px; font-family:inherit; cursor:pointer; transition:background .15s}
.lf-submit:hover{background:var(--blue2)}
.lf-note{font-size:14px; color:var(--ink3); margin:12px 0 0; line-height:1.75}
.sent-tip{background:#eaf7ee; border:1px solid #bfe3c9; color:#1e6b3a; border-radius:8px;
  padding:13px 18px; margin:20px 0 0; font-size:15.5px; transition:opacity .6s}
.sent-tip b{margin-right:9px}

@media(max-width:760px){
  .lf-row{grid-template-columns:1fr; gap:12px}
  .lead-form{padding:20px 18px 18px}
  .sel{padding:14px 16px}
  .case{padding:16px 17px}
  .man-box{padding:16px 17px}
}

.sent-tip.bad{background:#fdf2f1; border-color:#f0c9c5; color:#b3261e}
.lf-submit:disabled{background:#8aa6bd; cursor:default}

/* 曲线在手机端：图可横向滚动保证刻度可读，表格转卡片 */
@media (max-width:700px){
  .curve-fig{overflow-x:auto; -webkit-overflow-scrolling:touch}
  .curve-fig .curve-svg{min-width:520px}
  .curve-tbl thead{display:none}
  .curve-tbl, .curve-tbl tbody, .curve-tbl tr, .curve-tbl td{display:block; width:100%}
  .curve-tbl tr{border:1px solid var(--line); border-radius:8px; margin-bottom:10px; padding:8px 12px; background:#fff}
  .curve-tbl td{border:0; padding:4px 0; font-size:14.5px; line-height:1.7}
  .curve-tbl td::before{content:attr(data-l) "："; color:var(--ink3); font-weight:400}
  .curve-tbl td:nth-child(2)::before{content:"峰值："}
  .curve-tbl td:nth-child(3)::before{content:"数据点："}
  .curve-tbl td.sk{background:none; color:var(--ink); font-weight:600; padding:4px 0}
}

.img-note{font-size:13px; color:var(--ink3); margin:8px 0 0; line-height:1.6}

@media (max-width:1180px){
  .mega-in{flex-wrap:wrap; row-gap:14px}
  .mcol{flex:1 1 150px; min-width:150px}
}

/* ---------- 产品中心：八品类通栏下拉 ---------- */
.mega-cats-wrap{overflow:hidden}
/* 十品类按 5×2 排布：单行十栏在 1440 宽下每栏不足 130px，产品线名会被压成两三个字 */
/* 九品类由 build.py 预先分成 5 栏（_MEGA_COLS），此处只做等宽排布：
   用 grid 等高行或 CSS 多列都会把「01 光谱仪」那一长条挤断或顶出屏幕 */
.mega-cats{display:flex; gap:24px; align-items:flex-start;
  padding:18px 26px 14px; max-height:calc(100vh - 88px); overflow-y:auto}
.mcol-cat{flex:1 1 0; min-width:0}
.mcat{min-width:0; margin:0 0 16px}
.mcat:last-child{margin-bottom:0}
.mcat h6{margin:0 0 6px; padding-left:9px; border-left:3px solid var(--blue2);
  font-size:17px; font-weight:600; line-height:1.45}
.mcat h6 a{color:var(--blue); text-decoration:none; white-space:normal; padding:0; font-size:17px}
.mcat h6 i{font-style:normal; color:#7fb3d5; margin-right:5px; font-size:16px}
.mega .mline{display:block; font-size:16px; color:var(--ink); font-weight:600; padding:5px 5px 0; margin-top:0;
  line-height:1.38; text-decoration:none; white-space:normal; word-break:keep-all; overflow-wrap:break-word}
.mega .mline.dim{color:#9aa9b6}
.mega .msub{display:block; font-size:14px; color:#5f7488; padding:1px 5px 0 16px; line-height:1.4; background:none;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-decoration:none}
.mega .mline:hover,.mega .msub:hover{color:var(--blue); background:var(--bg2); border-radius:4px; text-decoration:none}
.mega-foot{padding:2px 26px 16px; text-align:right; border-top:1px solid var(--line); margin-top:2px}
.mega-foot .allbtn{margin-top:10px}
.msol p{font-size:14.5px; color:var(--ink2); margin:0 0 8px; line-height:1.65; max-width:260px}
/* 简化下拉只有单列时，不能拉伸到整行宽度，否则链接 hover 高亮会横贯整屏 */
.mega-sm .mega-in{justify-content:flex-start}
.mega-sm .mcol{flex:0 0 auto; min-width:220px; padding-right:36px}
@media(max-width:1320px){
  .mega-cats{gap:18px}
}

/* ---------- 品类页：涵盖清单 / 对比表 / 选型要点 / 产品图墙 ---------- */
.cat-cover{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 30px}
.ccg{border-left:3px solid var(--blue2); padding-left:15px}
.ccg h3{margin:0 0 2px; font-size:16.5px; line-height:1.5}
.ccg h3 a{color:var(--ink); text-decoration:none}
.ccg h3 a:hover{color:var(--blue)}
.ccg .ccd{display:block; font-size:14px; color:var(--ink3); line-height:1.6; margin-bottom:8px}
ul.ccl{list-style:none; margin:0; padding:0}
ul.ccl li{display:flex; justify-content:space-between; align-items:baseline; gap:14px;
  padding:5px 0; border-bottom:1px dashed var(--line); font-size:15px}
ul.ccl li:last-child{border-bottom:0}
ul.ccl li a{color:var(--blue2); text-decoration:none; border-bottom:1px solid #cbd8e3}
ul.ccl li a:hover{color:var(--blue); border-bottom-color:currentColor}
ul.ccl li span{flex:0 0 auto; max-width:60%; text-align:right; font-size:13.5px; color:var(--ink3); line-height:1.5}
ol.pick{list-style:none; counter-reset:pk; margin:0; padding:0}
ol.pick li{counter-increment:pk; position:relative; padding:0 0 15px 36px; font-size:15.5px; line-height:1.8}
ol.pick li:before{content:counter(pk); position:absolute; left:0; top:3px; width:23px; height:23px;
  border-radius:50%; background:var(--blue); color:#fff; font-size:13.5px; font-weight:600;
  text-align:center; line-height:23px}
ol.pick li b{display:block; color:var(--ink); margin-bottom:2px}
/* 03 选型问答：销售顾问抛问题，客户自己对号 */
ol.ask{list-style:none; margin:0 0 20px; padding:0}
ol.ask li{display:flex; gap:14px; padding:13px 0; border-bottom:1px solid var(--line)}
ol.ask li:last-child{border-bottom:0; padding-bottom:4px}
ol.ask .aq{flex:0 0 36px; height:23px; margin-top:3px; border-radius:12px; background:#eaf2fa;
  color:var(--blue); font-size:13px; font-weight:700; text-align:center; line-height:23px; letter-spacing:.3px}
ol.ask .at{flex:1 1 auto; min-width:0}
ol.ask .at b{display:block; font-size:16.5px; color:var(--ink); line-height:1.62; margin-bottom:5px}
ol.ask .at p{margin:0; font-size:15px; color:var(--ink2); line-height:1.85}
.askcta{display:flex; align-items:center; gap:26px; justify-content:space-between;
  border:1px solid #d7e5f2; border-radius:11px; background:#f6fafd; padding:18px 22px}
.askcta b{display:block; font-size:16px; color:var(--ink); margin-bottom:4px}
.askcta p{margin:0; font-size:15px; color:var(--ink2); line-height:1.8}
.askcta p strong{color:var(--ink)}
a.abtn{flex:0 0 auto; display:inline-block; background:var(--blue); color:#fff; text-decoration:none;
  font-size:15px; font-weight:600; padding:10px 20px; border-radius:8px; white-space:nowrap}
a.abtn:hover{background:#0b4a86}
@media(max-width:760px){
  .askcta{flex-direction:column; align-items:flex-start; gap:13px}
  a.abtn{width:100%; text-align:center}
  ol.ask li{gap:11px}
  ol.ask .aq{flex:0 0 32px}
  ol.ask .at b{font-size:16px}
}
.pfigs{display:flex; flex-wrap:wrap; gap:16px}
.pfigs a.pfig{flex:1 1 215px; max-width:340px}
.pfnote{flex:1 1 340px; border:1px dashed #cfdae4; border-radius:10px;
  padding:18px 20px; background:#fafcfe}
.pfnote b{display:block; font-size:15px; color:var(--ink); margin-bottom:8px}
.pfnote p{margin:0 0 9px; font-size:14px; color:var(--ink3); line-height:1.8}
.pfnote ul{margin:0; padding-left:16px}
.pfnote li{font-size:14px; color:var(--ink2); line-height:1.9}
a.pfig{display:block; border:1px solid var(--line); border-radius:10px; overflow:hidden;
  background:#fff; text-decoration:none; transition:box-shadow .18s, transform .18s, border-color .18s}
a.pfig:hover{box-shadow:0 12px 24px rgba(16,32,48,.10); transform:translateY(-2px); border-color:#c9d9e6}
.pfig-im{aspect-ratio:4/3; background:#f7f9fb; display:flex; align-items:center; justify-content:center; padding:12px}
.pfig-im img{max-width:100%; max-height:100%; object-fit:contain}
.pfig-tx{padding:10px 13px 13px; border-top:1px solid var(--line)}
.pfig-tx b{display:block; font-size:15px; color:var(--ink); margin-bottom:3px}
.pfig-tx span{display:block; font-size:13.5px; color:var(--ink3); line-height:1.55; min-height:34px}
.pfig-tx em{font-style:normal; font-size:13.5px; color:var(--blue2)}
@media(max-width:1080px){
  .cat-cover{grid-template-columns:1fr}
  .pfigs a.pfig{flex:1 1 260px; max-width:none}
}

/* ==========================================================================
   v12 视觉系统：光电企业调性
   —— 深空蓝 + 光谱渐变（橙红→金→蓝→紫→青），对应 logo 的「ST」双色
   —— 白底内容区保持可读性，只在头部、页脚、CTA、联系页使用深色
   ========================================================================== */
:root{
  --ink:#0d1b2a; --ink2:#39505f; --ink3:#6b7f8e;
  --line:#e6edf3; --bg:#ffffff; --bg2:#f6f9fb; --bg3:#eef4f8;
  --blue:#0b4f8a; --blue2:#0d6cb8; --cyan:#00a6c0; --accent:#c8452d;
  --deep:#081725;
  --spec:linear-gradient(90deg,#c8452d 0%,#e8942a 22%,#0d6cb8 55%,#5b4fcf 78%,#00a6c0 100%);
}

/* ---- 头部：光谱条 + 旧官网 logo 形式 + slogan ---- */
.top{background:rgba(255,255,255,.94); backdrop-filter:saturate(180%) blur(14px); border-bottom:1px solid var(--line)}
.top::before{content:""; position:absolute; left:0; right:0; top:0; height:2px; background:var(--spec); z-index:2}
/* 加了搜索框后 1180 的页头宽度要省出来：间距与导航内边距各收一点 */
.top .bar{height:70px; gap:16px}
.logo{align-items:center; gap:10px; text-decoration:none; flex:0 0 auto}
/* 页头改用整枚横式商标（ST 双色标 + 中文全称 + 英文名），文字已烘进图片 */
.logo .lpic{height:44px; width:auto; max-width:none; display:block}
.logo b{font-size:22px; font-weight:800; letter-spacing:1.2px; color:#0b4f8a; -webkit-font-smoothing:antialiased}
.logo span{font-size:12px; font-weight:400; letter-spacing:3.4px; color:#8494a3}
.logo:hover{text-decoration:none}
.slogan{display:flex; align-items:center; gap:9px; font-size:13.5px; color:#7b8b9a; letter-spacing:1.6px; white-space:nowrap}
.slogan i{width:1px; height:15px; background:#d5dee6; font-style:normal}
.nav a{padding:10px 9px; border-radius:0; position:relative; color:var(--ink2)}
.nav a::after{content:""; position:absolute; left:9px; right:9px; bottom:4px; height:2px; background:linear-gradient(90deg,#0d6cb8,#00a6c0); transform:scaleX(0); transform-origin:left; transition:transform .22s ease}
.nav a:hover::after,.nav a.on::after{transform:scaleX(1)}
.nav a:hover{background:none; color:var(--blue)}
.nav a.on{background:none; color:var(--blue)}
.tel{border-left-color:#dfe8ef; color:var(--ink3); font-size:13.5px; letter-spacing:.4px}
.tel b{font-size:17px; color:var(--blue); letter-spacing:.6px; font-variant-numeric:tabular-nums}
/* ---- 页头搜索：内联输入框 + 结果下拉 ---- */
.sfwrap{position:relative; flex:0 0 auto; margin-left:auto}
.sf{display:flex; align-items:center; gap:8px; width:272px; height:38px; padding:0 12px;
  border:1px solid #dbe6ef; border-radius:9px; background:#fff; color:#7c93a8;
  transition:border-color .18s, box-shadow .18s}
.sf:focus-within{border-color:var(--blue2); box-shadow:0 0 0 3px rgba(13,108,184,.08)}
.sf input{flex:1 1 auto; min-width:0; border:0; outline:0; background:none; font-size:14.5px;
  color:var(--ink); font-family:inherit; line-height:1.4}
.sf input::placeholder{color:#9aabba}
.sf kbd{flex:0 0 auto; font-family:inherit; font-size:11px; line-height:1.6; color:#a6b4c0;
  border:1px solid var(--line); border-radius:4px; padding:0 4px}
.sf:focus-within kbd{display:none}
.sres{position:absolute; top:calc(100% + 10px); right:0; width:580px; max-height:62vh; overflow:auto;
  background:#fff; border:1px solid var(--line); border-radius:12px; padding:10px;
  box-shadow:0 18px 40px rgba(16,32,48,.16); z-index:80}
.sres[hidden]{display:none}
.shot[hidden]{display:none}
.shot{display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:3px 6px 6px;
  font-size:13.5px; color:var(--ink3)}
.shot b{font-weight:600; color:#7c8d9c}
.shot a{font-size:13px; color:var(--blue); background:#f1f7fc; border:1px solid #e0edf7; border-radius:12px;
  padding:2px 10px; text-decoration:none}
.shot a:hover{background:#e6f2fb; border-color:#c9e0f2; text-decoration:none}
.srit{display:block; padding:10px 12px; border-radius:9px; text-decoration:none; border:1px solid transparent}
.srit + .srit{margin-top:2px}
.srit:hover,.srit.cur{background:var(--bg2); border-color:var(--line); text-decoration:none}
.srg{display:inline-block; font-size:12px; line-height:1.7; color:var(--blue); background:#eaf2fa;
  border-radius:6px; padding:0 7px; margin-right:8px; vertical-align:1px}
.srit b{font-size:16.5px; font-weight:600; color:var(--ink)}
.srit i{display:block; font-style:normal; font-size:14px; color:var(--ink3); line-height:1.62; margin-top:4px}
.srnone{margin:10px 6px 8px; font-size:14.5px; color:var(--ink3); line-height:1.85}
.srnone a{color:var(--blue)}
mark{background:#fff1bf; color:inherit; padding:0 1px; border-radius:2px}
.sbtn{display:none; align-items:center; justify-content:center; flex:0 0 auto; width:34px; height:34px;
  border:1px solid #dbe6ef; border-radius:9px; background:#fff; color:#4d6b85; cursor:pointer}
.scancel{display:none; flex:0 0 auto; border:0; background:none; color:var(--blue);
  font-size:15px; font-family:inherit; padding:0 2px; cursor:pointer}
@media(max-width:920px){
  /* 手机端：整屏搜索层。.top 的 backdrop-filter 会成为 fixed 后代的包含块，
     不关掉的话搜索层只能撑到页头高度，下面会漏出正文 */
  .top{backdrop-filter:none}
  /* 手机端：整屏搜索层，避免绝对定位被首屏图片盖住 */
  .sfwrap{display:none; position:fixed; left:0; right:0; top:0; bottom:0; z-index:300;
    background:#fff; padding:12px 16px 14px; overflow:auto}
  html.search-open .sfwrap{display:block}
  html.search-open{overflow:hidden}
  .sf{width:100%; height:44px; box-sizing:border-box}
  .sf input{font-size:16px}
  .sf kbd{display:none}
  .scancel{display:block}
  .sres{position:static; width:auto; max-height:none; border:0; box-shadow:none; padding:6px 0 0; margin-top:6px}
  .sbtn{display:flex}
}

/* ---- 标题排版 ---- */
.hero{padding:40px 0 44px; background:linear-gradient(180deg,#f8fbfd 0%,#fff 100%)}
.hero h1{font-size:39.5px; font-weight:700; letter-spacing:-.9px; line-height:1.24}
.hero .lede{font-size:17.5px; line-height:1.85}
.hero-tight{padding:34px 0 26px}
.hero.hero-nospec{padding-bottom:24px}
.hero.hero-nospec .lede{margin-bottom:0}
.hero-tight h1{font-size:32.5px; letter-spacing:-.6px; padding-left:18px; border-left:3px solid var(--blue2)}
.hero .kicker{color:var(--blue2); letter-spacing:2.4px; font-size:13px; font-weight:700; text-transform:uppercase}
.sec h2{font-size:25px; font-weight:700; letter-spacing:-.4px; gap:13px}
.sec h2 i{background:none; color:var(--blue2); border:1px solid #cfdde8; border-radius:3px;
  width:30px; height:25px; font-size:13px; letter-spacing:.6px; font-weight:600;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.sec{padding:52px 0 8px}
.sec h3{font-size:19px; font-weight:700}

/* ---- 卡片 ---- */
.card{position:relative; border:1px solid var(--line); border-radius:11px; background:#fff; overflow:hidden; transition:transform .2s, box-shadow .2s, border-color .2s}
.card::before{content:""; position:absolute; left:0; right:0; top:0; height:2px; background:var(--spec); opacity:0; transition:opacity .2s}
.card:hover{transform:translateY(-2px); box-shadow:0 12px 28px rgba(11,79,138,.09); border-color:#cfe0ec}
.card:hover::before{opacity:1}
.card .tagline{color:var(--blue2); font-size:13px; letter-spacing:1.6px; font-weight:700}

/* ---- 按钮 ---- */
.lead-form .btn{display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:linear-gradient(135deg,#0b4f8a,#0d6cb8); color:#fff; border:0; border-radius:8px;
  padding:12px 26px; font-size:16px; font-weight:600; cursor:pointer; transition:.2s; letter-spacing:.5px}
.lead-form .btn:hover{box-shadow:0 10px 24px rgba(11,79,138,.26); transform:translateY(-1px)}
a.abtn{background:linear-gradient(135deg,#0b4f8a,#0d6cb8); border-radius:8px; padding:11px 22px; font-weight:600; letter-spacing:.3px; transition:.2s}
a.abtn:hover{background:linear-gradient(135deg,#0d6cb8,#00a6c0); box-shadow:0 8px 20px rgba(13,108,184,.26)}

/* ---- CTA 深色 ---- */
.cta{background:radial-gradient(130% 170% at 0% 0%,#12395c 0%,#0b1e30 55%,#081725 100%);
  border:1px solid #16344c; position:relative; overflow:hidden; border-radius:12px}
.cta::after{content:""; position:absolute; right:-70px; top:-70px; width:300px; height:300px; border-radius:50%;
  background:radial-gradient(circle,rgba(0,166,192,.28),transparent 68%); pointer-events:none}
.cta::before{content:""; position:absolute; left:0; right:0; top:0; height:2px; background:var(--spec); opacity:.85}
.cta h3{letter-spacing:-.3px}
.cta p{color:#a9bfd0}
.cta .btn{position:relative; z-index:1}

/* ---- 页脚深色 ---- */
footer{background:linear-gradient(180deg,#0b1e30 0%,#081725 100%); border-top:1px solid #16344c; color:#8fa5b7}
footer h5{color:#fff; font-size:14px; letter-spacing:1.4px}
footer a{color:#8fa5b7}
footer a:hover{color:#fff; text-decoration:none}
footer .about p{color:#8fa5b7}
footer .fslogan{color:#5ec8dd; letter-spacing:4px; font-size:15px; margin:0 0 14px}
footer .bottom{border-top:1px solid #16344c; color:#67809a}
footer .bottom a{color:#67809a}

/* ---- 数据条 ---- */
.spec-row div{border-right-color:var(--line)}
.spec-row b{color:var(--blue); font-variant-numeric:tabular-nums; letter-spacing:-.6px}

/* ---- 选型问答编号 ---- */
ol.ask li{border-bottom-color:var(--line)}

/* ---- 联系页 ---- */
.chead{display:grid; grid-template-columns:1.15fr .85fr; border-radius:13px; overflow:hidden; margin:4px 0 22px;
  background:radial-gradient(130% 170% at 0% 0%,#12395c 0%,#0b1e30 58%,#081725 100%); color:#fff;
  border:1px solid #16344c; position:relative}
.chead::before{content:""; position:absolute; left:0; right:0; top:0; height:2px; background:var(--spec)}
.chead-l{padding:40px 42px 36px}
.cen{font-size:12px; letter-spacing:4.4px; color:#5ec8dd; margin-bottom:16px; font-weight:600}
.chead h3{font-size:28.5px; margin:0 0 7px; color:#fff; letter-spacing:-.4px}
.cen2{color:#9db4c6; font-size:14.5px; margin:0 0 22px; letter-spacing:.3px}
.cslogan{font-size:20px; letter-spacing:7px; color:#fff; margin:0; padding-top:18px; border-top:1px solid rgba(255,255,255,.13); font-weight:500}
.chead-r{display:flex; flex-direction:row; align-items:center; justify-content:space-between; gap:24px; padding:40px 38px;
  background:rgba(255,255,255,.045); border-left:1px solid rgba(255,255,255,.09)}
.chot{display:block; color:#fff; text-decoration:none; flex:1 1 auto; min-width:0}
.chot span{display:block; font-size:12px; letter-spacing:2.2px; color:#8fa8bc; margin-bottom:5px}
.chot b{font-size:27.5px; letter-spacing:.8px; font-variant-numeric:tabular-nums; font-weight:600}
.chot i{display:block; font-style:normal; font-size:14px; line-height:1.6; color:#8fa8bc; margin-top:9px}
/* 微信二维码：紧贴咨询热线，深色卡里放白底方块保证可扫 */
.cqr{flex:0 0 auto; text-align:center; padding-left:24px; border-left:1px solid rgba(255,255,255,.12)}
.cqr a{display:block; text-decoration:none}
.cqr img{display:block; width:106px; height:106px; box-sizing:border-box; padding:5px; background:#fff;
  border-radius:8px; box-shadow:0 4px 14px rgba(0,0,0,.28)}
.cqr span{display:block; margin-top:8px; font-size:12.5px; color:#9db4c6; letter-spacing:.4px; white-space:nowrap}
.cqr a:hover img{box-shadow:0 4px 14px rgba(94,200,221,.45)}
.chot:hover{text-decoration:none}
.chot:hover b{color:#5ec8dd}
.cinfo{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:11px; overflow:hidden}
.ci{background:#fff; padding:24px 26px}
.ci-k{font-size:12px; letter-spacing:2.2px; color:#8494a3; margin-bottom:10px; font-weight:600}
.ci-v{font-size:16px; color:var(--ink); line-height:1.65}
.ci-v a{color:var(--blue2)}
.ci-s{font-size:14px; color:#8494a3; margin-top:8px}
.steps{display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); margin:6px 0 24px}
.step{padding:24px 22px 20px 0; border-right:1px solid var(--line)}
.step:last-child{border-right:0; padding-right:0}
.step b{display:block; font-size:12px; letter-spacing:2.4px; color:var(--blue2); margin-bottom:11px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-weight:600}
.step h4{margin:0 0 8px; font-size:17px; letter-spacing:-.2px}
.step p{margin:0; font-size:15px; color:var(--ink3); line-height:1.68}

@media(max-width:1300px){.slogan{display:none}}
@media(max-width:920px){
  .chead{grid-template-columns:1fr}
  .chead-r{border-left:0; border-top:1px solid rgba(255,255,255,.09); padding:26px 34px 30px; flex-direction:row; gap:28px; justify-content:flex-start}
  .chead-l{padding:30px 34px 26px}
  .cinfo{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .step{border-right:0; padding-right:0}
  .hero h1{font-size:30.5px}
  .hero-tight h1{font-size:27.5px}
}
@media(max-width:920px){
  .chead-r{gap:20px; padding:24px 30px 26px}
  .cqr{padding-left:20px}
  .cqr img{width:96px; height:96px}
}
@media(max-width:1080px){
  /* 页头 1180 刚好塞满，窄屏要把搜索框收一点，避免 2px 横向滚动 */
  .sf{width:236px}
}
@media(max-width:640px){
  .top::before{height:2px}
  /* 手机端横向并排会把号码挤成两行，改成号码在上、二维码在下 */
  .chead-r{flex-direction:column; align-items:stretch; gap:16px}
  .cqr{padding:14px 0 0; border-left:0; border-top:1px solid rgba(255,255,255,.12);
    display:flex; align-items:center; gap:14px; text-align:left}
  .cqr img{width:88px; height:88px}
  .cqr span{margin-top:0; font-size:12px}
  .chot b{font-size:23px}
  .steps{grid-template-columns:1fr}
  .cslogan{letter-spacing:4px; font-size:18px}
  .hero-tight h1{font-size:24px; padding-left:13px}
}

/* ---- v12 第二批：hero 质感与首屏 ---- */
.hero{position:relative; overflow:hidden; isolation:isolate}
.hero::before{content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background-image:linear-gradient(rgba(13,108,184,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(13,108,184,.05) 1px,transparent 1px);
  background-size:68px 68px;
  -webkit-mask-image:radial-gradient(130% 90% at 12% 0%,#000 0%,rgba(0,0,0,.35) 55%,transparent 78%);
  mask-image:radial-gradient(130% 90% at 12% 0%,#000 0%,rgba(0,0,0,.35) 55%,transparent 78%)}
.hero-banner{position:relative; border-radius:14px; overflow:hidden;
  box-shadow:0 26px 60px -30px rgba(8,23,37,.6), 0 0 0 1px rgba(8,23,37,.06)}
.hero-banner img{height:450px}
.hero-banner::after{content:""; position:absolute; left:0; right:0; bottom:0; height:42%;
  background:linear-gradient(180deg,transparent,rgba(8,23,37,.5)); pointer-events:none}
/* 首页首行标语 */
.hero .kicker{font-size:14px; letter-spacing:5px; color:var(--blue2); font-weight:600}

/* 品类 / 产品页：图更满、标题更稳 */
.hero-tight .hero-grid{grid-template-columns:1fr 500px; gap:52px}
.hero-tight .hero-fig{min-height:300px; border-radius:12px; border-color:#dbe7f0;
  background:linear-gradient(145deg,#f4f9fc 0%,#e9f1f8 100%); position:relative; overflow:hidden}
.hero-tight .hero-fig::before{content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 78% 18%,rgba(0,166,192,.16),transparent 62%)}
.hero-tight .hero-fig img{max-height:340px; position:relative; z-index:1; filter:drop-shadow(0 18px 30px rgba(11,79,138,.16))}
.hero-fig img{transition:transform .35s ease}
.hero-fig:hover img{transform:scale(1.02)}

@media(max-width:920px){
  .hero-tight .hero-grid{grid-template-columns:1fr; gap:22px}
  .hero-banner img{height:260px}
  .hero::before{background-size:44px 44px}
}

/* ---- 品类页首屏：深色卡 + 英文小标 + 光谱短线 ---- */
.hero.hero-cat{padding:40px 44px 36px; margin:10px 0 0; border:1px solid #16344c; border-radius:15px;
  border-bottom:1px solid #16344c; position:relative; overflow:hidden; color:#fff;
  background:radial-gradient(135% 175% at 88% 0%,#12395c 0%,#0b1e30 56%,#081725 100%)}
.hero.hero-cat::before{content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(rgba(94,200,221,.065) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(94,200,221,.065) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(120% 100% at 100% 0%,#000 0%,transparent 74%);
  mask-image:radial-gradient(120% 100% at 100% 0%,#000 0%,transparent 74%)}
.hero.hero-cat::after{content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--spec)}
.hero.hero-cat .hd-en{position:relative; font-size:12px; letter-spacing:4.6px; color:#5ec8dd; margin-bottom:15px; font-weight:600}
.hero.hero-cat h1{position:relative; color:#fff; font-size:38.5px; letter-spacing:-.7px; margin:0; padding:0; border:0; line-height:1.2}
.hero.hero-cat .hd-rule{position:relative; margin-top:24px}
.hero.hero-cat .hd-rule i{display:block; width:72px; height:2px; background:linear-gradient(90deg,#5ec8dd,rgba(94,200,221,0))}
@media(max-width:920px){
  .hero.hero-cat{padding:30px 26px 26px; border-radius:12px}
  .hero.hero-cat h1{font-size:28.5px}
  .hero.hero-cat .hd-en{font-size:10px; letter-spacing:3px; margin-bottom:12px}
  .hero.hero-cat .hd-rule{margin-top:18px}
}

/* 品类页编号水印 */
.hero.hero-cat .hd-no{position:absolute; right:30px; top:50%; transform:translateY(-50%); font-size:118px; font-weight:800;
  line-height:1; letter-spacing:-4px; color:rgba(94,200,221,.11); pointer-events:none;
  font-variant-numeric:tabular-nums; user-select:none}
@media(max-width:920px){.hero.hero-cat .hd-no{font-size:76px; right:16px; opacity:.8}}

/* ---- v14：商标 + 产品线页「清单式」首屏 ---- */
.logo .lmark{width:34px; height:34px; display:block; flex:0 0 34px; border-radius:9px;
  box-shadow:0 4px 12px rgba(8,23,37,.16)}
.logo{gap:11px}
.logo b{letter-spacing:1.4px}

.hero.hero-line{padding:34px 0 18px}
.hero.hero-line .hmeta{font-size:13.5px; letter-spacing:1.6px; color:#7c8d9c; margin:14px 0 18px}
.hero.hero-line .hmeta b{color:var(--blue2); font-size:15px; font-variant-numeric:tabular-nums}
ul.hplist{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:0 34px}
ul.hplist li{display:flex; gap:14px; align-items:baseline; padding:11px 0; border-bottom:1px solid var(--line); min-width:0}
ul.hplist li b{flex:0 0 42%; font-size:15.5px; color:var(--ink); font-weight:600; letter-spacing:.1px}
ul.hplist li span{font-size:14.5px; color:var(--ink3); line-height:1.6; min-width:0}
ul.hplist li:first-child{border-top:1px solid var(--line)}
.sec.sec-spec{padding-top:38px}
.sec.sec-spec .spec-note{margin:18px 0 0; font-size:15px; color:var(--ink3); line-height:1.85; max-width:900px}
@media(max-width:920px){
  .logo .lmark{width:28px; height:28px; flex:0 0 28px; border-radius:8px}
  .hero.hero-line{padding:28px 0 26px}
  ul.hplist{grid-template-columns:1fr; gap:0}
  ul.hplist li b{flex:0 0 38%; font-size:15px}
  ul.hplist li span{font-size:14px}
}
footer h5{display:flex; align-items:center; gap:9px}
footer h5 .fmark,footer h5 img{width:22px; height:22px; border-radius:6px; opacity:.95}

/* 产品线页：清单撑满、行内名字不被压 */
.hero.hero-line .hero-banner{margin-bottom:30px}
.hero.hero-line .hero-grid{grid-template-columns:1fr 430px; gap:46px; margin-bottom:14px}
.hero.hero-line .hero-grid:not(.has-fig){grid-template-columns:1fr}
.hero.hero-line .hero-fig{min-height:250px}
.hero.hero-line .hero-fig img{max-height:270px}
ul.hplist{grid-template-columns:repeat(auto-fit,minmax(430px,1fr))}
ul.hplist li{gap:16px}
ul.hplist li b{flex:0 0 auto; min-width:132px; max-width:46%}
ul.hplist li span{flex:1}
@media(max-width:920px){
  ul.hplist{grid-template-columns:1fr}
  ul.hplist li{flex-direction:column; gap:3px}
  ul.hplist li b{max-width:none}
  .hero.hero-line .hero-banner img{height:200px}
}

/* ---- v14：移动端页头不再压住内容 ---- */
@media(max-width:920px){
  .top{position:static}
  .top .bar{height:auto; min-height:0; padding:10px 0 0; flex-wrap:wrap; gap:0 12px}
  .logo{flex:0 0 auto}
  .logo .lpic{height:32px}
  .nav{order:5; width:100%; margin:8px 0 0; padding:2px 0 8px; flex-wrap:nowrap; overflow-x:auto;
    overflow-y:hidden; border-top:1px solid var(--line); -webkit-overflow-scrolling:touch; scrollbar-width:none}
  .nav::-webkit-scrollbar{display:none}
  .nav a{padding:8px 10px; font-size:14.5px}
  .nav a::after{left:10px; right:10px; bottom:2px}
  .tel{display:none}
  .slogan{display:none}
  .hero.hero-line .hmeta{margin:12px 0 14px}
  .tbl-wrap{border-radius:6px}
}


/* ============================================================================
   v16：产品详情页改为「彩页版式」——深色首屏 + 彩页正文
   正文 DOM 由 brochure_build.py 从彩页 HTML 还原（保留原类名），此处只做版式
   ============================================================================ */

/* ---- 首屏 ---- */
.hero.hero-bc{padding:44px 46px 40px; margin:10px 0 0; border:1px solid #16344c; border-radius:15px;
  position:relative; overflow:hidden; color:#fff; border-bottom:1px solid #16344c;
  background:radial-gradient(135% 175% at 88% 0%,#12395c 0%,#0b1e30 56%,#081725 100%)}
.hero.hero-bc::before{content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(rgba(94,200,221,.06) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(94,200,221,.06) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(120% 100% at 100% 0%,#000 0%,transparent 74%);
  mask-image:radial-gradient(120% 100% at 100% 0%,#000 0%,transparent 74%)}
.hero.hero-bc::after{content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--spec)}
.hb-grid{position:relative; display:grid; grid-template-columns:1fr 512px; gap:46px; align-items:center}
.hb-en{font-size:12px; letter-spacing:3.6px; color:#5ec8dd; font-weight:600; margin-bottom:14px; line-height:1.9}
.hero.hero-bc h1{color:#fff; font-size:37.5px; letter-spacing:-.7px; line-height:1.24; margin:0 0 14px; padding:0; border:0}
.hb-sub{font-size:16px; line-height:1.85; color:#a9c2d4; margin:0 0 20px; max-width:660px}
.hb-chips{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 26px}
.hb-chips span{font-size:14px; color:#cfe6f3; border:1px solid rgba(94,200,221,.3);
  background:rgba(94,200,221,.09); padding:5px 12px; border-radius:20px; white-space:nowrap}
.hb-act{display:flex; gap:12px; flex-wrap:wrap}
a.hb-btn{display:inline-flex; align-items:center; background:linear-gradient(135deg,#0d6cb8,#00a6c0); color:#fff;
  padding:12px 24px; border-radius:8px; font-size:15.5px; font-weight:600; letter-spacing:.4px; transition:.2s}
a.hb-btn:hover{box-shadow:0 10px 26px rgba(0,166,192,.32); text-decoration:none; transform:translateY(-1px)}
a.hb-btn.ghost{background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.26); color:#dbeaf5}
a.hb-btn.ghost:hover{background:rgba(255,255,255,.12); box-shadow:none}
.hb-fig{background:#fff; border-radius:13px; padding:24px; display:flex; align-items:center; justify-content:center;
  height:372px; box-shadow:0 26px 60px rgba(0,0,0,.4)}
.hb-fig img{max-width:100%; max-height:344px; width:auto; object-fit:contain; display:block}

/* ---- 页内目录 ---- */
.bc-toc{background:#f7fafc; border-bottom:1px solid var(--line); position:relative}
.bc-toc::after{content:none; position:absolute; right:0; top:0; bottom:1px; width:60px; pointer-events:none;
  background:linear-gradient(90deg,rgba(247,250,252,0),#f7fafc 72%)}
.bc-toc-in{display:flex; flex-wrap:wrap; gap:8px 8px; overflow:visible; padding:13px 0}
.bc-toc-in::-webkit-scrollbar{display:none}
.bc-toc-in a{flex:0 0 auto; font-size:14px; color:var(--ink2); background:#fff; border:1px solid var(--line);
  padding:6px 12px; border-radius:20px; white-space:nowrap; transition:.15s}
.bc-toc-in a b{color:var(--blue2); font-weight:700; margin-right:6px; font-family:ui-monospace,Menlo,monospace; font-size:13px}
.bc-toc-in a:hover{border-color:#9ecde8; color:var(--blue); text-decoration:none; box-shadow:0 4px 12px rgba(11,79,138,.08)}

/* ---- 章节头 ---- */
.bc-sec{padding:48px 0 6px}
.bc-head{display:flex; align-items:baseline; gap:12px; padding-bottom:12px; margin-bottom:22px;
  border-bottom:1px solid var(--line)}
.bc-no{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13px; color:#fff;
  background:linear-gradient(135deg,#0b4f8a,#0d6cb8); padding:3px 7px; border-radius:4px; letter-spacing:.6px;
  align-self:center}
.bc-head h2{font-size:24px; font-weight:700; letter-spacing:-.3px; margin:0; color:var(--ink); display:inline-flex}
.bc-en{margin-left:auto; font-size:12px; letter-spacing:2.6px; color:#93a8b8; font-weight:600; align-self:center}

/* ---- 详情页标签栏：产品概述与技术参数/选型要点/应用案例/产品手册并排 ---- */
.tabs-pd{margin:26px 0 32px}
.tabs-pd .tab-head{gap:30px}
.tabs-pd .tab-head label{font-size:16.5px; padding:16px 2px}
.tabs-pd .pane{padding:26px 0 0}
.tabs-pd .bc-toc{border:1px solid var(--line); border-radius:10px; background:#f8fbfd;
  margin:0 0 4px; position:static; overflow:hidden}
.tabs-pd .bc-toc::after{display:none}
.tabs-pd .bc-toc-in{padding:11px 13px}
.tabs-pd .bc-sec{padding:36px 0 6px}
.tabs-pd .bc-sec:first-of-type{padding-top:30px}
.tabs-pd .tab-sec{margin:0 0 26px}
.tabs-pd .tab-sec:last-child{margin-bottom:0}
.ts-no{display:inline-block; font-family:ui-monospace,Menlo,Consolas,monospace; font-size:12px; color:#fff;
  background:linear-gradient(135deg,#0b4f8a,#0d6cb8); padding:2px 6px; border-radius:4px;
  margin-right:9px; vertical-align:2px; letter-spacing:.5px}
.ts-vol{font-size:13.5px; color:var(--blue2); font-weight:700; letter-spacing:.6px; margin-right:10px;
  padding-right:10px; border-right:1px solid var(--line)}
@media(max-width:920px){
  .tabs-pd{margin:18px 0 24px}
  .tabs-pd .tab-head{gap:14px}
  .tabs-pd .tab-head label{font-size:15px; padding:13px 1px}
  .tabs-pd .pane{padding:18px 0 0}
  .tabs-pd .bc-sec{padding:26px 0 6px}
}

/* ---- 正文排版 ---- */
.bc-body{font-size:16.5px; line-height:1.85; color:var(--ink2)}
.bc-body p{margin:0 0 14px; color:var(--ink2)}
.bc-body b,.bc-body strong{color:var(--ink)}
.bc-body .intro{font-size:17px; line-height:1.95; margin-bottom:18px}
.bc-body h3{font-size:18.5px; color:var(--ink); margin:0 0 8px; font-weight:700; line-height:1.45}
.bc-body h4{font-size:16.5px; color:var(--ink); margin:0 0 6px; font-weight:700}
.bc-body sub,.bc-body sup{font-size:.72em}
.bc-body ul,.bc-body ol{margin:0 0 14px; padding-left:22px}
.bc-body li{margin-bottom:6px}

/* 表：彩页原表 → 站点宽表 */
.bc-tbl{overflow-x:auto; border:1px solid var(--line); border-radius:10px; background:#fff; margin:0 0 18px}
.bc-body table{width:100%; border-collapse:collapse; font-size:15px; min-width:600px}
.bc-body thead th{background:#f1f7fb; color:var(--blue); font-weight:700; font-size:14.5px; text-align:left;
  padding:11px 14px; border-bottom:1px solid #dbe6ef; border-right:1px solid #e9f0f6; line-height:1.5}
.bc-body tbody td{padding:10px 14px; border-bottom:1px solid #eef4f8; border-right:1px solid #f3f7fa;
  vertical-align:top; line-height:1.7; color:var(--ink2)}
.bc-body tbody tr:last-child td{border-bottom:0}
.bc-body thead th:last-child,.bc-body tbody td:last-child{border-right:0}
.bc-body tbody tr:nth-child(even){background:#fafcfe}
.bc-body tbody tr:hover{background:#f4f9fd}
.bc-body td.k,.bc-body th.k{color:var(--ink); font-weight:600; background:#f8fbfd; min-width:132px}
.bc-body tbody tr:nth-child(even) td.k{background:#f5f9fc}
.bc-body td.k b{color:var(--blue)}
.bc-body .alt{color:var(--ink3)}

/* 图与图注 */
.bc-body img{max-width:100%; height:auto; max-height:600px; display:block; margin:0 auto; border-radius:6px}
.bc-body .fig,.bc-body .figwrap,.bc-body .figbox,.bc-body .figcenter,.bc-body .bimg,.bc-body .mimg,
.bc-body .shot,.bc-body .shimg{background:#f8fbfd; border:1px solid var(--line); border-radius:10px; padding:14px; margin:0 0 12px}
.bc-body .figcap{font-size:14.5px; line-height:1.8; color:var(--ink3); margin:8px 0 0}
.bc-body .figcap b,.bc-body .cap b{color:var(--ink2)}
.bc-body figure{margin:0 0 18px}

/* 卡片栅格：特点 / 型号 / 应用 / 选型 */
.bc-body .features,.bc-body .fgrid,.bc-body .mgrid,.bc-body .brandgrid,.bc-body .apps,.bc-body .pick,
.bc-body .appcase,.bc-body .fig3,.bc-body .duo,.bc-body .grid,.bc-body .grid2,.bc-body .modelgrid,
.bc-body .mgrid2,.bc-body .casegrid2{display:grid; gap:16px; margin:0 0 20px}
.bc-body .features,.bc-body .fgrid{grid-template-columns:repeat(auto-fit,minmax(238px,1fr))}
.bc-body .mgrid,.bc-body .pick,.bc-body .casegrid2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.bc-body .brandgrid,.bc-body .grid2{grid-template-columns:repeat(auto-fit,minmax(228px,1fr))}
.bc-body .apps{display:flex; flex-wrap:wrap; gap:12px}
.bc-body .apps .app{flex:1 1 152px; min-width:148px; max-width:100%}
.bc-body .fig3,.bc-body .duo{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.bc-body .fcard,.bc-body .mcard,.bc-body .bcard,.bc-body .pcard,.bc-body .ocard,.bc-body .ucard,
.bc-body .acard,.bc-body .appcase,.bc-body .app{border:1px solid var(--line); border-radius:11px; background:#fff;
  padding:18px 18px 16px; position:relative; overflow:hidden; transition:.2s}
.bc-body .fcard:hover,.bc-body .mcard:hover,.bc-body .bcard:hover,.bc-body .appcase:hover{
  border-color:#cfe0ec; box-shadow:0 10px 26px rgba(11,79,138,.07)}
.bc-body .fcard h3{font-size:16.5px; margin:0 0 6px}
.bc-body .fcard p{font-size:15px; line-height:1.72; margin:0; color:var(--ink3)}
.bc-body .fcard .ic{display:inline-flex; align-items:center; justify-content:center; min-width:26px; height:24px;
  padding:0 6px; border-radius:5px; background:#eaf4fb; color:var(--blue2); font-size:13.5px; font-weight:700;
  margin:0 0 10px; font-family:ui-monospace,Menlo,monospace}
.bc-body .fcard .fimg{margin:-18px -18px 14px; background:#f8fbfd; border-bottom:1px solid var(--line)}
.bc-body .fcard .fimg img{border-radius:0; max-height:150px; object-fit:contain; padding:10px}
.bc-body .app{text-align:center; padding:16px 12px}
.bc-body .app .t{font-size:15px; font-weight:700; color:var(--blue); line-height:1.5}
.bc-body .app .d{font-size:14px; color:var(--ink3); line-height:1.6; margin-top:5px}
.bc-body .mcard{padding:20px}
.bc-body .mcard .code,.bc-body .mcard .mi{font-family:ui-monospace,Menlo,monospace; font-size:13px;
  letter-spacing:.6px; color:var(--blue2); font-weight:700; margin-bottom:6px}
.bc-body .mcard .md,.bc-body .mcard .mdesc{font-size:15.5px; line-height:1.78; color:var(--ink2)}
.bc-body .mcard .mimg{margin:12px 0 0; padding:10px}
.bc-body .mcard .mimg img{max-height:190px; object-fit:contain}
.bc-body .bcard .bimg{margin:-18px -18px 12px; border:0; border-bottom:1px solid var(--line); border-radius:0;
  padding:12px; background:#f8fbfd; height:176px; display:flex; align-items:center; justify-content:center; overflow:hidden}
.bc-body .bcard .bimg img{max-height:152px; max-width:100%; width:auto; object-fit:contain; margin:0 auto}
.bc-body .bcard .bw{font-size:15px; font-weight:700; color:var(--ink); line-height:1.5}
.bc-body .bcard .btxt{font-size:14.5px; color:var(--ink3); line-height:1.65; margin-top:5px}
.bc-body .pcard{padding:18px}
.bc-body .pcard .pt{font-size:15.5px; font-weight:700; color:var(--blue); margin-bottom:7px}
.bc-body .pcard .pm{font-size:15px; color:var(--ink3); line-height:1.72}
.bc-body .appcase{padding:20px}
.bc-body .appcase h3{font-size:17px; display:flex; gap:9px; align-items:baseline}
.bc-body .appcase .idx{font-family:ui-monospace,Menlo,monospace; font-size:13px; color:#fff;
  background:linear-gradient(135deg,#0b4f8a,#0d6cb8); padding:2px 6px; border-radius:4px; flex:0 0 auto}
.bc-body .appcase .fig{background:none; border:0; padding:0; margin:12px 0 10px}
.bc-body .appcase .figcap{font-size:14px}

/* 标签行 / 提示条 / 分册标题 */
.bc-body .featline,.bc-body .feats,.bc-body .fchips{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px}
.bc-body .fchip,.bc-body .chip{display:inline-block; font-size:14px; color:var(--blue); background:#f4fafd;
  border:1px solid #d9e8f2; padding:5px 12px; border-radius:20px; line-height:1.6}
.bc-body .note{border-left:3px solid var(--blue2); background:#f4f9fd; padding:13px 16px; border-radius:0 8px 8px 0;
  font-size:15px; line-height:1.8; color:var(--ink2); margin:0 0 18px}
.bc-body .note b{color:var(--blue)}
.bc-body .coderow{border:1px dashed #cfe0ec; border-radius:9px; padding:13px 16px; font-size:15px;
  color:var(--ink2); background:#fbfdfe; margin:0 0 18px}
.bc-vol{margin:56px 0 4px; padding:10px 0 10px 16px; border-left:3px solid var(--blue2);
  font-size:23px; font-weight:700; color:var(--ink); letter-spacing:-.3px}
.bc-vol+.bc-sec{padding-top:22px}

@media(max-width:1000px){
  .hb-grid{grid-template-columns:1fr; gap:30px}
  .hb-fig{height:270px; order:-1; padding:20px}
  .hb-fig img{max-height:232px}
  .hero.hero-bc h1{font-size:28.5px}
}
@media(max-width:920px){
  .hero.hero-bc{padding:30px 24px 28px; border-radius:12px}
  .hb-sub{font-size:15px}
  .bc-head{flex-wrap:wrap}
  .bc-en{margin-left:0; flex-basis:100%; margin-top:4px}
  .bc-head h2{font-size:21px}
  .bc-body{font-size:16px}
  .bc-body table{font-size:14.5px; min-width:540px}
  .bc-body td.k{min-width:108px}
  .bc-body .features,.bc-body .mgrid,.bc-body .pick,.bc-body .brandgrid,.bc-body .apps,
  .bc-body .fig3,.bc-body .duo,.bc-body .casegrid2{grid-template-columns:1fr}
  .bc-vol{font-size:20px; margin-top:44px}
}

/* 步骤流（µ-Manager 五步、操作流程这类） */
.bc-body .flowrow,.bc-body .steps,.bc-body .flow,.bc-body .steprow{display:grid;
  grid-template-columns:repeat(auto-fit,minmax(166px,1fr)); gap:12px; margin:0 0 18px}
.bc-body .fstep,.bc-body .step{border:1px solid var(--line); border-radius:10px;
  background:linear-gradient(180deg,#fff,#f8fbfd); padding:15px 13px 13px; text-align:center}
.bc-body .fstep .n,.bc-body .step .n{width:26px; height:26px; border-radius:50%; color:#fff; font-size:14px;
  font-weight:700; display:flex; align-items:center; justify-content:center; margin:0 auto 9px;
  background:linear-gradient(135deg,#0b4f8a,#0d6cb8)}
.bc-body .fstep .t,.bc-body .step .t{font-size:15px; font-weight:700; color:var(--ink); line-height:1.5}
.bc-body .fstep .d,.bc-body .step .d{font-size:14px; color:var(--ink3); line-height:1.55; margin-top:4px}

/* 多册页的目录分组标签 */
.bc-toc-vol{flex:0 0 auto; display:inline-flex; align-items:center; font-size:13px; font-weight:700;
  letter-spacing:1.2px; color:#fff; background:linear-gradient(135deg,#0b4f8a,#0d6cb8);
  padding:6px 12px; border-radius:20px; margin-left:4px}
.bc-toc-vol:first-child{margin-left:0}

/* 无实拍图的产品线：首屏单列 */
.hero.hero-bc-nofig .hb-grid{grid-template-columns:1fr}
.hero.hero-bc-nofig .hb-sub{max-width:820px}

/* 章节副标（彩页 .rt），不进水目录 */
.bc-sub{font-size:14.5px; color:var(--ink3); font-weight:400; align-self:center;
  padding-left:13px; border-left:1px solid var(--line); line-height:1.5}
@media(max-width:920px){.bc-sub{flex-basis:100%; border-left:0; padding-left:0; margin-top:2px}}

/* 型号卡：型号名与定位（彩页 .mname / .mrole） */
.bc-body .mcard .mname,.bc-body .mtxt .mname{font-size:16.5px; font-weight:700; color:var(--ink);
  letter-spacing:.2px; margin:0 0 4px; font-family:inherit}
.bc-body .mcard .mrole,.bc-body .mtxt .mrole{font-size:14.5px; color:var(--blue2); font-weight:600;
  margin:0 0 8px; line-height:1.5}
.bc-body .mcard .mdesc,.bc-body .mtxt .mdesc{font-size:15px; color:var(--ink3); line-height:1.72; margin:0}

/* ---------- v20：产品页补充 Tab 的四段结构与章节块 ---------- */
.tab-sec{border-top:1px solid var(--line,#e6ecf2); padding:22px 0 4px}
.tab-sec:first-child{border-top:0; padding-top:6px}
.tab-sec .pd-h3{margin:0 0 4px}
.tab-sec .pd-sub{font-size:14.5px; color:var(--ink3,#7b8a9a); margin:0 0 14px; letter-spacing:.2px}
.tab-sec .bc-tbl{margin:14px 0 4px}
.tab-sec .bc-tbl table{width:100%; border-collapse:collapse; font-size:15px}
.tab-sec .bc-tbl th{background:#f5f8fb; text-align:left; font-weight:600; padding:9px 12px; border-bottom:1px solid var(--line,#e6ecf2); white-space:nowrap}
.tab-sec .bc-tbl td{padding:9px 12px; border-bottom:1px solid var(--line,#eef2f6); vertical-align:top}
.tab-sec .tbl-note{font-size:14px; color:var(--ink3,#7b8a9a); margin:8px 0 0}
.tab-sec .note{background:#f7fafc; border-left:3px solid var(--blue2,#2e6da4); padding:12px 16px; margin:16px 0 0}
.tab-sec .note p{margin:0; font-size:15px; line-height:1.85}
.tab-sec .cards{margin:14px 0 0}
.case-flag{font-size:13px; color:#b4441f; background:#fdf1ec; border:1px solid #f6d9cd; border-radius:999px; padding:2px 9px; letter-spacing:.2px}
.case-row b{display:inline-block; min-width:96px; color:var(--blue2,#2e6da4); font-weight:600; margin-right:8px}
@media (max-width:920px){
  .case-row b{display:block; min-width:0; margin:0 0 2px}
  .tab-sec .bc-tbl{overflow-x:auto}
}

/* ---------- v22：数值单元格不折行 + 首屏两列等高 ---------- */
.bc-tbl td.nw, .tab-sec td.nw{white-space:nowrap}
.hero-bc .hb-grid{align-items:stretch}
.hero-bc .hb-fig{height:auto; min-height:344px; align-self:stretch}
.hero-bc .hb-fig img{max-height:340px}
@media (max-width:920px){
  .hero-bc .hb-fig{min-height:0}
}

/* ---------- v23：产品线图片宫格（总览页九大品类 / 品类页子品类） ---------- */
.lgrid{display:grid; gap:18px; margin:24px 0 10px}
.lgrid.c4{grid-template-columns:repeat(4,1fr)}
.lgrid.c3{grid-template-columns:repeat(3,1fr)}
.lgrid.c2{grid-template-columns:repeat(2,1fr)}
.lcard{display:flex; flex-direction:column; background:#fff; border:1px solid var(--line);
  border-radius:11px; overflow:hidden; text-decoration:none; transition:transform .22s, box-shadow .22s, border-color .22s}
.lcard:hover{text-decoration:none; transform:translateY(-3px); border-color:#cfe0ec;
  box-shadow:0 14px 30px rgba(11,79,138,.10)}
.limg{display:grid; place-items:center; aspect-ratio:16/10; padding:16px 14px 4px;
  background:#fff; overflow:hidden}
.limg img{max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain;
  transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.lcard:hover .limg img{transform:scale(1.04)}
.lmeta{padding:2px 16px 20px; text-align:center}
.lmeta b{display:block; font-size:16px; line-height:1.5; color:var(--ink); font-weight:700; letter-spacing:-.1px}
.lmeta i{display:block; margin-top:5px; font-style:normal; font-size:11px; line-height:1.5;
  color:#93a3b4; letter-spacing:.11em; text-transform:uppercase;
  white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}

/* 九大品类卡：大图 + 编号角标 */
.cgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:26px 0 10px}
.ccard{position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid var(--line);
  border-radius:14px; overflow:hidden; text-decoration:none; transition:transform .22s, box-shadow .22s, border-color .22s}
.ccard:hover{text-decoration:none; transform:translateY(-4px); border-color:#cfe0ec;
  box-shadow:0 18px 38px rgba(11,79,138,.11)}
.ccard .cno{position:absolute; left:18px; top:16px; z-index:2; font-style:normal; font-size:12px;
  font-weight:700; letter-spacing:.1em; color:#b3c1cf}
.cimg{display:grid; place-items:center; aspect-ratio:16/10; padding:20px 24px 4px; overflow:hidden}
.cimg img{max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain;
  transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.ccard:hover .cimg img{transform:scale(1.035)}
.cmeta{padding:2px 20px 22px; text-align:center}
.cmeta b{display:block; font-size:19px; line-height:1.45; color:var(--ink); font-weight:700; letter-spacing:-.2px}
.cmeta i{display:block; margin-top:6px; font-style:normal; font-size:12px; color:#93a3b4;
  letter-spacing:.12em; line-height:1.6; text-transform:uppercase}
.cmeta u{display:inline-block; margin-top:11px; font-size:13px; text-decoration:none;
  color:var(--blue); background:#eef4fa; border-radius:999px; padding:2px 10px; letter-spacing:.02em}

/* 技术服务：编号卡，深色底与产品卡区分 */
.sgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:24px 0 10px}
.scard{display:block; padding:24px 22px 22px; border-radius:12px; text-decoration:none;
  background:linear-gradient(158deg,#0c2743 0%,#123c60 100%); transition:transform .22s, box-shadow .22s}
.scard:hover{text-decoration:none; transform:translateY(-3px); box-shadow:0 16px 32px rgba(9,38,64,.22)}
.scard em{font-style:normal; font-size:12px; font-weight:700; letter-spacing:.16em; color:#6f9dc4}
.scard b{display:block; margin:10px 0 5px; font-size:17px; line-height:1.45; color:#fff}
.scard i{display:block; font-style:normal; font-size:11px; letter-spacing:.12em; color:#7fa8c9; margin-bottom:10px}
.scard span{display:block; font-size:14.5px; line-height:1.65; color:#c3d6e6}

/* 折叠：完整型号清单 */
.fold{border:1px solid var(--line); border-radius:10px; background:var(--bg2); margin:22px 0 8px}
.fold>summary{cursor:pointer; padding:16px 20px; font-size:15.5px; font-weight:600; color:var(--ink);
  list-style:none; display:flex; align-items:center; justify-content:space-between}
.fold>summary::-webkit-details-marker{display:none}
.fold>summary::after{content:"展开"; font-size:14px; font-weight:400; color:var(--ink3)}
.fold[open]>summary::after{content:"收起"}
.fold[open]>summary{border-bottom:1px solid var(--line)}
.fold-in{padding:6px 20px 18px}
.fold-in h3{font-size:16.5px; margin:20px 0 6px}

@media(max-width:1080px){
  .cgrid{grid-template-columns:repeat(2,1fr)}
  .lgrid.c4{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:920px){
  .sgrid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .cgrid{grid-template-columns:repeat(2,1fr); gap:12px}
  .lgrid.c4,.lgrid.c3{grid-template-columns:repeat(2,1fr); gap:10px}
  .lgrid.c2{grid-template-columns:repeat(2,1fr); gap:10px}
  .limg{aspect-ratio:4/3; padding:14px 10px 4px}
  .lmeta{padding:0 10px 14px}
  .lmeta b{font-size:15px}
  .lmeta i{font-size:10px; letter-spacing:.06em}
  .cmeta{padding:0 8px 16px}
  .cmeta b{font-size:15.5px}
  .cmeta i{font-size:10px; letter-spacing:.06em}
  .cimg{padding:12px 10px 2px}
  .sgrid{grid-template-columns:1fr}
}

/* ---------- v25：首屏轮播（品牌形象 + 自制产品） ---------- */
.hc{margin:0 0 28px}
.hc-view{position:relative; height:450px; border-radius:14px; overflow:hidden; background:#0b1520;
  box-shadow:0 26px 60px -30px rgba(8,23,37,.55), 0 0 0 1px rgba(8,23,37,.06)}
.hc-slide{position:absolute; inset:0; opacity:0; visibility:hidden;
  transition:opacity .55s ease, visibility .55s}
.hc-slide.on{opacity:1; visibility:visible}
.hc-brand img{width:100%; height:100%; object-fit:cover; object-position:center 42%; display:block}

.hc-prod{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.04fr); background:#fff}
.hc-txt{display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
  padding:0 26px 0 60px; min-width:0}
.hc-tag{display:inline-block; font-size:12px; font-weight:600; letter-spacing:.1em;
  color:var(--blue); background:#e4eef8; border-radius:999px; padding:4px 11px}
.hc-name{margin:15px 0 0; font-size:32.5px; line-height:1.28; letter-spacing:-.6px}
.hc-name a{color:var(--ink)}
.hc-name a:hover{color:var(--blue); text-decoration:none}
.hc-spec{display:flex; flex-wrap:wrap; gap:6px 21px; margin:15px 0 0; font-size:15px;
  color:var(--ink3); letter-spacing:.01em}
.hc-spec span{position:relative; white-space:nowrap}
.hc-spec span:not(:last-child)::after{content:"·"; position:absolute; right:-13px; color:#b9c7d4}
.hc-more{margin-top:27px; display:inline-flex; align-items:center; gap:7px; font-size:14.5px;
  color:var(--blue); border:1px solid #cfdfec; border-radius:999px; padding:8px 17px;
  background:rgba(255,255,255,.7); white-space:nowrap;
  transition:background .2s, border-color .2s, color .2s}
.hc-more em{font-style:normal; transition:transform .2s}
.hc-more:hover{text-decoration:none; background:var(--blue); border-color:var(--blue); color:#fff}
.hc-more:hover em{transform:translateX(3px)}

.hc-fig{display:flex; align-items:center; justify-content:center; height:100%; min-width:0;
  min-height:0; overflow:hidden; padding:40px 58px 44px 6px}
.hc-fig img{max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain}

.hc-bar{display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:13px}
.hc-dots{display:flex; align-items:center; gap:7px}
.hc-dot{background:none; border:0; padding:3px 1px; cursor:pointer; line-height:0}
.hc-dot i{display:block; width:20px; height:3px; border-radius:2px; background:#dde5ec;
  transition:width .3s, background .3s; position:relative; overflow:hidden}
.hc-dot:hover i{background:#c2d0dd}
.hc-dot.on i{width:34px; background:#dde5ec}
/* 选中那格走一条进度，看得出来它在自己翻页 */
.hc-dot.on i::after{content:""; position:absolute; left:0; top:0; bottom:0; width:0;
  background:var(--blue); border-radius:2px; animation:hcprog 5s linear forwards}
@keyframes hcprog{from{width:0}to{width:100%}}
.hc[data-paused] .hc-dot.on i::after{animation-play-state:paused}
.hc-foot{display:flex; align-items:center; gap:18px}
.hc-count{font-size:13px; color:#9aabb9; letter-spacing:.09em; font-variant-numeric:tabular-nums}
.hc-count b{font-size:16px; font-weight:600; color:var(--ink2); margin-right:4px; letter-spacing:0}
.hc-nav{display:flex; gap:8px}
.hc-nav button{width:34px; height:34px; border-radius:50%; border:1px solid var(--line);
  background:#fff; color:var(--ink2); cursor:pointer; font-size:18px; line-height:1;
  display:flex; align-items:center; justify-content:center; padding:0 0 2px;
  transition:border-color .2s, color .2s, background .2s}
.hc-nav button:hover{border-color:var(--blue); color:var(--blue); background:#f6fafe}
.hc-nav button:focus-visible{outline:2px solid var(--blue2); outline-offset:2px}

@media(max-width:1080px){
  .hc-txt{padding-left:36px}
  .hc-name{font-size:27.5px}
  .hc-fig{padding:32px 46px 38px 4px}
}
@media(max-width:920px){
  .hc-view{height:360px}
  .hc-name{font-size:24px}
  .hc-txt{padding-left:28px}
  .hc-spec{font-size:14px; gap:5px 16px}
  .hc-spec span:not(:last-child)::after{right:-10px}
}
@media(max-width:640px){
  .hc-view{height:392px; border-radius:12px}
  .hc-prod{display:flex; flex-direction:column-reverse; background:#f6fafc}
  .hc-fig{flex:1 1 auto; height:auto; min-height:0; padding:14px 20px 2px}
  .hc-txt{flex:none; justify-content:flex-start; padding:8px 18px 18px}
  .hc-name{margin-top:9px; font-size:20px; letter-spacing:-.3px}
  .hc-spec{margin-top:9px; font-size:13px; gap:4px 13px}
  .hc-spec span:not(:last-child)::after{right:-8px}
  .hc-more{margin-top:13px; font-size:13px; padding:6px 13px; background:#fff}
  .hc-bar{margin-top:10px}
  .hc-dot i{width:15px}
  .hc-dot.on i{width:24px}
  .hc-foot{gap:12px}
  .hc-nav button{width:30px; height:30px; font-size:16px}
}

/* ---------- 首页：九个产品线入口（统一画框 + 图片 + 中英文名） ---------- */
.pl-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin:28px 0 10px}
.pl-card{
  position:relative; display:flex; flex-direction:column;
  border:1px solid #e4eaf2; border-radius:13px; overflow:hidden;
  background:#fff; text-decoration:none;
  transition:border-color .22s ease, box-shadow .22s ease, transform .22s ease;
}
.pl-card:hover{text-decoration:none; border-color:#b6cee4; box-shadow:0 14px 32px rgba(11,79,138,.10); transform:translateY(-3px)}
.pl-fig{aspect-ratio:4/3; background:#fff; display:flex; align-items:center; justify-content:center; overflow:hidden}
.pl-fig img{width:100%; height:100%; object-fit:contain; display:block;
  transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.pl-card:hover .pl-fig img{transform:scale(1.035)}
.pl-body{padding:15px 18px 16px; border-top:1px solid #eff3f8;
  display:flex; align-items:flex-start; justify-content:space-between; gap:14px}
.pl-body h3{margin:0 0 6px; font-size:17.5px; line-height:1.4; color:var(--ink); font-weight:600; letter-spacing:-.1px}
.pl-en{display:block; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:#8b9db0; line-height:1.5}
.pl-no{flex:0 0 auto; margin-top:1px; font-size:13.5px; letter-spacing:.08em; color:#b3c6d8;
  font-variant-numeric:tabular-nums; transition:color .22s ease}
.pl-card:hover .pl-no{color:var(--blue)}
@media(max-width:900px){
  .pl-grid{grid-template-columns:repeat(2,1fr); gap:16px}
  .pl-body{padding:13px 15px 14px}
}
@media(max-width:560px){
  .pl-grid{grid-template-columns:1fr; gap:14px}
  .pl-body h3{font-size:16.5px}
}

/* ---------- 页脚：联系信息（标签右对齐 + 值列） ---------- */
footer .fmeta{font-style:normal; margin:0; padding:0; display:grid; gap:9px}
footer .fmeta>div{display:grid; grid-template-columns:4.4em 1fr; column-gap:11px; align-items:start; line-height:1.72}
footer .fmeta b{font-weight:400; font-size:13.5px; color:#6d8aa3; letter-spacing:.1em; text-align:left; white-space:nowrap; padding-top:2px}
footer .fmeta span{color:#a9c0d2}
footer .fmeta .nb{white-space:nowrap}
footer .fmeta a{display:inline; margin:0; padding-bottom:1px; color:#dcebf5;
  border-bottom:1px solid rgba(94,200,221,.24); transition:color .18s, border-color .18s}
footer .fmeta a:hover{color:#5ec8dd; border-bottom-color:#5ec8dd; text-decoration:none}
@media(max-width:920px){
  footer .fmeta{gap:8px}
  footer .fmeta>div{grid-template-columns:4.2em 1fr; column-gap:9px}
}

/* ---------- 发展历程：年份节点（后续按年追加） ---------- */
.tl-sec{padding:0 0 10px}
.tl{padding-top:20px}
.tl-item{position:relative; display:grid; grid-template-columns:96px 1fr; gap:18px; align-items:baseline; padding-left:26px}
.tl-item::before{content:""; position:absolute; left:2px; top:.55em; width:10px; height:10px; border-radius:50%;
  background:var(--blue); box-shadow:0 0 0 5px rgba(11,79,138,.09)}
.tl-y{font-size:31.5px; font-weight:600; letter-spacing:-.6px; color:var(--blue);
  font-variant-numeric:tabular-nums; line-height:1.2}
.tl-b h3{margin:0; font-size:19px; font-weight:500; color:var(--ink); line-height:1.55}
@media(max-width:640px){
  .tl-item{grid-template-columns:1fr; gap:6px; padding-left:22px}
  .tl-y{font-size:27.5px}
  .tl-b h3{font-size:17.5px}
}

/* ---------- 独立搜索页 /search/ ---------- */
#spage{max-width:100%}
.spform{display:flex; align-items:center; gap:12px; padding:11px 14px; background:#fff;
  border:1.5px solid var(--blue2); border-radius:11px; color:var(--blue2);
  box-shadow:0 0 0 4px rgba(13,108,184,.07)}
.spform input{flex:1 1 auto; min-width:0; border:0; outline:0; background:none;
  font-size:17.5px; color:var(--ink); font-family:inherit; line-height:1.5}
.spform input::placeholder{color:#9aabba}
.spgo{flex:0 0 auto; border:0; background:var(--blue2); color:#fff; font-family:inherit;
  font-size:15.5px; padding:9px 22px; border-radius:8px; cursor:pointer; transition:background .18s}
.spgo:hover{background:var(--blue)}
.spchips{margin:14px 0 0; display:flex; flex-wrap:wrap; align-items:center; gap:8px;
  font-size:14px; color:var(--ink3)}
.spchips b{font-weight:600; color:#7c8d9c}
.spchips a{font-size:13.5px; color:var(--blue); background:#f1f7fc; border:1px solid #e0edf7;
  border-radius:13px; padding:3px 12px; text-decoration:none; transition:background .16s, border-color .16s}
.spchips a:hover{background:#e6f2fb; border-color:#c9e0f2; text-decoration:none}
.spmeta{margin:26px 0 6px; display:flex; flex-wrap:wrap; align-items:center;
  justify-content:space-between; gap:10px 16px; padding-bottom:12px; border-bottom:1px solid var(--line)}
.spcount{font-size:15px; color:var(--ink2)}
.spcount b{color:var(--blue); font-size:17px; font-variant-numeric:tabular-nums; margin:0 2px}
.spchips .spchip, .spmeta .spchips{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.spchip{border:1px solid var(--line); background:#fff; color:var(--ink2); font-family:inherit;
  font-size:14px; padding:5px 13px; border-radius:15px; cursor:pointer; transition:all .16s}
.spchip i{font-style:normal; color:#93a6b6; font-size:12.5px; margin-left:2px}
.spchip:hover{border-color:#c9dcec; color:var(--blue)}
.spchip.on{background:var(--blue); border-color:var(--blue); color:#fff}
.spchip.on i{color:rgba(255,255,255,.72)}
.splist{margin-top:6px}
.splist .srit{padding:15px 16px; border-radius:0; border-bottom:1px solid var(--line)}
.splist .srit:last-of-type{border-bottom:0}
.splist .srit:hover{background:#f7fbfe; border-color:transparent; border-bottom-color:var(--line)}
.splist .srit b{font-size:17.5px}
.splist .srit i{font-size:14.5px}
.spnone{margin:18px 2px; font-size:15px; color:var(--ink3); line-height:1.9}
.splink{border:0; background:none; color:var(--blue); font-family:inherit; font-size:15px;
  cursor:pointer; padding:0 2px; text-decoration:underline}
.smore{display:block; margin:10px 0 4px; font-size:14.5px; color:var(--blue); padding:9px 12px;
  border-top:1px dashed var(--line); text-decoration:none}
.smore.top{position:sticky; top:-10px; z-index:2; background:#fff; margin:-4px 0 6px;
  border-top:0; border-bottom:1px solid var(--line); border-radius:0}
.smore i{font-style:normal; font-weight:600}
.smore:hover{text-decoration:underline}
@media(max-width:920px){
  .spform input{font-size:16px}
  .spgo{padding:8px 16px; font-size:15px}
}
@media(max-width:640px){
  .spmeta{align-items:flex-start}
  .spchip{font-size:13.5px; padding:4px 11px}
}

/* ============================================================
   询价浮层（inquiry.js）——替代 mailto，本地没配邮件客户端也能提交
   ============================================================ */
html.inq-lock{overflow:hidden}
.inq{position:fixed; inset:0; z-index:400; display:none}
.inq.on{display:block}
.inq-mask{position:absolute; inset:0; background:rgba(8,20,32,.62); backdrop-filter:blur(2px)}
.inq-box{position:relative; z-index:1; width:min(940px,calc(100% - 40px)); max-height:calc(100vh - 60px);
  overflow-y:auto; margin:5vh auto; background:#fff; border-radius:14px;
  box-shadow:0 26px 70px rgba(6,18,30,.42); display:grid; grid-template-columns:1fr 296px}
.inq-main{padding:30px 32px 26px}
.inq-main h3{margin:0 0 8px; font-size:23px; letter-spacing:-.3px; color:var(--ink)}
.inq-sub{margin:0 0 20px; font-size:14.5px; line-height:1.8; color:var(--ink3)}
.inq-x{position:absolute; right:12px; top:10px; width:34px; height:34px; border:0; background:rgba(255,255,255,.1);
  font-size:24px; line-height:1; color:#dbe9f4; cursor:pointer; border-radius:50%; z-index:3; transition:.16s}
.inq-x:hover{background:rgba(255,255,255,.22); color:#fff}
.inq-form.lead-form{padding:0; border:0; max-width:none; background:transparent}
.inq-form .lf-row{grid-template-columns:1fr 1fr}
.inq-form textarea{min-height:66px}
.inq-err{display:none; margin:0 0 13px; padding:10px 13px; border-radius:7px; font-size:14.5px;
  background:#fdeceb; border:1px solid #f3c9c5; color:#a3352a}
.inq-side{background:linear-gradient(180deg,#0c2a44,#081a2b); color:#dce8f2; padding:28px 22px;
  border-radius:0 14px 14px 0; display:flex; flex-direction:column; gap:16px}
.inq-side h4{margin:0; font-size:13px; letter-spacing:2px; color:#7fa3bd; font-weight:600}
.inq-qr{text-align:center}
.inq-qr img{width:148px; height:148px; margin:0 auto; padding:7px; background:#fff; border-radius:9px;
  box-shadow:0 6px 18px rgba(0,0,0,.32)}
.inq-qr span{display:block; margin-top:9px; font-size:12.5px; color:#8fadc4}
.inq-mailbox{border-top:1px solid rgba(255,255,255,.12); padding-top:16px}
.inq-mail{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:9px}
.inq-mail b{font-size:15.5px; color:#fff; font-weight:600; word-break:break-all}
.inq-cp{flex:0 0 auto; border:1px solid rgba(255,255,255,.34); background:transparent; color:#dbe9f4;
  font-family:inherit; font-size:12.5px; padding:5px 11px; border-radius:15px; cursor:pointer;
  transition:.16s; white-space:nowrap}
.inq-cp:hover{background:rgba(255,255,255,.12); border-color:#5ec8dd; color:#fff}
.inq-cp.ok{background:#1c8f5a; border-color:#1c8f5a; color:#fff}
.inq-cptip{display:none; margin:9px 0 0; font-size:12.5px; line-height:1.7; color:#93b3c9}
.inq-call{border-top:1px solid rgba(255,255,255,.12); padding-top:16px; margin-top:auto}
.inq-call b{display:block; font-size:22px; color:#fff; letter-spacing:.5px}
.inq-call span{font-size:12.5px; color:#8fadc4}
.inq-call a{color:#fff}
.inq-done{display:none; padding:14px 0 6px}
.inq-done b{display:block; font-size:19px; color:#1e6b3a; margin-bottom:10px}
.inq-done p{margin:0 0 10px; font-size:15px; line-height:1.9; color:var(--ink2)}
.inq-done .inq-side2{display:flex; align-items:center; gap:14px; padding:14px; border:1px solid var(--line);
  border-radius:9px; background:var(--bg2); margin-top:14px}
.inq-done .inq-side2 img{width:84px; height:84px}
.inq-done .inq-side2 span{font-size:13.5px; color:var(--ink3); line-height:1.7}

@media(max-width:820px){
  .inq-box{display:flex; flex-direction:column; width:calc(100% - 24px); margin:2vh auto;
    max-height:96vh; border-radius:12px}
  .inq-main{padding:20px 18px 16px; order:2}
  .inq-main h3{font-size:20px; padding-right:0}
  .inq-sub{font-size:13.5px; margin-bottom:16px}
  .inq-form .lf-row{grid-template-columns:1fr; gap:11px; margin-bottom:11px}
  .inq-form .lf-submit{width:100%}
  /* 联系卡置顶：一打开就看到扫码/复制邮箱，不用往下翻 */
  /* 二维码在左，右侧两行：邮箱 + 复制 / 电话 + 时间 */
  .inq-side{order:1; border-radius:12px 12px 0 0; padding:13px 46px 13px 16px; display:grid;
    grid-template-columns:auto minmax(0,1fr); gap:7px 13px; align-items:center}
  .inq-side h4{display:none}
  .inq-qr{grid-column:1; grid-row:1/3}
  .inq-qr img{width:76px; height:76px; padding:4px; border-radius:7px}
  .inq-qr span{display:none}
  .inq-mailbox{grid-column:2; grid-row:1; border-top:0; padding-top:0; min-width:0}
  .inq-mail{flex-wrap:nowrap; gap:8px; margin-top:0}
  .inq-mail b{font-size:13.5px; letter-spacing:-.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
  .inq-cp{padding:3px 9px; font-size:11.5px}
  .inq-cptip{display:none}
  .inq-call{grid-column:2; grid-row:2; border-top:0; padding-top:0; margin-top:0;
    text-align:left; display:flex; align-items:baseline; gap:9px}
  .inq-call b{font-size:16px; white-space:nowrap}
  .inq-call span{display:none}
  .inq-x{color:rgba(255,255,255,.85); right:6px; top:6px; width:30px; height:30px; font-size:21px}
  .inq-done .inq-side2 img{width:72px; height:72px}
}
.inq-topic{margin:-8px 0 16px; padding:7px 12px; font-size:13.5px; color:var(--blue);
  background:#f1f7fc; border-left:3px solid var(--blue2); border-radius:0 5px 5px 0; line-height:1.6;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
@media(max-width:820px){.inq-topic{margin:-6px 0 13px; font-size:13px}}

/* ============================================================
   404 页：搜索 + 品类出口（build.py page404）
   ============================================================ */
.nfmain{background:linear-gradient(180deg,#f7fafc 0%,#fff 62%); border-bottom:1px solid var(--line)}
.nf-in{display:grid; grid-template-columns:250px minmax(0,1fr); align-items:center; gap:44px;
  padding-top:76px; padding-bottom:76px}
.nf-num{font-size:150px; line-height:.86; font-weight:800; letter-spacing:-8px;
  color:#fff; -webkit-text-stroke:2px #d3e0ea;
  user-select:none; text-align:center}
.nf-eye{margin:0 0 10px; font-size:12px; letter-spacing:3.2px; font-weight:700; color:var(--accent)}
.nf-body h1{margin:0 0 12px; font-size:34px; line-height:1.28; letter-spacing:-.6px; color:var(--ink)}
.nf-txt{margin:0 0 26px; font-size:16px; line-height:1.85; color:var(--ink3); max-width:600px}
.nf-search{display:flex; gap:0; max-width:620px; margin:0 0 14px;
  background:#fff; border:1px solid #cfdce6; border-radius:9px; overflow:hidden;
  box-shadow:0 2px 8px rgba(12,42,68,.05); transition:.18s}
.nf-search:focus-within{border-color:var(--blue2); box-shadow:0 0 0 3px rgba(13,108,184,.12)}
.nf-search input{flex:1 1 auto; min-width:0; border:0; outline:none; background:none;
  font:inherit; font-size:16px; color:var(--ink); padding:15px 17px}
.nf-search input::placeholder{color:#93a7b6}
.nf-search button{flex:0 0 auto; border:0; cursor:pointer; font-family:inherit;
  font-size:15.5px; font-weight:600; color:#fff; background:var(--blue); padding:0 30px; transition:.16s}
.nf-search button:hover{background:var(--blue2)}
.nf-hot{display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin:0 0 26px; font-size:13.5px}
.nf-hot span{color:var(--ink3); letter-spacing:1px; margin-right:2px}
.nf-hot a{color:var(--ink2); background:var(--bg3); padding:4px 12px; border-radius:14px; transition:.16s}
.nf-hot a:hover{background:#e0edf6; color:var(--blue); text-decoration:none}
.nf-acts{display:flex; flex-wrap:wrap; gap:11px}
.nf-acts .btn{display:inline-block; background:var(--blue); color:#fff; padding:11px 26px;
  border-radius:7px; font-size:15.5px; font-weight:600; transition:.16s}
.nf-acts .btn:hover{background:var(--blue2); color:#fff; text-decoration:none}
.nf-acts .btn.ghost{background:#fff; color:var(--blue); border:1px solid #c3d6e5}
.nf-acts .btn.ghost:hover{background:#f1f7fc; border-color:var(--blue2); color:var(--blue2)}

.nfcats{padding:52px 0 62px}
.nfcats-h{margin:0 0 22px}
.nfcats-h h2{margin:0 0 5px; font-size:21px; letter-spacing:-.3px; color:var(--ink)}
.nfcats-h p{margin:0; font-size:14px; color:var(--ink3)}
.nfgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:12px}
.nfcat{display:flex; flex-direction:column; gap:4px; padding:15px 17px 16px;
  border:1px solid var(--line); border-radius:9px; background:#fff; transition:.16s}
.nfcat:hover{border-color:#bcd4e4; box-shadow:0 6px 18px rgba(12,42,68,.07);
  transform:translateY(-1px); text-decoration:none}
.nfcat i{font-style:normal; font-size:11.5px; font-weight:700; letter-spacing:1.4px; color:#a8bccb}
.nfcat b{font-size:16px; font-weight:600; color:var(--ink); line-height:1.4}
.nfcat span{font-size:13px; color:var(--ink3); line-height:1.6}
.nfcat:hover b{color:var(--blue)}
.nfhelp{margin:22px 0 0; font-size:14.5px; color:var(--ink3)}
.nfhelp a{color:var(--blue2); font-weight:600}

@media(max-width:900px){
  .nf-in{grid-template-columns:1fr; gap:8px; padding-top:52px; padding-bottom:52px}
  .nf-num{font-size:96px; letter-spacing:-4px; -webkit-text-stroke-width:1.6px; text-align:left}
  .nf-body h1{font-size:26px}
  .nfgrid{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .nf-num{font-size:74px; letter-spacing:-3px}
  .nf-body h1{font-size:23px}
  .nf-txt{font-size:15px; margin-bottom:20px}
  /* 搜索框保持一行：input 让步、按钮只占「搜索」两字宽，比上下两块更像搜索框 */
  .nf-search{flex-wrap:nowrap}
  .nf-search input{flex:1 1 auto; padding:13px 13px; font-size:15px}
  .nf-search button{flex:0 0 auto; padding:0 17px; font-size:15px}
  .nfgrid{grid-template-columns:1fr}
  .nf-acts{gap:9px}
  .nf-acts .btn{flex:1 1 calc(50% - 5px); text-align:center; padding:11px 8px; font-size:15px}
  .nf-acts .btn:first-child{flex:1 1 100%}
}

/* 小屏导航：6 项在 390px 下原本超出 38px，「联系我们」被切一半；收窄内边距让它一行放下 */
@media(max-width:430px){
  .nav a{padding:7px 6px; font-size:14px}
  .nav a::after{left:6px; right:6px}
}