/* ==========================================================================
   series.v2.css — 产品系列页改版（材料样本册 / Material Sample Book）
   覆盖根路径产品系列页的默认蓝白样式。
   设计立场：这不是电商列表，是一本来料样本册——放大展示真实材质纹理，
             用工业数据字体承载可核对的数字。
   ========================================================================== */

:root{
  --slab:#16181C;        /* 深石墨底 */
  --slab-2:#1C1F24;      /* 面板 */
  --slab-3:#23272D;      /* 悬停 */
  --vein:#C2A878;        /* 赭金：石材脉络，唯一强调色 */
  --vein-dim:#8C7A55;
  --chalk:#E9E5DD;       /* 粉笔白正文 */
  --dust:#918C80;        /* 灰褐次要文字 */
  --edge:#2C3037;        /* 分隔线 */
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}

/* ---- 基础重置（覆盖 block1 的浅色） ---- */
html{background:var(--slab);-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);
  font-size:15px;line-height:1.65;
  color:var(--chalk);
  background:var(--slab);
  margin:0;
}

/* ---- 顶部导航 ---- */
nav.top{
  background:var(--slab);
  border-bottom:1px solid var(--edge);
  padding:0 32px;
  height:64px;
  display:flex;align-items:center;gap:28px;
  position:sticky;top:0;z-index:50;
}
nav.top a{
  color:var(--dust);text-decoration:none;
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  font-weight:500;transition:color .18s ease;
}
nav.top a:hover{color:var(--vein);text-decoration:none}
nav.top a:first-child{
  color:var(--chalk);font-weight:700;font-size:15px;letter-spacing:0;
  text-transform:none;margin-right:auto;
}
nav.top a:first-child::before{
  content:'';display:inline-block;width:9px;height:9px;
  background:var(--vein);margin-right:10px;vertical-align:middle;
}

main{max-width:1320px;margin:0 auto;padding:0 32px 96px}

/* ---- Hero：左纹理大图 + 右标题与关键数据 ---- */
.slab-hero{
  display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:56px;align-items:end;
  padding:72px 0 56px;
  border-bottom:1px solid var(--edge);
}
.slab-hero__fig{margin:0;position:relative}
.slab-hero__fig img{
  width:100%;aspect-ratio:3/2;object-fit:cover;object-position:center;
  background:#0F1114;
  border:1px solid var(--edge);border-radius:2px;
  filter:saturate(.94) contrast(1.05);
}
.slab-hero__fig figcaption{
  margin-top:10px;font-family:var(--mono);font-size:10px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--dust);
  display:flex;justify-content:space-between;
}
.slab-hero__eyebrow{
  font-family:var(--mono);font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--vein);margin:0 0 18px;
}
.slab-hero h1{
  font-family:var(--sans);font-size:clamp(34px,5vw,58px);
  font-weight:700;letter-spacing:-.025em;line-height:1.02;
  color:var(--chalk);margin:0 0 8px;
}
.slab-hero__cn{
  font-size:17px;color:var(--dust);margin:0 0 28px;letter-spacing:.02em;
}
.slab-hero__lede{
  font-size:15.5px;line-height:1.72;color:#C9C4BA;
  max-width:56ch;margin:0 0 32px;
}
/* 价格带：横向条，长度按区间在全局中的相对位置编码 */
.priceband{
  border-top:1px solid var(--edge);border-bottom:1px solid var(--edge);
  padding:22px 0 20px;margin:0 0 22px;
}
.priceband__row{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.priceband__fig{
  font-family:var(--mono);font-size:34px;font-weight:500;
  color:var(--vein);letter-spacing:-.02em;line-height:1;
}
.priceband__unit{font-family:var(--mono);font-size:13px;color:var(--dust)}
.priceband__label{
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--dust);margin-left:auto;
}
.priceband__track{position:relative;height:2px;background:var(--edge);border-radius:2px}
.priceband__fill{position:absolute;inset:0 auto 0 0;background:var(--vein);border-radius:2px}
.priceband__tick{
  position:absolute;top:-4px;width:1px;height:10px;background:var(--vein-dim);
}
.slab-hero__facts{display:flex;gap:36px;flex-wrap:wrap}
.fact{min-width:0}
.fact__k{
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--dust);margin:0 0 5px;
}
.fact__v{font-size:16px;color:var(--chalk);font-weight:500;margin:0}

/* ---- 规格数据块：替代裸表格 ---- */
.slab-specs{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));
  gap:1px;background:var(--edge);
  border:1px solid var(--edge);margin:56px 0 0;
}
.slab-spec{background:var(--slab-2);padding:22px 24px}
.slab-spec dt{
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--dust);margin:0 0 9px;
}
.slab-spec dd{margin:0;font-size:16px;color:var(--chalk);font-weight:500;line-height:1.4}
.slab-spec dd .u{font-size:12px;color:var(--dust);font-weight:400;margin-left:3px}

/* ---- 纹理切片墙：签名元素 ---- */
.slab-wall{margin:80px 0 0}
.slab-wall__head{
  display:flex;align-items:baseline;gap:18px;
  padding-bottom:20px;border-bottom:1px solid var(--edge);margin-bottom:32px;
}
.slab-wall__head h2{
  font-size:22px;font-weight:600;letter-spacing:-.015em;
  color:var(--chalk);margin:0;
}
.slab-wall__count{
  font-family:var(--mono);font-size:12px;color:var(--vein);letter-spacing:.1em;
}
.slab-wall__hint{
  margin-left:auto;font-family:var(--mono);font-size:10px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--dust);
}
.slab-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(186px,1fr));
  gap:18px;
}
.swatch{
  display:block;text-decoration:none;color:inherit;
  background:var(--slab-2);border:1px solid var(--edge);border-radius:2px;
  overflow:hidden;transition:border-color .2s ease,transform .2s ease,background .2s ease;
}
.swatch:hover{
  border-color:var(--vein);background:var(--slab-3);
  transform:translateY(-2px);text-decoration:none;
}
.swatch:hover .swatch__img{transform:scale(1.06)}
.swatch__imgwrap{
  overflow:hidden;background:#101215;
  border-bottom:1px solid var(--edge);
}
.swatch__img{
  width:100%;aspect-ratio:1;object-fit:contain;
  padding:14px;transition:transform .35s cubic-bezier(.2,.7,.3,1);
  filter:saturate(.95) contrast(1.03);
}
.swatch__meta{padding:13px 14px 15px}
.swatch__sku{
  font-family:var(--mono);font-size:13.5px;letter-spacing:.06em;
  color:var(--chalk);display:block;
}
.swatch:hover .swatch__sku{color:var(--vein)}
.swatch__spec{
  font-family:var(--mono);font-size:10.5px;color:var(--dust);
  display:block;margin-top:4px;letter-spacing:.02em;
}

/* ---- 0 SKU 时 hero 收敛为单列 ---- */
.slab-hero:has(.slab-hero__body:only-child){grid-template-columns:1fr}
.slab-hero:has(.slab-hero__body:only-child) .slab-hero__body{max-width:72ch}

/* ---- 空状态 ---- */
.slab-empty{
  border:1px solid var(--edge);background:var(--slab-2);
  padding:34px 32px;margin:0;color:#C9C4BA;font-size:15px;line-height:1.7;
  max-width:62ch;
}
.slab-empty a{color:var(--vein);border-bottom:1px solid var(--vein-dim);text-decoration:none}
.slab-empty a:hover{color:#D8BE8C;border-bottom-color:#D8BE8C}

/* ---- 页脚 ---- */
.slab-foot{
  margin-top:80px;padding-top:28px;border-top:1px solid var(--edge);
  display:flex;gap:20px;flex-wrap:wrap;align-items:center;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--dust);
}
.slab-foot a{color:var(--dust);text-decoration:none;border-bottom:1px solid transparent}
.slab-foot a:hover{color:var(--vein);border-bottom-color:var(--vein);text-decoration:none}

/* ---- 响应式 ---- */
@media (max-width:1000px){
  .slab-hero{grid-template-columns:1fr;gap:34px;padding:48px 0 40px}
  .slab-specs{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
}
@media (max-width:640px){
  nav.top{height:auto;padding:14px 18px;gap:16px;flex-wrap:wrap}
  main{padding:0 18px 64px}
  .slab-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
  .slab-hero__facts{gap:24px}
  .slab-wall__hint{display:none}
}

/* ---- 键盘可达性 ---- */
a:focus-visible,button:focus-visible{
  outline:2px solid var(--vein);outline-offset:3px;border-radius:2px;
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  .swatch:hover{transform:none}
  .swatch:hover .swatch__img{transform:none}
}