/* ===========================================================
   千佳机械 · 产品分类落地页组件（中/英/西/俄 共用）
   依赖 style.css 的设计令牌，不覆盖既有组件
   =========================================================== */

/* ---------- 系列切换条 ---------- */
.cbar{background:var(--paper-2);border-bottom:1px solid var(--line);position:relative;z-index:50}
.cbar-in{display:flex;align-items:stretch;gap:0;overflow-x:auto;scrollbar-width:none}
.cbar-in::-webkit-scrollbar{display:none}
.cbar a{
  position:relative;flex:0 0 auto;padding:15px 18px 14px;
  font-size:13px;letter-spacing:.02em;color:#4A575E;white-space:nowrap;
  border-bottom:2px solid transparent;transition:color .25s var(--ease),border-color .25s var(--ease);
}
.cbar a:hover{color:var(--ink)}
.cbar a.on{color:var(--ink);border-bottom-color:var(--copper);font-weight:600}
.cbar a em{font-style:normal;display:block;font-size:10px;letter-spacing:.14em;color:#9AA4A8;margin-top:3px;font-weight:400}
.cbar a.on em{color:var(--copper)}

/* ---------- 分类英雄区 ---------- */
.chero{background:var(--ink);color:#fff;position:relative;overflow:hidden;isolation:isolate}
.chero::before{
  content:"";position:absolute;inset:0;z-index:-1;
  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:84px 84px;
  mask-image:radial-gradient(95% 110% at 15% 0%,#000,transparent 72%);
  -webkit-mask-image:radial-gradient(95% 110% at 15% 0%,#000,transparent 72%);
}
.chero .in{padding:clamp(44px,5.6vw,76px) var(--pad) clamp(40px,4.6vw,60px)}
.chero .crumb{margin-bottom:22px}
.chero h1{font-size:clamp(27px,3.4vw,44px);line-height:1.22;letter-spacing:-.015em;margin:0 0 8px}
.chero .h1-sub{color:var(--copper);font-size:clamp(13px,1.2vw,15px);letter-spacing:.18em;text-transform:uppercase;margin:0 0 18px;font-weight:600}
.chero .lede{margin:0;color:#A6B3B9;max-width:70ch;font-size:15px;line-height:1.9}
.chero-tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:26px}
.chero-tags span{
  border:1px solid rgba(255,255,255,.18);padding:7px 13px;font-size:12px;letter-spacing:.04em;
  color:#C6D0D4;background:rgba(255,255,255,.03);
}
.chero-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.12);margin-top:34px;border:1px solid rgba(255,255,255,.12)}
.chero-facts div{background:var(--ink);padding:18px 20px}
.chero-facts b{display:block;font-size:22px;letter-spacing:-.01em;line-height:1.2;margin-bottom:5px}
.chero-facts small{display:block;font-size:11.5px;letter-spacing:.1em;color:#8B999F;text-transform:uppercase}
@media(max-width:820px){
  .chero-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------- 两栏骨架 ---------- */
.cshell{display:grid;grid-template-columns:minmax(0,1fr) 316px;gap:clamp(28px,4vw,60px);align-items:start}
@media(max-width:980px){.cshell{grid-template-columns:1fr}}
.ctitle{margin:0 0 6px;font-size:clamp(21px,2.2vw,28px);letter-spacing:-.01em;line-height:1.3}
.csub{color:var(--muted);font-size:13px;letter-spacing:.03em;margin:0 0 26px}
.csec{margin-bottom:clamp(40px,5vw,64px)}
.csec:last-child{margin-bottom:0}
.prose p{font-size:14.5px;line-height:1.95;color:#3C484E;margin:0 0 16px}
.prose p:last-child{margin-bottom:0}
.prose strong{color:var(--ink);font-weight:600}

/* ---------- 机型卡 ---------- */
.mcard{border:1px solid var(--line);background:var(--paper-2);margin-bottom:22px;display:grid;grid-template-columns:330px minmax(0,1fr)}
.mcard:last-child{margin-bottom:0}
.mcard-media{background:#F2F3F0;border-right:1px solid var(--line);display:flex;align-items:center;justify-content:center;padding:18px;min-height:200px}
.mcard-media img{width:100%;height:auto;display:block;mix-blend-mode:multiply}
.mcard-body{padding:clamp(20px,2.4vw,30px)}
.mcard-body h3{margin:0 0 6px;font-size:17px;line-height:1.4;letter-spacing:-.005em}
.mcard-model{display:inline-block;font-size:11px;letter-spacing:.16em;color:var(--copper);font-weight:600;margin-bottom:10px;text-transform:uppercase}
.mcard-desc{font-size:13px;line-height:1.85;color:var(--muted);margin:0 0 18px}
.mcard-foot{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.mlink{font-size:12.5px;letter-spacing:.04em;color:var(--copper);border-bottom:1px solid rgba(192,86,33,.35);padding-bottom:2px}
.mlink:hover{color:var(--copper-2);border-bottom-color:var(--copper-2)}
@media(max-width:860px){
  .mcard{grid-template-columns:1fr}
  .mcard-media{border-right:0;border-bottom:1px solid var(--line);max-height:240px;overflow:hidden}
  .mcard-media img{max-height:210px;width:auto}
}

/* ---------- 参数表 ---------- */
.pstable{width:100%;border-collapse:collapse;border:1px solid var(--line);background:var(--paper-2)}
.pstable caption{caption-side:top;text-align:left;font-size:10.5px;letter-spacing:.18em;color:var(--muted);padding:0 0 9px;text-transform:uppercase}
.pstable th,.pstable td{padding:10px 14px;font-size:12.8px;line-height:1.6;text-align:left;vertical-align:top;border-top:1px solid #EEF1EC}
.pstable tr:first-child th,.pstable tr:first-child td{border-top:0}
.pstable th{width:30%;color:#5C666B;font-weight:500;background:#FAFBF8;white-space:nowrap}
.pstable td{color:var(--ink);font-variant-numeric:tabular-nums}
.pstable .rt{display:block;font-size:10px;letter-spacing:.06em;color:var(--copper)}
.psnote{font-size:11.5px;color:#8B9599;line-height:1.8;margin:9px 0 0}
.nospec{border:1px dashed var(--line);background:#FBFCFA;padding:18px 20px;font-size:12.5px;line-height:1.85;color:var(--muted)}

/* ---------- 应用场景 ---------- */
.appgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
@media(max-width:760px){.appgrid{grid-template-columns:1fr}}
.appcard{background:var(--paper-2);padding:24px 24px 26px}
.appcard i{
  display:block;font-style:normal;font-size:11px;letter-spacing:.18em;color:var(--copper);
  font-weight:600;margin-bottom:11px;
}
.appcard b{display:block;font-size:14.5px;margin-bottom:9px;letter-spacing:-.005em}
.appcard p{font-size:12.8px;line-height:1.85;color:var(--muted);margin:0}

/* ---------- 选型要点 ---------- */
.wlist{counter-reset:w;list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.wlist li{
  counter-increment:w;position:relative;padding:20px 0 20px 58px;border-bottom:1px solid var(--line);
}
.wlist li::before{
  content:counter(w,decimal-leading-zero);position:absolute;left:0;top:21px;
  font-size:12px;letter-spacing:.1em;color:var(--copper);font-weight:600;font-variant-numeric:tabular-nums;
}
.wlist b{display:block;font-size:14.5px;margin-bottom:7px}
.wlist p{font-size:12.8px;line-height:1.85;color:var(--muted);margin:0}

/* ---------- 侧栏 ---------- */
.cside{position:sticky;top:78px}
.side-card{border:1px solid var(--line);background:var(--paper-2);padding:26px 24px}
.side-card--dark{background:var(--ink);border-color:var(--ink);color:#E6EDEF}
.side-card h4{margin:0 0 6px;font-size:15px;letter-spacing:-.005em}
.side-card p{font-size:12.5px;line-height:1.8;color:var(--muted);margin:0 0 18px}
.side-card--dark p{color:#98A6AC}
.side-card .btn{width:100%;justify-content:center}
.side-tel{font-size:20px;letter-spacing:-.01em;margin:0 0 4px;display:block;color:#fff}
.side-list{list-style:none;margin:16px 0 0;padding:16px 0 0;border-top:1px solid var(--line)}
.side-card--dark .side-list{border-top-color:rgba(255,255,255,.14)}
.side-list li{font-size:12.2px;line-height:1.7;color:#5C666B;padding:7px 0;display:flex;gap:9px}
.side-card--dark .side-list li{color:#A9B6BB}
.side-list li::before{content:"—";color:var(--copper);flex:0 0 auto}
.side-nav{margin-top:18px;border:1px solid var(--line);background:var(--paper-2)}
.side-nav h5{margin:0;padding:16px 20px;font-size:11px;letter-spacing:.16em;color:var(--muted);text-transform:uppercase;border-bottom:1px solid var(--line)}
.side-nav a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 20px;font-size:12.8px;color:#3C484E;border-bottom:1px solid #F0F2EE}
.side-nav a:last-child{border-bottom:0}
.side-nav a:hover{background:#FAFBF8;color:var(--copper)}
.side-nav a em{font-style:normal;font-size:11px;color:#A5AEB2;letter-spacing:.08em}
@media(max-width:980px){
  .cside{position:static;order:-1}
  .side-nav{display:none}
}

/* ---------- 页内询价条 ---------- */
.ccta{border:1px solid var(--line);background:var(--paper);padding:clamp(26px,3vw,40px);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center}
.ccta h3{margin:0 0 8px;font-size:clamp(17px,1.9vw,22px);letter-spacing:-.01em}
.ccta p{margin:0;font-size:12.8px;line-height:1.85;color:var(--muted);max-width:62ch}
@media(max-width:760px){.ccta{grid-template-columns:1fr}}

/* ---------- 语言切换 ---------- */
.nav a.lang.on-lang{color:var(--copper)}
.langbar{display:flex;gap:6px;align-items:center;font-size:11.5px;letter-spacing:.06em;color:#8B9599}
.langbar a{color:#5C666B;padding:3px 6px;border:1px solid transparent}
.langbar a:hover{color:var(--copper)}
.langbar a.on{color:var(--ink);border-color:var(--line);background:#fff;font-weight:600}
.chero .langbar a{color:#8B999F}
.chero .langbar a.on{color:#fff;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}

/* 多列参数表（系列多规格） */
.pstable thead th{width:auto;background:#F2F4F0;color:#3C484E;font-size:11.5px;letter-spacing:.04em;font-weight:600;white-space:nowrap}
.pstable thead th:first-child{background:#FAFBF8}
.pstable tbody th{font-size:12.2px}
@media(max-width:640px){
  .pstable th,.pstable td{padding:9px 11px;font-size:12px}
  .pstable th{width:36%}
}

/* 机型卡：参数表跨两列通栏 */
.mcard-spec{grid-column:1 / -1;padding:2px clamp(20px,2.4vw,30px) clamp(20px,2.4vw,28px)}
.mcard-spec .pstable caption{padding-top:0}
.mcard-media{min-height:230px}
.mcard-media img{max-height:300px;object-fit:contain}
@media(max-width:860px){
  .mcard-spec{padding:0 18px 20px}
}

/* ---------- 小屏适配 ---------- */
@media(max-width:760px){
  .topbar .wrap{flex-wrap:wrap;row-gap:3px;padding-top:6px;padding-bottom:6px;min-height:0}
  .topbar .tk{gap:10px;font-size:11.5px}
  .langbar{font-size:11px}
  .langbar a{padding:2px 4px}
  .chero h1{font-size:clamp(24px,6.4vw,32px)}
  .chero .lede{font-size:14px;line-height:1.8}
  .chero-facts b{font-size:18px}
  .chero-facts small{font-size:10.5px}
  .side-card{padding:22px 20px}
  .ccta{padding:22px 20px}
  .wlist li{padding-left:44px}
  .wlist li::before{top:20px}
}