/* ===== NALI V4 共享基础样式 v4-base.css =====
   抽取自定稿首页 index.html 的设计系统，供其余页面 <link> 引用。
   页面自身仅保留页面独有样式（写在各自 <style> 中）。
   字体/图片相对路径基准：本文件位于 zh-v4/assets/，故 ../../ = frontend/ */

:root{
  --bg:#FFFFFF; --bg-soft:#F9FAFB; --ink:#0F172A; --ink-2:#475569;
  --muted:#4B5563; --line:#E5E7EB; --accent:#36A0FF; --accent-ink:#1A6FCC;
  --accent-press:#155AA8; --dark:#0F172A; --img:#EEF1F5;
}
@font-face{font-family:"Noto Serif SC";src:url("../../fonts/NotoSerifSC-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Noto Serif SC";src:url("../../fonts/NotoSerifSC-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Noto Sans SC";src:url("../../fonts/NotoSansSC-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Noto Sans SC";src:url("../../fonts/NotoSansSC-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Noto Sans SC";src:url("../../fonts/NotoSansSC-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:hidden;scroll-behavior:smooth}
body{font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink-2);background:var(--bg);-webkit-font-smoothing:antialiased;line-height:1.75;letter-spacing:.01em;font-weight:400;overflow-x:hidden}
a{color:inherit;text-decoration:none}
h1,h2,h3{text-wrap:balance;font-weight:700;word-break:keep-all;overflow-wrap:break-word}
p,li{text-wrap:pretty}
/* 短文案/副标题/小字：中文按标点断行、不拆词（防语义截断），长串溢出兜底 */
.sub,.kicker,.more,.lead,.hub-q,.hub-r,.hub-link,.pc-desc,.pc-title,.rc-card p,.legal-note,.resp-note,.close-title,.stmt,.trust-stmt,.brand-stmt{word-break:keep-all;overflow-wrap:break-word}
.sec-head h2,.stmt,.close-title,.trust-stmt,.brand-stmt{font-family:"Noto Serif SC","Songti SC","SimSun",serif;font-weight:600}
.facts b{font-weight:700;font-variant-numeric:tabular-nums}

/* ===== 导航 ===== */
.nav{position:fixed;top:0;left:0;width:100%;z-index:1000;height:64px;display:flex;align-items:center;background:rgba(255,255,255,.6);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid rgba(15,23,42,.06);transition:background .3s,box-shadow .3s}
.nav.scrolled{background:rgba(255,255,255,.92);border-bottom:1px solid rgba(15,23,42,.08);box-shadow:0 4px 16px rgba(15,23,42,.04)}
.nav .container{display:flex;align-items:center;height:100%;width:100%;max-width:1280px;margin:0 auto;padding:0 40px}
.nav-logo{display:flex;align-items:center;margin-right:auto}
.nav-logo img{height:48px;width:auto;display:block}
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a{font-size:15px;color:var(--ink);transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--accent)}
.nav-right{display:flex;align-items:center;gap:14px;margin-left:18px;padding-left:18px;border-left:1px solid rgba(15,23,42,.1)}
.nav-lang{font-size:13px;color:#475569;cursor:pointer;transition:all .2s;border:1px solid rgba(15,23,42,.14);border-radius:6px;padding:5px 10px;font-weight:500}
.nav-lang:hover{color:var(--accent);border-color:rgba(54,160,255,.5)}
.nav-cta{background:var(--accent);color:#fff;padding:8px 18px;border-radius:8px;font-size:14px;white-space:nowrap;transition:background .2s}
.nav-cta:hover{background:var(--accent-ink)}
.nav-cta:active{transform:translateY(1px)}
.hamburger{display:none;background:none;border:none;font-size:26px;line-height:1;color:var(--ink);cursor:pointer}
.mobile-nav-overlay{position:fixed;inset:0;background:rgba(15,23,42,.4);z-index:999;opacity:0;visibility:hidden;transition:.25s}
.mobile-nav-overlay.open{opacity:1;visibility:visible}
.mobile-nav{position:absolute;top:0;right:0;height:100%;width:78%;max-width:340px;background:#fff;padding:80px 28px 28px;display:flex;flex-direction:column;gap:6px;overflow-y:auto}
.mobile-nav a{font-size:18px;padding:14px 4px;border-bottom:1px solid var(--line)}
.mobile-nav .nav-lang,.mobile-nav .nav-cta{display:inline-block;margin-top:12px;border-bottom:none}
/* 移动端菜单底部「咨询合作」做成完整按钮：整宽、文字居中、品牌色块，避免原 inline 链接显得又小又怪 */
.mobile-nav .nav-cta{display:block;width:100%;margin-top:20px;padding:14px 18px;border-bottom:none;text-align:center;background:var(--accent);color:#fff;font-size:16px;font-weight:600;letter-spacing:.02em;border-radius:8px}
.mobile-nav .nav-cta:hover{background:var(--accent-ink);color:#fff}
/* 导航下拉 */
/* 导航下拉（修复：hover 死区闪退） */
.has-drop{position:relative;display:inline-flex;align-items:center}
.has-drop .caret{font-size:11px;margin-left:4px;opacity:.8;transition:transform .2s;display:inline-block}
.has-drop:hover .caret,
.has-drop:focus-within .caret{transform:rotate(180deg)}
.nav-drop{position:absolute;top:100%;left:0;margin-top:10px;min-width:190px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 28px rgba(15,23,42,.10);padding:7px;display:flex;flex-direction:column;gap:1px;opacity:0;visibility:hidden;transform:translateY(-4px);pointer-events:none;transition:opacity .2s ease,transform .2s ease,visibility .2s ease;transition-delay:.12s;z-index:1001}
/* 透明桥：横跨 trigger 与面板间的 10px 空隙，鼠标过境不丢失 :hover（解决下拉闪退） */
.nav-drop::before{content:'';position:absolute;top:-12px;left:0;right:0;height:12px}
.has-drop:hover .nav-drop,
.has-drop:focus-within .nav-drop{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s}
.nav-drop a{font-size:14px;color:var(--ink);padding:9px 12px;border-radius:7px;white-space:nowrap}
.nav-drop a:hover{background:rgba(54,160,255,.10);color:var(--accent)}
.mobile-nav a.sub{padding-left:22px;font-size:15px;color:var(--muted)}
.wrap{max-width:1280px;margin:0 auto;padding:0 40px}
@media(max-width:768px){.wrap{padding:0 20px}.nav .container{padding:0 20px}.nav-links{display:none}.nav-right{border-left:none;margin-left:0;padding-left:0}.nav-cta{display:none}.hamburger{display:block}}

/* ===== 按钮 / section-head ===== */
.btn{font-size:15px;padding:14px 32px;border-radius:8px;cursor:pointer;border:1px solid transparent;display:inline-block;white-space:nowrap;transition:background .2s,border-color .2s,color .2s}
.btn.primary{background:var(--accent);color:#fff}
.btn.primary:hover{background:var(--accent-ink)}
.btn:active{transform:translateY(1px)}
.btn.ghost{background:transparent;color:var(--ink);border-color:#D1D5DB}
.btn.ghost:hover{background:#F0F7FF;border-color:var(--accent);color:var(--accent)}
.sec-head{margin-bottom:40px}
.sec-head .kicker{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.sec-head h2{font-size:clamp(28px,3.4vw,40px);font-weight:500;letter-spacing:-.01em;line-height:1.15}
.sec-head p{color:var(--muted);margin-top:12px;max-width:64ch;font-size:15px}
.page-hero{padding:132px 0 72px;background:var(--bg-soft);border-bottom:1px solid var(--line)}
.page-hero h1{font-size:clamp(30px,4vw,46px);font-weight:500;letter-spacing:-.01em;line-height:1.28;text-wrap:pretty;word-break:normal;max-width:18em}
.page-hero p{margin-top:16px;color:var(--ink-2);max-width:60ch;font-size:16px}

/* ===== 通用卡片 / 小字 ===== */
.card{border:1px solid var(--line);border-radius:2px;background:#fff}
.legal{font-size:12px;color:var(--muted);margin-top:14px}
.note{font-size:13px;color:var(--muted);border-left:2px solid var(--line);padding-left:12px;margin-top:10px}
.muted{color:var(--muted)}

/* ===== 深色编辑式区块（镜像首页 .strength/.close/.chain/.brand-bar/.biz/.scene-wrap） =====
   供 solutions / salon 等承接页复用，统一首页视觉语言。 */

/* 浅色 eyebrow（深底上用） */
.eyebrow-light{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin-bottom:16px}

/* 深底 Hero（静态，产品图作背景，镜像首页 .hero/.close） */
.dhero{position:relative;min-height:76vh;display:flex;align-items:center;overflow:hidden;background:var(--dark)}
.dhero .bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.5}
.dhero::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,rgba(15,23,42,.88) 0%,rgba(15,23,42,.62) 38%,rgba(15,23,42,.28) 64%,rgba(15,23,42,.12) 100%);z-index:1}
.dhero .wrap{position:relative;z-index:2;color:#fff;max-width:1100px;margin:0 auto;padding:120px 40px}
.dhero h1{font-family:"Noto Serif SC","Songti SC","SimSun",serif;font-weight:600;font-size:clamp(30px,4.6vw,54px);line-height:1.16;color:#fff;max-width:20ch;letter-spacing:-.01em}
.dhero p.sub{color:rgba(255,255,255,.86);font-size:18px;line-height:1.7;max-width:46ch;margin-top:20px}
.dhero .actions{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap}
.dhero .btn.primary{background:var(--accent);color:#fff}
.dhero .btn.primary:hover{background:var(--accent-press)}
.dhero .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.dhero .btn.ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
@media(max-width:900px){.dhero{min-height:62vh}.dhero .wrap{padding:88px 24px}.dhero p.sub{font-size:16px}}

/* 居中衬线陈述带（镜像首页 .brand-bar） */
.stmt-band{background:var(--bg-soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:64px 0;text-align:center}
.stmt-band .s{font-family:"Noto Serif SC","Songti SC","SimSun",serif;font-weight:600;font-size:clamp(20px,2.6vw,32px);color:var(--ink);line-height:1.5;letter-spacing:.02em;max-width:26ch;margin:0 auto}
@media(max-width:768px){.stmt-band{padding:48px 24px}.stmt-band .s{font-size:clamp(18px,5vw,24px)}}

/* 编辑式双章（院线 / 居家，图文交替，镜像首页 .scene-wrap 放大版） */
.chap{padding:96px 0;border-top:1px solid var(--line)}
.chap:first-of-type{border-top:none}
.chap .row{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;max-width:1100px;margin:0 auto;padding:0 40px}
.chap.flip .c-img{order:2}
.chap.flip .c-txt{order:1}
.chap .c-img img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;display:block;background:#fff}
.chap .c-txt .c-kicker{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.chap .c-txt h2{font-family:"Noto Serif SC",serif;font-weight:600;font-size:clamp(24px,3vw,36px);line-height:1.2;color:var(--ink);letter-spacing:-.01em}
.chap .c-txt p{margin-top:16px;color:var(--ink-2);font-size:16px;line-height:1.85;max-width:46ch}
.chap .c-txt a{display:inline-block;margin-top:22px;font-size:15px;font-weight:600;color:var(--accent-ink)}
.chap .c-txt a:hover{color:var(--accent)}
@media(max-width:900px){.chap{padding:64px 0}.chap .row{grid-template-columns:1fr;gap:28px;padding:0 24px}.chap.flip .c-img,.chap.flip .c-txt{order:initial}.chap .c-img{order:-1}}

/* 深色协作流程链（镜像首页 .strength .chain，内容填协作步骤而非产能） */
.chain-band{position:relative;background:var(--dark);overflow:hidden}
.chain-band .wrap{position:relative;z-index:2;color:#E2E8F0;max-width:1100px;margin:0 auto;padding:96px 40px}
.chain-band h2{font-family:"Noto Serif SC",serif;font-weight:600;font-size:clamp(24px,3vw,38px);color:#fff;max-width:22ch;line-height:1.2;margin-bottom:8px}
.chain-band .c-sub{color:#CBD5E1;font-size:15px;margin-bottom:44px;max-width:54ch}
.chain{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.chain .step{display:flex;gap:14px;align-items:flex-start}
.chain .step .n{font-size:13px;font-weight:600;color:var(--accent);border:1px solid rgba(54,160,255,.4);border-radius:50%;width:30px;height:30px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;margin-top:2px}
.chain .step h4{font-size:18px;font-weight:500;color:#fff}
.chain .step p{font-size:14px;color:#CBD5E1;margin-top:6px;max-width:24ch;line-height:1.6}
@media(max-width:900px){.chain-band .wrap{padding:72px 24px}.chain{grid-template-columns:1fr 1fr;gap:20px}.chain .step p{max-width:none}}
@media(max-width:560px){.chain{grid-template-columns:1fr}}

/* 编号索引（为什么选这套 01-04，浅底分隔线，镜像首页 .biz） */
.biz-band{padding:96px 0}
.biz-band .wrap{max-width:1100px;margin:0 auto;padding:0 40px}
.biz-band .h-sec{font-family:"Noto Serif SC",serif;font-weight:600;font-size:clamp(24px,3vw,36px);color:var(--ink);letter-spacing:-.01em;margin-bottom:44px}
.biz-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.biz-item{position:relative;padding:0 32px;border-left:1px solid var(--line)}
.biz-item:first-child{padding-left:0;border-left:none}
.biz-item:last-child{padding-right:0}
.biz-num{display:block;font-family:"Noto Serif SC",serif;font-size:15px;font-weight:600;letter-spacing:.04em;color:var(--accent);margin-bottom:18px}
.biz-item h3{font-size:19px;font-weight:500;margin-bottom:10px;color:var(--ink);line-height:1.4}
.biz-item p{font-size:14.5px;color:var(--ink-2);line-height:1.7}
@media(max-width:900px){
  .biz-band{padding:64px 0}.biz-band .wrap{padding:0 24px}
  .biz-grid{grid-template-columns:1fr 1fr;gap:36px 0}
  .biz-item{padding:24px 0;border-left:none;border-top:1px solid var(--line)}
  .biz-item:first-child{border-top:none}
  .biz-item:nth-child(odd){padding-right:32px}
  .biz-item:nth-child(even){padding-left:32px;border-left:1px solid var(--line)}
}

/* 场景叙事（图文行交替，产品图当主角） */
.scn{padding:80px 0;border-top:1px solid var(--line)}
.scn .row{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center;max-width:1100px;margin:0 auto;padding:0 40px}
.scn.flip .s-img{order:2}
.scn.flip .s-txt{order:1}
.scn .s-img img{width:100%;aspect-ratio:1/1;object-fit:contain;background:#fff;border-radius:8px;display:block;padding:12px}
.scn .s-txt .s-kicker{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:10px}
.scn .s-txt h3{font-family:"Noto Serif SC",serif;font-weight:600;font-size:clamp(20px,2.4vw,28px);color:var(--ink);line-height:1.25}
.scn .s-txt p{margin-top:14px;color:var(--ink-2);font-size:15.5px;line-height:1.8;max-width:42ch}
@media(max-width:900px){.scn{padding:56px 0}.scn .row{grid-template-columns:1fr;gap:24px;padding:0 24px}.scn.flip .s-img,.scn.flip .s-txt{order:initial}.scn .s-img{order:-1}}

/* 自绘信息图（研发/教材等页，T-20260812-02 交付的 SVG 落位） */
.infographic{margin:32px 0;background:#fff;border:1px solid var(--line);border-radius:8px;padding:24px;overflow:hidden}
.infographic img{width:100%;height:auto;display:block}
.infographic figcaption{margin-top:14px;font-size:13px;line-height:1.6;color:var(--muted);text-align:center}
@media(max-width:560px){.infographic{padding:16px;margin:24px 0}}

/* 深色收束 CTA（镜像首页 .close） */
.cta-band{position:relative;min-height:58vh;display:flex;align-items:flex-end;overflow:hidden;background:var(--dark)}
.cta-band .bg{position:absolute;inset:0;background-size:cover;background-position:58% center;opacity:.42}
.cta-band::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,23,42,.35),rgba(15,23,42,.72));z-index:1}
.cta-band .txt{position:relative;z-index:2;margin:0 auto;max-width:1100px;padding:72px 40px 88px;color:#fff}
.cta-band h2{font-family:"Noto Serif SC",serif;font-weight:600;font-size:clamp(26px,4vw,46px);line-height:1.18;color:#fff;max-width:20ch}
.cta-band p{color:rgba(255,255,255,.74);margin:16px 0 28px;max-width:42ch;font-size:15px}
.cta-band .cta-row{display:flex;gap:14px;flex-wrap:wrap}
.cta-band .btn.ghost{color:#fff;border-color:rgba(255,255,255,.5);background:transparent}
.cta-band .btn.ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.cta-band .btn.primary{background:var(--accent);color:#fff}
.cta-band .btn.primary:hover{background:var(--accent-press)}
@media(max-width:900px){.cta-band{min-height:50vh}.cta-band .txt{padding:52px 24px 64px}.cta-band .cta-row{flex-direction:column;align-items:stretch}.cta-band .cta-row .btn{width:100%;text-align:center}}

/* 文字链接条（按部位等次级导航，轻量不抢戏） */
.linkrow{display:flex;flex-wrap:wrap;gap:10px 22px;padding:52px 0;border-top:1px solid var(--line)}
.linkrow .lr-label{width:100%;font-size:13px;color:var(--muted);letter-spacing:.04em;margin-bottom:4px}
.linkrow a{font-size:15px;color:var(--ink-2);transition:color .2s}
.linkrow a:hover{color:var(--accent)}

/* ===== reveal 入场 ===== */
.reveal{opacity:0;transform:translateY(10px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ===== 仪器详情页「适配微晶」型号列表 ===== */
/* 链接型号：品牌蓝可点；无详情页型号：置灰不可点（仅作事实标注） */
.pd-spec .micro-list{display:flex;flex-direction:column;gap:8px;align-items:flex-start;padding:4px 0}
.pd-spec .micro-list a{color:var(--accent);text-decoration:none;font-weight:500;font-size:14px;line-height:1.4}
.pd-spec .micro-list a::after{content:' →';font-weight:400;color:var(--accent)}
.pd-spec .micro-list a:hover{text-decoration:underline}
.pd-spec .micro-list .mk-off{display:flex;flex-direction:column;gap:2px;align-items:flex-start;color:#9aa3af;font-size:14px;line-height:1.4;cursor:default}
.pd-spec .micro-list .mk-item{display:flex;flex-direction:column;gap:2px;align-items:flex-start}
.pd-spec .micro-list .mk-desc{font-style:normal;font-size:12.5px;color:var(--muted);line-height:1.5}
.pd-spec .micro-list .mk-off .mk-desc{color:#9aa3af}
/* 适配微晶 — 价格钩子（更多型号 / 报价 CTA） */
.pd-spec .micro-list .mk-hint{margin:8px 0 0;padding-top:9px;border-top:1px dashed #e6e9f0;font-size:12.5px;line-height:1.5;color:var(--muted)}
.pd-spec .micro-list .mk-hint a{color:var(--accent);font-weight:600;text-decoration:none}
.pd-spec .micro-list .mk-hint a::after{content:""}
