/* ==========================================================================
   Tami Natural Home — Site Layer (2026-09-26)
   在 shared.css（A′ 设计系统）之上补齐：
   下拉导航 · 数据表 · FAQ 行 · 面包屑内层 · 内容区块 · RFQ 表单 · 页脚四栏
   设计令牌沿用 shared.css 的 :root，此处只加组件。
   ========================================================================== */

/* ---------------- 导航：下拉 ---------------- */
.nav-link { position: relative; }
.nav-link.active { color: var(--brand-red); }
.nav-link.active::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -6px;
  height: 2px; background: var(--brand-red);
}
.nav-drop { position: relative; }
.nav-drop-btn {
  font-family: var(--font-nav); font-size: .72rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 1px; color: var(--secondary);
  display: inline-flex; align-items: center; gap: 6px; transition: color .2s;
}
.nav-drop:hover .nav-drop-btn { color: var(--brand-red); }
.caret {
  width: 0; height: 0; border-left: 4px solid transparent;
  border-right: 4px solid transparent; border-top: 4px solid currentColor;
  opacity: .6;
}
.nav-drop-menu {
  position: absolute; top: calc(100% + 14px); left: 50%; transform: translateX(-50%) translateY(-6px);
  background: var(--white); border: 1px solid var(--border); min-width: 210px;
  padding: 8px 0; opacity: 0; visibility: hidden; transition: all .22s ease;
  box-shadow: 0 18px 40px -22px rgba(0,0,0,.35); z-index: 1000;
}
.nav-drop-menu::before {
  content: ''; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.nav-drop:hover .nav-drop-menu {
  opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);
}
.nav-drop-menu a {
  display: block; padding: 9px 22px; font-family: var(--font-nav);
  font-size: .7rem; font-weight: 500; text-transform: uppercase;
  letter-spacing: .8px; color: var(--text); transition: all .18s;
}
.nav-drop-menu a:hover { background: var(--bg-soft); color: var(--brand-red); padding-left: 26px; }

.mob-group { font-weight: 600 !important; color: var(--brand-red) !important; }
.mob-sub { padding-left: 26px !important; font-size: .82rem !important; }

/* ---------------- 面包屑 ---------------- */
.breadcrumb {
  background: var(--bg-soft); border-bottom: 1px solid var(--border-light);
  padding: 0;
}
.breadcrumb-inner {
  max-width: 1200px; margin: 0 auto; padding: 14px 32px;
  font-family: var(--font-nav); font-size: .7rem; letter-spacing: .6px;
  text-transform: uppercase; color: var(--text-muted);
}
.breadcrumb-inner a { color: var(--text-muted); transition: color .2s; }
.breadcrumb-inner a:hover { color: var(--brand-red); }
.crumb-sep { margin: 0 9px; opacity: .45; }
.crumb-cur { color: var(--secondary); font-weight: 600; }

/* ---------------- 内容区块 ---------------- */
.content-sec { padding: 56px 32px; max-width: 1200px; margin: 0 auto; }
.content-sec + .content-sec { padding-top: 8px; }
.sec-h2 {
  font-family: var(--font-display); font-size: clamp(1.35rem, 2.4vw, 1.85rem);
  font-weight: 700; line-height: 1.28; color: var(--secondary);
  margin-bottom: 14px; letter-spacing: -.2px;
}
.sec-h2 strong { font-weight: 700; }
.sec-lead {
  font-size: 1rem; line-height: 1.78; color: var(--text);
  max-width: 860px; margin-bottom: 22px;
}
.sec-lead strong { color: var(--secondary); font-weight: 600; }
.sec-lead code {
  font-family: ui-monospace, Menlo, monospace; font-size: .86em;
  background: var(--bg-soft); padding: 1px 6px; border: 1px solid var(--border-light);
}

/* ---------------- 数据表 ---------------- */
.tbl-wrap { overflow-x: auto; margin: 6px 0 10px; }
.tbl {
  width: 100%; border-collapse: collapse; background: var(--white);
  border: 1px solid var(--border); font-size: .9rem;
}
.tbl thead th {
  background: var(--secondary); color: var(--white);
  font-family: var(--font-nav); font-size: .66rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 1.1px;
  text-align: left; padding: 14px 18px; white-space: nowrap;
}
.tbl tbody td {
  padding: 14px 18px; border-top: 1px solid var(--border-light);
  color: var(--text); line-height: 1.65; vertical-align: top;
}
.tbl tbody tr:nth-child(even) { background: #FBF8F4; }
.tbl tbody tr:hover { background: var(--bg-soft); }
.tbl tbody td:first-child { color: var(--secondary); font-weight: 500; }
.tbl code {
  font-family: ui-monospace, Menlo, monospace; font-size: .85em;
  background: var(--bg-soft); padding: 1px 5px; border: 1px solid var(--border-light);
}

/* ---------------- FAQ 折叠行 ---------------- */
.faq-list { max-width: 900px; }
.faq-row {
  border: 1px solid var(--border); background: var(--white);
  margin-bottom: 10px; transition: border-color .2s;
}
.faq-row[open] { border-color: var(--brand-red); }
.faq-row summary {
  cursor: pointer; list-style: none; padding: 17px 22px;
  font-family: var(--font-display); font-size: .98rem; font-weight: 700;
  color: var(--secondary); position: relative; padding-right: 52px;
}
.faq-row summary::-webkit-details-marker { display: none; }
.faq-row summary::after {
  content: '+'; position: absolute; right: 22px; top: 50%;
  transform: translateY(-50%); font-size: 1.3rem; font-weight: 400;
  color: var(--accent-rose); line-height: 1;
}
.faq-row[open] summary::after { content: '\2013'; }
.faq-row-body {
  padding: 0 22px 20px; font-size: .92rem; line-height: 1.78;
  color: var(--text);
}

/* ---------------- CTA 行 ---------------- */
.cta-row { display: flex; gap: 14px; flex-wrap: wrap; margin: 22px 0 6px; }

/* ---------------- RFQ 表单 ---------------- */
.rfq-sec { border-top: 1px solid var(--border-light); }
.rfq-form { max-width: 900px; }
.rfq-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 16px 20px; margin-bottom: 22px;
}
.rfq-wide { grid-column: 1 / -1; }
.rfq-field { display: flex; flex-direction: column; gap: 7px; }
.rfq-field span {
  font-family: var(--font-nav); font-size: .66rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted);
}
.rfq-field input, .rfq-field select, .rfq-field textarea {
  font-family: var(--font-body); font-size: .92rem; color: var(--secondary);
  background: var(--white); border: 1px solid var(--border);
  padding: 11px 14px; outline: none; transition: border-color .2s;
  border-radius: 0; width: 100%;
}
.rfq-field input:focus, .rfq-field select:focus, .rfq-field textarea:focus {
  border-color: var(--brand-red);
}
.rfq-note { font-size: .82rem; color: var(--text-muted); margin-top: 14px; }
.rfq-note.muted { opacity: .8; }

/* ---------------- 页脚四栏 ---------------- */
.footer-inner { grid-template-columns: 1.5fr 1.4fr 1.3fr 1.1fr; }
.foot-col h4 {
  font-family: var(--font-nav); font-size: .7rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.4px; color: var(--white);
  margin-bottom: 14px;
}
.foot-col p { font-size: .85rem; line-height: 1.85; color: rgba(255,255,255,.62); }
.foot-col a { color: rgba(255,255,255,.72); border-bottom: 1px solid rgba(255,255,255,.16); }
.foot-col a:hover { color: var(--accent-rose); border-bottom-color: var(--accent-rose); }
.foot-note { color: rgba(255,255,255,.4); font-size: .78rem; font-style: italic; }

/* ---------------- 首页 Hero 补充 ---------------- */
.hero-eyebrow { letter-spacing: 2.4px; }
.hero h1 { max-width: 900px; }

/* ---------------- 区块配图 ---------------- */
.sec-figure { margin: 4px 0 26px; overflow: hidden; }
.sec-figure img {
  width: 100%; height: clamp(240px, 34vw, 420px); object-fit: cover;
  display: block;
}

/* ---------------- 证书展示区 ---------------- */
.cert-gallery {
  display: grid; grid-template-columns: 1fr 1fr 0.9fr; gap: 22px;
  margin: 8px 0 10px;
}
.cert-card {
  background: var(--white); border: 1px solid var(--border);
  display: flex; flex-direction: column; overflow: hidden;
}
.cert-img {
  background: #F7F4EF; border-bottom: 1px solid var(--border-light);
  display: flex; align-items: center; justify-content: center;
  padding: 14px; height: 320px;
}
.cert-img img {
  max-width: 100%; max-height: 100%; width: auto; height: auto;
  object-fit: contain; box-shadow: 0 4px 18px -8px rgba(0,0,0,.3);
}
.cert-meta { padding: 18px 20px 22px; flex: 1; }
.cert-meta h4 {
  font-family: var(--font-display); font-size: 1rem; font-weight: 700;
  color: var(--secondary); margin-bottom: 8px;
}
.cert-meta p { font-size: .82rem; line-height: 1.72; color: var(--text-muted); }
.cert-card-info {
  background: var(--bg-soft); justify-content: center;
}
.cert-badge-lg {
  font-family: var(--font-nav); font-size: 1.5rem; font-weight: 700;
  letter-spacing: 3px; color: var(--brand-red); text-align: center;
  padding: 44px 20px 26px;
}

/* ---------------- 清单 ---------------- */
.item-list { max-width: 900px; }
.item-list li {
  position: relative; padding: 11px 0 11px 26px;
  border-bottom: 1px solid var(--border-light);
  font-size: .95rem; color: var(--text);
}
.item-list li::before {
  content: ''; position: absolute; left: 4px; top: 20px;
  width: 6px; height: 6px; background: var(--accent-rose);
}

/* ---------------- 响应式 ---------------- */
@media (max-width: 1024px) {
  .nav-links { display: none; }
  .nav-toggle { display: flex; flex-direction: column; gap: 5px; }
  .footer-inner { grid-template-columns: 1fr 1fr; }
  .cert-gallery { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .content-sec { padding: 40px 22px; }
  .rfq-grid { grid-template-columns: 1fr; }
  .footer-inner { grid-template-columns: 1fr; }
  .breadcrumb-inner { padding: 12px 22px; font-size: .64rem; }
  .tbl { font-size: .84rem; }
  .tbl thead th, .tbl tbody td { padding: 11px 13px; }
}

/* ==========================================================================
   站点层修补 A（2026-09-26）
   ========================================================================== */

/* ---------------- 1. Logo 深底版：修正资源路径 ----------------
   shared.css 写死 url('../images/logo-dark-bg.png')，那是 _s1/css/ 的相对路径。
   本站 CSS 位于 site/assets/css/，正确路径为 ../img/。此处覆盖。 */
.nav-logo {
  background: url('../img/logo-dark-bg.png') no-repeat left center;
  background-size: contain;
  width: 164px; height: 42px;
}
.nav-logo img { opacity: 0; }

/* ---------------- 2. 首页实参数带（stat band） ---------------- */
.stat-band {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: var(--bg-soft);
  border: 1px solid var(--border);
  margin: 0 auto;
  max-width: 1100px;
}
.stat-cell {
  padding: 26px 16px;
  text-align: center;
  font-family: var(--font-display);
  font-size: 1.08rem;
  line-height: 1.5;
  font-weight: 700;
  color: var(--secondary);
  border-left: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
}
.stat-cell:first-child { border-left: none; }

/* 首页首个内容区块内的 stat band 上下留白 */
.content-sec > .stat-band { margin: 26px auto 6px; }

/* ---------------- 3. 区块序号（01 / 02 …） ----------------
   行内小号序号 + 细横线分隔：01 —— 厂内实拍
   坑：不要用 flex/baseline 对齐，inline-block 在 flex 容器里会脱基线飘高。 */
.sec-num {
  font-family: var(--font-nav);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--accent-rose);
  margin-right: 10px;
}
.sec-num::after {
  content: '';
  display: inline-block;
  width: 20px; height: 1px;
  background: var(--border);
  vertical-align: middle;
  margin-left: 10px;
}

/* ---------------- 4. 表格内链接 ---------------- */
.tbl a {
  color: var(--brand-red);
  text-decoration: none;
  border-bottom: 1px solid var(--brand-red-light);
  transition: border-color .2s;
}
.tbl a:hover { border-bottom-color: var(--brand-red); }
.tbl tbody tr:hover { background: var(--bg-soft); }

/* 多品类单元格内的分隔符（Hub-and-Spoke） */
.cat-sep { color: var(--accent-rose); margin: 0 1px; }

@media (max-width: 1024px) {
  .stat-band { grid-template-columns: repeat(2, 1fr); }
  .stat-cell:nth-child(3) { border-left: none; }
  .stat-cell { border-top: 1px solid var(--border); }
  .stat-cell:nth-child(1), .stat-cell:nth-child(2) { border-top: none; }
}
@media (max-width: 560px) {
  .stat-band { grid-template-columns: 1fr; }
  .stat-cell { border-left: none; border-top: 1px solid var(--border); }
  .stat-cell:first-child { border-top: none; }
}


/* ===== PRODUCT WALL (2026-09-26) =====
   品类页/首页「产品墙」—— 产品图网格。所有颜色走令牌，换主题自动跟随。 */
.prod-wall{ margin:28px 0 10px; }
.prod-wall-tag{
  display:inline-block; margin:0 0 16px;
  font-size:12px; line-height:1; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent-rose,#C4956A);
}
.prod-grid{
  display:grid; gap:16px;
  grid-template-columns:repeat(auto-fill,minmax(168px,1fr));
}
.prod-card{
  margin:0; position:relative; overflow:hidden;
  aspect-ratio:1/1; border-radius:16px; background:#fff;
  box-shadow:0 0 0 1px rgba(35,31,32,.08), 0 3px 12px -8px rgba(35,31,32,.18);
  transition:transform .35s cubic-bezier(.2,.7,.25,1), box-shadow .35s;
}
.prod-card img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .6s cubic-bezier(.2,.7,.25,1);
}
.prod-card:hover{
  transform:translateY(-5px);
  box-shadow:0 0 0 1px rgba(35,31,32,.10), 0 20px 40px -16px rgba(35,31,32,.30);
}
.prod-card:hover img{ transform:scale(1.045); }
.prod-sec{ padding-top:6px; }
@media (max-width:900px){
  .prod-grid{ grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:12px; }
}
@media (max-width:560px){
  .prod-grid{ grid-template-columns:repeat(2,1fr); gap:11px; }
  .prod-card{ border-radius:13px; }
}
/* ===== /PRODUCT WALL ===== */

/* ==========================================================================
   REDESIGN s2 · 意式编辑奢华（2026-09-26 · 第 108 轮）
   老板选定方向：参考 Intercos —— 满屏色场 + 巨标题 + 编号章节 + 金色点缀。
   🔴 图片规则：一个产品一个套图（.pset），同产品多图成组出现，绝不跨产品拼图。
   🔴 本层同时承担结构与配色（单一风格，不再做 D/E/F 多套）。
   ========================================================================== */
:root{
  /* 色板 · 意式编辑奢华 */
  --wine:#5E0B2E; --wine2:#7A1040; --deep:#2B0821; --deep2:#1A0513;
  --gold:#D8B98A; --gold2:#B9975F; --gold-ink:#8A6A32;
  --paper:#FFFDFA; --cream:#FBF6F1; --blush:#F3E8E0;
  --ink:#1A0A12; --ink2:#5C4450; --ink3:#7E6875;
  --rule:#E6DACB; --rule2:#D9C9B6;
  --white:#FFFFFF;
  /* 兼容旧令牌名（结构层曾用） */
  --brand-red:var(--wine); --accent2:var(--wine2); --warm:var(--gold-ink);
  --accent2Ink:var(--wine2); --warmInk:var(--gold-ink); --accentInk:var(--wine);
  --secondary:var(--deep); --bg-soft:var(--cream); --text:var(--ink);
  --text-muted:var(--ink2); --border:var(--rule);
  --heroA:var(--wine2); --heroB:var(--deep);
  --font-display:'Inter','Helvetica Neue',Arial,'PingFang SC','Microsoft YaHei',sans-serif;
  --font-body:var(--font-display);
  --serif:Georgia,'Times New Roman','Songti SC','SimSun',serif;
}

/* ---------- 基础 ---------- */
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--font-body); font-size:16px; line-height:1.75;
  -webkit-font-smoothing:antialiased; letter-spacing:-.003em;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4,p,figure{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }
.muted{ color:var(--ink3); }
.fade-in{ animation:fadeUp .8s cubic-bezier(.2,.7,.2,1) both; }
.fade-in-delay-1{ animation-delay:.12s; }
@keyframes fadeUp{ from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:none} }
@media (prefers-reduced-motion:reduce){ .fade-in{animation:none} html{scroll-behavior:auto} }

/* ---------- 导航 ---------- */
.nav{
  position:sticky; top:0; z-index:60;
  background:rgba(255,253,250,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--rule);
}
.nav-inner{
  max-width:1280px; margin:0 auto; padding:0 44px; height:74px;
  display:flex; align-items:center; gap:32px;
}
.nav-logo img{ height:30px; }
.nav-links{ display:flex; align-items:center; gap:26px; flex:0 1 auto; min-width:0; }
.nav-links > a, .nav-drop-btn{
  font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; white-space:nowrap;
  color:var(--ink2); font-weight:500; background:none; border:0; cursor:pointer;
  font-family:inherit; display:inline-flex; align-items:center; gap:6px;
}
.nav-links > a:hover, .nav-drop-btn:hover{ color:var(--wine); }
.caret{ width:5px; height:5px; border-right:1px solid currentColor; border-bottom:1px solid currentColor;
  transform:rotate(45deg) translateY(-2px); }
.nav-drop{ position:relative; }
.nav-drop-menu{
  position:absolute; top:calc(100% + 14px); left:-18px; min-width:230px;
  background:var(--paper); border:1px solid var(--rule); padding:12px 0;
  box-shadow:0 30px 60px -34px rgba(43,8,33,.55);
  opacity:0; visibility:hidden; transform:translateY(-6px); transition:.24s;
}
.nav-drop:hover .nav-drop-menu{ opacity:1; visibility:visible; transform:none; }
.nav-drop-menu a{ display:block; padding:9px 22px; font-size:.82rem; color:var(--ink2); }
.nav-drop-menu a:hover{ color:var(--wine); background:var(--cream); }
.nav-lang{ margin-left:auto; display:flex; align-items:center; gap:18px; }
.nav-lang a{ font-size:.72rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink3); white-space:nowrap; }
.nav-lang a:hover{ color:var(--wine); }
.nav-cta{
  padding:11px 18px; border:1px solid var(--gold2); color:var(--gold-ink); white-space:nowrap;
  font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600;
}
.nav-cta:hover{ background:var(--wine); border-color:var(--wine); color:#fff; }
/* 🔴🔴🔴 2026-09-27（第 126 轮 · 老板复报「手机还是打不开子页面」）——**真正根因在这**。
   第 125 轮修好了「点了没反应」（类名）和「不浮层」（position），
   但老板真机上**依然点不开** —— 因为汉堡按钮**触摸目标只有 34×25 px**（padding 仅 1px 6px）。
   Apple HIG / Google Material 的移动端最小触摸目标是 **44×44 px**；成人手指腹宽约 10 mm ≈ 38 px。
   ⇒ 老板手指**大概率点空**（尤其贴屏幕右边缘 + 单手 + 走路时）。
   headless 测试用 `.click()` 直接调 DOM 所以「全过」，**掩盖了真机问题** —— 教训：
   交互类验收不能只看「状态能不能变」，还要看「**人能不能点到**」。

   修法：视觉尺寸不变（三横线仍 22px 宽），用 `padding` 把**可点区域**撑到 ≥48×48，
   并保证已显示时 `box-sizing` 正确、`line-height:0` 消掉多余行高。 */
.nav-toggle{
  display:none; background:none; border:0; cursor:pointer;
  /* 🔴 触摸目标：48×48 最小（视觉仍居中，不撑大版式） */
  min-width:48px; min-height:48px; padding:13px; margin:-13px 0 -13px 0;
  box-sizing:border-box; line-height:0; align-items:center; justify-content:center;
  -webkit-tap-highlight-color:transparent;   /* 去掉 iOS 点击灰块 */
  touch-action:manipulation;                 /* 去掉 300ms 延迟 + 禁双击缩放 */
  position:relative; z-index:2;              /* 确保不被相邻元素吃掉点击 */
}
.nav-toggle span{ display:block; width:22px; height:1px; background:var(--ink); margin:5px 0; }
/* 🔴🔴 2026-09-27（第 125 轮 · 老板报「手机打开无法显示子页面」）——**手机端整站导航不可用**。
   两个叠加的 bug，缺一修都不好：
   ① 类名不匹配：`site.js` 里加的是 `.active`（`mobile.classList.toggle('active')`），
      而 CSS 写的是 `.nav-mobile.open` ⇒ 面板**永远 `display:none`** ⇒ 菜单点了没反应。
   ② 缺定位：`.nav-mobile` 是 `<nav>` 的**兄弟节点**、在文档流里。即使展开，它也只会把
      首页内容往下推（首页能滚到、子页面首屏看不到）⇒ 必须 `position:sticky/fixed` 浮起成覆盖面板。
   修法 = ① 选择器改 `.nav-mobile.active`（并**保留** `.open` 与 `[data-open]` 兜底，防将来改 JS 再踩）
         ② 手机端改 `position:fixed` 覆盖层（`top` 由 `.nav` 实测高度 `--navH` 决定）+ 可滚动
         ③ 桌面端务必仍是普通文档流（若不重置，桌面也会浮出来） */
.nav-mobile{
  display:none; border-top:1px solid var(--rule); background:var(--paper); padding:14px 0 22px;
}
.nav-mobile.active, .nav-mobile.open{ display:block; }
.nav-mobile a{ display:block; padding:11px 44px; font-size:.86rem; color:var(--ink2); }
.mob-group{ font-weight:600; color:var(--ink); }
.mob-sub{ padding-left:58px !important; font-size:.8rem !important; }
/* 面包屑等内页元素一并挪到面板之下 */
@media (max-width:1024px){
  body.nav-open .breadcrumb{ position:relative; z-index:45; }
  /* 🔴🔴 2026-09-27（第 126 轮）——**断点盲区修复**。
     浮层用的断点是 1024，而汉堡的 `display:flex` 原先写在 820 断点里
     ⇒ 820~1024px 之间（iPad 竖屏 / 横屏手机 / 部分安卓大屏）：
        **浮层逻辑已启用，但汉堡按钮是 display:none ⇒ 界面上根本没有入口**。
     现在把汉堡显隐统一到 1024，与 `.nav-mobile` 的浮层断点**严格一致**。 */
  .nav-links{ display:none; }
  .nav-toggle{ display:flex; }
}

/* ---------- 面包屑 ---------- */
.breadcrumb{ border-bottom:1px solid var(--rule); background:var(--paper); }
.breadcrumb-inner{
  max-width:1280px; margin:0 auto; padding:15px 44px;
  font-size:.72rem; letter-spacing:.12em; color:var(--ink3);
  display:flex; gap:10px; align-items:center; text-transform:uppercase;
}
.breadcrumb-inner a:hover{ color:var(--wine); }
.crumb-sep{ color:var(--rule2); }
.crumb-cur{ color:var(--wine); }

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:inherit; font-size:.76rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; cursor:pointer;
  padding:16px 34px; border:1px solid transparent; transition:.28s;
}
.btn-primary{ background:linear-gradient(100deg,var(--gold),var(--gold2)); color:var(--deep); }
.btn-primary:hover{ filter:brightness(1.08); transform:translateY(-1px); }
.btn-outline{ border-color:rgba(255,255,255,.5); color:#fff; }
.btn-outline:hover{ background:rgba(255,255,255,.1); border-color:var(--gold); color:var(--gold); }
.btn-large{ padding:18px 42px; }
.cta-row{ display:flex; gap:14px; flex-wrap:wrap; }

/* ---------- 首页 Hero：满屏深色色场 ---------- */
.hero{
  position:relative; overflow:hidden; color:#fff;
  background:linear-gradient(158deg,#7A1040 0%,var(--wine) 44%,var(--deep) 100%);
}
.hero::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(120% 78% at 80% 6%,rgba(216,185,138,.30),transparent 58%);
}
.hero-bg{ position:absolute; inset:0; }
.hero-split .hero-bg-mosaic{ opacity:.20; }
/* 🔴 mosa 里混着**白底产品图**，20% 不透明度压上去会变成一块块浅色砖；
   眉标（金色 0.68rem）正好落在上面 → 对比度不够。
   给 mosa 加一层「上深下散」的暗罩，只在文字区生效，不下压 Hero 后半段的渐变。 */
.hero-bg-mosaic::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg,
    rgba(43,8,33,.30) 0%, rgba(43,8,33,.68) 34%, rgba(94,11,46,.12) 64%, rgba(94,11,46,0) 100%);
}
.hero-mosaic{ max-width:1280px; margin:0 auto; padding:0 44px; }
.hm-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.hm-card{ margin:0; overflow:hidden; aspect-ratio:3/4; background:rgba(255,255,255,.06); }
.hm-card img{ width:100%; height:100%; object-fit:cover; }
.hm-2,.hm-5{ transform:translateY(-26px); }
.hm-cap{ display:none; }
.hero-inner{
  position:relative; z-index:2; max-width:1280px; margin:0 auto;
  padding:132px 44px 96px; text-align:center;
}
.hero-eyebrow{
  font-size:.68rem; letter-spacing:.42em; text-transform:uppercase;
  color:var(--gold); margin-bottom:34px;
}
.hero-inner h1{
  font-size:clamp(40px,6.4vw,88px); line-height:1.06; font-weight:600;
  letter-spacing:-.025em; max-width:19ch; margin:0 auto;
}
.hero-desc{
  font-size:.98rem; line-height:1.9; color:rgba(255,255,255,.78);
  max-width:62ch; margin:30px auto 0;
}
.hero-inner .cta-row{ justify-content:center; margin-top:44px; }

/* 内页 Hero */
.page-hero{ position:relative; overflow:hidden; color:#fff;
  background:linear-gradient(158deg,#7A1040 0%,var(--wine) 46%,var(--deep) 100%); }
.page-hero-bg{ position:absolute; inset:0; opacity:.9; }
.page-hero-inner{
  position:relative; z-index:2; max-width:1280px; margin:0 auto;
  padding:118px 44px 100px; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:64px; align-items:center;
}
.page-hero-copy h1{
  font-size:clamp(32px,4.2vw,58px); line-height:1.1; font-weight:600; letter-spacing:-.025em;
}
.hero-eyebrow + h1{ margin-top:0; }
.page-hero-lead{ font-size:.96rem; line-height:1.9; color:rgba(255,255,255,.78); margin-top:24px; max-width:54ch; }
.page-hero .cta-row{ margin-top:34px; }
.hero-art{ display:flex; align-items:center; justify-content:flex-end; }
.hero-art-nums{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px;
  background:rgba(255,255,255,.22); border:1px solid rgba(255,255,255,.22); width:100%; }
.hero-num{ background:rgba(26,5,19,.35); padding:26px 22px; }
.hero-num b{ display:block; font-size:1.5rem; font-weight:300; letter-spacing:-.03em;
  color:var(--gold); font-variant-numeric:tabular-nums; }
.hero-num span{ display:block; font-size:.75rem; color:rgba(255,255,255,.68); margin-top:9px; }
.hero-art-nums > .hero-num:last-child:nth-child(odd){ grid-column:1 / -1; }   /* 奇数条：末格横跨，不留空格子 */
/* 关键参数短列表（替代原来的右侧产品图 · 2026-09-26 老板指令） */
.hero-art-facts{ display:block; width:100%; max-width:420px; }
.hero-fact{ padding:24px 0; border-top:1px solid rgba(255,255,255,.18); }
.hero-fact:first-child{ border-top:0; padding-top:0; }
.hero-fact:last-child{ padding-bottom:0; }
.hero-fact b{ display:block; font-size:clamp(20px,2.1vw,30px); font-weight:300;
  letter-spacing:-.03em; line-height:1.25; color:var(--gold); font-variant-numeric:tabular-nums; }
.hero-fact span{ display:block; margin-top:10px; font-size:.7rem; font-weight:400;
  letter-spacing:.24em; text-transform:uppercase; color:rgba(255,255,255,.66); }
/* 🔴 2026-09-27 联系页 Hero 邮箱卡（老板指令 ⑧）：值若是邮箱 → 渲染器自动加 mailto + is-mail。
   ① 链接继承金色、用一条淡金细下划线示意可点（符合全站「细金线」语汇）；
   ② is-mail 用更小字号（22 字符长串），且允许断行 —— 实测最紧的是 ≤1080 的 3 列布局
      （900px 时单格内容宽仅 ~234px），必须留余量，否则邮箱会撑破格宽。
   ③ `.hero-fact b.is-mail`（0,2,1）特异性高于 `.hero-fact b`（0,1,1）与其媒体查询版本，
      因此各断点均生效，不需要重复声明。 */
.hero-fact b a{ color:inherit; text-decoration:none; border-bottom:1px solid rgba(216,185,138,.42); }
.hero-fact b a:hover{ border-bottom-color:var(--gold); }
.hero-fact b.is-mail{ font-size:clamp(17px,1.9vw,26px); letter-spacing:-.035em; overflow-wrap:anywhere; }

/* ---------- 内容区 / 章节头 ---------- */
.content-sec{ max-width:1280px; margin:0 auto; padding:92px 44px 0; }
.content-sec:last-of-type{ padding-bottom:96px; }
.sec-h2{
  font-size:clamp(24px,2.9vw,40px); line-height:1.18; font-weight:600;
  letter-spacing:-.024em; margin-bottom:30px;
}
.sec-num{
  display:block; font-size:.68rem; font-weight:600; letter-spacing:.3em;
  color:var(--gold-ink); text-transform:uppercase; margin-bottom:16px;
}
.sec-num::after{ content:" —"; opacity:.7; }
.sec-lead{ font-size:.96rem; line-height:1.9; color:var(--ink2); max-width:76ch; margin-bottom:34px; }

/* ---------- 厂区卡片 ---------- */
/* 🔴 细线网格的正确画法：容器**不能用 rule 色铺底**——行数不满时，
   空格子会把底色漏出来，变成一大块莫名的米色方块（踩过）。
   改用「容器 paper 底 + 细边框 + 每格 inset 阴影画右下两条线」。
   这样空格子 = 纸面，与页面融为一体。 */
.zone-list{ display:grid; grid-template-columns:repeat(auto-fill,minmax(292px,1fr)); gap:0;
  background:var(--paper); border:1px solid var(--rule); border-width:1px 0 0 1px; }
.zone-item{ background:var(--paper); padding:30px 28px 32px;
  box-shadow:inset -1px -1px 0 0 var(--rule); }
.zone-item h3{ font-size:1.02rem; font-weight:600; margin-bottom:12px; }
.zone-item h3::before{ content:""; display:block; width:26px; height:2px;
  background:linear-gradient(90deg,var(--gold),var(--gold2)); margin-bottom:16px; }
.zone-item p{ font-size:.88rem; line-height:1.8; color:var(--ink2); }
/* ===== FACILITY PHOTOS v112 起 ===== */
/* ---------- 厂区构成 · 实拍配图（第 112 轮 · 老板令「可以放照片」） ----------
   🔴 107 轮全站撤图的原因是「**裁切效果与实际差距过大**」，不是合规问题。
      本轮只在 /factory 的「01 厂区构成」解禁，并从根上解决裁切：
      配图**事先按目标比例一次裁到位**（单一真源 = `r512_fac_build_assets.py` 的 CROP 表），
      站上只做 `aspect-ratio` + `object-fit:cover` → **比例相同 ⇒ 不会再有第二次裁切**。
   🔴 112 轮补（老板令「仓库图放一张大图，尺寸和第一张图保持一致」）：
      仓储由「深酒红数据带」升级为**通栏大图** —— 取景 = 厂方原片 IMG_0544
      （成品仓：纸箱托盘规整堆垛 · 箱贴越南文产品规格 · 零第三方品牌），
      2400×1021 与厂区外观**完全同尺寸**（同一个 .fac-band 类）。 */
.fac-band{ margin:0 0 30px; }
.fac-band img{ width:100%; aspect-ratio:2.35/1; object-fit:cover; display:block; }
.fac-band figcaption{ display:flex; align-items:baseline; gap:10px 20px; flex-wrap:wrap;
  padding-top:12px; margin-top:14px; border-top:1px solid var(--rule); }
.fac-band figcaption b{ font-size:.74rem; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--wine); }
.fac-band figcaption span{ font-size:.82rem; color:var(--ink2); }

.zone-list--photo{ grid-template-columns:1fr 1fr; margin-bottom:30px; }
.zone-item--fig{ padding:0; display:flex; flex-direction:column; }
.zone-fig{ margin:0; overflow:hidden; }
.zone-fig img{ width:100%; aspect-ratio:16/9; object-fit:cover; display:block;
  transition:transform 520ms ease; }
.zone-item--fig:hover .zone-fig img{ transform:scale(1.03); }
.zone-body{ padding:26px 28px 30px; }

.zone-item--stat{ grid-column:1 / -1; box-shadow:none; background:var(--wine);
  display:flex; align-items:center; justify-content:space-between; gap:36px;
  padding:30px 34px; }
.zone-item--stat h3{ color:var(--paper); }
.zone-item--stat p{ color:rgba(255,253,250,.78); margin:0; }
.zone-stat-nums{ display:flex; gap:46px; flex-shrink:0; }
.zone-stat-nums b{ display:block; font-size:1.72rem; font-weight:300; letter-spacing:-.02em;
  line-height:1.1; color:var(--gold); font-variant-numeric:tabular-nums; }
.zone-stat-nums span{ display:block; margin-top:7px; font-size:.7rem; letter-spacing:.16em;
  text-transform:uppercase; color:rgba(255,253,250,.62); }
/* ===== /FACILITY PHOTOS v112 ===== */

/* ---------- 数据卡 ---------- */
.spec-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(212px,1fr)); gap:0;
  background:var(--paper); border:1px solid var(--rule); border-width:1px 0 0 1px; }
.spec-item{ background:var(--paper); padding:30px 24px;
  box-shadow:inset -1px -1px 0 0 var(--rule); }
.spec-item-num{ display:flex; flex-direction:column; gap:10px; }
.spec-big{ font-size:1.62rem; font-weight:300; letter-spacing:-.03em; line-height:1.1;
  color:var(--wine); font-variant-numeric:tabular-nums; }
.spec-lab{ font-size:.79rem; line-height:1.55; color:var(--ink3); }

/* ---------- 产品套图（一个产品一个套图） ---------- */
.prod-wall{ margin-top:6px; }
.prod-sec{
  background:var(--cream); margin-top:96px; padding:92px 0;
  box-shadow:0 0 0 100vmax var(--cream); clip-path:inset(0 -100vmax);
}
.prod-sec .prod-wall{ max-width:1280px; margin:0 auto; padding:0 44px; }
.prod-wall-tag{
  font-size:.68rem; font-weight:600; letter-spacing:.3em; text-transform:uppercase;
  color:var(--gold-ink); margin-bottom:44px;
}
.pset-list{ display:flex; flex-direction:column; gap:56px; }
.pset{ display:grid; grid-template-columns:minmax(0,1fr) 306px; gap:42px; align-items:center; }
/* 🔴 flip 必须**同时反转列宽**：只写 order 的话，info 会落到「1fr」大列、
   媒体被塞进 306px 窄列 → 图变得特别小（踩过）。 */
.pset--flip{ grid-template-columns:306px minmax(0,1fr); }
.pset--flip .pset-media{ order:2; }
.pset--flip .pset-info{ order:1; }
/* 一个产品一行两格：主图 + 场景（同一产品成组，绝不跨产品拼图）。
   🔴 源图全部 2000×2000 正方 → 一律 aspect-ratio:1/1 + object-fit:cover，
      既保证两格等高不参差，也不会把产品两侧削掉（用 4/3 会削，踩过）。
   🔴 不加 figcaption：深色压条会糊住成品图底部。 */
.pset-media{ display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:start; }
/* 单图组（彩妆：每个产品只搜到 1 张干净成品图）。
   🔴 2026-09-27 修「图片过大」（老板反馈）：原 `grid-template-columns:1fr` 让单图
      **铺满整个媒体区**（>1080px 时 ≈852px），是套图单张（≈420px）的 **2 倍宽** → 视觉失衡。
      改为「**限宽到套图单张宽度 + 居中对齐**」：`calc(50% - 6px)` 里的 6px = 套图两列
      `gap:12px` 的一半 → 宽度与套图单张**精确相等**，且随容器自适应（无需硬编码 px）。 */
.pset--single .pset-media{ grid-template-columns:minmax(0,1fr); justify-items:center; }
.pset--single .pset-media > figure{ width:100%; max-width:calc(50% - 6px); }
.pset-hero, .pset-sub{ margin:0; overflow:hidden; background:var(--blush); aspect-ratio:1/1; }
.pset-hero img, .pset-sub img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .8s cubic-bezier(.2,.7,.2,1);
}
.pset:hover .pset-hero img{ transform:scale(1.04); }
.pset-sub:hover img{ transform:scale(1.05); }
.pset-info{ padding-right:6px; }
.pset-no{
  display:inline-block; font-size:.68rem; font-weight:600; letter-spacing:.3em;
  color:var(--gold-ink); padding-bottom:10px; border-bottom:1px solid var(--rule2);
  min-width:38px; margin-bottom:22px;
}
.pset-title{ font-size:clamp(20px,2.1vw,28px); font-weight:600; letter-spacing:-.022em; line-height:1.26; }
.pset-note{ font-size:.78rem; color:var(--ink3); margin-top:12px; letter-spacing:.06em; }
.pset-cta{
  display:inline-flex; align-items:center; gap:10px; margin-top:26px;
  font-size:.72rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--wine); border-bottom:1px solid var(--gold2); padding-bottom:5px;
}
.pset-cta i{ font-style:normal; transition:transform .3s; }
.pset-cta:hover i{ transform:translateX(5px); }

/* ---------- 列表 / 表格 ---------- */
.item-list{ border-top:1px solid var(--rule); max-width:960px; }
.item-list li{
  padding:19px 0 19px 30px; border-bottom:1px solid var(--rule);
  font-size:.92rem; line-height:1.8; color:var(--ink2); position:relative;
}
.item-list li::before{
  content:""; position:absolute; left:0; top:29px; width:12px; height:1px; background:var(--gold2);
}
.tbl-wrap{ overflow-x:auto; border:1px solid var(--rule); }
.tbl{ width:100%; border-collapse:collapse; font-size:.88rem; }
.tbl th{ background:var(--deep); color:#fff; text-align:left; padding:16px 20px;
  font-size:.72rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.tbl td{ padding:16px 20px; border-bottom:1px solid var(--rule); color:var(--ink2); vertical-align:top; }
.tbl tr:last-child td{ border-bottom:0; }
.tbl tr:nth-child(even) td{ background:var(--cream); }

/* ---------- 数据带 / 信任带 ---------- */
/* 🔴 数据带底色是**渐变**，没法用 `box-shadow:0 0 0 100vmax <c>` 铺满（渐变塞不进 shadow），
   所以用 ::before 铺 100vw。同时逐项压掉旧结构层遗留的 max-width:1100px / border /
   `margin:26px auto 6px`（那条是 (0,2,0)，必须用同等特异性的选择器覆盖）。
   🔴 .stat-cell 里必须是 `<b>数字</b><span>标签</span>` 两段：单串文本会继承旧层的
   `color:var(--secondary)`（=深酒红）→ 深色压深色，整条读不出来。 */
.stat-band,
.content-sec > .stat-band{
  position:relative; max-width:none; border:0; background:none;
  margin:96px 0 0; padding:66px 0 70px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:0;
  color:#fff;
}
.stat-band::before{
  content:""; position:absolute; top:0; bottom:0; left:50%;
  width:100vw; margin-left:-50vw; z-index:0;
  background:linear-gradient(120deg,var(--wine2),var(--deep));
}
.stat-band > .stat-cell{
  position:relative; z-index:1; display:block; text-align:center;
  padding:6px 26px; border:0; border-left:1px solid rgba(255,255,255,.18);
  font-family:inherit; font-weight:400; font-size:1rem; line-height:1.5; color:#fff;
}
.stat-band > .stat-cell:first-child{ border-left:0; }
.stat-band .stat-cell b{
  display:block; font-size:clamp(30px,3.6vw,54px); font-weight:200;
  letter-spacing:-.035em; line-height:1.04; color:var(--gold);
  font-variant-numeric:tabular-nums;
}
.stat-band .stat-cell span{
  display:block; margin-top:14px; font-size:.74rem; font-weight:400;
  letter-spacing:.24em; text-transform:uppercase; color:rgba(255,255,255,.72);
}
.trust-band{
  background:var(--deep); color:#fff; padding:34px 0;
  box-shadow:0 0 0 100vmax var(--deep); clip-path:inset(0 -100vmax);
}
/* 🔴 不要给整条加 text-transform:uppercase：内页信任条里混着「10,000 m² 厂区」，
   大写会把单位 m² 变成 M²（踩过）。字号/字距上提的只有条内的 <b> 段。 */
.trust-band-inner{
  max-width:1280px; margin:0 auto; padding:0 44px; display:flex;
  gap:16px 44px; justify-content:center; flex-wrap:wrap;
  font-size:.76rem; letter-spacing:.1em;
}
.trust-cell{ color:var(--gold); flex:0 0 auto; white-space:nowrap; }
.trust-cell b{ font-weight:600; letter-spacing:.16em; }
.trust-cell::before{ content:"—"; color:rgba(255,255,255,.36); margin-right:12px; }

/* ---------- 证书 ---------- */
.cert-gallery{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:26px; }
.cert-card{ background:var(--paper); border:1px solid var(--rule); overflow:hidden; }
.cert-img{ width:100%; aspect-ratio:4/3; object-fit:contain; background:var(--cream); padding:18px; }
.cert-card-info{ padding:22px 24px 26px; border-top:1px solid var(--rule); }
.cert-meta{ font-size:.78rem; letter-spacing:.1em; color:var(--ink3); }
.cert-badge-lg{ font-size:1.06rem; font-weight:600; color:var(--wine); }

/* ---------- 指路卡 ---------- */
.nx-row{ display:grid; grid-template-columns:repeat(auto-fill,minmax(252px,1fr)); gap:0;
  background:var(--paper); border:1px solid var(--rule); border-width:1px 0 0 1px; }
.nx-card{ background:var(--paper); padding:32px 30px 34px; transition:.28s;
  box-shadow:inset -1px -1px 0 0 var(--rule); }
.nx-card:hover{ background:var(--cream); }
.nx-card b{ display:block; font-size:1.06rem; font-weight:600; color:var(--ink); }
.nx-card span{ display:block; font-size:.84rem; color:var(--ink2); margin-top:10px; }
.nx-card i{ display:inline-block; margin-top:18px; font-style:normal; color:var(--gold-ink);
  transition:transform .3s; }
.nx-card:hover i{ transform:translateX(6px); }

/* ---------- FAQ ---------- */
.faq-list{ border-top:1px solid var(--rule); }
.faq-row{ border-bottom:1px solid var(--rule); }
.faq-row summary, .faq-row > b{ display:block; padding:22px 0; font-size:1rem; font-weight:600; cursor:pointer; }
.faq-row-body{ padding:0 0 24px; font-size:.9rem; line-height:1.85; color:var(--ink2); max-width:82ch; }

/* ---------- CTA 段 ---------- */
.cta-section{
  background:linear-gradient(120deg,var(--wine2),var(--deep)); color:#fff;
  margin-top:96px; padding:96px 0;
  box-shadow:0 0 0 100vmax transparent; clip-path:inset(0 -100vmax);
}
.cta-inner{ max-width:1280px; margin:0 auto; padding:0 44px; text-align:center; }
.cta-inner h2{ font-size:clamp(26px,3.2vw,46px); font-weight:600; letter-spacing:-.026em; }
.cta-inner .cta-row{ justify-content:center; margin-top:36px; }

/* ---------- 询价表单 ---------- */
.rfq-sec{ max-width:1280px; margin:0 auto; padding:0 44px; }
.rfq-form{ border:1px solid var(--rule); padding:38px 40px 42px; background:var(--cream); }
.rfq-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; }
.rfq-wide{ grid-column:1/-1; }
.rfq-field label{ display:block; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink3); margin-bottom:9px; }
.rfq-field input, .rfq-field textarea, .rfq-field select{
  width:100%; padding:13px 15px; border:1px solid var(--rule2); background:var(--paper);
  font-family:inherit; font-size:.92rem; color:var(--ink); }
.rfq-field input:focus, .rfq-field textarea:focus{
  outline:none; border-color:var(--wine); box-shadow:0 0 0 3px rgba(94,11,46,.09); }
.rfq-note{ font-size:.78rem; color:var(--ink3); margin-top:18px; }

/* ---------- 页脚 ---------- */
.footer{ background:var(--deep2); color:#fff; margin-top:0; padding:84px 0 40px; }
.footer-inner{ max-width:1280px; margin:0 auto; padding:0 44px;
  display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,2.5fr); gap:64px; }
.foot-col{ font-size:.84rem; line-height:2.15; color:rgba(255,255,255,.7); }
.foot-col a:hover{ color:var(--gold); }
.footer-inner > .foot-col:first-child{ font-size:.86rem; letter-spacing:.16em; font-weight:600;
  text-transform:uppercase; color:#fff; }
.footer-bottom{
  max-width:1280px; margin:64px auto 0; padding:26px 44px 0;
  border-top:1px solid rgba(255,255,255,.16); display:flex; justify-content:space-between;
  gap:24px; flex-wrap:wrap; font-size:.74rem; color:rgba(255,255,255,.5);
}
.foot-note{ font-size:.74rem; color:rgba(255,255,255,.5); }
.cat-sep{ color:rgba(255,255,255,.3); }

/* ---------- 响应式 ---------- */
/* 🔴🔴 手机/平板导航覆盖面板（第 125 轮修「手机打不开子页面」）
   为什么必须 `position:fixed`：`.nav-mobile` 是 `<nav>` 的兄弟节点、位于文档流。
   面板展开后若不加定位，它只会把首页内容往下推 —— 首页能滚到菜单，但子页面首屏看不到
   （老板就是在这个状态下报「只能打开首页，无子页面选项」）。
   `top` 用 `.nav` 的实测高度 `--navH`，避免与固定导航重叠。
   `body.nav-open` 由 site.js 在开合时切换。 */
@media (max-width:1024px){
  .nav{ position:sticky; top:0; z-index:60; }
  .nav-mobile{
    position:fixed; left:0; right:0; top:var(--navH, 64px); z-index:55;
    max-height:calc(100vh - var(--navH, 64px));
    overflow-y:auto; -webkit-overflow-scrolling:touch;
    border-bottom:1px solid var(--rule);
    box-shadow:0 18px 36px -18px rgba(26,5,19,.28);
  }
  .nav-mobile a{ padding-left:32px; }
  .nav-mobile .mob-sub{ padding-left:52px !important; }
  /* 面板展开时锁滚动，避免背景跟着滑动 */
  body.nav-open{ overflow:hidden; }
}
@media (max-width:1280px){
  .nav-inner{ gap:22px; padding:0 32px; }
  .nav-links{ gap:18px; }
  .nav-links > a, .nav-drop-btn{ font-size:.72rem; letter-spacing:.07em; }
  .nav-lang{ gap:14px; }
}
@media (max-width:1080px){
  .page-hero-inner{ grid-template-columns:1fr; gap:44px; padding:96px 32px 84px; }
  .hero-art{ justify-content:flex-start; }
  /* 单列后右侧文字块横排三格，避免右侧大片留白 */
  .hero-art-facts{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; max-width:none; }
  .hero-fact{ padding:0 22px; border-top:0; border-left:1px solid rgba(255,255,255,.18); }
  .hero-fact:first-child{ padding-left:0; border-left:0; }
  .hero-fact b{ font-size:clamp(18px,2.4vw,24px); }
  .pset{ grid-template-columns:1fr; gap:26px; }
  .pset--flip .pset-media, .pset--flip .pset-info{ order:0; }
  .pset-media{ grid-template-columns:1fr 1fr; }
  .stat-band, .content-sec > .stat-band{ grid-template-columns:repeat(2,1fr); padding:56px 0 60px; }
  .stat-band > .stat-cell:nth-child(3){ border-left:0; }
  .hm-grid{ grid-template-columns:repeat(3,1fr); }
  .hm-2,.hm-5{ transform:none; }
  .footer-inner{ grid-template-columns:1fr; gap:40px; }
}
@media (max-width:820px){
  .nav-inner, .breadcrumb-inner, .hero-mosaic, .hero-inner, .page-hero-inner,
  .content-sec, .prod-sec .prod-wall, .stat-band .stat-cell, .trust-band-inner,
  .cta-inner, .rfq-sec, .footer-inner, .footer-bottom{ padding-left:22px; padding-right:22px; }
  .nav-links{ display:none; }
  .nav-toggle{ display:flex; }
  .nav-lang{ margin-left:auto; }
  .zone-list, .spec-grid, .cert-gallery, .nx-row, .rfq-grid{ grid-template-columns:1fr; }
  .stat-band, .content-sec > .stat-band{ grid-template-columns:1fr; padding:50px 0 54px; }
  .stat-band > .stat-cell{ border-left:0; border-top:1px solid rgba(255,255,255,.18); padding:22px 0; }
  .stat-band > .stat-cell:first-child{ border-top:0; }
  .pset-media{ grid-template-columns:1fr 1fr; }
  .hero-inner{ padding-top:96px; padding-bottom:76px; }
  .hero-inner h1{ font-size:clamp(30px,9vw,46px); }
  .cta-row{ flex-direction:column; align-items:stretch; }
  .btn{ width:100%; }
  .trust-band-inner{ flex-direction:column; gap:14px; align-items:flex-start; }
  .footer-bottom{ flex-direction:column; gap:10px; }
  .zone-list--photo{ grid-template-columns:1fr 1fr; }
  .zone-item--stat{ flex-direction:column; align-items:flex-start; gap:22px; padding:26px 24px; }
}
@media (max-width:560px){
  .zone-list--photo{ grid-template-columns:1fr; }
  .zone-stat-nums{ gap:30px; }
  .zone-stat-nums b{ font-size:1.42rem; }
  .fac-band figcaption{ flex-direction:column; gap:5px; }
  .hm-grid{ grid-template-columns:repeat(2,1fr); gap:10px; }
  .hero-art-facts{ grid-template-columns:1fr; }
  .hero-fact{ padding:16px 0; border-left:0; border-top:1px solid rgba(255,255,255,.18); }
  .hero-fact:first-child{ padding-top:0; border-top:0; }
  .hero-fact b{ font-size:20px; }
  /* 🔴 窄屏单图放满：此时若仍限 `calc(50% - 6px)` 会只剩 ~230px（太小没意义）；
     套图两列不变（既有设计，不改）。 */
  .pset--single .pset-media > figure{ max-width:none; }
}
/* ===== /REDESIGN s2 ===== */