/* ===========================================================
   zenbian.com — 安阳超高 · 中子屏蔽材料
   设计体系：「实验室白皮书」纸白 + 墨蓝 + 青，衬线标题，单栏叙事。
   与 B 站（深色密集行式）结构完全不同：无侧栏、无卡片网格、章节号驱动。
   =========================================================== */
:root{
  --paper:#f4f1e9;
  --paper-2:#efeadf;
  --ink:#16202c;
  --ink-2:#3d4a58;
  --ink-3:#6f7985;
  --line:#d9d2c4;
  --line-2:#c9c0ae;
  --teal:#0d6e63;
  --teal-soft:#e2eeea;
  --col:clamp(20px,4vw,64px);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--paper);color:var(--ink);
  font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Source Han Sans SC",system-ui,sans-serif;
  font-size:16.5px;line-height:1.85;-webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
::selection{background:var(--teal);color:#fff}
.serif{font-family:"Songti SC","Source Han Serif SC","Noto Serif SC",Georgia,"SimSun",serif}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--col)}
.num{font-variant-numeric:tabular-nums}

/* ---------- 页头 ---------- */
.masthead{border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:50}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;height:76px;gap:30px}
.brand{display:flex;align-items:baseline;gap:14px}
.brand .zh{font-size:23px;font-weight:700;letter-spacing:.04em}
.brand .en{font-size:10.5px;letter-spacing:.34em;color:var(--ink-3);text-transform:uppercase}
.masthead nav{display:flex;gap:30px;font-size:13.5px;color:var(--ink-2)}
.masthead nav a{position:relative;padding:4px 0;transition:color .25s}
.masthead nav a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--teal);transition:width .35s cubic-bezier(.16,1,.3,1)}
.masthead nav a:hover{color:var(--teal)}
.masthead nav a:hover::after{width:100%}
.masthead .tel{font-size:13px;color:var(--ink-3);letter-spacing:.06em}
.masthead .tel b{color:var(--ink);font-weight:600;font-size:14.5px;margin-left:9px}

/* ---------- HERO ---------- */
.hero{padding:clamp(52px,7vw,104px) 0 clamp(38px,4vw,56px);border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.hero::after{
  content:"";position:absolute;right:-8%;top:-25%;width:52vw;height:52vw;border-radius:50%;
  background:radial-gradient(circle,rgba(13,110,99,.07),transparent 68%);pointer-events:none;
}
.hero .kicker{font-size:11.5px;letter-spacing:.36em;text-transform:uppercase;color:var(--teal);margin-bottom:30px}
.hero h1{
  font-size:clamp(2.05rem,4.5vw,3.9rem);line-height:1.24;font-weight:600;letter-spacing:-.01em;
  max-width:19em;position:relative;
;text-wrap:balance}
.hero h1 span{display:block;color:var(--ink-3);font-size:.42em;line-height:1.6;margin-top:18px;letter-spacing:.01em;max-width:30em}
.hero .abstract{
  margin-top:clamp(30px,4vw,52px);display:grid;grid-template-columns:120px 1fr;gap:clamp(20px,3vw,48px);
  border-top:1px solid var(--line);padding-top:26px;max-width:1000px;
}
.hero .abstract .lab{font-size:11.5px;letter-spacing:.22em;color:var(--ink-3);text-transform:uppercase;padding-top:5px}
.hero .abstract p{font-size:17px;line-height:1.95;color:var(--ink-2);max-width:40em}
.hero .abstract p b{color:var(--ink);font-weight:600}

/* meta 数据行 */
.meta{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(34px,4vw,56px)}
.meta div{background:var(--paper);padding:20px 22px 22px}
.meta dt{font-size:11.5px;letter-spacing:.18em;color:var(--ink-3);margin-bottom:10px}
.meta dd{font-size:clamp(1.15rem,1.9vw,1.5rem);font-weight:600;letter-spacing:-.01em}
.meta dd small{font-size:.6em;font-weight:400;color:var(--ink-3);margin-left:4px}

/* ---------- 章节 ---------- */
.chap{padding:clamp(56px,7vw,100px) 0;border-bottom:1px solid var(--line)}
.chap-in{display:grid;grid-template-columns:120px 1fr;gap:clamp(20px,3vw,48px)}
.chap-no{font-size:12px;letter-spacing:.2em;color:var(--teal);padding-top:8px}
.chap-no b{display:block;font-family:Georgia,serif;font-size:44px;line-height:1;color:var(--ink);letter-spacing:-.02em;font-weight:400;margin-bottom:8px}
.chap-body{max-width:1040px}
.chap-body h2{font-size:clamp(1.5rem,2.7vw,2.15rem);font-weight:600;line-height:1.3;letter-spacing:-.01em;margin-bottom:22px}
.chap-body .lead{font-size:16.5px;color:var(--ink-2);line-height:1.95;max-width:44em}
.chap-body .lead + .lead{margin-top:14px}

/* 两栏解释 */
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.4vw,56px);margin-top:clamp(28px,3.4vw,44px)}
.two h3{font-size:16px;font-weight:600;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--line-2)}
.two p{font-size:15px;color:var(--ink-2);line-height:1.9}
.two p + p{margin-top:10px}

/* 曲线图 */
.figure{margin-top:clamp(32px,4vw,52px);border:1px solid var(--line);background:var(--paper-2);padding:clamp(18px,2.4vw,30px)}
.figure svg{width:100%;height:auto;display:block}
.figure figcaption{margin-top:14px;font-size:12.5px;color:var(--ink-3);line-height:1.7;border-top:1px solid var(--line);padding-top:12px}
.figure figcaption b{color:var(--ink-2);font-weight:600}

/* 参数表 */
.tbl-wrap{margin-top:clamp(28px,3.4vw,44px);overflow-x:auto}
table.par{width:100%;border-collapse:collapse;font-size:14.5px;min-width:620px}
table.par caption{caption-side:top;text-align:left;font-size:12.5px;color:var(--ink-3);letter-spacing:.14em;padding-bottom:12px}
table.par th,table.par td{border-bottom:1px solid var(--line);padding:14px 12px;text-align:left;vertical-align:top}
table.par thead th{border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);font-size:12.5px;letter-spacing:.1em;color:var(--ink-3);font-weight:500}
table.par td:first-child{font-weight:600;width:26%}
table.par tbody tr:hover{background:rgba(13,110,99,.045)}
.note{margin-top:14px;font-size:12.5px;color:var(--ink-3);line-height:1.8}

/* 硼含量刻度条 */
.scale{margin-top:clamp(30px,3.6vw,46px)}
.scale .track{position:relative;height:6px;background:var(--line);margin:34px 0 12px}
.scale .track i{position:absolute;left:0;top:0;height:6px;background:var(--teal)}
.scale .ticks{display:flex;justify-content:space-between;font-size:12px;color:var(--ink-3);letter-spacing:.06em}
.scale .marks{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:26px}
.scale .marks div{font-size:13.5px;color:var(--ink-2);line-height:1.75;border-left:1px solid var(--line-2);padding-left:14px}
.scale .marks b{display:block;font-size:14px;color:var(--ink);margin-bottom:4px}

/* 应用列表 */
.apps{border-top:1px solid var(--line);margin-top:clamp(30px,3.6vw,46px)}
.apps .row{
  display:grid;grid-template-columns:56px 1fr 1.15fr;gap:clamp(16px,2.4vw,40px);
  padding:20px 0;border-bottom:1px solid var(--line);align-items:baseline;
}
.apps .row .i{font-size:12.5px;color:var(--teal);letter-spacing:.12em}
.apps .row h4{font-size:16.5px;font-weight:600}
.apps .row p{font-size:14.5px;color:var(--ink-2);line-height:1.8}
.apps .row:hover h4{color:var(--teal)}

/* 产品条 */
.prods{margin-top:clamp(28px,3.4vw,44px);display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.prod{background:var(--paper);padding:0;display:flex;flex-direction:column;transition:background .3s}
.prod:hover{background:var(--paper-2)}
.prod figure{aspect-ratio:4/3;overflow:hidden;background:var(--paper-2)}
.prod img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.prod:hover img{transform:scale(1.04)}
.prod .cap{padding:14px 16px 16px;display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.prod .cap span{font-size:13.5px;line-height:1.5}
.prod .cap em{font-style:normal;font-size:11px;color:var(--ink-3);letter-spacing:.1em;flex:0 0 auto}

/* 交付 */
.deliver{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(26px,3vw,40px)}
.deliver div{background:var(--paper);padding:22px 24px}
.deliver h4{font-size:15px;font-weight:600;margin-bottom:8px}
.deliver p{font-size:14px;color:var(--ink-2);line-height:1.85}

/* 引用块 */
.quote{margin:clamp(30px,3.6vw,48px) 0 0;padding:28px 0 0;border-top:1px solid var(--line-2)}
.quote p{font-size:clamp(1.15rem,2vw,1.5rem);line-height:1.75;color:var(--ink);max-width:36em}
.quote cite{display:block;margin-top:14px;font-size:12.5px;color:var(--ink-3);letter-spacing:.14em;font-style:normal}

/* FAQ */
.faq{border-top:1px solid var(--line);margin-top:clamp(28px,3.4vw,44px)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:20px 34px 20px 0;position:relative;font-size:15.5px;font-weight:600;transition:color .25s}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:4px;top:50%;width:8px;height:8px;border-right:1.5px solid var(--ink-3);border-bottom:1.5px solid var(--ink-3);transform:translateY(-70%) rotate(45deg);transition:.35s}
.faq details[open] summary{color:var(--teal)}
.faq details[open] summary::after{transform:translateY(-30%) rotate(225deg);border-color:var(--teal)}
.faq .a{padding:0 10px 22px 0;font-size:14.5px;color:var(--ink-2);line-height:1.9;max-width:52em}

/* 询价 */
.contact{background:var(--paper-2);border-bottom:0}
.contact .chap-in{align-items:start}
.form{display:grid;grid-template-columns:1fr 1fr;gap:22px 26px;margin-top:8px}
.form .f{display:flex;flex-direction:column;gap:7px}
.form .f.full{grid-column:1/-1}
.form label{font-size:11.5px;letter-spacing:.16em;color:var(--ink-3)}
.form input,.form select,.form textarea{
  background:transparent;border:0;border-bottom:1px solid var(--line-2);color:var(--ink);
  padding:9px 2px;font-size:15px;font-family:inherit;transition:border-color .25s;
}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--teal)}
.form textarea{resize:vertical;min-height:84px}
.form .act{grid-column:1/-1;display:flex;align-items:center;gap:20px;margin-top:10px;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 28px;background:var(--ink);
  color:var(--paper);border:0;font-size:14.5px;font-weight:600;font-family:inherit;cursor:pointer;
  transition:.28s cubic-bezier(.16,1,.3,1);
}
.btn:hover{background:var(--teal);transform:translateY(-2px)}
.btn:active{transform:scale(.985)}
.form .act p{font-size:12px;color:var(--ink-3);line-height:1.7;max-width:34em}

/* 页脚 */
footer{padding:clamp(40px,5vw,60px) 0 26px;font-size:13.5px;color:var(--ink-3)}
footer .cols{display:grid;grid-template-columns:1.55fr .8fr 1.25fr;gap:clamp(24px,3.4vw,48px);padding-bottom:34px}
footer b{display:block;font-size:13px;color:var(--ink);letter-spacing:.08em;margin-bottom:12px}
footer p,footer li{line-height:2;font-size:13px}
footer ul{list-style:none}
footer a:hover{color:var(--teal)}
footer .cp{border-top:1px solid var(--line);padding-top:18px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px}

/* 进场 */
.rv{opacity:0;transform:translateY(18px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

@media (max-width:980px){
  .masthead nav{display:none}
  .meta{grid-template-columns:1fr 1fr}
  .chap-in{grid-template-columns:1fr;gap:16px}
  .chap-no{display:flex;align-items:baseline;gap:12px;padding:0}
  .chap-no b{font-size:28px;margin:0}
  .hero .abstract{grid-template-columns:1fr;gap:12px}
  .two{grid-template-columns:1fr}
  .prods{grid-template-columns:1fr 1fr}
  .apps .row{grid-template-columns:34px 1fr;gap:10px}
  .apps .row p{grid-column:2}
  .deliver{grid-template-columns:1fr}
}
@media (max-width:640px){
  body{font-size:16px}
  .meta{grid-template-columns:1fr 1fr}
  .prods{grid-template-columns:1fr}
  .form{grid-template-columns:1fr}
  .scale .marks{grid-template-columns:1fr 1fr}
  .masthead .tel{display:none}
  footer .cols{grid-template-columns:1fr}
}