/* ============================================================
   YH Machining — 精密零部件分包加工 官网首页
   版式、字号、间距、组件全部对齐参考站 mzpmachining.com
   配色：工业深灰 + 信号橙 ／ 栅格 1140 ／ 圆角 6
   ============================================================ */

/* 字体自托管：与参考站同一套 Inter（latin 子集），Mac / Windows / Android 观感一致 */
@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;
  src:url("fonts/inter-latin-400.woff2") format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;
  src:url("fonts/inter-latin-600.woff2") format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;
  src:url("fonts/inter-latin-700.woff2") format("woff2")}

:root{
  --ink:#101820;
  --ink-2:#1c2733;
  --ink-3:#2b3a49;
  --body:#38424e;
  --muted:#6b7482;
  --line:#e4e8ec;
  --line-2:#eef1f4;
  --bg:#ffffff;
  --bg-alt:#f6f8fa;
  --accent:#c2410c;
  --accent-dk:#9a3412;
  --accent-bg:#fdf3ee;
  --ok:#166b43;
  --radius:6px;
  --maxw:1140px;
  --sans:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"PingFang SC","Microsoft YaHei",sans-serif;
  --mono:"SF Mono",ui-monospace,Consolas,monospace;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--body);
  font:16px/1.7 var(--sans);-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto}
/* 参考站漏了这条 reset，会让按钮/输入框掉回系统字体；本站补上，与正文同一套 Inter */
button,input,select,textarea{font-family:inherit}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{color:var(--ink);letter-spacing:-.02em;line-height:1.25;margin:0 0 .6em}
h1{font-size:clamp(1.9rem,4.2vw,2.9rem);font-weight:700}
h2{font-size:clamp(1.4rem,2.6vw,1.95rem);font-weight:700}
h3{font-size:1.12rem;font-weight:650}
h4{font-size:1rem;font-weight:650}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding-inline-start:1.25em}
li{margin:.3em 0}
strong{color:var(--ink)}
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.narrow{max-width:820px}
.lede{max-width:820px}
.center{text-align:center}
.sec{padding:3.6rem 0;scroll-margin-top:76px}
.sec.alt{background:var(--bg-alt)}
.sec.tight{padding:2.4rem 0}
.lead{font-size:1.08rem;color:var(--body)}

.eyebrow{
  font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);margin:0 0 .7rem;
}
.sec-head{max-width:760px;margin-bottom:2rem}
.sec-head p{margin-bottom:0}
.mono{font-family:var(--mono);font-size:.79rem;letter-spacing:.01em}

/* ---------- 顶部导航 ---------- */
.topbar{
  background:var(--ink);color:#93a1b0;font-size:.79rem;
  padding:.45rem 0;border-bottom:1px solid #223040;
}
.topbar .wrap{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.topbar a{color:#c8d2dc}
.topbar a:hover{color:#fff;text-decoration:none}
.topbar .tb-r{display:flex;gap:1.2rem;flex-wrap:wrap;align-items:center}
.topbar b{color:#fff;font-weight:600}

header.site{
  position:sticky;top:0;z-index:40;background:#fff;
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 2px rgba(16,24,32,.04);
  transition:box-shadow .2s;
}
header.site.scrolled{box-shadow:0 2px 12px rgba(16,24,32,.08)}
.nav{display:flex;align-items:center;gap:1.1rem;padding:.7rem 0;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;flex:0 0 auto}
.brand:hover{text-decoration:none}
.brand-mark{height:36px;width:auto;flex:0 0 auto;color:var(--ink);display:block}
.brand-txt{display:flex;flex-direction:column;line-height:1.1}
.brand-txt strong{font-size:1.16rem;color:var(--ink);font-weight:700;letter-spacing:.01em;line-height:1.05}
.brand-txt em{font-style:normal;font-size:.62rem;color:var(--muted);letter-spacing:.16em;text-transform:uppercase;font-weight:600;margin-top:.16rem}

nav.main{display:flex;gap:1.15rem;flex-wrap:wrap;margin-inline-start:auto}
nav.main a{
  color:var(--ink-3);font-size:.88rem;font-weight:550;text-decoration:none;
  padding:.25rem 0;border-bottom:2px solid transparent;
}
nav.main a:hover{color:var(--accent);border-bottom-color:var(--accent);text-decoration:none}
.nav-cta{display:flex;align-items:center;gap:.75rem;flex:0 0 auto}
.nav-tel{font-size:.87rem;font-weight:650;color:var(--ink);white-space:nowrap;line-height:1.35}
.nav-tel span{color:var(--muted);font-weight:500;font-size:.76rem}
.nav-tel a{color:var(--ink);text-decoration:none}
.nav-tel a:hover{color:var(--accent);text-decoration:none}

/* 移动端导航开关：仅 ≤900px 显示，纯 CSS，不依赖脚本 */
.mnav-cb{position:absolute;opacity:0;pointer-events:none;width:0;height:0}
.mnav-btn{
  display:none;flex-direction:column;justify-content:center;gap:4px;
  width:40px;height:36px;margin-inline-start:auto;cursor:pointer;
  border:1px solid var(--line);border-radius:var(--radius);background:#fff;
}
.mnav-btn span{display:block;height:2px;width:17px;margin:0 auto;background:var(--ink);border-radius:1px}
.nav-m-cta{display:none}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-block;padding:.72rem 1.25rem;border-radius:var(--radius);
  font-size:.9rem;font-weight:650;text-align:center;cursor:pointer;
  border:1px solid transparent;text-decoration:none;transition:.15s;
}
.btn:hover{text-decoration:none}
.btn-p{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn-p:hover{background:var(--accent-dk);border-color:var(--accent-dk);color:#fff}
.btn-g{background:#fff;color:var(--ink-3);border-color:#c9d1d9}
.btn-g:hover{border-color:var(--ink-3);color:var(--ink)}
.btn-gh{background:transparent;color:#e6eaf0;border-color:#3b4a5a}
.btn-gh:hover{border-color:#7a8b9c;color:#fff}
.btn-sm{padding:.5rem .9rem;font-size:.82rem}
.btn-block{display:block;width:100%}
.btns{display:flex;gap:.7rem;flex-wrap:wrap}

/* ---------- 首页 Hero ---------- */
.hero{
  background:var(--ink);color:#c3ccd6;position:relative;overflow:hidden;
  padding:4.2rem 0 3.4rem;
}
.hero::before{
  content:"";position:absolute;inset:0;opacity:.5;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:46px 46px;
}
.hero-media{position:absolute;inset:0;overflow:hidden}
.hero-media img{width:100%;height:100%;object-fit:cover;opacity:.32;object-position:center 42%}
.hero-media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(16,24,32,.94) 0%,rgba(16,24,32,.80) 55%,rgba(16,24,32,.62) 100%)}
.hero .wrap{position:relative;z-index:2}
.hero h1{color:#fff;max-width:20ch;margin-bottom:.7rem}
.hero .sub{font-size:1.06rem;color:#a9b6c4;max-width:64ch;margin-bottom:1.5rem}
.hero .btns{margin-bottom:1.9rem}
.hero-strip{
  display:flex;gap:1.4rem;flex-wrap:wrap;padding-top:1.4rem;
  border-top:1px solid #253343;font-size:.82rem;color:#8fa0b1;font-weight:600;
}
.hero-strip>span{display:inline-flex;align-items:baseline}
.hero-strip i{color:var(--accent);font-style:normal;margin-inline-end:.4rem;font-size:.72rem}

/* ---------- 栅格 ---------- */
.grid{display:grid;gap:1rem}
.g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(205px,1fr))}
.c3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.c4{grid-template-columns:repeat(auto-fit,minmax(205px,1fr))}

/* ---------- 卡片 ---------- */
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:1.15rem 1.2rem;transition:.15s;
}
.card:hover{border-color:#c9d1d9;box-shadow:0 2px 8px rgba(16,24,32,.05)}
.card h3{margin-bottom:.35rem;font-size:1.02rem}
.card h3 a{color:var(--ink)}
.card h3 a:hover{color:var(--accent);text-decoration:none}
.card p{margin:0;font-size:.9rem;color:var(--muted)}
.card .more{display:inline-block;margin-top:.7rem;font-size:.83rem;font-weight:650}
.card-plain{background:var(--bg-alt);border-color:transparent}
.card-plain:hover{border-color:transparent;box-shadow:none}

/* 配图卡：图片顶到卡片上/左/右边缘（负外边距抵消卡片内边距），卡片 overflow 把图裁进圆角。
   行业卡 .r11 用 1:1，能力卡 .r32 用 3:2 —— 与参考站一致。
   本站素材是图库照片而非白底抠图，所以用 cover 填满（参考站用 contain 是因为素材自带白底）。 */
.card.pic{overflow:hidden;display:flex;flex-direction:column}
.card.pic .card-img{
  display:block;margin:-1.15rem -1.2rem .95rem;
  background:#eef1f4;border-bottom:1px solid var(--line-2);overflow:hidden;
}
.card.pic .card-img img{display:block;width:100%;object-fit:cover}
.card.pic.r11 .card-img img{aspect-ratio:1/1}
.card.pic.r32 .card-img img{aspect-ratio:3/2}
.card.pic p{flex:1 1 auto}
/* 同一行卡片的「了解详情」贴底对齐：参考站这里是浮动的，长摘要会让入口高低错落 */
.card.pic .more{margin-top:auto;padding-top:.7rem}

.tag{
  display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;padding:.22rem .55rem;border-radius:3px;
  background:var(--accent-bg);color:var(--accent);margin-bottom:.6rem;align-self:flex-start;
}
.tag.hi{background:#fef3c7;color:#92400e}
.tag.nt{background:#eef1f4;color:var(--muted)}

/* ---------- 表格 ---------- */
.tbl{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.tbl::-webkit-scrollbar{height:6px}
.tbl::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
table.tb{width:100%;border-collapse:collapse;font-size:.9rem;margin:1.2rem 0}
.card table.tb{margin:.55rem 0 .1rem}
table.tb th{
  background:var(--ink);color:#fff;text-align:start;padding:.7rem .85rem;
  font-weight:600;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;
}
table.tb td{padding:.7rem .85rem;border-bottom:1px solid var(--line-2);vertical-align:top}
table.tb tr:nth-child(even) td{background:#fbfcfd}
table.tb td:first-child{color:var(--ink);font-weight:600}
table.tb .mono{color:var(--ink-3);font-size:.79rem;line-height:1.6}
.w26{width:26%}
.w40{width:40%}

/* ---------- 提示块 ---------- */
.note{
  border-inline-start:4px solid var(--accent);background:var(--accent-bg);
  padding:1rem 1.2rem;margin:1.3rem 0;
  border-start-start-radius:0;border-end-start-radius:0;
  border-start-end-radius:var(--radius);border-end-end-radius:var(--radius);
}
.note h3{font-size:.98rem;margin-bottom:.35rem}
.note p:last-child{margin-bottom:0;font-size:.92rem}
.note.gray{border-color:var(--muted);background:var(--bg-alt)}

/* ---------- 卡内紧凑列表 ---------- */
.mini{list-style:none;margin:.55rem 0 0;padding:0}
.mini li{
  position:relative;padding-block:.42rem;padding-inline-start:1.05rem;
  font-size:.9rem;line-height:1.55;color:var(--body);
  border-top:1px solid var(--line-2);
}
.mini li:first-child{border-top:0;padding-top:0}
.mini li::before{content:"";position:absolute;inset-inline-start:0;top:.98rem;width:5px;height:5px;border-radius:50%;background:var(--accent)}
.mini li:first-child::before{top:.56rem}
.mini b{color:var(--ink)}

/* ---------- 零件卡 ---------- */
.pcard{
  margin:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;
  transition:box-shadow .22s ease,border-color .22s ease;
}
.pcard:hover{box-shadow:0 8px 22px rgba(16,24,32,.09);border-color:var(--line-2)}
.pcard img{aspect-ratio:3/4;object-fit:cover;width:100%;background:#eef1f4}
.pcard .bd{padding:.85rem 1rem;border-top:1px solid var(--line-2)}
.pcard .bd b{display:block;font-size:.94rem;color:var(--ink);margin-bottom:.2rem}
.pcard .bd span{font-size:.79rem;color:var(--muted);font-family:var(--mono)}
.parts-note{font-size:.78rem;color:#8d97a3;margin:1.1rem 0 0}

/* ---------- 三步 ---------- */
.steps{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:1.6rem}
.step{flex:1 1 190px;display:flex;gap:.6rem;align-items:flex-start}
.step b{
  flex:0 0 24px;height:24px;border-radius:50%;background:var(--accent);color:#fff;
  font:700 .78rem/24px var(--mono);text-align:center;
}
.step div{font-size:.87rem;color:var(--muted)}
.step div strong{display:block;color:var(--ink);font-size:.93rem}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer;padding:1rem .2rem;font-weight:600;color:var(--ink);
  font-size:.98rem;list-style:none;display:flex;justify-content:space-between;gap:1rem;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--accent);font-weight:700;font-size:1.15rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq summary:hover{color:var(--accent)}
.faq details p{padding:0 .2rem 1.1rem;margin:0;font-size:.93rem;color:var(--body);max-width:75ch}
.faq details p:last-child{margin-bottom:0}

/* ---------- 深色询价区 ---------- */
.cta{background:var(--ink);color:#a9b6c4;padding:3rem 0;scroll-margin-top:76px}
.cta h2{color:#fff;margin-bottom:.5rem}
.cta p{color:#9db0c0;max-width:60ch}
.cta .eyebrow{color:#f0a882}
.cta .btns{margin-top:1.3rem}
.quote-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:3rem;align-items:stretch}
/* 表单比文案高：让联系方式沉到列底，两列底部齐平，不然左边留一大块空 */
.quote-copy{display:flex;flex-direction:column}
.quote-copy .quote-contact{margin-top:auto;padding-top:1.4rem}
.quote-list{list-style:none;padding:0;margin:1.4rem 0 1.6rem}
.quote-list li{position:relative;padding-inline-start:1.05rem;font-size:.9rem;color:#c3ccd6;margin:.5rem 0}
.quote-list li::before{content:"";position:absolute;inset-inline-start:0;top:.62em;width:5px;height:5px;border-radius:50%;background:var(--accent)}
.quote-contact{display:flex;flex-direction:column;gap:.4rem;font-size:.9rem}
.quote-contact a{color:#fff;align-self:flex-start;border-bottom:1px solid #33465a;padding-bottom:1px}
.quote-contact a:hover{color:#f0a882;border-color:#f0a882;text-decoration:none}

/* ---------- 表单 ---------- */
.form{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem;color:var(--body)}
.fld{margin-bottom:1rem;position:relative}
.fld label{display:block;font-size:.84rem;font-weight:650;color:var(--ink);margin-bottom:.3rem}
.fld input,.fld select,.fld textarea{
  width:100%;padding:.62rem .75rem;border:1px solid #ccd4dc;border-radius:4px;
  font:15px/1.5 var(--sans);color:var(--ink);background:#fff;
}
.fld textarea{resize:vertical;min-height:78px}
.fld input:focus,.fld select:focus,.fld textarea:focus{
  outline:2px solid var(--accent);outline-offset:-1px;border-color:var(--accent);
}
.fld select{
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236b7482' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .7rem center;padding-inline-end:2rem;
}
.fld input::placeholder,.fld textarea::placeholder{color:#a9b2bd}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}

/* 文件上传：<label> 当投放区，真 input 视觉隐藏但键盘可达 */
/* 用 <label> 当投放区后，会把 .fld label 的 650 字重 / 深色文字继承过来 →
   这里显式压回原 .drop 的观感（块内那个 <b> 再单独加深）。 */
label.drop{
  display:block;cursor:pointer;font-size:.86rem;font-weight:400;color:var(--muted);margin-bottom:0;
  border:1.5px dashed #ccd4dc;border-radius:4px;padding:1.1rem 1rem;text-align:center;
  background:var(--bg-alt);transition:border-color .15s,background .15s,color .15s;
}
label.drop:hover{border-color:var(--accent);color:var(--accent)}
label.drop b{display:block;color:var(--ink);font-size:.93rem;margin:0 0 .3rem}
label.drop:hover b{color:var(--accent)}
label.drop span{display:block;line-height:1.55}
label.drop.dragover{border-style:solid;border-color:var(--accent);background:rgba(194,65,12,.07)}
.filein{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.filein:focus-visible + .flist{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.flist{list-style:none;margin:.6rem 0 0;padding:0;font-size:.83rem}
.flist li{
  display:flex;align-items:center;gap:.55rem;padding:.34rem .55rem;margin-bottom:.3rem;
  border:1px solid var(--line);border-radius:4px;background:#fff;
}
.flist .nm{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink)}
.flist .sz{flex:0 0 auto;color:var(--muted);font:400 .76rem/1.4 var(--mono)}
.flist .rm{
  flex:0 0 auto;border:0;background:none;cursor:pointer;color:var(--muted);
  padding:.16rem .34rem;border-radius:3px;font:inherit;font-size:1.05rem;line-height:1;
}
.flist .rm:hover{color:var(--accent);background:rgba(194,65,12,.09)}

.check{display:flex;align-items:center;gap:.5rem;margin:0 0 1rem;font-size:.84rem;color:var(--body);cursor:pointer}
.check input{width:15px;height:15px;margin:0;accent-color:var(--accent);flex:0 0 auto}

.fmsg{
  margin:1rem 0 0;padding:.8rem .95rem;border-radius:4px;font-size:.89rem;line-height:1.6;
  border:1px solid var(--line);background:var(--bg-alt);
}
.fmsg[data-state="ok"]{border-color:#a7d3b0;background:#eef8f0;color:#1c6b31}
.fmsg[data-state="err"]{border-color:#f0b4ae;background:#fdf1f0;color:#97231a}
.fmsg[data-state="busy"]{border-color:#e3cf9a;background:#fdf7e9;color:#7a5b12}
.fmsg strong{display:block;font-weight:650;margin-bottom:.15rem}
.fmsg span{display:block;font-size:.86rem}
/* 卡片底部的补充说明（设备清单、报告清单） */
.card-foot{font-size:.82rem;color:var(--muted);margin:.65rem 0 0;line-height:1.65}
/* 指南卡整卡可点 */
.guide{display:block;color:inherit}
.guide:hover{text-decoration:none;color:inherit}
.form-note{font-size:.74rem;color:#8b95a1;margin:.7rem 0 0;line-height:1.6}
/* 反垃圾蜜罐：对真人不可见。不用 display:none —— 部分机器人会跳过隐藏元素 */
/* 表单蜜罐：用 clip 隐藏而不是 left:-9999px —— 后者在 RTL 版面上会撑出上万像素的横向滚动 */
.hp{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;border:0;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.form[data-busy] .btn-p{opacity:.55;pointer-events:none}

/* ---------- 页脚 ---------- */
footer.site{background:var(--ink);color:#8b98a6;padding:3rem 0 1.5rem;font-size:.88rem}
footer.site .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;margin-bottom:2.2rem}
footer.site h4{color:#fff;font-size:.82rem;letter-spacing:.09em;text-transform:uppercase;margin-bottom:.8rem}
footer.site a{color:#a8b8c6;display:block;padding:.16rem 0;font-size:.86rem}
footer.site a:hover{color:#fff;text-decoration:none}
footer.site .fbrand b{color:#fff;font-size:1rem;display:block;margin-bottom:.4rem}
footer.site .fbrand p{font-size:.85rem;line-height:1.7;margin:0 0 .8rem;color:#8b98a6;max-width:26em}
footer.site .flegal{color:#93a1b0;font-size:.79rem;margin:0 0 .8rem;letter-spacing:.01em}
footer.site .fbot{
  border-top:1px solid #223040;padding-top:1.2rem;display:flex;
  justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.79rem;color:#67757f;
}
footer.site .fbot a{display:inline;padding:0;color:#8b98a6;font-size:.79rem}
.brand-foot .brand-mark{color:#fff}
.brand-foot .brand-txt strong{color:#fff}
.brand-foot .brand-txt em{color:#7f8d9c}
.brand-foot{margin-bottom:.9rem}

.f-langs{display:flex;flex-wrap:wrap;gap:.3rem .85rem;align-items:center;
  padding-top:1rem;margin-top:.4rem;border-top:1px solid #223040;font-size:.82rem}
.f-langs b{color:#fff;font-weight:600;margin-inline-end:.15rem}
.f-langs a{display:inline-block;padding:.06rem 0;color:#a8b8c6}
.f-langs a:hover{color:#fff;text-decoration:none}
.f-langs a.on{color:#fff;font-weight:600}

/* ---------- 语言切换器（顶栏下拉） ---------- */
.lang{position:relative;display:inline-block;font-size:.79rem;line-height:1.2}
/* 顶栏里排到最右：.tb-r 是 flex 容器，用 order 定位，不改 DOM 顺序 */
.topbar .tb-r .lang{order:9}
.lang>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:.32rem;
  padding:.2rem .5rem;border:1px solid #3a4a5c;border-radius:var(--radius);color:#c8d2dc;
  white-space:nowrap;transition:border-color .15s,color .15s}
.lang>summary::-webkit-details-marker{display:none}
.lang>summary:hover,.lang[open]>summary{border-color:#64798f;color:#fff}
.lang-globe{font-size:.95em;opacity:.85}
.lang-cv{width:9px;height:6px;opacity:.75;flex:0 0 auto}
.lang-menu{position:absolute;z-index:90;top:calc(100% + 5px);inset-inline-end:0;min-width:160px;
  max-height:min(72vh,470px);overflow:auto;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:0 12px 30px rgba(16,24,32,.20);padding:.3rem;display:flex;flex-direction:column}
.lang-menu a{display:block;padding:.36rem .6rem;border-radius:4px;
  color:var(--ink-2);text-decoration:none;white-space:nowrap;font-size:.84rem}
.lang-menu a:hover{background:var(--bg-alt);text-decoration:none}
.lang-menu a.on{font-weight:700;color:var(--accent);background:var(--accent-bg)}

/* ---------- 多语言排版 ---------- */
html[lang="zh-Hans"] body{line-height:1.82}
html[lang="zh-Hans"] h1{letter-spacing:0;line-height:1.24}
html[lang="zh-Hans"] h2{letter-spacing:0;line-height:1.42}
html[lang="zh-Hans"] h3,html[lang="zh-Hans"] h4{letter-spacing:0}
html[lang="zh-Hans"] .eyebrow{letter-spacing:.09em;text-transform:none}
html[lang="zh-Hans"] .hero h1{max-width:20em}

html[lang="ja"] body{line-height:1.85;
  /* 日文必须先落到日文字体，否则 Windows 上汉字会取到雅黑的中文字形 */
  font-family:Inter,-apple-system,"Segoe UI","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic UI","Yu Gothic","Meiryo","Noto Sans JP","Microsoft YaHei",sans-serif;
}
html[lang="ja"] h1{letter-spacing:0;line-height:1.3}
html[lang="ja"] h2,html[lang="ja"] h3{letter-spacing:0}
html[lang="ja"] .eyebrow{letter-spacing:.1em;text-transform:none}
html[lang="ja"] .hero h1{max-width:24em}
/* 日文按文节断行：否则「お答えします」会被拆成「お / 答えします」 */
html[lang="ja"] .hero h1,html[lang="ja"] .hero .sub,html[lang="ja"] .sec-head h2,
html[lang="ja"] .sec-head p,html[lang="ja"] .step div,html[lang="ja"] .faq details p{
  word-break:auto-phrase;line-break:strict;
}

html[lang="ko"] body{line-height:1.85;
  font-family:Inter,-apple-system,"Segoe UI","Malgun Gothic","Apple SD Gothic Neo","Noto Sans KR","Microsoft YaHei",sans-serif;
}
html[lang="ko"] h1{letter-spacing:-.01em;line-height:1.28}
html[lang="ko"] h2,html[lang="ko"] h3{letter-spacing:0}
html[lang="ko"] .eyebrow{letter-spacing:.08em;text-transform:none}

html[lang="de"] h1,html[lang="de"] h2,html[lang="de"] .card h3,html[lang="de"] .card p{hyphens:auto}
html[lang="vi"] body{line-height:1.75}

/* 繁體中文：与简体共用一套排版，标题字距同样归零 */
html[lang="zh-Hant"] body{line-height:1.82}
html[lang="zh-Hant"] h1{letter-spacing:0;line-height:1.24}
html[lang="zh-Hant"] h2{letter-spacing:0;line-height:1.42}
html[lang="zh-Hant"] h3,html[lang="zh-Hant"] h4{letter-spacing:0}
html[lang="zh-Hant"] .eyebrow{letter-spacing:.09em;text-transform:none}
html[lang="zh-Hant"] .hero h1{max-width:20em}

/* 法语 / 俄语 / 土耳其语：单词更长，允许连字符断行，避免撑破卡片与表格 */
html[lang="fr"] h1,html[lang="fr"] h2,html[lang="fr"] .card h3,html[lang="fr"] .card p,
html[lang="ru"] h1,html[lang="ru"] h2,html[lang="ru"] .card h3,html[lang="ru"] .card p,
html[lang="ru"] td,html[lang="tr"] h1,html[lang="tr"] h2{hyphens:auto}
html[lang="ru"] body{line-height:1.72}
html[lang="tr"] h1,html[lang="tr"] h2{letter-spacing:-.01em}

/* 阿拉伯语 / 波斯语 / 希伯来语：连写文字，字距必须为 0（否则字母之间断开），行高放开 */
html[lang="ar"] body,html[lang="fa"] body,html[lang="he"] body{line-height:1.95}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3,html[lang="ar"] h4,
html[lang="ar"] .eyebrow,html[lang="ar"] .brand-txt strong,html[lang="ar"] .brand-txt em,
html[lang="ar"] table.tb th,html[lang="ar"] .btn,html[lang="ar"] .tag,
html[lang="fa"] h1,html[lang="fa"] h2,html[lang="fa"] h3,html[lang="fa"] h4,
html[lang="fa"] .eyebrow,html[lang="fa"] .brand-txt strong,html[lang="fa"] .brand-txt em,
html[lang="fa"] table.tb th,html[lang="fa"] .btn,html[lang="fa"] .tag,
html[lang="he"] h1,html[lang="he"] h2,html[lang="he"] h3,html[lang="he"] h4,
html[lang="he"] .eyebrow,html[lang="he"] .brand-txt strong,html[lang="he"] .brand-txt em,
html[lang="he"] table.tb th,html[lang="he"] .btn,html[lang="he"] .tag{letter-spacing:0}
html[lang="ar"] .eyebrow,html[lang="fa"] .eyebrow,html[lang="he"] .eyebrow{
  text-transform:none;font-size:.8rem}
html[lang="ar"] h1,html[lang="fa"] h1,html[lang="he"] h1{line-height:1.45}
html[lang="ar"] h2,html[lang="fa"] h2,html[lang="he"] h2{line-height:1.6}
html[lang="ar"] .hero h1{max-width:22em}
html[lang="fa"] .hero h1,html[lang="he"] .hero h1{max-width:24em}
/* 这三种文字上扬下探幅度大，按钮与标签需要更多垂直空间，否则字被裁切 */
html[lang="ar"] .btn,html[lang="fa"] .btn,html[lang="he"] .btn{padding-block:.72rem}
html[lang="ar"] .tag,html[lang="fa"] .tag,html[lang="he"] .tag{line-height:1.5;padding-block:.2rem}
html[lang="ar"] table.tb th,html[lang="ar"] table.tb td,
html[lang="fa"] table.tb th,html[lang="fa"] table.tb td,
html[lang="he"] table.tb th,html[lang="he"] table.tb td{padding-block:.62rem}

/* 字体栈：Inter 只有拉丁子集，阿拉伯 / 波斯 / 希伯来字形必须落到系统字体 */
html[lang="ar"] body{font-family:Inter,"Segoe UI","Noto Naskh Arabic","Geeza Pro",Tahoma,Arial,sans-serif}
html[lang="fa"] body{font-family:Inter,"Segoe UI",Tahoma,"Noto Naskh Arabic","Iranian Sans",Arial,sans-serif}
html[lang="he"] body{font-family:Inter,"Segoe UI","Noto Sans Hebrew","Arial Hebrew",Arial,sans-serif}
html[lang="ru"] body{font-family:Inter,-apple-system,"Segoe UI",Roboto,Arial,"Noto Sans",sans-serif}

/* ---------- RTL 镜像（阿拉伯语 / 波斯语 / 希伯来语） ---------- */
/* 版面方向性已改用逻辑属性，这里只处理无法逻辑化的物理属性 */
html[dir="rtl"] .hero-media::after{
  background:linear-gradient(270deg,rgba(16,24,32,.94) 0%,rgba(16,24,32,.80) 55%,rgba(16,24,32,.62) 100%)}
html[dir="rtl"] .fld select{
  background-position:left .7rem center;
  padding-inline-end:1rem;padding-inline-start:2rem}
html[dir="rtl"] .note{border-start-start-radius:0;border-end-start-radius:0;
  border-start-end-radius:var(--radius);border-end-end-radius:var(--radius)}
html[dir="rtl"] table.tb .mono{direction:ltr;unicode-bidi:isolate;display:inline-block}
/* 电话与邮箱是纯 LTR 内容：不做隔离的话，加号会被排到行尾，号码读成倒序 */
html[dir="rtl"] a[href^="tel:"],html[dir="rtl"] a[href^="mailto:"]{
  direction:ltr;unicode-bidi:isolate;display:inline-block}
html[dir="rtl"] .nav-tel{unicode-bidi:isolate}
html[dir="rtl"] input[type="email"]{direction:ltr;text-align:start}
html[dir="rtl"] .flist .nm{direction:ltr;unicode-bidi:isolate;display:inline-block}

/* 栅格/弹性子项默认 min-width:auto，长词会撑破轨道导致整页横向溢出 */
.cols>*,.grid>*,.grid-pic>*,.row2>*,.quote-grid>*,.steps>*,.mini{min-width:0}
h1,h2,h3,h4,.card h3,.card p,.pcard .bd b,.pcard .bd span,.step div,
.note p,td,th,.f-langs a{overflow-wrap:break-word}

/* ---------- 动效 ---------- */
/* 入场动效只在脚本就绪时生效：脚本被拦截或报错时内容不会整块消失 */
html.js .reveal{opacity:0;transform:translateY(12px);transition:opacity .6s ease,transform .6s ease}
html.js .reveal.in{opacity:1;transform:none}

/* 键盘可见焦点：只在键盘操作时出现，鼠标点击不显示，不影响版式 */
a:focus-visible,button:focus-visible,summary:focus-visible,
.btn:focus-visible,.drop:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--accent);outline-offset:3px;border-radius:3px;
}

/* ---------- 响应式 ---------- */
@media (max-width:900px){
  .nav-cta{display:none}
  .mnav-btn{display:flex}
  nav.main{display:none;width:100%;order:3;margin-inline-start:0;padding-top:.2rem;
    border-top:1px solid var(--line-2);flex-direction:column;gap:0}
  .mnav-cb:checked ~ nav.main{display:flex}
  nav.main a{display:block;width:100%;padding:.65rem 0;font-size:.95rem;border-bottom:1px solid var(--line-2)}
  nav.main a:hover{color:var(--accent);border-bottom-color:var(--line-2)}
  nav.main a.nav-m-cta{display:block;margin-top:.9rem;color:var(--accent);font-weight:600;border-bottom:0}
  .hero{padding:3rem 0 2.6rem}
  .sec{padding:2.6rem 0}
  .quote-grid{grid-template-columns:1fr;gap:2rem}
}
@media (max-width:760px){
  .quote-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .nav-tel{display:none}
  .topbar .tb-r span.hide-s{display:none}
  .brand-txt em{display:none}
  .brand-mark{height:30px;width:auto}
  .topbar{padding:.5rem 0;font-size:.74rem}
  .topbar .tb-r{gap:.3rem .6rem}
  .lang>summary{padding:.14rem .38rem}
}

/* 宽屏列数收敛：g2 固定两列 */
@media (min-width:900px){
  .grid.g2{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:1080px){
  .grid.c3{grid-template-columns:repeat(3,1fr)}
  .grid.c4{grid-template-columns:repeat(4,1fr)}
}

/* 中文 / 日文导航标签比英文宽，1200 以下会与右侧电话挤在一起：
   藏掉电话块（顶栏与页脚仍有），只留报价按钮 */
@media (max-width:1180px){
  .nav-tel{display:none}
}

/* 窄屏 / 平板：顶栏会换行，语言按钮可能被挤到屏幕边缘。
   菜单改为锚定整个顶栏并横向铺满，与按钮位置无关，任何语种都不会出屏。 */
@media (max-width:860px){
  .topbar{position:relative}
  .topbar .lang{position:static}
  .topbar .lang-menu{
    left:10px;right:10px;min-width:0;max-width:none;
    max-height:70vh;overflow:auto;
    display:grid;grid-template-columns:1fr 1fr;gap:2px;
  }
}
/* 窄屏表格：定宽布局强制在容器内换行，避免德语复合词撑破 */
@media (max-width:640px){
  .tbl{border:1px solid var(--line);border-radius:var(--radius)}
  .tb{width:100%;table-layout:fixed}
  .tb th,.tb td{overflow-wrap:anywhere;word-break:normal;padding:.42rem .5rem;font-size:.85rem}
  .tb th{font-size:.7rem}
}

/* ---------- 手机端专项 ---------- */
@media (max-width:700px){
  /* 配图卡改两列：只作用于「整格都是配图卡」的栅格 */
  .grid.grid-pic{grid-template-columns:repeat(2,1fr);gap:.7rem}
  .grid.grid-pic>.card{padding:.85rem .8rem}
  .grid.grid-pic>.card h3{font-size:.95rem;line-height:1.25;margin-bottom:.28rem}
  .grid.grid-pic>.card p{font-size:.86rem;line-height:1.45}
  .grid.grid-pic>.card .tag{margin-bottom:.42rem;padding:.16rem .42rem;font-size:.66rem}
  .grid.grid-pic>.card.pic .card-img{margin:-.85rem -.8rem .6rem}

  /* 整卡可点：隐藏 Learn more，用标题链接的 ::after 撑满整张卡 */
  .grid.grid-pic>.card{position:relative}
  .grid.grid-pic>.card h3 a{color:var(--accent)}
  .grid.grid-pic>.card h3 a::after{content:"";position:absolute;inset:0}
  .grid.grid-pic>.card .more{display:none}

  /* 点击区达标（WCAG 2.2 AA 是 24px，主要操作按 44px 做） */
  .btn{display:inline-flex;align-items:center;justify-content:center;
       min-height:44px;padding:.6rem 1.1rem;font-size:.95rem}
  .hero .btns .btn{width:100%}
  .mnav-btn{width:44px;height:44px}
  .lang>summary{min-height:44px;padding:.4rem .55rem;align-items:center}
  .card .more{padding:.35rem 0}

  /* Hero 精简 */
  h1{font-size:1.62rem;line-height:1.22}
  h2{font-size:1.28rem;line-height:1.3}
  .hero{padding:2.1rem 0 1.7rem}
  .hero .sub{font-size:.97rem;line-height:1.55;margin-bottom:1.05rem}
  .hero .btns{gap:.5rem;margin-bottom:1.25rem}
  .hero-strip{gap:.5rem 1.05rem;padding-top:.95rem;font-size:.78rem}

  /* 区块间距与字号收紧 */
  .sec{padding:2.1rem 0}
  .sec-head{margin-bottom:1.25rem}
  .lead{font-size:1rem;line-height:1.6}
  .eyebrow{font-size:.72rem}
  .row2{grid-template-columns:1fr;gap:0}
  .form{padding:1.15rem 1rem}
  .quote-grid{gap:1.6rem}
}
@media (max-width:560px){
  .topbar .tb-l{display:none}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  html.js .reveal{opacity:1;transform:none;transition:none}
  *{transition:none!important;animation:none!important}
}

/* ============================================================
   内页（子页面）：页头、面包屑、标签、正文列
   版式对齐参考站 .phead / .lede / .chips
   ============================================================ */
nav.main a.on{color:var(--accent);border-bottom-color:var(--accent)}
.phead{background:var(--ink-2);color:#a9b6c4;padding:3rem 0 2.6rem}
.phead h1{color:#fff;margin-bottom:.55rem;font-size:clamp(1.75rem,3.6vw,2.45rem);max-width:22ch}
.phead p{margin:0;max-width:68ch;color:#9db0c0;font-size:1.02rem;line-height:1.65}
.crumb{font-size:.78rem;color:#7d8fa1;margin-bottom:1rem}
.crumb a{color:#a9b6c4;text-decoration:none}
.crumb a:hover{color:#fff;text-decoration:none}
.crumb i{font-style:normal;color:#5c6b7a;padding:0 .4rem}
.phead .crumb i{color:#5c6b7a}

.lede{max-width:830px}
.lede p{font-size:1.04rem}
.lede p:last-child{margin-bottom:0}

.chips{display:flex;flex-wrap:wrap;gap:.55rem;margin:1.2rem 0 .2rem}
.chip{display:inline-block;background:#fff;border:1px solid var(--line);border-radius:100px;padding:.42rem .95rem;font-size:.85rem;color:var(--ink);line-height:1.4}
.sec.alt .chip{background:#fff}

.link-more{font-size:.9rem;font-weight:600;margin:.2rem 0 0}
.sec-body p:last-child{margin-bottom:0}

/* 内页底部导航片（上一页 / 下一页） */
.pager{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:.4rem}
.pager a{display:block;border:1px solid var(--line);border-radius:var(--radius);padding:.9rem 1.1rem;background:#fff;text-decoration:none}
.pager a:hover{border-color:var(--accent);text-decoration:none}
.pager span{display:block;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:.25rem}
.pager b{color:var(--ink);font-weight:650;font-size:.95rem}

/* 内页表格与清单 */
.fact-list{list-style:none;margin:1.1rem 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.55rem 1.6rem}
.fact-list li{position:relative;padding-inline-start:1.05rem;font-size:.92rem}
.fact-list li::before{content:"";position:absolute;inset-inline-start:0;top:.62rem;width:5px;height:5px;border-radius:50%;background:var(--accent)}

@media (max-width:760px){
  .fact-list{grid-template-columns:1fr}
  .pager{grid-template-columns:1fr}
  .phead{padding:2.1rem 0 1.8rem}
  .crumb{font-size:.74rem;margin-bottom:.7rem}
  .phead h1{max-width:none}
}

/* ============================================================
   内页增强块：关键参数带 / 成本因素 / 相关页面
   ============================================================ */
.glance-band{background:#fff;border-bottom:1px solid var(--line);padding:1.5rem 0}
.glance{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:1.15rem 1.4rem}
.glance div{border-inline-start:2px solid var(--accent);padding-inline-start:.75rem}
.glance b{display:block;font-size:1.1rem;font-weight:700;color:var(--ink);letter-spacing:-.01em;line-height:1.25}
.glance span{display:block;margin-top:.2rem;font-size:.78rem;color:var(--muted);line-height:1.35}

.cost-list{list-style:none;margin:1.2rem 0 0;padding:0}
.cost-list li{position:relative;padding-inline-start:1.35rem;margin-bottom:.95rem;font-size:.95rem;color:var(--muted);line-height:1.7}
.cost-list li:last-child{margin-bottom:0}
.cost-list li::before{content:"";position:absolute;inset-inline-start:0;top:.66rem;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.cost-list b{display:block;color:var(--ink);font-weight:650;font-size:.98rem;margin-bottom:.1rem}

.rel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:.8rem;margin-top:1.3rem}
.rel-grid a{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:.85rem 1.05rem;text-decoration:none;transition:border-color .18s ease}
.rel-grid a:hover{border-color:var(--accent);text-decoration:none}
.rel-grid span{display:block;font-size:.71rem;letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}
.rel-grid b{display:block;margin-top:.3rem;font-size:.95rem;font-weight:650;color:var(--ink);line-height:1.4}

@media (max-width:760px){
  .glance{grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem 1rem}
  .glance b{font-size:1rem}
  .glance-band{padding:1.15rem 0}
}

/* ============================================================
   功能页配图：横构图卡片（车间 / 零件实拍）
   ============================================================ */
.shots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem;margin-top:1.4rem}
.shots figure{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.shots img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:#eef1f4}
.shots figcaption{padding:.8rem .95rem;font-size:.82rem;color:var(--muted);line-height:1.5}
.shots figcaption b{display:block;color:var(--ink);font-size:.93rem;font-weight:650;margin-bottom:.15rem;letter-spacing:-.01em}
.strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin-top:1.4rem}
.strip figure{margin:0}
.strip img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius);display:block;background:#eef1f4}
.strip figcaption{font-size:.8rem;color:var(--muted);margin-top:.55rem;line-height:1.5}

@media (max-width:860px){.shots{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.shots{grid-template-columns:1fr}}

/* RTL：品牌标识保持 LTR 构图（标志在左、字标在右），不随页面镜像 */
html[dir="rtl"] .brand{direction:ltr}
html[dir="rtl"] .brand-txt{text-align:left}
html[dir="rtl"] .footer .brand{direction:ltr}