@import "./tokens.css";
/* ==========================================================================
   国内独立商城 · 前台主样式（M7 设计系统重构）
   --------------------------------------------------------------------------
   设计基调：大方 · 美观 · 简洁
   主色：#0db083（品牌绿）
   规范：移动端优先、点击目标 ≥44px、LCP 友好（首图不懒加载）
   说明：类名保持与历史视图一致，仅重塑视觉表现，不影响既有功能。
   ========================================================================== */
:root{
  /* ── 品牌色阶 ── */
  --brand:#0db083;
  --brand-dark:#0a9b74;
  --brand-darker:#088a66;
  --brand-50:#f0faf7;
  --brand-100:#e7f6f1;
  --brand-200:#cdeee3;

  /* ── 中性色阶 ── */
  --text:#1f2329;
  --text-2:#3d4452;
  --bg:#ffffff;
  --bg-soft:#f6f8f9;
  --border:#eceff2;
  --border-strong:#e1e5ea;

  /* ── 状态色（--muted/--danger/--warn 已统一至 tokens.css）── */

  /* ── 圆角 / 阴影 / 间距 ── */
  --radius-sm:8px;
  --radius:12px;
  --radius-lg:16px;
  --radius-pill:999px;
  --shadow-sm:0 1px 2px rgba(16,24,40,.04), 0 1px 3px rgba(16,24,40,.06);
  --shadow:0 4px 16px rgba(16,24,40,.08);
  --shadow-lg:0 14px 40px rgba(16,24,40,.12);
  --maxw:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  color:var(--text);background:var(--bg);line-height:1.65;
  font-size:15px;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--brand-strong);text-decoration:none;transition:color .15s}
a:hover{color:var(--brand-strong)}
img{max-width:100%;height:auto}
h1,h2,h3,h4{font-weight:600;color:var(--text);line-height:1.35}

/* ───────────────────────── 头部导航 ───────────────────────── */
.site-header{
  position:sticky;top:0;z-index:40;
  background:rgba(255,255,255,.9);
  backdrop-filter:saturate(180%) blur(10px);
  -webkit-backdrop-filter:saturate(180%) blur(10px);
  border-bottom:1px solid var(--border);
}
.header-inner{
  /* 内容区与页面主体对齐：主体内容实宽 1180-40(main padding)-40(页容器padding)=1100，
     header 用 1180-40 盒宽 + 20px 自身 padding 达到同样的 1100 内容宽 */
  max-width:calc(var(--maxw) - 40px);margin:0 auto;
  display:flex;align-items:center;gap:14px;
  padding:0 20px;height:64px;
}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:18px;color:var(--text)}
.logo:hover{color:var(--text)}
.logo-mark{
  width:24px;height:24px;border-radius:8px;flex:none;
  background:linear-gradient(135deg,var(--brand),var(--brand-dark));
  box-shadow:var(--shadow-sm);position:relative;
}
.logo-mark::after{
  content:"";position:absolute;inset:6px;border-radius:4px;
  background:rgba(255,255,255,.9);
}
.logo-text{white-space:nowrap}
/* 后台「站点设置 → Logo 图片」配置了才渲染；高度与 .logo-mark 对齐 */
.logo-img{height:24px;width:auto;flex:none;object-fit:contain}
.footer-icp{margin-left:10px}

.site-nav{margin-left:6px}
.nav-list{list-style:none;display:flex;align-items:center;gap:2px}
.nav-list a{
  display:block;padding:9px 14px;font-size:15px;color:var(--text-2);
  border-radius:var(--radius-sm);transition:color .15s,background .15s;white-space:nowrap;
}
/* 英文站：标签更长，整体收窄字号/内边距，避免撑破 64px 头部 */
.lang-en .site-nav{margin-left:4px}
.lang-en .nav-list{gap:1px}
.lang-en .nav-list a{font-size:14px;padding:8px 10px}
.nav-list a:hover{color:var(--brand-strong);background:var(--brand-50)}
.nav-list a.on{color:var(--brand-strong);background:var(--brand-50);font-weight:600}

.header-tools{margin-left:auto;display:flex;align-items:center;gap:10px;flex:none}
/* 变体1：登录降为描边胶囊（站点主张免注册询价，实心绿留给转化动作） */
.header-cta{
  display:inline-flex;align-items:center;gap:6px;flex:none;
  height:36px;padding:0 14px;border-radius:var(--radius-pill);
  border:1px solid var(--border);background:#fff;
  color:var(--text-2);font-size:13.5px;font-weight:600;white-space:nowrap;
}
.header-cta:hover{border-color:var(--brand);color:var(--brand-strong)}
/* 变体1：意向单升为品牌浅底 + 绿徽标 */
.header-cart{
  display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;flex:none;
  border-radius:var(--radius-pill);background:var(--brand-50);
  color:var(--brand-strong);font-size:13.5px;font-weight:600;white-space:nowrap;text-decoration:none;
}
.header-cart:hover{background:var(--brand-100);color:var(--brand-strong)}
.cta-badge{
  min-width:18px;height:18px;padding:0 5px;border-radius:9px;
  background:var(--brand);color:#fff;font-size:11px;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;
}
/* 变体1：语言+币种合并为一个胶囊 combo（左语言右币种，中间分隔线） */
.header-combo{
  display:inline-flex;align-items:center;flex:none;
  border:1px solid var(--border);border-radius:var(--radius-pill);
  background:#fff;overflow:visible;
}
.header-combo .lang-switch{border-right:1px solid var(--border)}
.header-combo .lang-trigger,
.header-combo .cur-trigger{
  border:none;background:transparent;border-radius:0;
  height:34px;padding:0 10px;
}
/* ── 语言切换（M4.10 · 点击弹窗单选 · 确认后跳转）── */
.lang-switch{position:relative;display:inline-block;flex:none}
.lang-trigger{
  display:inline-flex;align-items:center;gap:5px;
  font-size:13px;line-height:1;padding:7px 10px;white-space:nowrap;
  border:1px solid var(--border);background:var(--bg);
  color:var(--text-2);border-radius:var(--radius-sm);cursor:pointer;
  transition:border-color .15s,color .15s,background .15s;
}
.lang-trigger:hover{border-color:var(--brand-strong);color:var(--brand-strong)}
.lang-trigger .cur-caret{font-size:10px;line-height:1;opacity:.7;margin-left:1px}
.lang-trigger-label{font-weight:600}
.lang-popup{
  position:absolute;top:calc(100% + 6px);right:0;z-index:60;
  min-width:150px;padding:6px;display:flex;flex-direction:column;gap:4px;
  border:1px solid var(--border);background:#fff;border-radius:var(--radius-sm);
  box-shadow:var(--shadow-lg);
}
.lang-popup[hidden]{display:none}
.lang-opt{
  display:flex;align-items:center;gap:8px;width:100%;text-align:left;
  font-size:13px;padding:8px 10px;border:1px solid transparent;
  background:transparent;color:var(--text-2);border-radius:var(--radius-sm);cursor:pointer;
  transition:border-color .15s,color .15s,background .15s;
}
.lang-opt:hover{border-color:var(--brand-strong);color:var(--brand-strong);background:var(--brand-50)}
.lang-opt.active{border-color:var(--brand-strong);color:#fff;background:var(--brand);font-weight:600}
.lang-opt.applied::after{content:"✓";margin-left:auto;font-weight:700;opacity:.9}
.lang-opt.active.applied::after{color:#fff}

/* ── 弹窗底部：取消 / 确定 ── */
.popup-foot{
  display:flex;gap:8px;justify-content:flex-end;align-items:center;
  padding:8px 4px 2px;margin-top:2px;border-top:1px solid var(--border);
}
.popup-foot .btn-ghost,
.popup-foot .btn-primary{
  flex:0 0 auto;padding:7px 16px;min-height:36px;font-size:13px;font-weight:600;
  border-radius:var(--radius-sm);cursor:pointer;line-height:1;
  transition:background .15s,border-color .15s,color .15s;
}
.popup-foot .btn-ghost{background:transparent;border:1px solid var(--border);color:var(--text-2)}
.popup-foot .btn-ghost:hover{border-color:var(--brand-strong);color:var(--brand-strong)}
.popup-foot .btn-primary{background:var(--brand);border:1px solid var(--brand);color:#fff}
.popup-foot .btn-primary:hover{background:var(--brand-dark);border-color:var(--brand-strong)}

/* 移动端汉堡（纯 CSS 切换） */
.nav-toggle{display:none}
.nav-burger{display:none}

/* ── 币种切换（M4.10 纯前端 · 点击弹窗单选）── */
.currency-switch{position:relative;display:inline-block;flex:none}
.cur-trigger{
  display:inline-flex;align-items:center;gap:5px;
  font-size:13px;line-height:1;padding:7px 10px;white-space:nowrap;
  border:1px solid var(--border);background:var(--bg);
  color:var(--text-2);border-radius:var(--radius-sm);cursor:pointer;
  transition:border-color .15s,color .15s,background .15s;
}
.cur-trigger:hover{border-color:var(--brand-strong);color:var(--brand-strong)}
.cur-trigger .cur-caret{font-size:10px;line-height:1;opacity:.7;margin-left:1px}
.cur-trigger-sym{font-weight:700}
.cur-popup{
  position:absolute;top:calc(100% + 6px);right:0;z-index:60;
  min-width:210px;padding:6px;display:flex;flex-direction:column;gap:4px;
  border:1px solid var(--border);background:#fff;border-radius:var(--radius-sm);
  box-shadow:var(--shadow-lg);
}
.cur-popup[hidden]{display:none}
.currency-switch .cur-btn{
  display:flex;align-items:center;gap:8px;width:100%;text-align:left;
  font-size:13px;padding:8px 10px;border:1px solid transparent;
  background:transparent;color:var(--text-1);border-radius:var(--radius-sm);cursor:pointer;
  transition:border-color .15s,color .15s,background .15s;
}
.currency-switch .cur-btn:hover{border-color:var(--brand-strong);color:var(--brand-strong);background:var(--brand-50)}
.currency-switch .cur-btn.active{border-color:var(--brand-strong);color:#fff;background:var(--brand);font-weight:600}
.cur-opt-sym{font-weight:700;flex:none}
.cur-opt-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cur-opt-code{font-size:11px;opacity:.7;flex:none}
.mprice{white-space:nowrap;font-variant-numeric:tabular-nums}

/* ───────────────────────── 转化通道 ───────────────────────── */
.contact-bar{
  display:flex;gap:12px;padding:16px;
  position:sticky;top:64px;background:var(--bg);z-index:20;
}
.btn-tel,.btn-primary{
  flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-height:48px;padding:13px 16px;border-radius:var(--radius);
  font-size:15px;font-weight:600;border:none;cursor:pointer;
}
.btn-tel{border:1px solid var(--brand);color:var(--brand-strong);background:var(--bg)}
.btn-tel:hover{background:var(--brand-50);color:var(--brand-strong)}
.btn-primary{background:var(--brand);color:#fff}
.btn-primary:hover{background:var(--brand-dark);color:#fff}

/* 🚨 询价型主转化按钮：我要询价（醒目，替代原先突出的电话/微信） */
.inquire-actions{display:flex;gap:12px;margin:18px 0 4px;flex-wrap:wrap}
.btn-inquire{
  flex:1;min-width:180px;padding:15px 24px;border:none;border-radius:var(--radius);
  background:var(--brand);color:#fff;font-size:17px;font-weight:700;cursor:pointer;
  box-shadow:0 6px 18px rgba(13,176,131,.28);transition:background .15s,transform .08s;
}
.btn-inquire:hover{background:var(--brand-dark)}
.btn-inquire:active{transform:translateY(1px)}
.btn-inquire:disabled{opacity:.6;cursor:not-allowed;box-shadow:none}
.btn-intent-ghost{
  display:inline-flex;align-items:center;gap:6px;padding:15px 20px;
  border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);
  color:var(--text-2);font-size:15px;font-weight:600;cursor:pointer;text-decoration:none;
}
.btn-intent-ghost:hover{border-color:var(--brand-strong);color:var(--brand-strong)}
.btn-intent-ghost .badge{
  display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;
  padding:0 5px;background:var(--brand);color:#fff;border-radius:9px;font-size:11px;font-weight:600;
}

/* 🚨 弱化的电话/微信入口（不抢主转化） */
.contact-mini{display:inline-flex;gap:14px;align-items:center;flex-wrap:wrap}
.mini-tel,.mini-wechat{
  display:inline-flex;align-items:center;gap:5px;padding:7px 12px;
  border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--bg);color:var(--text-2);font-size:14px;font-weight:600;cursor:pointer;
  text-decoration:none;line-height:1.3;
}
.mini-tel:hover,.mini-wechat:hover{border-color:var(--brand-strong);color:var(--brand-strong);background:var(--brand-50)}

/* ───────────────────────── 主体框架 ───────────────────────── */
main{max-width:var(--maxw);margin:0 auto;padding:12px 20px}
/* 🚨 原 .hero（圆角卡片式内嵌区块）已移除：
   首页 Hero 改为 .home-hero（全宽通栏），两者同名命中同一元素会打架 ——
   旧规则会给通栏加圆角/边框，且 padding 与新规则叠加。见 index.php 的 Hero 注释。 */

.how-to-order{margin-top:32px}
.how-to-order h2{font-size:20px;font-weight:700;margin-bottom:16px}
.steps{list-style:none;display:grid;gap:16px}
@media(min-width:768px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{
  border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;
  background:var(--bg);box-shadow:var(--shadow-sm);transition:box-shadow .2s,transform .2s;
}
.step:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.step-no{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:50%;background:var(--brand);color:#fff;
  font-size:14px;font-weight:700;margin-bottom:10px;
}
.step h3{font-size:16px;font-weight:600;margin-bottom:6px}
.step p{font-size:13px;color:var(--muted);line-height:1.7}

/* ───────────────────────── 商品详情 ───────────────────────── */
.product-detail h1{font-size:22px;font-weight:700;letter-spacing:-.01em;line-height:1.45}
.sub-title{color:var(--muted);font-size:13px;margin-bottom:14px}
.pd-brand{display:inline-flex;align-items:center;gap:8px;margin-bottom:8px;font-size:12px;color:var(--muted)}
.pd-brand span{background:var(--brand-50);color:var(--brand-strong);border-radius:4px;padding:2px 8px;font-weight:600}
.pd-brand strong{color:var(--text);font-size:13px;font-weight:600}
/* ── 详情页两栏布局（对齐天猫详情页）：
   左列 = 主图 → 参数表 → 详情长图；右列 = 商品信息（sticky 固定，不随左列高度滚动）
   🚨 左列必须 minmax(0,1fr)：grid 子项默认 min-width:auto 会把大图撑破栅格
   移动端单列，按 主图 → 商品信息 → 参数/详情 排序 */
.pd-layout{display:grid;grid-template-columns:1fr;gap:20px}
.pd-gallery{order:1;display:flex;flex-direction:column;gap:12px;min-width:0}
.pd-info{order:2;min-width:0}
.pd-extra{order:3;min-width:0}
@media(min-width:1024px){
  .pd-layout{grid-template-columns:minmax(0,1fr) 400px;gap:28px;align-items:start}
  .pd-gallery{grid-column:1;grid-row:1}
  .pd-extra{grid-column:1;grid-row:2}
  .pd-info{
    grid-column:2;grid-row:1 / span 2;   /* 贯穿两行：sticky 才有整列的滚动行程 */
    position:sticky;top:76px;            /* 64px 吸顶头 + 间距 */
    max-height:calc(100vh - 92px);       /* 信息栏高于视口时内部滚动，询价按钮永远可达 */
    overflow-y:auto;
    scrollbar-width:none;                /* 🚨 内部可滚但不显示滚动条（Windows 下那条很扎眼），
                                            滚轮/触摸板滚动不受影响 */
  }
  .pd-info::-webkit-scrollbar{display:none}
}
/* 缩略图滚条：移动端横排在下方；桌面竖排在左侧（对齐主流电商详情页） */
.pd-thumbs{
  display:flex;gap:10px;overflow-x:auto;padding-bottom:4px;
  scrollbar-width:thin;-webkit-overflow-scrolling:touch;
}
.pd-thumb{
  flex:0 0 auto;width:76px;height:76px;padding:0;cursor:pointer;
  background:#fff;border:2px solid var(--border);border-radius:8px;overflow:hidden;
  transition:border-color .15s;
}
.pd-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.pd-thumb:hover{border-color:var(--brand-200)}
.pd-thumb.is-active{border-color:var(--brand-strong)}
.pd-stage{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.pd-stage-img{display:block;width:100%;height:auto;max-height:560px;object-fit:contain;background:#fff}
@media(min-width:1024px){
  .pd-gallery{flex-direction:row;align-items:flex-start}
  .pd-thumbs{flex:0 0 84px;flex-direction:column;overflow-x:visible;overflow-y:auto;max-height:560px;padding-bottom:0}
  .pd-stage{flex:1;min-width:0}
}
/* ── 规格选择（多规格 / 每规格独立价）──
   选中项高亮 + 价格就地联动；选项本身带价，客户不必逐个点开看 */
.spec-picker{margin:16px 0 2px}
.spec-group{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:10px}
.spec-group-name{flex:0 0 56px;font-size:13px;color:var(--muted);line-height:42px}
.spec-options{display:flex;gap:8px;flex-wrap:wrap}
.spec-opt{display:flex;flex-direction:column;align-items:flex-start;gap:1px;
  min-height:44px;padding:5px 14px;cursor:pointer;font-size:14px;color:var(--text);
  background:#fff;border:1px solid var(--border-strong);border-radius:var(--radius-sm);transition:border-color .15s,color .15s}
.spec-opt:hover{border-color:var(--brand-strong)}
.spec-opt.is-active{border-color:var(--brand-strong);background:var(--brand-50);color:var(--brand-strong);box-shadow:inset 0 0 0 1px var(--brand)}
.spec-opt-val{line-height:1.35}
.spec-opt-price{font-size:12px;color:#d54941;line-height:1.35;font-weight:600}
.spec-opt.is-active .spec-opt-price{color:#d54941;font-weight:700}
.spec-range{font-size:12px;color:var(--muted);margin:6px 0 0}
/* ── 数量步进 ── */
.pd-qty{display:flex;align-items:center;gap:12px;margin:18px 0 6px}
.pd-qty-label{font-size:13px;color:var(--muted)}
/* 计量单位标签（分类管理可配）：数量步进右侧浅灰小标签 */
.pd-qty-unit{font-size:12px;color:var(--muted);background:var(--bg-soft);border-radius:4px;padding:3px 10px;white-space:nowrap}
.qty-stepper{display:inline-flex;align-items:center;border:1px solid var(--border-strong);border-radius:var(--radius-sm);overflow:hidden}
.qty-btn{
  width:36px;height:38px;border:none;background:var(--bg-soft);
  font-size:18px;line-height:1;cursor:pointer;color:var(--text-2);transition:background .15s,color .15s;
}
.qty-btn:hover{background:var(--brand-50);color:var(--brand-strong)}
.qty-input{
  width:64px;height:38px;border:none;text-align:center;font-size:14px;color:var(--text);
  border-left:1px solid var(--border);border-right:1px solid var(--border);
  -moz-appearance:textfield;
}
.qty-input:focus{outline:2px solid var(--brand-200);outline-offset:-2px}
.qty-input::-webkit-outer-spin-button,.qty-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
/* ── 服务 / 联系块（只放真实信息，不编造服务承诺）── */
.pd-service{margin:12px 0 4px;padding:12px 0 0;border-top:1px solid var(--border);font-size:13px}
.pd-service-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:5px 0}
.pd-service-k{color:var(--muted);white-space:nowrap}
.pd-service-v{color:var(--text);font-weight:600;text-align:right}
.pd-service-v a{color:var(--text);font-weight:600}
.price-box{
  display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;
  padding:14px 0;border-bottom:1px solid var(--border);
}
.ref-price{font-size:26px;color:#d54941;font-weight:700}
.price-note{font-size:12px;color:var(--muted)}

/* ── 规格参考价卡片（灰底价格卡 + 黄字口径提示）── */
.price-card{background:#f7f8fa;border-radius:var(--radius);padding:12px 14px;margin:14px 0}
.price-card-label{font-size:12px;color:var(--muted);margin-bottom:4px}
.price-card-main{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.price-to{font-size:16px;color:#d54941;font-weight:600}
.price-warn{display:inline-block;margin-top:6px;font-size:12px;color:#b45309;background:#fdf3d8;border-radius:4px;padding:2px 8px}
/* 品牌 tag + 产地（产地取自商品参数） */
.pd-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:12px;flex-wrap:wrap}
.pd-brand-tag{background:var(--brand-50);color:var(--brand-strong);border-radius:4px;padding:2px 8px;font-weight:600;font-size:12px}
.pd-origin{color:var(--muted)}
/* ── 详情页 tab（商品详情 / 商品参数 / 商品问答）──
   tab 条吸左列顶部；非当前 pane 靠 hidden 隐藏（内容仍在 HTML，爬虫可见） */
.pd-tabs{margin-top:24px}
.pd-tab-nav{
  display:flex;gap:4px;padding:6px 0;   /* tab 顶格居左，无左缩进 */
  overflow-x:auto;scrollbar-width:none;   /* 内容可滑但不出滚动条 */
  /* 🚨 吸顶：滚动离开视口时钉在吸顶头（.site-header）正下方，随时可切 tab（对齐天猫）。
     top 用 --header-h（JS 按 header 实际高度设置，移动端 header 可换行不止 64px） */
  position:sticky;top:var(--header-h,64px);z-index:30;
  background:var(--bg);
}
.pd-tab-nav::-webkit-scrollbar{display:none}
.pd-tab{
  appearance:none;background:none;border:0;cursor:pointer;
  padding:10px 16px;font-size:15px;color:var(--muted);
  border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;
}
.pd-tab:hover{color:var(--text)}
.pd-tab.is-active{color:var(--brand-strong);font-weight:600;border-bottom-color:var(--brand-strong)}
.pd-tab-pane{padding:14px 2px}
/* ── 商品详情富文本（tab 内）── */
.pd-detail h2{font-size:20px;font-weight:700;margin-bottom:14px}
.pd-detail-body{font-size:14px;line-height:1.8;color:var(--text-2)}
.pd-detail-body p{margin:0 0 12px}
/* 详情长图：块级居中纵排，间距小（多为整张切好的长图） */
.pd-detail-body img{display:block;max-width:100%;height:auto;margin:0 auto 10px;border-radius:var(--radius-sm)}
.pd-detail-body table{max-width:100%;border-collapse:collapse}
/* ── 参数顶部三格（产地/品牌/材质）：大值居中 + 灰色小标签，浅灰底圆角 ── */
.pd-param-hero{
  display:flex;background:var(--bg-soft);border-radius:var(--radius);padding:18px 8px;
}
.pd-param-hero-item{flex:1;min-width:0;text-align:center;padding:0 8px}
.pd-param-hero-item strong{
  display:block;font-size:17px;font-weight:700;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.pd-param-hero-item span{display:block;margin-top:6px;font-size:12px;color:var(--muted)}
/* ── 参数明细表：两列并排（每行两组键/值），无边框无行线 ── */
.params{width:100%;border-collapse:collapse;margin:16px 0 0}
.params th,.params td{
  border:0;padding:10px 8px;text-align:left;font-size:14px;vertical-align:top;
}
.params th{width:16%;background:none;font-weight:400;color:var(--muted)}
.params td{width:34%;color:var(--text-2)}
.contact-strip{
  display:flex;gap:16px;align-items:center;flex-wrap:wrap;
  padding:14px 16px;background:var(--brand-50);border-radius:var(--radius);margin:16px 0;
}

/* ───────────────────────── 问答 / 评价区块 ───────────────────────── */
/* 注：.customer-reviews / .review-item / .review-content / .review-meta
   的正式定义在下方「真实客户评价（M5）」区块，此处不再重复声明。 */
.product-questions{margin-top:32px}
.product-questions h2{
  font-size:20px;font-weight:700;margin-bottom:14px;
}
.qa-item{
  border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;margin-bottom:10px;
  background:var(--bg);transition:border-color .15s;
}
.qa-item:hover{border-color:var(--brand-200)}
.qa-item summary{
  cursor:pointer;font-size:15px;font-weight:600;min-height:24px;
}
.qa-answer{margin-top:8px;font-size:14px;color:var(--muted);line-height:1.8}
.ask-link{
  display:inline-flex;align-items:center;margin-top:8px;font-size:13px;min-height:36px;
}

/* ───────────────────────── 表单 ───────────────────────── */
.submit-form{max-width:640px;margin:0 auto}
/* 页面标题显式定级：原无规则回退浏览器默认 ≈32px，与全站页头（22–26px）不一致 */
.submit-form h1{font-size:24px;font-weight:700;letter-spacing:-.01em;margin-bottom:6px}
.submit-form .tip{font-size:14px;color:var(--muted);margin-bottom:22px}
.submit-form label{display:block;margin-bottom:18px;font-size:14px;color:var(--text-2)}
/* 字段分组卡片：降低长表单认知负荷（联系信息 / 需求信息） */
.submit-form .form-group,.my-form .form-group{
  border:1px solid var(--border);border-radius:var(--radius);
  padding:14px 18px 2px;margin-bottom:18px;min-width:0;
}
.submit-form .form-group legend,.my-form .form-group legend{
  font-size:14px;font-weight:700;color:var(--text);padding:0 6px;margin-left:-4px;
}
.submit-form input,.submit-form textarea{
  width:100%;padding:11px 14px;border:1px solid var(--input-border);
  border-radius:var(--radius);font-size:15px;min-height:46px;margin-top:6px;
  transition:border-color .15s,box-shadow .15s;
}
.submit-form input::placeholder,.submit-form textarea::placeholder{color:#aab2bd}
.submit-form input:focus,.submit-form textarea:focus{
  outline:none;border-color:var(--brand-strong);box-shadow:0 0 0 3px var(--brand-100);
}
/* 内联校验错误态：字段级红框 + 提示文案（Toast 之外的可定位反馈） */
.submit-form input.is-invalid,.submit-form textarea.is-invalid{
  border-color:var(--danger);box-shadow:0 0 0 3px rgba(207,50,49,.12);
}
.field-error{display:none;font-size:12px;color:var(--danger);margin-top:4px}
.field-error.show{display:block}
/* 🐛 修复：.submit-form input 通配规则曾把 .agree 里的复选框拉成宽/高 100%，
   导致勾选框脱离文字孤立成一行（见用户截图）；恢复为常规小勾选框。 */
.submit-form .agree input{
  width:18px;height:18px;min-height:0;padding:0;margin:2px 0 0;flex:none;
  accent-color:var(--brand-strong);
}
.usage-note{display:block;font-size:12px;color:var(--muted);margin-top:4px}
.optional{color:var(--muted);font-weight:400}
.btn-submit{
  width:100%;padding:14px;background:var(--brand);color:#fff;border:none;
  border-radius:var(--radius);font-size:16px;font-weight:600;min-height:50px;cursor:pointer;
  transition:background .15s;
}
.btn-submit:hover{background:var(--brand-dark)}
.btn-submit:disabled{opacity:.6;cursor:not-allowed}

/* ───────────────────────── 两栏布局：表单卡 + 须知面板（填补留白） ───────────────────────── */
.submit-form.submit-layout{
  max-width:1040px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 340px;
  gap:28px;
  align-items:start;
}
.submit-card{
  background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:30px 32px;box-shadow:var(--shadow-sm);
}
.submit-aside{
  background:var(--brand-50);border:1px solid var(--brand-100);
  border-radius:var(--radius-lg);padding:26px 24px;
  position:sticky;top:84px;
}
.aside-head{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.aside-head h2{font-size:17px;font-weight:700;color:var(--text)}
.aside-ico{width:34px;height:34px;border-radius:10px;background:var(--brand);color:#fff;display:grid;place-items:center;flex:none}
.aside-ico svg{width:20px;height:20px}
.steps{list-style:none;display:flex;flex-direction:column;gap:16px}
.steps li{display:flex;gap:12px;align-items:flex-start}
.step-no{flex:none;width:26px;height:26px;border-radius:50%;background:var(--brand-strong);color:#fff;display:grid;place-items:center;font-size:14px;font-weight:700}
.steps b{font-size:14px;color:var(--text);font-weight:600}
.steps p{font-size:13px;color:var(--muted);margin-top:2px;line-height:1.5}
.aside-divider{height:1px;background:var(--brand-100);margin:20px 0}
.trust{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:18px}
.trust li{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;color:var(--text-2);line-height:1.5}
.trust svg{flex:none;width:17px;height:17px;color:var(--brand-strong);margin-top:2px}
.aside-contact{background:#fff;border:1px solid var(--brand-100);border-radius:var(--radius);padding:14px 16px}
.aside-contact .ac-phone{font-size:18px;font-weight:700;color:var(--brand-strong)}
.aside-contact .ac-phone a{color:inherit}
.aside-contact .ac-line{font-size:13px;color:var(--text-2);margin-top:6px}
@media(max-width:880px){
  .submit-form.submit-layout{grid-template-columns:1fr;gap:20px}
  .submit-aside{position:static;order:2}
  .submit-card{padding:24px 20px}
}

/* ───────────────────────── 移动端底部固定（弱化入口） ───────────────────────── */
.mobile-bottom-bar{
  display:none;position:fixed;left:0;right:0;bottom:0;gap:8px;
  padding:8px 12px;background:var(--bg);border-top:1px solid var(--border);
  padding-bottom:calc(8px + env(safe-area-inset-bottom));
  z-index:30;
}
.mobile-bottom-bar .mini-tel,.mobile-bottom-bar .mini-wechat{
  flex:1;justify-content:center;min-height:44px;border-radius:var(--radius);
}
.mobile-bottom-bar .btn-inquire-bar{
  flex:1.6;display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-height:44px;padding:0 18px;border:none;border-radius:var(--radius);
  background:var(--brand-strong);color:#fff;font-size:15px;font-weight:600;
  text-decoration:none;line-height:1.3;
}
.mobile-bottom-bar .btn-inquire-bar:active{background:var(--brand-darker)}
@media(max-width:767px){
  .mobile-bottom-bar{display:flex}
  main{padding-bottom:88px}
}

/* ───────────────────────── 页脚 ───────────────────────── */
.site-footer{margin-top:64px;background:var(--bg-soft);border-top:4px solid;border-image:linear-gradient(90deg,#0db083,#7ee7c8) 1}
.footer-inner{
  /* 与 header/页面主体对齐：同 .header-inner 的 1140 盒宽 + 20px padding = 1100 内容宽 */
  max-width:calc(var(--maxw) - 40px);margin:0 auto;
  display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:36px;
  padding:40px 20px 28px;
}
.footer-brand .logo{margin-bottom:14px}
.footer-slogan{color:var(--muted);font-size:14px;line-height:1.7;max-width:460px}
/* 品牌区信任徽章（版本 B：填补空旷 + 强化信任） */
.footer-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--brand-strong);background:#fff;border:1px solid var(--brand-200);border-radius:var(--radius-pill);padding:4px 11px}
.chip svg{width:13px;height:13px;flex:none}
.footer-col h4{font-size:14px;font-weight:700;color:var(--text);margin-bottom:16px}
.footer-nav{list-style:none;display:flex;flex-direction:column;gap:11px}
.footer-nav a{color:var(--text-2);font-size:14px}
.footer-nav a:hover{color:var(--brand-strong)}
/* 扫码咨询：微信 + 小程序二维码并排（替代原快速导航列） */
.footer-qr-row{display:flex;gap:18px}
.footer-qr{margin:0;text-align:center}
.footer-qr img,.footer-qr-ph{width:96px;height:96px;border-radius:var(--radius);border:1px solid var(--border);background:#fff;display:block;object-fit:cover}
.footer-qr-ph{background:linear-gradient(135deg,#f2f4f6,#e6eaee)}
.footer-qr figcaption{font-size:12px;color:var(--muted);margin-top:6px}
.footer-line{font-size:14px;color:var(--text-2);margin-bottom:8px}
/* 版本 B：联系电话放大为品牌绿，作为右侧视觉锚点 */
.footer-phone-big{font-size:20px;font-weight:800;color:var(--brand-strong);margin-bottom:8px;letter-spacing:.3px}
.footer-phone-big a{color:inherit}
.footer-cta{
  display:inline-flex;margin-top:10px;padding:10px 22px;border-radius:var(--radius-pill);
  background:var(--brand-strong);color:#fff;font-size:14px;font-weight:600;
}
.footer-cta:hover{background:var(--brand-darker);color:#fff}
.footer-bottom{
  border-top:1px solid var(--border);text-align:center;
  padding:18px 20px;font-size:13px;color:var(--muted);
}
/* 📱 移动端页脚：桌面三栏直接叠单列会拖得很长 —— 导航改两列网格 + CTA 通栏 + 整体收紧 */
@media(max-width:767px){
  .footer-inner{grid-template-columns:1fr;gap:20px;padding:26px 20px 18px}
  .footer-slogan{font-size:13px}
  .footer-chips{margin-top:12px}
  .footer-col h4{margin-bottom:10px}
  .footer-qr-row{gap:14px}
  /* 快速导航：两列网格代替纵向堆叠（高度减半），品牌色小圆点作视觉引导 */
  .footer-nav{display:grid;grid-template-columns:repeat(2,1fr);gap:9px 12px}
  .footer-nav a{display:inline-flex;align-items:center;gap:7px;font-size:13.5px}
  .footer-nav a::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--brand);flex:none}
  /* 联系区：电话是移动端第一入口，放大；次要信息收紧行距 */
  .footer-phone-big{font-size:22px;margin-bottom:6px}
  .footer-line{font-size:13px;margin-bottom:4px}
  /* 提交询价：通栏大按钮，拇指友好 */
  .footer-cta{display:flex;width:100%;justify-content:center;margin-top:14px;padding:12px 22px;font-size:15px}
  .footer-bottom{padding:14px 16px;font-size:12px}
}

/* ───────────────────────── 联系方式模块 ───────────────────────── */
.contact-module{position:relative}

.btn-intent-link{
  display:inline-flex;align-items:center;gap:4px;
  padding:8px 12px;font-size:14px;color:var(--muted);white-space:nowrap;
}
.btn-intent-link .badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:18px;height:18px;padding:0 5px;
  background:var(--brand);color:#fff;border-radius:9px;font-size:11px;font-weight:600;
}

.contact-status{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);margin:8px 0 0}
.contact-status .dot{width:8px;height:8px;border-radius:50%;background:#ccc;flex:none}
.contact-status .dot.on{background:var(--brand)}
.contact-status .dot.off{background:#bbb}

/* 微信二维码弹层 */
.qrcode-modal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:rgba(16,24,40,.55)}
.qrcode-modal[hidden]{display:none}
.modal-inner{position:relative;background:var(--bg);border-radius:var(--radius-lg);padding:28px 24px;text-align:center;max-width:300px;box-shadow:var(--shadow-lg)}
.modal-close{position:absolute;top:8px;right:12px;background:none;border:none;font-size:26px;color:#999;cursor:pointer;line-height:1}
.modal-title{font-size:16px;font-weight:600;margin-bottom:12px}

/* 加入意向单：规格选择弹层（多规格商品先选规格再落库） */
.spec-modal{position:fixed;inset:0;z-index:110;display:flex;align-items:flex-end;justify-content:center;background:rgba(16,24,40,.5)}
.spec-modal[hidden]{display:none}
.spec-modal-mask{position:absolute;inset:0}
.spec-modal-card{position:relative;width:100%;max-width:520px;background:var(--bg);border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:18px 18px 20px;box-shadow:var(--shadow-lg);max-height:82vh;display:flex;flex-direction:column;animation:specUp .2s ease}
@keyframes specUp{from{transform:translateY(24px);opacity:.6}to{transform:translateY(0);opacity:1}}
.spec-modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.spec-modal-head h3{font-size:16px;font-weight:600;color:var(--text)}
.spec-modal-x{background:none;border:none;font-size:24px;color:#999;cursor:pointer;line-height:1}
.spec-modal-body{overflow-y:auto;display:flex;flex-wrap:wrap;gap:10px;padding:2px}
.spec-modal-cancel{margin-top:14px;width:100%;padding:12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text-2);font-size:15px;font-weight:600;cursor:pointer}
.spec-empty{color:var(--muted);font-size:14px;padding:8px 0}
.spec-opt{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 14px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);font-size:14px;cursor:pointer;transition:border-color .15s,background .15s;font-family:inherit}
.spec-opt:hover{border-color:var(--brand-strong)}
.spec-opt .spec-opt-val{font-weight:600}
.spec-opt .spec-opt-price{font-size:12px;color:var(--brand-strong)}
@media(min-width:768px){.spec-modal{align-items:center}.spec-modal-card{border-radius:var(--radius-lg)}}

/* 微信弹层里的小程序二维码（与微信码并列） */
.qr-mp{margin-top:14px;padding-top:14px;border-top:1px dashed var(--border)}
/* 页面联系区：微信 + 小程序 并排二维码 */
.contact-qr-row{display:flex;flex-wrap:wrap;gap:20px;margin-top:16px}
.contact-qr{display:flex;flex-direction:column;align-items:center;gap:6px}
.contact-qr img{border:1px solid var(--border);border-radius:var(--radius-sm);background:#fff;padding:6px}
.contact-qr-label{font-size:13px;color:var(--muted)}
.qrcode-img{width:200px;height:200px;display:block;margin:0 auto 12px;border-radius:var(--radius-sm)}
.modal-tip{font-size:13px;color:var(--muted);margin-bottom:12px}
.btn-copy-wechat{width:100%;padding:10px;background:var(--bg-soft);border:none;border-radius:var(--radius-sm);font-size:14px;cursor:pointer;color:var(--text)}
.btn-copy-wechat:hover{background:var(--border)}
.modal-note{font-size:12px;color:#bbb;margin-top:12px}

/* ───────────────────────── 提交需求页（M2.5）───────────────────────── */
.intent-preview{background:var(--brand-50);border:1px solid var(--brand-100);border-radius:var(--radius);padding:18px;margin-bottom:20px}
.intent-preview h2{font-size:15px;font-weight:600;margin-bottom:10px}
.intent-preview ul{list-style:none}
.intent-preview li{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:8px 0;border-bottom:1px dashed var(--border);font-size:14px}
.intent-preview li:last-child{border-bottom:none}
.intent-preview .brand{background:#fff;border:1px solid var(--brand-100);color:var(--brand-strong);font-size:12px;padding:1px 6px;border-radius:4px;font-weight:600;flex:none}
.intent-preview .sku{color:var(--muted);font-size:13px}
.intent-preview .qty{color:var(--muted);font-size:13px}
.intent-preview .price{margin-left:auto;color:var(--brand-strong);font-weight:600}
.intent-preview .offline-tip{color:var(--danger);font-size:12px;border:1px solid #f7c1c1;padding:1px 6px;border-radius:4px}
.link{color:var(--brand-strong)}
.intent-empty{background:#fffbf0;border:1px solid #f7dcb0;border-radius:var(--radius-sm);padding:12px 14px;margin-bottom:20px;font-size:14px}
.required{color:var(--danger)}
.submit-contact{margin-top:20px;padding-top:16px;border-top:1px solid var(--border);font-size:14px;color:var(--muted)}
.btn-submit{width:100%;padding:14px;background:var(--brand);color:#fff;border:none;border-radius:var(--radius);font-size:16px;font-weight:600;min-height:50px;cursor:pointer}
.btn-submit:disabled{opacity:.6;cursor:not-allowed}

/* ───────────────────────── 提交成功页 · 变体 C ───────────────────────── */
.submit-success{margin:0 auto}
.vc-hero{background:linear-gradient(160deg,var(--brand) 0%,var(--brand-dark) 70%,var(--brand-darker) 100%);padding:52px 20px 84px;text-align:center;position:relative;border-radius:var(--radius-lg)}
.vc-ring{width:74px;height:74px;border-radius:50%;background:rgba(255,255,255,.15);border:2px solid rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;box-shadow:0 0 0 12px rgba(255,255,255,.07)}
.vc-hero h1{color:#fff;font-size:27px;letter-spacing:1px;margin-bottom:8px}
.vc-hero p{color:rgba(255,255,255,.92);font-size:14.5px}
.vc-no-card{max-width:460px;margin:-56px auto 0;position:relative;z-index:1;background:#fff;border-radius:var(--radius-lg);box-shadow:0 6px 20px rgba(16,24,40,.07);padding:18px 22px;display:flex;align-items:center;gap:12px}
.vc-no-card .lb{font-size:12.5px;color:var(--muted)}
.vc-no-card .no{font-size:20px;font-weight:800;letter-spacing:.8px;font-family:ui-monospace,Consolas,monospace}
.vc-no-card .cp{margin-left:auto;border:1px solid var(--brand-100);background:var(--brand-50);color:var(--brand-strong);border-radius:var(--radius-sm);padding:6px 14px;font-size:12.5px;cursor:pointer}
.vc-no-card .cp:hover{background:var(--brand-100)}
.vc-body{max-width:980px;margin:0 auto;padding:34px 20px 48px}
.vc-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:26px}
.vc-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px 18px;text-align:center;box-shadow:0 1px 3px rgba(16,24,40,.05)}
.vc-card .ic{width:40px;height:40px;border-radius:12px;background:var(--brand-50);border:1px solid var(--brand-100);display:flex;align-items:center;justify-content:center;margin:0 auto 10px}
.vc-card b{display:block;font-size:14px;margin-bottom:4px;color:var(--text)}
.vc-card span{font-size:12.5px;color:var(--muted);line-height:1.6;display:block}
.vc-note{background:#fffbf0;border:1px solid #f7dcb0;border-radius:var(--radius-sm);padding:11px 16px;font-size:12.5px;color:#8a6116;line-height:1.75;margin-bottom:22px;text-align:left}
.vc-note b{color:#7c4a03}
.vc-contact{background:var(--brand-50);border:1px solid var(--brand-100);border-radius:var(--radius-lg);padding:22px 24px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.vc-contact .t{flex:1;min-width:220px}
.vc-contact .t b{font-size:15.5px;display:block;margin-bottom:3px;color:var(--text)}
.vc-contact .t span{font-size:12.5px;color:var(--muted)}
.vc-btns{display:flex;gap:10px;flex-wrap:wrap}
.vc-btns .tel{display:flex;align-items:center;justify-content:center;gap:7px;min-height:46px;padding:0 22px;border-radius:var(--radius-pill);background:var(--brand);color:#fff;font-weight:700;font-size:14.5px;text-decoration:none}
.vc-btns .tel:hover{background:var(--brand-dark)}
.vc-btns .wx{display:flex;align-items:center;justify-content:center;min-height:46px;padding:0 20px;border-radius:var(--radius-pill);background:#fff;border:1px solid var(--brand-100);color:var(--brand-strong);font-weight:600;font-size:14px;cursor:pointer}
.vc-links{display:flex;justify-content:center;gap:22px;margin-top:24px;font-size:13.5px}
/* .contact-box 基础样式唯一定义在此（下方政策/帮助区块不再重复声明） */
.contact-box{background:var(--brand-50);border:1px solid var(--brand-100);border-radius:var(--radius);padding:20px;margin:32px 0 0}
.contact-box h2{font-size:15px;font-weight:600;margin-bottom:12px}
.contact-box .btn-tel,.contact-box .btn-wechat{width:100%;margin-bottom:8px}
.contact-box .btn-wechat{padding:13px;background:var(--bg-soft);border:none;border-radius:var(--radius);font-size:15px;cursor:pointer;color:var(--text);font-weight:600}
.contact-box .btn-wechat:hover{background:var(--border)}
/* 提交成功页 · 变体 C 响应式（与品类页/案例页同一套断点） */
@media(max-width:767px){
  .vc-cards{grid-template-columns:1fr}
  .vc-hero{padding:44px 18px 72px}
  .vc-body{padding:28px 16px 40px}
  .vc-contact{flex-direction:column;align-items:stretch;text-align:center}
  .vc-btns{justify-content:center}
}
@media(max-width:480px){
  .vc-no-card{max-width:none;margin:-46px 16px 0}
  .vc-btns{flex-direction:column}
  .vc-btns .tel,.vc-btns .wx{width:100%;flex:none}
}

/* ───────────────────────── 意向单页 ───────────────────────── */
.intent-list{list-style:none;margin-bottom:16px}
.intent-item{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 0;border-bottom:1px solid var(--border)}
.intent-item.is-offline{opacity:.6}
.intent-item .info{flex:1;min-width:200px;display:flex;flex-direction:column;gap:2px}
.intent-item .sku,.intent-item .remark{font-size:13px;color:var(--muted)}
.intent-item .offline-tip{font-size:12px;color:var(--danger)}
.intent-item .qty{color:var(--muted);font-size:14px}
.intent-item .price{font-size:14px;color:var(--brand-strong);font-weight:600}
.intent-item .no-price{color:var(--muted);font-size:13px}
.btn-remove{padding:6px 12px;border:1px solid var(--border);background:var(--bg);color:var(--muted);border-radius:var(--radius-sm);font-size:13px;cursor:pointer}
.btn-remove:hover{border-color:var(--danger);color:var(--danger)}
.total-row{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0;border-top:1px solid var(--border);font-size:15px}
.total-row strong{font-size:20px;color:var(--brand-strong);font-weight:700}
.intent-page .tip{font-size:13px;color:var(--muted);margin-bottom:20px}
.intent-page .actions{display:flex;gap:10px;margin-top:16px}
.intent-page .actions>*{flex:1;justify-content:center}
.intent-page .empty{text-align:center;padding:48px 0;color:var(--muted)}

/* ───────────────────────── 品类 / 列表页 ───────────────────────── */
.breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--muted);margin-bottom:12px;line-height:1.4}
.breadcrumb a{color:var(--muted);padding:2px 0}
.breadcrumb a:hover{color:var(--brand-strong)}
.breadcrumb span[aria-hidden]{color:#ccc}
.breadcrumb [aria-current]{color:var(--text)}
.category-content{font-size:14px;color:var(--muted);line-height:1.9;padding:16px;background:var(--bg-soft);border-radius:var(--radius);margin-bottom:20px}
.filter-bar{display:flex;justify-content:space-between;align-items:center;padding:10px 0;font-size:13px;color:var(--muted);border-bottom:1px solid var(--border);margin-bottom:16px}
.product-grid{display:grid;gap:14px}
@media(min-width:480px){.product-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.product-grid{grid-template-columns:repeat(4,1fr)}}
.product-card{border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;background:var(--bg);box-shadow:var(--shadow-sm);transition:box-shadow .2s,transform .2s,border-color .2s}
.product-card:hover{box-shadow:var(--shadow);transform:translateY(-3px);border-color:var(--brand-100)}
.product-card a{display:flex;flex-direction:column;flex:1}
.product-card .thumb{background:#f2f4f6;overflow:hidden;border-radius:var(--radius-lg) var(--radius-lg) 0 0}
.product-card .thumb img{width:100%;height:auto;display:block}
.product-card h2,.product-card h3{font-size:15px;font-weight:600;padding:12px 14px 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.5;min-height:45px}
.product-card .sub{font-size:13px;color:var(--muted);padding:2px 14px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.product-card .price{font-size:15px;color:var(--brand-strong);font-weight:600;padding:8px 14px}
.btn-intent{width:100%;padding:11px;border:none;border-top:1px solid var(--border);background:var(--bg);color:var(--brand-strong);font-size:14px;font-weight:600;cursor:pointer;transition:background .15s;margin-top:auto}
.btn-intent:hover{background:var(--brand-50)}
.btn-intent:disabled{color:var(--muted);cursor:not-allowed}
.pagination{text-align:center;padding:24px 0}
.pagination a{padding:8px 14px;border:1px solid var(--border);border-radius:var(--radius-sm);margin:0 4px}
.pagination a:hover{border-color:var(--brand-strong);color:var(--brand-strong)}
/* 完整分页（场景应用列表）：上一页/下一页 + 页码 + 省略号 */
.pagination .pg-nav{display:inline-block;padding:8px 14px;border:1px solid var(--border);border-radius:var(--radius-sm);margin:0 4px;font-size:14px}
.pagination .pg-nav.is-disabled{opacity:.45;pointer-events:none}
.pagination .pg-num{display:inline-block;min-width:36px;padding:8px 6px;border:1px solid var(--border);border-radius:var(--radius-sm);margin:0 3px;font-size:14px;text-align:center}
.pagination .pg-num:hover{border-color:var(--brand-strong);color:var(--brand-strong)}
.pagination .pg-num.is-current{background:var(--brand-strong);border-color:var(--brand-strong);color:#fff;font-weight:600}
.pagination .pg-dots{margin:0 4px;color:var(--muted)}
.category-page .empty{text-align:center;padding:48px 0;color:var(--muted)}

/* ══ 品类英雄区（变体 A） ══ */
.cat-hero{display:flex;gap:22px;align-items:flex-start;background:linear-gradient(135deg,var(--brand-50),#fff);border:1px solid var(--brand-200);border-radius:var(--radius-lg);padding:24px 26px;margin:4px 0 22px}
.cat-hero-ic{width:64px;height:64px;border-radius:16px;background:#fff;color:var(--brand-strong);display:flex;align-items:center;justify-content:center;font-size:30px;flex:none;box-shadow:var(--shadow-sm);border:1px solid var(--brand-200)}
.cat-hero-main{flex:1;min-width:0}
.cat-hero-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.cat-hero-top h1{font-size:26px;font-weight:700}
.scene-tag{font-size:12px;font-weight:600;color:var(--brand-strong);background:var(--brand-100);border-radius:var(--radius-pill);padding:3px 12px}
.cat-hero-sub{font-size:14px;color:var(--text-2);margin-bottom:14px;max-width:680px}
.cat-attrs{display:flex;flex-wrap:wrap;gap:8px}
.attr{display:inline-flex;align-items:baseline;gap:6px;font-size:12.5px;background:#fff;border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 11px;color:var(--muted)}
.attr b{color:var(--text);font-weight:600;font-size:12.5px}
.cat-hero-aside{flex:none;width:240px}
.tip-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow-sm)}
.tip-card .t-title{font-size:13.5px;font-weight:700;margin-bottom:6px}
.tip-card p{font-size:12.5px;color:var(--muted);margin-bottom:12px;line-height:1.6}
.btn-block{width:100%}

/* 品类说明（SEO 长文案，可折叠次级块） */
.cat-desc{font-size:13.5px;color:var(--text-2);line-height:1.85;background:var(--bg-soft);border-radius:var(--radius);padding:0;margin-bottom:20px;border:1px solid var(--border);overflow:hidden}
.cat-desc summary{cursor:pointer;font-weight:600;color:var(--text);font-size:14px;padding:14px 18px;list-style:none;user-select:none}
.cat-desc summary::-webkit-details-marker{display:none}
.cat-desc summary::before{content:"▸";color:var(--brand-strong);margin-right:8px;display:inline-block;transition:transform .15s}
.cat-desc[open] summary::before{content:"▾"}
.cat-desc .body{padding:0 18px 16px;border-top:1px solid var(--border);padding-top:14px}

/* 排序条（替代原 filter-bar 的纯统计，支持真实排序） */
.sort-bar{display:flex;align-items:center;gap:12px;padding:6px 0 14px;margin-bottom:14px}
.sort-bar .total{font-size:13.5px;color:var(--muted);font-weight:600}
.sort-sp{margin-left:auto;display:flex;gap:6px}
.sort-btn{font-size:13px;color:var(--text-2);background:#fff;border:1px solid var(--border);border-radius:var(--radius-pill);padding:6px 15px}
.sort-btn.on{color:var(--brand-strong);border-color:var(--brand-200);background:var(--brand-50);font-weight:600}
.sort-btn:hover{border-color:var(--brand-200)}

/* 手机端：英雄区纵向堆叠，提示卡占满整行 */
@media(max-width:767px){
  .cat-hero{flex-direction:column;gap:16px;padding:20px 18px}
  .cat-hero-aside{width:100%}
  .cat-hero-top h1{font-size:22px}
}

/* ───────────────────────── 内容页：政策 / 帮助 / 案例 ───────────────────────── */
.page-intro{font-size:14px;color:var(--muted);margin-bottom:24px}
/* 🚨 改造：宽度对齐 /how-to-order（满宽 + 同款内边距），不再用 780px 窄栏 */
.policy-page{max-width:var(--maxw);margin:0 auto;padding:4px 20px 28px}
/* 标题区对齐 how-to-order 的 .page-head（小标签 + h1 + 副标题） */
.policy-page .page-head{margin-bottom:14px}
.policy-page .eyebrow{font-size:14px;color:var(--muted);letter-spacing:2px;font-weight:600;margin-bottom:8px}
.policy-page .page-head h1{font-size:26px;font-weight:700;margin-bottom:8px}
.policy-page .page-head p{font-size:14px;color:var(--muted);max-width:760px;line-height:1.7}
/* 合规必填（§11 A8）：版本号 + 生效日期信息条（标题区下方） */
.policy-meta{display:flex;flex-wrap:wrap;gap:12px;padding:12px 16px;background:var(--bg-soft);border-radius:var(--radius);font-size:13px;color:var(--muted);margin-bottom:20px}
.policy-meta .version{font-weight:600;color:var(--text)}
/* 页尾复用全站绿色转化条（.home-cta，同首页 / how-to-order）。
   --home-gap 只在 .home 与移动端 :root 下有定义，桌面非首页需显式给 margin-top */
.policy-page .home-cta{margin-top:40px}
/* CTA 是本页最后元素：缩短 main 底部 padding 与页脚上间距
   （全站 28+64px 太空，同 how-to-order / about / help 页） */
main:has(> .policy-page){padding-bottom:0}
main:has(> .policy-page) + .site-footer{margin-top:24px}
/* 移动端有固定底部转化栏：恢复占位，避免遮住末屏 CTA */
@media(max-width:767px){main:has(> .policy-page){padding-bottom:88px}}
.policy-page .summary{font-size:15px;color:var(--muted);padding-bottom:16px;border-bottom:1px solid var(--border);margin-bottom:24px;line-height:1.8}
.policy-content{font-size:15px;line-height:1.9}
.policy-content h2{font-size:18px;font-weight:700;margin:28px 0 12px;padding-left:12px;border-left:3px solid var(--brand)}
.policy-content h2:first-child{margin-top:0}
.policy-content h3{font-size:15px;font-weight:600;margin:20px 0 8px}
.policy-content p{margin-bottom:12px;color:var(--text-2)}
.policy-content ul,.policy-content ol{margin:0 0 12px 22px}
.policy-content li{margin-bottom:6px}
.policy-content strong{color:var(--text)}
.policy-content a{color:var(--brand-strong);text-decoration:underline}

.contact-box p{font-size:14px;color:var(--muted);margin-bottom:12px}
.contact-box .btn-tel,.contact-box .btn-primary{width:100%;margin-bottom:8px;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:13px;border-radius:var(--radius);font-size:15px;font-weight:600;border:none;cursor:pointer}
.contact-box .btn-tel{border:1px solid var(--brand);color:var(--brand-strong);background:var(--bg)}
.contact-box .btn-tel:hover{background:var(--brand-50)}
.contact-box .btn-primary{background:var(--brand);color:#fff}
.contact-box .btn-primary:hover{background:var(--brand-dark)}

.help-search{display:flex;gap:8px;margin-bottom:24px}
.help-search input{flex:1;padding:12px 14px;border:1px solid var(--border);border-radius:var(--radius);font-size:15px;min-height:46px}
.help-search input:focus{outline:none;border-color:var(--brand-strong);box-shadow:0 0 0 3px var(--brand-100)}
.help-search button{padding:12px 24px;background:var(--brand);color:#fff;border:none;border-radius:var(--radius);font-size:15px;cursor:pointer;min-height:46px;font-weight:600}
.help-search button:hover{background:var(--brand-dark)}
.faq-group{margin-bottom:32px}
.faq-group h2{font-size:17px;font-weight:700;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--border)}
.faq-list{list-style:none}
.faq-item{border-bottom:1px solid var(--border)}
.faq-item details summary{cursor:pointer;padding:14px 0;font-size:15px;list-style:none;position:relative;padding-right:28px;font-weight:500}
.faq-item details summary::-webkit-details-marker{display:none}
.faq-item details summary::after{content:'+';position:absolute;right:0;top:14px;font-size:20px;color:var(--muted);line-height:1}
.faq-item details[open] summary::after{content:'−'}
.faq-answer{padding:0 0 16px;font-size:14px;color:var(--muted);line-height:1.8}
.faq-answer a{color:var(--brand-strong);text-decoration:underline}
.search-summary{font-size:14px;color:var(--muted);margin-bottom:20px}

.case-grid{display:grid;gap:18px;margin-bottom:24px}
@media(min-width:480px){.case-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.case-grid{grid-template-columns:repeat(3,1fr)}}
.case-card{border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;background:var(--bg);box-shadow:var(--shadow-sm);transition:box-shadow .2s,transform .2s}
.case-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.case-card a{display:block}
/* 🚨 商品主图多为竖版包装图，cover 裁切会把包装上的字切一半 ——
   改为 contain 完整显示 + 浅灰衬底，图片四周自然留白 */
.case-card .thumb{aspect-ratio:4/3;background:#f4f6f8;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:8px}
.case-card .thumb img{width:100%;height:100%;object-fit:contain}
.case-card .info{padding:14px}
.case-card .scene{display:inline-block;font-size:12px;color:var(--brand-strong);background:var(--brand-100);padding:2px 8px;border-radius:4px;margin-bottom:8px;font-weight:600}
.case-card h2{font-size:15px;font-weight:600;margin-bottom:6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.5;min-height:45px}
.case-card .challenge{font-size:13px;color:var(--muted);line-height:1.6}
/* 宽度与 /help、/about、/zhishi、/category 等内容页统一：1180 容器 + 20px 内边距（内容实宽 1100） */
.case-detail{max-width:var(--maxw);margin:0 auto;padding:4px 20px 28px}
.case-detail h1{font-size:26px;font-weight:700;margin-bottom:12px}
.case-meta{display:flex;gap:16px;font-size:13px;color:var(--muted);padding-bottom:16px;border-bottom:1px solid var(--border);margin-bottom:20px}
.case-detail .cover{width:100%;max-height:520px;object-fit:contain;background:#f4f6f8;border-radius:var(--radius);margin-bottom:24px}
.case-detail .block{margin-bottom:28px}
.case-detail .block h2{font-size:18px;font-weight:700;margin-bottom:12px;padding-left:12px;border-left:3px solid var(--brand)}
.case-detail .block div{font-size:15px;line-height:1.9;color:var(--text-2)}
.case-detail .block ul{margin:0 0 12px 22px}

/* ───────────────────────── 我的需求 ───────────────────────── */
.my-page{max-width:640px;margin:0 auto;padding:4px 0 40px}
.my-page h1{font-size:22px;font-weight:700;margin-bottom:6px}
.my-page .tip{font-size:13px;color:var(--muted);margin-bottom:20px}
/* 注册/登录等认证页：窄卡容器，与 /submit 卡片语言一致 */
.my-page.auth-page{max-width:460px}
.auth-card{background:#fff;border:1px solid var(--border);border-top:3px solid;border-image:linear-gradient(90deg,#0db083,#7ee7c8) 1;border-radius:var(--radius-lg);padding:30px 30px 26px;box-shadow:var(--shadow-sm)}
.my-form label{display:block;margin-bottom:16px;font-size:14px;color:var(--text-2)}
.my-form input{width:100%;padding:11px 14px;border:1px solid var(--input-border);border-radius:var(--radius);font-size:15px;box-sizing:border-box;margin-top:6px}
.my-form input::placeholder{color:#aab2bd}
.my-form input:focus{outline:none;border-color:var(--brand-strong);box-shadow:0 0 0 3px var(--brand-100)}
/* 内联校验错误态 */
.my-form input.is-invalid{border-color:var(--danger);box-shadow:0 0 0 3px rgba(207,50,49,.12)}
/* 🐛 同 submit：.my-form input 通配曾把 .agree 复选框拉伸，恢复常规小勾选框 */
.my-form .agree input{width:18px;height:18px;min-height:0;padding:0;margin:2px 0 0;flex:none;accent-color:var(--brand-strong)}
.code-row{display:flex;gap:10px;margin-top:6px}
.code-row input{flex:1;margin-top:0}
.btn-code{flex:0 0 auto;padding:10px 14px;border:1px solid var(--brand);color:var(--brand-strong);background:var(--bg);border-radius:var(--radius);font-size:13px;white-space:nowrap;cursor:pointer}
.btn-code:hover{background:var(--brand-50)}
.btn-code:disabled{opacity:.5;cursor:not-allowed}
.form-error{background:#fdecec;color:var(--danger);border:1px solid #f5c6c6;padding:10px 14px;border-radius:var(--radius-sm);font-size:13px;margin-bottom:16px}
.my-alt{font-size:13px;color:var(--muted);margin-top:18px}
.my-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
/* H5 / 小屏：收紧认证卡片内边距，避免内容区被压得太窄（如微信内 375px 屏） */
@media(max-width:600px){
  .my-page.auth-page{max-width:100%}
  .auth-card{padding:24px 18px 22px}
  .form-group{padding:12px 14px 2px}
}
.my-phone{font-size:13px;color:var(--muted)}
.my-phone .link{margin-left:10px;font-size:12px}
.my-list{list-style:none;margin-top:16px;display:grid;gap:12px}
.my-card{border:1px solid var(--border);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow-sm)}
.my-card-link{display:block;padding:14px 16px;text-decoration:none;color:inherit}
.my-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.my-no{font-size:14px;font-weight:600}
.my-status{font-size:12px;color:var(--brand-strong);font-weight:600}
.my-status.s-X1,.my-status.s-X2,.my-status.s-X3{color:var(--muted)}
.my-status.s-S10{color:var(--brand-strong)}
.my-progress{height:4px;background:#eee;border-radius:2px;margin:10px 0;overflow:hidden}
.my-progress > span{display:block;height:100%;background:var(--brand);border-radius:2px;transition:width .3s ease}
.my-card-bottom{display:flex;align-items:center;gap:14px;font-size:12px;color:var(--muted)}
.my-amount{margin-left:auto;color:var(--text);font-size:13px;font-weight:600}
.my-empty{border:1px dashed var(--border);border-radius:var(--radius);padding:28px 18px;text-align:center;font-size:14px;color:var(--muted)}
.my-empty .link{display:inline-block;margin-top:10px}
.my-muted{font-size:13px;color:var(--muted)}
.my-detail{max-width:720px;margin:0 auto;padding:16px 0 40px}
.my-back{font-size:13px;display:inline-block;margin-bottom:12px}
.my-detail-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.my-detail-head h1{font-size:22px;font-weight:700}
.my-detail h2{font-size:15px;font-weight:600;margin:24px 0 10px}
.my-meta{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:13px;margin-top:12px}
.my-meta dt{color:var(--muted)}
.my-meta dd{margin:0}
.my-items{list-style:none;border:1px solid var(--border);border-radius:var(--radius)}
.my-items li{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;padding:12px 14px;border-bottom:1px solid var(--border)}
.my-items li:last-child{border-bottom:none}
.my-items .brand{align-self:center;flex:none;background:var(--brand-50);border:1px solid var(--brand-100);color:var(--brand-strong);font-size:11.5px;padding:1px 6px;border-radius:4px;font-weight:600;line-height:1.6}
.my-items .sku{color:var(--muted);font-size:12px}
.my-items .qty{color:var(--muted);font-size:12px}
.my-items .remark{flex:1 0 100%;font-size:12px;color:var(--muted);line-height:1.5}
.my-quote{border:1px solid var(--border);border-radius:var(--radius);padding:16px;overflow-x:auto}
.my-quote-amount{font-size:22px;color:var(--brand-strong);font-weight:700}
.my-quote-amount .qno{font-size:12px;color:var(--muted);font-weight:400;margin-left:10px}
.my-quote-valid{font-size:12px;color:var(--muted);margin-top:6px}
/* 报价头：金额 + 单号 + 有效期同一行（窄屏自动换行），避免金额/单号挤成两行错位 */
.my-quote-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 0;font-size:12.5px;color:var(--muted)}
.my-quote-head .amt{color:var(--text-2);flex:none}
.my-quote-head .amt strong{color:var(--brand-strong);font-size:20px;font-weight:700;margin-left:6px;line-height:1.2}
.my-quote-head .qno,.my-quote-head .valid{flex:none}
.my-quote-head .qno::before,.my-quote-head .valid::before{content:"·";margin:0 7px;color:var(--border-strong)}
/* 明细表：浅灰表头 + 固定列宽（数量居中、单价右对齐），不再被内容撑变形 */
.my-q-table{width:100%;border-collapse:separate;border-spacing:0;margin-top:14px;font-size:13px;table-layout:fixed}
.my-q-table th{background:#f6f7f9;color:var(--text-2);font-weight:600;font-size:12px;padding:9px 12px;text-align:left;white-space:nowrap}
.my-q-table th:first-child{border-radius:6px 0 0 6px}
.my-q-table th:nth-child(2){width:64px;text-align:center}
.my-q-table th:last-child{width:110px;text-align:right;border-radius:0 6px 6px 0}
.my-q-table td{padding:12px;border:none;vertical-align:top;word-break:break-word}
.my-q-table td:nth-child(2){text-align:center;color:var(--text-2)}
.my-q-table td:last-child{text-align:right;font-weight:600;color:var(--text)}
.my-q-table .sku{display:block;font-size:12px;color:var(--muted);margin-top:2px}
/* 进度时间线：一行一条（左点 + 文案，时间右对齐灰色），不再用竖线串联 */
.my-timeline{list-style:none;position:relative;padding:0}
.my-timeline::before{display:none}
.my-timeline li{display:flex;align-items:center;gap:10px;padding:10px 0;font-size:13px}
.my-timeline li + li{border-top:1px solid var(--border)}
.my-timeline .dot{position:static;flex:none;width:8px;height:8px;border-radius:50%;background:var(--brand)}
.my-timeline .txt{flex:1}
.my-timeline time{margin-left:auto;font-size:12px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.my-contact{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:28px;padding-top:16px;border-top:1px solid var(--border);font-size:13px;color:var(--muted)}

/* ───────────────────────── 真实客户评价（M5）───────────────────────── */
.customer-reviews{margin-top:36px;padding-top:24px;border-top:1px solid var(--border)}
.customer-reviews h2{font-size:18px;font-weight:700;margin-bottom:14px}
.review-item{border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;margin-bottom:12px;background:#fff}
.review-head{display:flex;align-items:center;gap:10px;margin-bottom:8px;flex-wrap:wrap}
.review-alias{font-size:13px;font-weight:600;color:var(--text)}
.review-time{font-size:12px;color:var(--muted)}
.review-head .edited{font-size:11px;color:var(--muted);background:var(--bg-soft);padding:1px 6px;border-radius:3px}
.review-content{font-size:14px;line-height:1.8;color:var(--text);word-break:break-word}
.review-media{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.review-thumb{display:block;width:76px;height:76px;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--border);background:#f2f4f6}
.review-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.review-meta{font-size:12px;color:var(--muted);margin-top:8px}
.review-more{margin-top:4px}
.review-more summary{cursor:pointer;font-size:13px;color:var(--brand-strong);padding:6px 0;list-style:none}
.review-more summary::-webkit-details-marker{display:none}
.review-more summary::before{content:"▸ "}
.review-more[open] summary::before{content:"▾ "}
.review-more[open] summary{margin-bottom:10px}

/* 我的需求 - 评价提交表单 */
.my-review-form{border:1px solid var(--border);border-radius:var(--radius);padding:16px;background:var(--bg-soft);margin-bottom:16px}
.my-review-field{display:block;margin-bottom:12px;font-size:13px;color:var(--muted)}
.my-review-field select,.my-review-field textarea,.my-review-field input[type=file]{display:block;width:100%;margin-top:5px;font-size:14px;color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 10px;background:#fff;font-family:inherit}
.my-review-field textarea{resize:vertical;line-height:1.7}
.my-review-field input[type=file]{padding:6px 8px;font-size:13px}
.my-review-form .btn-submit{margin-top:4px}
.my-review-ok{font-size:13px;color:var(--brand-strong);background:var(--brand-100);border:1px solid var(--brand-200);border-radius:var(--radius-sm);padding:9px 12px;margin-bottom:10px}
.my-review-reject{font-size:13px;color:var(--warn);background:#fff8ec;border:1px solid #f2dcb8;border-radius:var(--radius-sm);padding:9px 12px;margin-bottom:10px;line-height:1.7}

/* ───────────────────────── 内链 / 首页区块 ───────────────────────── */
.thumb-none{width:100%;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f3f1ec,#e9e6df);color:#b5aea2;font-size:26px;font-weight:500;border-radius:var(--radius-sm)}

.product-gallery{margin:14px 0 6px}
.gallery-main{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);background:#f2f4f6;display:block}
.gallery-thumbs{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.gallery-thumbs img{width:76px;height:57px;object-fit:cover;border-radius:var(--radius-sm);border:1px solid var(--border);background:#f2f4f6}
.category-links{display:flex;flex-wrap:wrap;gap:10px}
.category-links a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1px solid var(--border);border-radius:22px;font-size:14px;color:var(--text-2);background:#fff;transition:border-color .15s,color .15s}
.category-links a:hover{border-color:var(--brand-strong);color:var(--brand-strong)}
.case-links{list-style:none;display:grid;gap:12px}
.case-links li{border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px;background:#fff}
.case-links a{font-size:15px;font-weight:600}
.case-links .sub{font-size:13px;color:var(--muted);margin-top:4px}

/* ══════════════════════════════════════════════════════════════
   首页版式（A 版 · 旗舰首屏 / B 版 · 品类优先）
   ──────────────────────────────────────────────────────────────
   🚨 一份 HTML，两套排版，由后台「站点设置 → 首页版式」全局指定。

   为什么不为 A/B 各写一份模板：
     · CDN：同一 URL 只有一份缓存。按访客差异化必然串味；
     · SEO：爬虫只索引到一个版本，另一版拿不到权重；
     · 曾按 IP 分流，但移动 IP 归属地误判率高 → 已改为人工指定。
   全站统一后，爬虫看到的 = 用户看到的，缓存与收录都稳定。

   实现方式：所有差异挂在 .home-a / .home-b 作用域类上，
   DOM 始终完整（爬虫不缺内容），切换版式不丢内链。 */
.home-flow{display:flex;flex-direction:column}
/* .home 只作版式作用域钩子（规则挂在 .home-a / .home-b），不承担视觉 */
.home{--home-gap:64px}

/* ── Hero ──
   🚨 通栏出血：Hero 与信任条要"顶到视口两边"，但模板被 <main>（max-width:1180）
      包住。用负 margin 抵消 main 的左右 padding，再用内层 wrap 限宽，
      这样背景色铺满视口、内容仍与下方区块对齐（设计稿的核心观感）。 */
.home-hero{
  background:linear-gradient(135deg,var(--brand-50) 0%,#fff 62%);
  border-bottom:1px solid var(--border);
  margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px;
}
.home-hero .hero-inner{
  max-width:var(--maxw);margin:0 auto;padding:48px 0 44px;
  display:grid;grid-template-columns:1fr;gap:24px;align-items:center;
}
.hero-main{max-width:640px}
.hero-eyebrow{
  display:inline-flex;align-items:center;min-height:30px;padding:0 14px;
  font-size:13px;font-weight:600;color:var(--brand-strong);
  background:#fff;border:1px solid var(--brand-200);border-radius:var(--radius-pill);
  margin-bottom:16px;
}
.home-hero h1{font-size:30px;font-weight:800;line-height:1.28;letter-spacing:-.02em}
.home-hero h1 .hero-hl{color:var(--brand-strong)}
.hero-eyebrow .eb-dot{width:6px;height:6px;border-radius:50%;background:var(--brand-strong);flex:none}
.home-hero .slogan{margin-top:12px;font-size:16px;color:var(--text-2);line-height:1.75}

/* Hero 承诺点 */
.hero-points{list-style:none;display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:18px}
.hero-points li{display:flex;align-items:center;gap:6px;font-size:13.5px;color:var(--text-2)}
.tick{
  width:16px;height:16px;border-radius:50%;background:var(--brand-100);
  color:var(--brand-strong);font-size:10px;font-style:normal;
  display:inline-flex;align-items:center;justify-content:center;font-weight:700;flex:none;
}

/* Hero CTA */
.hero-cta{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}
/* ── 按钮基础类 ──
   🚨 本项目原先**没有** .btn 通用类，各按钮类（.btn-primary/.btn-submit…）
      各自写全样式。首页的 .btn-invert / .btn-ghost-invert / .btn-secondary
      只写了配色，圆角与布局无处继承 → 渲染成直角。
      这里补一个真正的结构基类：只管"怎么摆"，不管"什么颜色"，
      配色交给修饰类，避免与既有按钮类冲突（它们不挂 .btn，不受影响）。 */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-height:44px;padding:0 22px;
  border:1px solid transparent;border-radius:var(--radius);
  font-family:inherit;font-size:14.5px;font-weight:600;line-height:1.2;
  text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:background .15s,color .15s,border-color .15s;
}
.btn:focus-visible{outline:var(--focus-ring);outline-offset:2px}

/* Hero CTA */
.hero-cta .btn{min-height:46px;padding:0 26px;font-size:15px}
/* 🚨 不用 .btn-primary：它自带 `flex:1`（为并排均分设计），
   在 Hero 里会被拉成 437px 宽的巨型按钮，与设计稿不符。 */
.btn-hero-primary{background:var(--brand-strong);color:#fff;flex:none}
.btn-hero-primary:hover{background:var(--brand-darker);color:#fff}
.btn-secondary{background:#fff;color:var(--text-2);border-color:var(--border-strong);flex:none}
.btn-secondary:hover{border-color:var(--brand-strong);color:var(--brand-strong)}
/* Hero 电话按钮：品牌绿描边（设计稿第三个按钮） */
.btn-tel-hl{background:#fff;color:var(--brand-strong);border-color:var(--brand-strong);flex:none}
.btn-tel-hl:hover{background:var(--brand-50);color:var(--brand-strong)}

/* ── Hero 搜索（B 版主角）── */
.hero-search{display:none;gap:8px;max-width:560px}
.hero-search input{
  flex:1;min-width:0;height:48px;padding:0 16px;font-size:15px;
  border:1px solid var(--border-strong);border-radius:var(--radius);
}
.hero-search input:focus{outline:none;border-color:var(--brand-strong);box-shadow:0 0 0 3px var(--brand-100)}
.hero-search .btn{height:48px;padding:0 28px;font-size:15px;white-space:nowrap}

/* ── Hero 右侧应用场景网格（A 版；替代原产品拼贴，不显示产品图）── */
.hero-v2{display:none;grid-template-columns:1fr 1fr 1fr;gap:10px}
.home-a .hero-v2{display:grid}
.hv-scene{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:12px 10px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:5px}
.hv-scene .s-ic{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--brand-50),#fff);border:1px solid var(--brand-200);display:flex;align-items:center;justify-content:center;font-size:15px}
.hv-scene b{font-size:13px;color:var(--text)}
.hv-scene span{font-size:11px;color:var(--muted);line-height:1.4}
@media(max-width:1024px){.home-a .hero-v2{display:none}}

/* ── 区块骨架 ── */
.home-block{margin-top:var(--home-gap)}
.home-wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.home-sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.home-sec-head h2{font-size:20px;font-weight:700;margin-bottom:0}
/* 设计稿：区块标题左侧绿色竖条 */
.home-sec-head h2{border-left:4px solid var(--brand-strong);padding-left:10px}

/* ══ 按品类浏览：图标 + 名称 + 描述 卡片（4 列 2 行）══ */
.category-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(min-width:1024px){.category-cards{grid-template-columns:repeat(4,1fr)}}
.cat-card{
  display:flex;align-items:center;gap:13px;padding:16px 14px;
  border:1px solid var(--border);border-radius:var(--radius);background:#fff;
  transition:border-color .15s,box-shadow .15s,transform .15s;
}
.cat-card:hover{border-color:var(--brand-strong);box-shadow:var(--shadow-sm);transform:translateY(-2px)}
.cat-ic{
  width:44px;height:44px;border-radius:12px;flex:none;
  background:var(--brand-50);color:var(--brand-strong);
  display:flex;align-items:center;justify-content:center;font-size:19px;
}
.cat-txt{min-width:0}
.cat-txt b{display:block;font-size:15px;font-weight:600;line-height:1.4;color:var(--text)}
.cat-txt p{font-size:12.5px;color:var(--muted);margin-top:2px;line-height:1.5}
@media(max-width:639px){.category-cards{grid-template-columns:1fr}}
.home-sec-head .sub{font-size:13px;color:var(--muted);margin-top:4px}
.home-more{font-size:14px;color:var(--brand-strong);font-weight:600;white-space:nowrap}

/* ── 信任条（A 版置顶）── */
.home-trust{background:#fff;border-bottom:1px solid var(--border);margin-top:0;
  margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px}
.home-trust-in{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
  max-width:var(--maxw);margin:0 auto;
  padding-top:20px;padding-bottom:20px;
}
.trust-item{display:flex;gap:11px;align-items:flex-start}
.trust-ic{
  width:36px;height:36px;border-radius:10px;background:var(--brand-50);color:var(--brand-strong);
  display:inline-flex;align-items:center;justify-content:center;font-size:17px;flex:none;
}
.trust-item b{display:block;font-size:14px}
.trust-item p{font-size:12.5px;color:var(--muted);line-height:1.55;margin-top:2px}
/* 首页隐藏首屏紧凑联系条与状态行：hero 已有电话/微信/询价入口，
   移动端底部固定栏(.mobile-bottom-bar)不受影响，转化通道不丢 */
.home .contact-bar,
.home .contact-status{display:none}

/* ── 版式 A：旗舰首屏（左主张 / 右拼贴，正好 2 列）── */
.home-a .hero-inner{grid-template-columns:1.05fr .95fr;gap:40px}
.home-a .hero-search{display:none}   /* 与搜索互斥，保证 2 列不被挤成 3 行 */
.home-a .home-trust{display:block}
/* A 版：商品用大图 4 列 */
.home-a .home-product-grid{grid-template-columns:repeat(2,1fr)}
@media(min-width:1024px){.home-a .home-product-grid{grid-template-columns:repeat(4,1fr)}}

/* ── 版式 B：品类优先（左标题 / 右搜索，同样 2 列）── */
.home-b .hero-inner{grid-template-columns:1.1fr .9fr}
.home-b .hero-search{display:flex}
.home-b .hero-points,
.home-b .hero-collage,
.home-b .home-trust{display:none}
.home-b .home-categories{order:1}
.home-b .home-products{order:2}
.home-b .home-cases{order:3}
.home-b .how-to-order{order:4}
/* B 版：热销商品一行四个（与设计稿「4 件主推正好排满一行」一致，横向扫读更省事）。
   窄屏逐级降级：<1024px 2 列，<768px 1 列。
   注：首页主推 4 件时桌面端正好一行满格，超过 4 件自然换行，不会留孤零零的半行。 */
.home-b .home-product-grid{grid-template-columns:repeat(2,1fr)}
@media(min-width:1024px){.home-b .home-product-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:767px){.home-b .home-product-grid{grid-template-columns:1fr}}

/* ── 品类卡：胶囊（A 默认）/ 大卡（B）── */
.category-links.is-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(min-width:1024px){.category-links.is-cards{grid-template-columns:repeat(4,1fr)}}
.category-links.is-cards a{
  min-height:44px;border-radius:var(--radius);padding:18px 16px;align-items:center;gap:12px;
}
.category-links.is-cards .cat-no{
  font-size:12px;font-weight:700;color:var(--brand-strong);
  background:var(--brand-50);padding:4px 8px;border-radius:var(--radius-sm);flex:none;
}
.category-links.is-cards b{font-size:15px;font-weight:600}
.category-links.is-cards .cat-go{margin-left:auto;color:var(--border-strong);font-size:17px;flex:none}
.category-links.is-cards a:hover{border-color:var(--brand-strong);box-shadow:var(--shadow-sm)}
.category-links.is-cards a:hover .cat-go{color:var(--brand-strong)}

/* ── 案例卡：一行三个（A / B 版统一，桌面端 3 列）──
   首页主推 3 条案例，3 列正好排满一行，不再出现 2+1 的半行；
   平板 2 列、手机 1 列。 */
.home-case-list{grid-template-columns:repeat(1,1fr);gap:14px}
@media(min-width:768px){.home-case-list{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.home-case-list{grid-template-columns:repeat(3,1fr)}}
.home-case-list a{display:block}
.case-ph{
  display:flex;align-items:center;justify-content:center;
  height:150px;position:relative;overflow:hidden;
  background:linear-gradient(135deg,#eef2f5,#e2e8ed);
}
/* 通用配图：未上传封面时自动取关联商品主图（完整显示，不裁包装字） */
.case-cover{
  display:block;width:100%;height:150px;object-fit:contain;background:#f4f6f8;
  transition:transform .25s;
}
.home-case-list a:hover .case-cover{transform:scale(1.03)}
/* 占位提示文字 */
.case-ph::before{
  content:"案例配图";font-size:13px;color:#a9b4bf;position:relative;z-index:1;
}
/* 装饰纹理：斜向细纹，避免大块纯色显得廉价（不引图片，零请求） */
.case-ph::after{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(45deg,rgba(255,255,255,.5) 0 2px,transparent 2px 9px);
}
.case-body{display:block;padding:14px 16px 16px}
.case-scene{
  display:inline-block;font-size:11.5px;color:var(--brand-strong);
  background:var(--brand-50);padding:2px 9px;border-radius:var(--radius-sm);margin-bottom:7px;
}
.home-case-list b{display:block;font-size:15px;font-weight:600;line-height:1.5;margin-bottom:5px;color:var(--text)}
.home-case-list .sub{font-size:13px;color:var(--muted);line-height:1.6}
.home-case-list li{overflow:hidden;padding:0}
.home-case-list li:hover{border-color:var(--brand-200);box-shadow:var(--shadow-sm)}

/* ── 三步 ── */
.home-steps{gap:16px}
.home-steps .step{padding:20px}

/* ── 底部转化条（通栏出血）── */
.home-cta{
  margin-top:var(--home-gap);
  margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px;
  background:linear-gradient(135deg,var(--brand-strong),var(--brand-dark));
  color:#fff;
  border-radius:var(--radius-lg);   /* 四角圆角 */
}
.home-cta-in{
  max-width:var(--maxw);margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding-top:34px;padding-bottom:34px;flex-wrap:wrap;
}
/* 🚨 必须显式写 color：全局 `h1,h2,h3,h4{color:var(--text)}` 是直接给 h2 上色，
   会盖掉 .home-cta 的继承白字 —— 不写这里标题在绿底上是深色，几乎看不清。 */
.home-cta-txt h2{font-size:24px;font-weight:800;letter-spacing:-.01em;line-height:1.35;color:#fff}
.home-cta-txt p{font-size:13.5px;color:rgba(255,255,255,.92);margin-top:8px;max-width:620px;line-height:1.7}
.home-cta-btns{display:flex;gap:12px;flex-wrap:wrap}
.home-cta-btns .btn{min-height:44px;padding:0 24px;font-size:14.5px}
.btn-invert{background:#fff;color:var(--brand-strong);border-color:#fff;transition:background .16s,color .16s,border-color .16s}
/* hover 反色为品牌绿底白字，避免 brightness(.96) 把白底压成灰白，显脏 */
.btn-invert:hover{background:var(--brand-strong);color:#fff;border-color:var(--brand-strong);filter:none}
/* 次要按钮：半透明填充（设计稿为实心半透，非描边） */
.btn-ghost-invert{background:rgba(255,255,255,.22);color:#fff;border-color:transparent}
.btn-ghost-invert:hover{background:rgba(255,255,255,.32);color:#fff;border-color:transparent}

/* ── 响应式 ── */
@media(max-width:1024px){
  .home-a .hero-inner,.home-b .hero-inner{grid-template-columns:1fr}
  .home-trust-in{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:767px){
  :root{--home-gap:44px}
  .home-hero h1{font-size:25px}
  .home-hero .slogan{font-size:15px}
  .home-trust-in{grid-template-columns:1fr;gap:14px}
  .hero-cta .btn{flex:1;justify-content:center}
  .home-sec-head h2{font-size:18px}
  .home-cta-in{flex-direction:column;align-items:flex-start}
  .home-cta-btns{width:100%}
  .home-cta-btns .btn{flex:1;justify-content:center}
  .case-ph{width:68px;height:52px}
}

.more{margin-top:10px;font-size:14px}

/* ══ 商品分类总览页（/category/）· 变体 1：分类区块 + 商品横排卡 ══ */
.category-index{max-width:var(--maxw);margin:0 auto;padding:4px 20px 28px}
.category-index .home-cta{margin-top:36px}
/* CTA 是本页最后元素：缩短 main 底部 padding 与页脚上间距（同 how-to-order 页） */
main:has(> .category-index){padding-bottom:0}
main:has(> .category-index) + .site-footer{margin-top:24px}
.category-index .breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--muted);margin-bottom:14px}
.category-index .breadcrumb .sep{color:#ccc}
.category-index .breadcrumb [aria-current]{color:var(--text)}
.category-index .page-head{margin-bottom:10px}
.category-index .eyebrow{font-size:14px;color:var(--muted);letter-spacing:2px;font-weight:600;margin-bottom:8px}
.category-index .page-head h1{font-size:26px;font-weight:700;margin-bottom:8px}
.category-index .page-head p{font-size:14px;color:var(--muted);max-width:760px;line-height:1.7}

/* 分类区块 */
.cat-section{padding:22px 0 20px;border-bottom:1px solid var(--border)}
.cat-section:last-of-type{border-bottom:0}
.cat-sec-head{display:flex;align-items:center;gap:13px;margin-bottom:16px}
.cat-sec-ic{width:42px;height:42px;border-radius:10px;background:var(--brand-50);color:var(--brand-strong);display:flex;align-items:center;justify-content:center;font-size:19px;flex:none}
.cat-sec-name{flex:1;min-width:0}
.cat-sec-name b{display:block;font-size:17.5px;font-weight:600;color:var(--text)}
.cat-sec-name span{font-size:12.5px;color:var(--muted)}
.pill{font-size:11.5px;border-radius:var(--radius-pill);padding:3px 10px;font-weight:600;flex:none;white-space:nowrap}
.pill-stock{color:var(--brand-strong);background:var(--brand-100)}
.sec-all{font-size:13px;color:var(--brand-strong);font-weight:600;white-space:nowrap;flex:none}

/* 商品横排卡（4 列，与全站商品卡视觉一致，独立 class 不影响首页） */
.p-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.p-card{border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;background:#fff;box-shadow:var(--shadow-sm);transition:box-shadow .2s,transform .2s,border-color .2s;display:flex;flex-direction:column}
.p-card:hover{box-shadow:var(--shadow);transform:translateY(-3px);border-color:var(--brand-100)}
.p-thumb{display:block;background:#f2f4f6;position:relative;overflow:hidden}
/* 与首页商品卡一致：图片按原比例完整显示，不裁剪 */
.p-thumb img{width:100%;height:auto;display:block}
.p-thumb .thumb-none{width:100%;min-height:150px;display:flex;align-items:center;justify-content:center;background:#eef2f5;color:#b7c0c9;font-size:24px;font-weight:700}
.p-body{padding:10px 12px 12px;display:flex;flex-direction:column;gap:6px;flex:1}
.p-name{font-size:13.5px;font-weight:600;line-height:1.45;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:39px}
.p-price{font-size:13.5px;color:var(--brand-strong);font-weight:600}
.p-intent{margin-top:auto;padding-top:4px}
.p-intent .btn-intent{width:100%;min-height:32px;padding:0 14px;border:1px solid var(--brand-200);border-radius:var(--radius-pill);font-size:12px;color:var(--brand-strong);font-weight:600;background:#fff;cursor:pointer;font-family:inherit;transition:border-color .15s}
.p-intent .btn-intent:hover{border-color:var(--brand-strong)}

/* 空分类 slim 行 */
.slim-row{display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid var(--border);transition:background .15s}
.slim-row:hover{background:var(--brand-50)}
.slim-ic{width:34px;height:34px;border-radius:9px;background:var(--bg-soft);color:#9aa3ad;display:flex;align-items:center;justify-content:center;font-size:15px;flex:none}
.slim-txt{flex:1;min-width:0}
.slim-txt b{display:block;font-size:15px;font-weight:600;color:var(--text)}
.slim-txt span{font-size:12px;color:var(--muted)}
.slim-note{font-size:12px;color:#9aa3ad;flex:none}
.slim-arr{font-size:13px;color:var(--brand-strong);flex:none;font-weight:600}

@media(max-width:900px){
  .p-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:639px){
  .p-grid{grid-template-columns:1fr}
  .slim-note{display:none}
}

/* ══ 如何下单页（/how-to-order）· 版本 C：问答式采购指南 ══ */
.howto-page{max-width:var(--maxw);margin:0 auto;padding:4px 20px 28px}
.howto-page .breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--muted);margin-bottom:14px}
.howto-page .breadcrumb .sep{color:#ccc}
.howto-page .breadcrumb [aria-current]{color:var(--text)}
.howto-page .page-head{margin-bottom:10px}
.howto-page .eyebrow{font-size:14px;color:var(--muted);letter-spacing:2px;font-weight:600;margin-bottom:8px}
.howto-page .page-head h1{font-size:26px;font-weight:700;margin-bottom:8px}
.howto-page .page-head p{font-size:14px;color:var(--muted);max-width:760px;line-height:1.7}

/* 30 秒了解速览条 */
.glance{margin-top:18px;background:var(--brand-50);border:1px solid var(--brand-200);border-radius:var(--radius);padding:14px 18px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.glance b{font-size:13px;color:var(--brand-strong);flex:none}
.glance span{font-size:13.5px;color:var(--text)}
.glance .g-arrow{color:#9fd8c5;font-weight:600}

/* 问答列表 */
.qa-list{margin-top:18px}
.qa-item{border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px 18px;margin-bottom:12px}
.qa-item:last-child{margin-bottom:0}
.qa-head{display:flex;gap:10px;margin-bottom:8px}
.qa-badge{width:24px;height:24px;border-radius:8px;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;flex:none}
.qa-head b{font-size:15px;padding-top:2px}
.qa-item>p{font-size:13px;color:var(--text-2);line-height:1.85;margin:0}
.qa-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.qa-step{background:var(--bg-soft);border-radius:10px;padding:12px}
.qa-step b{display:block;font-size:12px;color:var(--brand-strong);margin-bottom:4px}
.qa-step span{font-size:12px;color:var(--muted);line-height:1.65;display:block}

/* 更快的联系方式 */
.contact-block{padding:22px 0 0}
.contact-block h3{font-size:15px;margin-bottom:10px}
/* 文字型触发按钮：视觉与链接一致（如「点击查看联系方式」打开微信/小程序弹层） */
.link-btn{background:none;border:none;padding:0;margin:0;font:inherit;color:var(--brand-strong);cursor:pointer}
.link-btn:hover{color:var(--brand-strong)}
.contact-btns{display:flex;gap:10px;flex-wrap:wrap}
.contact-btns .btn{min-height:44px;padding:0 22px;font-size:14.5px}
.btn-solid{background:var(--brand);color:#fff}
.btn-solid:hover{background:var(--brand-dark)}
.btn-soft{background:rgba(13,176,131,.1);color:var(--brand-strong)}
.btn-soft:hover{background:rgba(13,176,131,.16)}
.btn-line{border:1px solid var(--border-strong);color:var(--text-2);background:#fff}
.btn-line:hover{border-color:var(--brand-strong);color:var(--brand-strong)}

/* 页尾：相关页面 + 版本信息 */
.howto-page .home-cta{margin-top:40px}
/* CTA 是本页最后元素：缩短 main 底部 padding 与页脚上间距（全站 28+64px 太空） */
main:has(> .howto-page){padding-bottom:0}
main:has(> .howto-page) + .site-footer{margin-top:24px}
.howto-page .page-foot{padding:22px 0 26px}
.foot-inner{border-top:1px solid var(--border);padding-top:14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}
.foot-inner b{color:var(--text-2)}
.foot-inner a{color:var(--text-2)}
.foot-inner a:hover{color:var(--brand-strong)}
.foot-sep{color:#d8dde3}
.foot-ver{margin-left:auto;color:#9aa3ad}

@media(max-width:900px){
  .qa-steps{grid-template-columns:1fr}
}

/* ───────────────────────── 移动端可用性（S10）───────────────────────── */
.btn-intent,.btn-tel,.btn-primary,.btn-submit{min-height:44px;padding:0 16px}

/* 内容型表格横向滚动：页面不滚，表自己滚（块级化 + 自身滚动容器） */
.case-detail table,.policy-page table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
/* 键值参数表（th+td 两列）：固定布局自适应窄屏、单元格换行，不横向滚动 */
table.params{width:100%;table-layout:fixed}
table.params th,table.params td{white-space:normal;word-break:break-word}
.qno,.review-content,.case-detail p{overflow-wrap:break-word;word-break:break-word}
pre,code{overflow-x:auto;max-width:100%}

/* ───────────────────────── AI 使用助手抽屉（M6.5）───────────────────────── */
.ai-fab{position:fixed;right:16px;bottom:84px;z-index:60;display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:var(--radius-pill);background:var(--brand-strong);color:#fff;font-size:14px;box-shadow:var(--shadow-lg);cursor:pointer}
.ai-fab:hover{filter:brightness(1.05)}
.ai-fab-text{line-height:1}
.ai-drawer{position:fixed;right:12px;bottom:12px;z-index:61;width:min(380px,calc(100vw - 24px));height:min(560px,calc(100vh - 24px));display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden}
.ai-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--border);background:var(--bg-soft)}
.ai-drawer-head strong{font-size:15px}
.ai-close{border:none;background:none;font-size:22px;line-height:1;cursor:pointer;color:var(--muted);min-width:44px;min-height:44px}
.ai-drawer-tip{padding:8px 14px;font-size:12px;color:var(--muted);background:#fffdf3;border-bottom:1px solid var(--border)}
.ai-body{flex:1;overflow-y:auto;padding:12px 14px;display:flex;flex-direction:column;gap:10px}
.ai-msg{font-size:13px;line-height:1.7;max-width:88%;word-break:break-word}
.ai-msg-sys{background:#f4f4f4;color:var(--text);border-radius:10px;padding:8px 10px;max-width:100%}
.ai-msg-user{align-self:flex-end;background:var(--brand-strong);color:#fff;border-radius:10px;padding:8px 10px}
.ai-msg-ai{align-self:flex-start;background:var(--brand-50);border-radius:10px;padding:8px 10px}
.ai-badge{display:inline-block;font-size:10px;line-height:1;padding:2px 5px;border-radius:3px;background:#eef0f2;color:#666;margin-right:4px;vertical-align:1px}
.ai-quick{display:block;width:100%;text-align:left;margin:6px 0 0;padding:9px 12px;font-size:13px;border:1px solid var(--border);border-radius:var(--radius-sm);background:#fff;color:var(--text);cursor:pointer;min-height:44px}
.ai-quick:hover{border-color:var(--brand-strong);color:var(--brand-strong)}
.ai-form{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--border);background:var(--bg-soft)}
.ai-form input{flex:1;min-width:0;min-height:44px;padding:0 12px;font-size:14px;border:1px solid var(--border);border-radius:var(--radius-sm)}
.ai-form input:focus{outline:none;border-color:var(--brand-strong)}
.ai-form .btn{min-height:44px}
.ai-foot{padding:8px 12px;font-size:11px;color:var(--muted);text-align:center}
.ai-fallback{padding:12px 14px;background:#fff8f0;border-top:1px solid var(--border);font-size:13px}
.ai-fallback p{margin:0 0 8px}
@media (max-width:480px){
  .ai-drawer{right:0;bottom:0;width:100vw;height:78vh;border-radius:var(--radius-lg) var(--radius-lg) 0 0}
  .ai-fab{bottom:16px}
}

/* ══ 关于我们页（/about）· 版本 C：品牌故事型 ══ */
.about-page{max-width:var(--maxw);margin:0 auto;padding:4px 20px 28px}
.about-page .breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--muted);margin-bottom:14px}
.about-page .breadcrumb .sep{color:#ccc}
.about-page .breadcrumb [aria-current]{color:var(--text)}
.about-page .c-hero{padding:0}
.about-page .eyebrow{font-size:14px;color:var(--muted);letter-spacing:2px;font-weight:600;margin-bottom:8px}
.about-page .c-hero .page-head h1{font-size:26px;font-weight:700;margin-bottom:0}
.lead-quote{border-left:4px solid var(--brand);background:var(--brand-50);padding:18px 22px;border-radius:0 var(--radius) var(--radius) 0;font-size:14px;color:var(--muted);line-height:1.7;margin-top:8px}
.lead-quote strong{color:var(--brand-strong)}

/* 通用区块（关于/政策共用） */
.section{padding:26px 0}
.section + .section{border-top:1px solid var(--border)}
.section-title{font-size:19px;font-weight:700;margin-bottom:4px;display:flex;align-items:center;gap:9px}
.section-title .tick{width:5px;height:18px;border-radius:3px;background:var(--brand);display:inline-block;flex:none}
.section-lead{font-size:13.5px;color:var(--muted);margin-bottom:18px}

/* 编号承诺清单 */
.commit-list{display:flex;flex-direction:column;gap:14px;margin-top:6px}
.commit-row{display:grid;grid-template-columns:64px 1fr;gap:18px;align-items:start;padding:18px 20px;border:1px solid var(--border);border-radius:var(--radius);background:#fff}
.commit-row:hover{border-color:var(--brand-200)}
.commit-no{font-size:30px;font-weight:800;color:var(--brand-200);line-height:1;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.commit-body h3{font-size:16px;margin-bottom:5px;display:flex;align-items:center;gap:9px}
.commit-body .cg{width:30px;height:30px;border-radius:8px;background:var(--brand-50);color:var(--brand-strong);display:inline-flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;flex:none}
.commit-body p{font-size:13px;color:var(--muted);line-height:1.85}
.commit-body b{color:var(--text-2)}

/* 品牌色 CTA 条 */
.note-cta{margin-top:22px;background:linear-gradient(135deg,var(--brand-strong),var(--brand-dark));border-radius:var(--radius-lg);padding:22px 24px;color:#fff;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.note-cta .nc-text{flex:1;min-width:240px}
.note-cta .nc-text h3{color:#fff;font-size:16px;margin-bottom:5px}
.note-cta .nc-text p{color:rgba(255,255,255,.88);font-size:13px;line-height:1.8}
/* 描边按钮（深色/绿色底上使用） */
.btn-ghost{background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.35)}
.btn-ghost:hover{background:rgba(255,255,255,.26)}
/* 🚨 CTA 条上的描边按钮：hover 用纯白底 + 品牌深绿字。
   原来只叠加半透明白（rgba .26），在绿底上呈灰绿脏色，观感差。 */
.note-cta .btn-ghost{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.45);transition:background .16s,color .16s,border-color .16s}
.note-cta .btn-ghost:hover{background:#fff;color:var(--brand-strong);border-color:#fff}

/* 相关页面（页内） */
.related{margin-top:26px;border-top:1px solid var(--border);padding-top:18px}
.related h4{font-size:13px;color:var(--muted);font-weight:600;margin-bottom:10px;letter-spacing:.5px}
.related ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.related a{display:inline-flex;align-items:center;padding:7px 14px;border:1px solid var(--border);border-radius:var(--radius-pill);font-size:13px;color:var(--text-2);background:#fff}
.related a:hover{border-color:var(--brand-200);color:var(--brand-strong)}
.about-page .page-foot{padding:22px 0 26px}
/* CTA 是本页最后元素：缩短 main 底部 padding 与页脚上间距（同 how-to-order 页） */
main:has(> .about-page){padding-bottom:0}
main:has(> .about-page) + .site-footer{margin-top:24px}
/* 🚨 本页 CTA 位于末尾 .section 内部：还需收掉「末尾区块 26px + .about-page 20px」的下内边距，
   否则 main/页脚收窄后仍有 46px 内部空档（实测 70px → 目标与其它页一致的 24px） */
main:has(> .about-page) .about-page{padding-bottom:0}
main:has(> .about-page) .about-page > .section:last-of-type{padding-bottom:0}

@media(max-width:720px){
  .commit-row{grid-template-columns:44px 1fr;gap:12px;padding:15px 16px}
  .commit-no{font-size:24px}
}

/* ══ 帮助中心页（/help）· 版本 A：精炼侧栏 + 双栏问答卡 ══ */
.help-page{max-width:var(--maxw);margin:0 auto;padding:4px 20px 28px}
.help-page .breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--muted);margin-bottom:14px}
.help-page .breadcrumb .sep{color:#ccc}
.help-page .breadcrumb [aria-current]{color:var(--text)}

/* 品牌色 Hero（收口首屏，含搜索框） */
.help-page .hero{position:relative;background:linear-gradient(120deg,var(--brand) 0%,var(--brand-dark) 52%,var(--brand-darker) 100%);border-radius:var(--radius-lg);padding:36px 34px;color:#fff;overflow:hidden;margin-bottom:6px}
.help-page .hero::after{content:"";position:absolute;right:-70px;top:-70px;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.08)}
.help-page .hero::before{content:"";position:absolute;right:40px;bottom:-90px;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.06)}
.help-page .hero .eyebrow{color:rgba(255,255,255,.82);font-size:12.5px;letter-spacing:2px;font-weight:600;margin-bottom:8px;position:relative}
.help-page .hero h1{color:#fff;font-size:29px;font-weight:700;margin-bottom:8px;position:relative}
.help-page .hero p{color:rgba(255,255,255,.92);font-size:14.5px;max-width:560px;margin-bottom:20px;position:relative}
.help-page .search{display:flex;gap:0;max-width:560px;background:#fff;border-radius:var(--radius-pill);padding:5px 5px 5px 18px;box-shadow:var(--shadow);position:relative}
.help-page .search svg{width:20px;height:20px;color:var(--muted);align-self:center;flex:none}
.help-page .search input{flex:1;border:none;outline:none;font-size:14.5px;font-family:inherit;color:var(--text);background:transparent;padding:0 12px;min-width:0}
.help-page .search button{border:none;background:var(--brand);color:#fff;font-size:14px;font-weight:600;border-radius:var(--radius-pill);padding:0 22px;height:42px;cursor:pointer;flex:none;font-family:inherit}
.search-summary{margin:22px 0 12px;font-size:14px;color:var(--text-2)}
.search-summary a{color:var(--brand-strong);font-weight:600}

/* 侧栏 + 双栏卡布局 */
.help-page .a-layout{display:grid;grid-template-columns:228px 1fr;gap:24px;align-items:start;margin-top:20px}
.help-page .side{position:sticky;top:14px;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:10px}
.help-page .side h4{font-size:11.5px;letter-spacing:1px;color:var(--muted);text-transform:uppercase;padding:10px 12px 6px}
.help-page .side a{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:var(--radius-sm);color:var(--text-2);font-size:13.5px;margin-bottom:2px}
.help-page .side a .ci{width:26px;height:26px;border-radius:8px;background:var(--bg-soft);color:var(--brand-strong);display:inline-flex;align-items:center;justify-content:center;flex:none}
.help-page .side a .ci svg{width:15px;height:15px}
.help-page .side a .c{margin-left:auto;font-size:11.5px;color:var(--muted-2);background:var(--bg-soft);border-radius:var(--radius-pill);padding:1px 8px}
.help-page .side a.on{background:var(--brand-50);color:var(--brand-strong);font-weight:600}
.help-page .side a.on .ci{background:#fff}

.help-page .sec{margin-bottom:24px;scroll-margin-top:64px}
.help-page .sec-head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.help-page .sec-head h2{font-size:17px;font-weight:700}
.help-page .sec-head .n{font-size:12px;color:var(--muted);background:var(--bg-soft);border-radius:var(--radius-pill);padding:2px 10px}
.help-page .cat-ico{width:34px;height:34px;border-radius:10px;background:var(--brand-50);color:var(--brand-strong);display:inline-flex;align-items:center;justify-content:center;flex:none}
.help-page .cat-ico svg{width:19px;height:19px}

/* 双栏问答卡 */
.help-page .faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.help-page .fcard{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:16px 17px;transition:.18s}
.help-page .fcard:hover{border-color:var(--brand-200);box-shadow:var(--shadow-sm)}
.help-page .fcard h3{font-size:14.5px;font-weight:600;margin-bottom:7px;line-height:1.5;display:flex;gap:8px}
.help-page .fcard h3 .q{color:var(--brand-strong);font-weight:700;flex:none}
.help-page .fcard p{font-size:13px;color:var(--text-2);line-height:1.85}

/* 联系卡 */
.help-page .contact{margin-top:26px;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:22px 24px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;box-shadow:var(--shadow-sm)}
.help-page .contact .cc{width:46px;height:46px;border-radius:13px;background:var(--brand-50);color:var(--brand-strong);display:inline-flex;align-items:center;justify-content:center;flex:none}
.help-page .contact .cc svg{width:24px;height:24px}
.help-page .contact .ct{flex:1;min-width:200px}
.help-page .contact .ct h3{font-size:15.5px;margin-bottom:3px}
.help-page .contact .ct p{font-size:13px;color:var(--muted)}
.help-page .contact .cb{display:flex;gap:10px;flex-wrap:wrap}
.help-page .contact .btn{min-height:42px;padding:0 18px;font-size:14px}

/* CTA 联系卡是本页最后元素：缩短 main 底部 padding 与页脚上间距（同其他改版页） */
main:has(> .help-page){padding-bottom:0}
main:has(> .help-page) + .site-footer{margin-top:24px}

.help-page .related{margin-top:24px;border-top:1px solid var(--border);padding-top:16px}
.help-page .related h4{font-size:13px;color:var(--muted);font-weight:600;margin-bottom:10px}
.help-page .related ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.help-page .related a{display:inline-flex;align-items:center;padding:7px 14px;border:1px solid var(--border);border-radius:var(--radius-pill);font-size:13px;color:var(--text-2);background:#fff}
.help-page .related a:hover{border-color:var(--brand-200);color:var(--brand-strong)}

.help-page .link{display:inline-block;margin:16px 0 0;color:var(--brand-strong);font-weight:600}

@media(max-width:860px){
  .help-page .a-layout{grid-template-columns:1fr}
  .help-page .side{position:static}
  .help-page .faq-grid{grid-template-columns:1fr}
}

/* ───────────────────────── 移动端头部导航 ───────────────────────── */
@media (max-width:767px){
  .header-inner{height:auto;min-height:60px;padding:10px 16px;flex-wrap:wrap;gap:10px}
  .nav-burger{
    display:inline-flex;flex-direction:column;justify-content:center;gap:5px;
    width:42px;height:42px;border:1px solid var(--border);border-radius:var(--radius-sm);
    cursor:pointer;background:var(--bg);margin-left:auto;
  }
  .nav-burger span{display:block;width:18px;height:2px;background:var(--text-2);border-radius:2px;transition:.2s}
  /* 选中态：汉堡变叉 */
  .nav-toggle:checked ~ .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle:checked ~ .nav-burger span:nth-child(2){opacity:0}
  .nav-toggle:checked ~ .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .site-nav{
    position:absolute;top:100%;left:0;right:0;margin-left:0;
    background:#fff;border-bottom:1px solid var(--border);
    max-height:0;overflow:hidden;transition:max-height .25s ease;
    box-shadow:var(--shadow);
  }
  .nav-toggle:checked ~ .site-nav{max-height:75vh;overflow:auto}
  .nav-list{flex-direction:column;align-items:stretch;gap:0;padding:6px 12px 12px}
  .nav-list a{padding:14px 10px;border-radius:0;border-bottom:1px solid var(--border);font-size:15px}
  .nav-list a:hover{background:transparent}
  .header-tools{margin-left:auto;gap:8px}
  .header-cta{padding:8px 14px}
}

/* ───────────────────────── AI 公示页（M6.9）───────────────────────── */
/* 注：以下类原先在 ai/notice.php 中以内联 style 呈现，现收敛为正式类，
   复用 M7 设计 token，主色 #0db083 保持不变。 */
.panel{
  max-width:760px;margin:0 auto;
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:32px;
}
.panel > h1{font-size:24px;font-weight:700;margin-bottom:4px}
.table{width:100%;border-collapse:collapse;font-size:14px;margin-top:14px}
.table th,.table td{
  padding:11px 14px;border-bottom:1px solid var(--border);
  text-align:left;vertical-align:top;
}
.table th{width:150px;color:var(--text-2);font-weight:600;background:var(--bg-soft);white-space:nowrap}
.focus-box{
  margin-top:16px;padding:16px 18px;
  background:var(--brand-50);border:1px solid var(--brand-100);
  border-radius:var(--radius);
}
.focus-box ul{margin:8px 0 0 18px;line-height:1.9}
.focus-box div{margin-top:8px;color:var(--text-2);line-height:1.7}
.panel > p{margin-top:18px;color:var(--text-2);line-height:1.8}

/* ───────── P0 止血：主行动按钮白字对比度补足（3.18 → 4.57:1）─────────
   白字承载的实心绿按钮改用 --brand-strong，正文级 AA 通过；
   装饰性渐变 / 描边 / 进度条仍用 --brand（#0db083）。 */
.btn-primary,.btn-submit,.footer-cta,
.popup-foot .btn-primary,.contact-box .btn-primary,.help-search button,
.lang-opt.active,.cur-btn.active{
  background:var(--brand-strong);border-color:var(--brand-strong);
}
.btn-primary:hover,.btn-submit:hover,.footer-cta:hover,
.popup-foot .btn-primary:hover,.contact-box .btn-primary:hover,.help-search button:hover{
  background:var(--brand-darker);border-color:var(--brand-darker);
}

/* ───────── 站内搜索结果页（F-11：补齐 6 个此前未定义的类名）─────────
   整页此前裸奔（容器/表单/间距全无），仅复用通用类 product-grid/card 有样式。 */
.search-page{
  max-width:var(--maxw);margin:0 auto;
  display:flex;flex-direction:column;gap:18px;
}
.search-page h1{font-size:24px;font-weight:700}
.search-form{display:flex;gap:10px;flex-wrap:wrap}
.search-form input[type=search]{
  flex:1;min-width:200px;height:46px;padding:0 16px;
  border:1px solid var(--border);border-radius:var(--radius);
  background:var(--bg);color:var(--text);font-size:15px;
}
.search-form input[type=search]:focus{
  outline:none;border-color:var(--brand-strong);
  box-shadow:0 0 0 3px var(--brand-100);
}
.search-form .btn-primary,.search-cta .btn-primary{
  display:inline-flex;align-items:center;justify-content:center;
  height:46px;padding:0 26px;border:none;border-radius:var(--radius);
  font-size:15px;font-weight:600;cursor:pointer;white-space:nowrap;
}
.search-total{font-size:14px;color:var(--muted);line-height:1.7}
.search-total strong{color:var(--brand-strong);font-size:16px}
.search-tip{
  font-size:14px;color:var(--muted);line-height:1.7;
  background:var(--bg-soft);border-radius:var(--radius);padding:12px 16px;
}
.search-hot-title{
  font-size:18px;font-weight:700;margin-top:6px;
  padding-left:12px;border-left:3px solid var(--brand);
}
.search-cta{margin-top:2px}

/* ───────── 全局轻提示 Toast（替代原生 alert）───────── */
.toast-wrap{
  position:fixed;left:50%;bottom:84px;transform:translateX(-50%);
  z-index:80;display:flex;flex-direction:column;gap:10px;
  width:max-content;max-width:88vw;pointer-events:none;
}
.toast{
  pointer-events:auto;
  background:rgba(31,35,41,.94);color:#fff;
  font-size:14px;line-height:1.5;padding:11px 16px;border-radius:var(--radius);
  box-shadow:var(--shadow);opacity:0;transform:translateY(8px);
  transition:opacity .22s ease,transform .22s ease;word-break:break-word;
}
.toast.show{opacity:1;transform:translateY(0)}
.toast-error{background:rgba(207,50,49,.96)}
.toast-success{background:rgba(28,122,69,.96)}

/* ───────── 二次确认框（替代原生 confirm）───────── */
.modal-confirm-mask{
  position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;
  background:rgba(31,35,41,.45);padding:16px;
}
.modal-confirm{
  width:100%;max-width:360px;background:#fff;border-radius:var(--radius);
  box-shadow:var(--shadow-lg);overflow:hidden;animation:modalIn .16s ease;
}
@keyframes modalIn{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}
.modal-confirm-body{
  padding:20px 18px 16px;font-size:14px;line-height:1.6;color:var(--text);
  white-space:pre-line;word-break:break-word;
}
.modal-confirm-foot{display:flex;gap:10px;padding:0 18px 18px}
.modal-confirm-foot button{
  flex:1;height:40px;border-radius:var(--radius-sm);border:1px solid var(--border-strong);
  font-size:14px;cursor:pointer;background:#fff;color:var(--text-2);transition:background .15s;
}
.modal-confirm-ok{background:var(--brand-strong);border-color:var(--brand-strong);color:#fff}
.modal-confirm-ok:hover{background:var(--brand-darker);border-color:var(--brand-darker)}
.modal-confirm-cancel:hover{background:#f5f6f8}
.modal-confirm.is-danger .modal-confirm-ok{background:var(--danger);border-color:var(--danger)}
.modal-confirm.is-danger .modal-confirm-ok:hover{filter:brightness(.94)}

/* ───────── 带输入对话框（替代原生 prompt）───────── */
.modal-field{margin-top:12px}
.modal-input,.modal-select{
  height:40px;padding:0 12px;border:1px solid var(--border-strong);
  border-radius:var(--radius-sm);font-size:14px;color:var(--text);background:#fff;
}
/* 单行输入稍短并居中，不撑满整个对话框 */
.modal-input{display:table;width:260px;max-width:100%;margin:0 auto}
/* 下拉按内容宽度并居中显示（display:table 让它收缩到内容宽，margin auto 居中） */
.modal-select{display:table;width:auto;min-width:180px;max-width:100%;margin:0 auto;padding-right:34px;cursor:pointer}
.modal-input:focus,.modal-select:focus{
  outline:none;border-color:var(--brand-strong);
  box-shadow:0 0 0 3px var(--brand-100,rgba(13,176,131,.15));
}
.modal-input.is-error,.modal-select.is-error{border-color:var(--danger)}
/* 多行输入仍占满整行（要写长文本） */
textarea.modal-input{display:block;width:100%;height:auto;min-height:84px;padding:10px 12px;resize:vertical;line-height:1.6}
.modal-input-err{font-size:12px;color:var(--danger);margin-top:6px;min-height:1em}

/* ───────── F-12 补齐悬空类名（前台）───────── */
.cur-trigger-code{font-size:11px;color:var(--muted);font-weight:600;margin-left:2px}
.name{font-weight:600;color:var(--text)}
.contact-status .text{color:var(--muted);font-size:13px}
.my-timeline .txt{color:var(--text-2);font-size:13px;flex:1}
.filter-bar .total{color:var(--muted);font-size:13px}
/* 宽度与 /zhishi/ 等全站内容页一致：1180 容器 + 20px 内边距（内容实宽 1100） */
/* 🚨 上内距收窄（main 已有 28px）：避免“页头→面包屑”空白过大，与下方标题间距失衡 */
main:has(> .cases-page){padding-top:10px}
.cases-page{max-width:var(--maxw);margin:0 auto;padding:4px 20px 28px}
.cases-page .breadcrumb{margin-bottom:14px}
.cases-page h1{font-size:26px;font-weight:700;margin:0 0 8px}
.cases-page .page-intro{margin-bottom:24px}
.my-time,.my-count{color:var(--muted);font-size:12px}
.agree{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--text-2);line-height:1.6;margin-top:12px}
.effective{color:var(--muted);font-size:12px;margin-left:8px}
.form-alt{margin-top:14px;font-size:13px;color:var(--muted)}
.client{color:var(--text-2);font-size:13px}
.pd-empty{margin:8px 0 0;font-size:13px;line-height:1.6}

/* ───────── 建材知识模块（/zhishi/）───────── */
/* 宽度与 /help 等全站内容页完全一致：max-width 1180 + padding 20（<main> 已限宽 1180+20，
   这里再设 padding 使其内容与顶栏/其他页左右边缘严格对齐，不贴边） */
.knowledge-page,.knowledge-detail{max-width:var(--maxw);margin:0 auto;padding:4px 20px 28px}
.know-hero{background:linear-gradient(135deg,var(--brand-50),#fff);border:1px solid var(--brand-200);border-radius:var(--radius-lg);padding:26px 28px;margin:4px 0 22px}
.kh-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.kh-eyebrow{font-size:12px;font-weight:700;letter-spacing:.12em;color:var(--brand-strong);background:#fff;border:1px solid var(--brand-200);border-radius:999px;padding:3px 12px}
.know-hero h1{font-size:28px;font-weight:700}
.kh-sub{font-size:14px;color:var(--text-2);margin:0;max-width:760px;line-height:1.7}

/* 分类卡片网格（索引页） */
.know-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;margin-bottom:30px}
.know-cat{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px;transition:border-color .15s,box-shadow .15s,transform .15s}
.know-cat:hover{border-color:var(--brand-strong);box-shadow:var(--shadow-sm);transform:translateY(-2px)}
.know-cat-ic{width:46px;height:46px;border-radius:12px;background:var(--brand-50);color:var(--brand-strong);display:flex;align-items:center;justify-content:center;font-size:24px}
.know-cat-name{font-size:17px;font-weight:700}
.know-cat-sum{font-size:13px;color:var(--text-2);line-height:1.6;flex:1}
.know-cat-count{font-size:12px;color:var(--muted);margin-top:4px}

/* 通用：文章列表（索引/列表页共用） */
.know-latest{margin-top:8px}
.sec-title{font-size:20px;font-weight:700;margin:0 0 14px}
.know-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.know-item{display:flex;gap:14px;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:14px;transition:border-color .15s,box-shadow .15s}
.know-item:hover{border-color:var(--brand-strong);box-shadow:var(--shadow-sm)}
.know-item .thumb,.know-item .thumb-none{width:120px;height:90px;flex:none;border-radius:var(--radius-sm);overflow:hidden}
.know-item .thumb-none{display:flex;align-items:center;justify-content:center;background:var(--brand-50);color:var(--brand-strong);font-size:30px;font-weight:700}
.know-item-body{flex:1;min-width:0;display:flex;flex-direction:column}
.know-item-body h3{font-size:16px;font-weight:700;margin:0 0 6px;line-height:1.4}
.know-item-body p{font-size:13px;color:var(--text-2);margin:0 0 8px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.know-item-date{font-size:12px;color:var(--muted);margin-top:auto}

/* 文章详情 */
.know-article{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px 26px}
.ka-head{margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid var(--border)}
.ka-head h1{font-size:26px;font-weight:700;margin:0 0 10px;line-height:1.35}
.ka-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.ka-tag{color:var(--brand-strong);background:var(--brand-50);border:1px solid var(--brand-200);border-radius:999px;padding:3px 10px;font-weight:600}
.ka-tag:hover{background:var(--brand-200)}
.ka-content{font-size:15px;line-height:1.85;color:var(--text)}
.ka-content h2{font-size:20px;margin:22px 0 10px}
.ka-content h3{font-size:17px;margin:18px 0 8px}
.ka-content p{margin:0 0 12px}
.ka-content ul,.ka-content ol{margin:0 0 14px;padding-left:22px}
.ka-content li{margin-bottom:6px}
.ka-content img{max-width:100%;height:auto;border-radius:var(--radius-sm);margin:8px 0}
.ka-content a{color:var(--brand-strong);text-decoration:underline}
.ka-related{margin-top:22px;padding-top:18px;border-top:1px solid var(--border)}
.related-card{background:var(--brand-50);border:1px solid var(--brand-200);border-radius:var(--radius-lg);padding:16px 18px;max-width:420px}
.rc-title{font-size:13px;font-weight:700;color:var(--brand-strong);margin-bottom:8px}
.rc-link{display:inline-block;font-size:16px;font-weight:700;color:var(--text);margin-bottom:12px}
.rc-link:hover{color:var(--brand-strong)}
.ka-updated{font-size:12px;color:var(--muted);margin:14px 0 0}
/* CTA 是本页最后元素：缩短 main 底部 padding 与页脚上间距（同 about/help/howto/category 页口径） */
main:has(> .knowledge-page),main:has(> .knowledge-detail){padding-bottom:0}
main:has(> .knowledge-page) + .site-footer,
main:has(> .knowledge-detail) + .site-footer{margin-top:24px}

@media(max-width:767px){
  .know-list{grid-template-columns:1fr}
  .know-cats{grid-template-columns:1fr 1fr}
  .know-item{flex-direction:column}
  .know-item .thumb,.know-item .thumb-none{width:100%;height:160px}
  .know-article{padding:18px 16px}
  .ka-head h1{font-size:22px}
  .know-hero{padding:20px 18px}
  .know-hero h1{font-size:24px}
}
@media(max-width:480px){
  .know-cats{grid-template-columns:1fr}
}

/* ════════ 我的询价 · UI 重构落地（列表 A + 详情 C，2026-10-17）════════ */
/* 状态徽章：四色分档（待处理蓝 / 已报价橙 / 进行中绿 / 已结束灰），覆盖既有纯文字态 */
.my-status{display:inline-flex;align-items:center;height:24px;padding:0 11px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap;line-height:1}
.my-status.b-pending{background:#eef4ff;color:#2f6df6}
.my-status.b-quoted{background:#fff5e6;color:#c77b16}
.my-status.b-active{background:var(--brand-50);color:var(--brand-strong)}
.my-status.b-closed{background:#f1f3f5;color:#8a929c}
/* 进度条圆角（覆盖既有 2px） */
.my-progress{height:6px;border-radius:999px}
.my-progress > span{border-radius:999px}
/* 列表卡片 hover 高亮（覆盖既有无 transition） */
.my-card{transition:border-color .15s,box-shadow .15s}
.my-card:hover{border-color:var(--brand-200);box-shadow:0 4px 16px rgba(16,24,40,.08)}
.my-card-hint{margin-left:auto;color:var(--muted);font-size:12px}
/* 列表页吸底联系条（判断 18：双通道给足） */
.my-footbar{position:sticky;bottom:8px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px;padding:14px 16px;background:var(--brand-50);border:1px solid var(--brand-100);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.my-footbar .t{flex:1;min-width:160px}
.my-footbar .t b{display:block;font-size:14.5px;color:var(--text)}
.my-footbar .t span{font-size:12.5px;color:var(--muted)}
/* 电话按钮：实心绿胶囊 + 白色话机图标（与「复制微信号」形成主次对比） */
.my-footbar .btn-tel{flex:none;min-height:44px;padding:0 22px;background:var(--brand);color:#fff;border:none;border-radius:999px;box-shadow:0 2px 8px rgba(16,161,120,.25)}
.my-footbar .btn-tel:hover{background:var(--brand-dark);color:#fff}
.my-footbar .btn-tel .ico{width:16px;height:16px;flex:none}
.my-footbar .btn-copy-wechat{flex:none;width:auto;min-height:44px;padding:0 18px;background:#fff;border:1px solid var(--brand-200);color:var(--brand-strong);font-weight:600;border-radius:var(--radius);font-size:14px}
.my-footbar .btn-copy-wechat:hover{background:var(--brand-50)}

/* ── 详情 C：步骤 Hero + 分区卡 ── */
.my-detail.dc{max-width:820px;padding-top:0}
.dc-hero{background:linear-gradient(160deg,var(--brand) 0%,var(--brand-dark) 70%,#088a66 100%);border-radius:var(--radius-lg);padding:30px 20px 26px;text-align:center;color:#fff;margin-bottom:18px}
.dc-hero .my-status{background:rgba(255,255,255,.18);color:#fff;border:1px solid rgba(255,255,255,.4)}
.dc-hero h1{color:#fff;font-size:22px;font-family:ui-monospace,Consolas,monospace;letter-spacing:.4px;margin:10px 0 6px}
.dc-hero-sub{font-size:13px;color:rgba(255,255,255,.9);margin:0}
.dc-steps{display:flex;justify-content:center;max-width:560px;margin:18px auto 0}
.dc-step{flex:1;text-align:center;position:relative;font-size:12px;color:rgba(255,255,255,.85)}
.dc-step .n{width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.2);border:1.5px solid rgba(255,255,255,.55);display:flex;align-items:center;justify-content:center;margin:0 auto 6px;font-weight:700;position:relative;z-index:1}
.dc-step.on .n{background:#fff;color:var(--brand-strong)}
.dc-step:not(:last-child)::before{content:"";position:absolute;top:13px;left:calc(50% + 16px);right:calc(-50% + 16px);height:2px;background:rgba(255,255,255,.35)}
.dc-wrap{position:relative}
.dc-meta{display:flex;gap:20px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin:14px 0 4px}
.dc-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px;margin-bottom:14px;box-shadow:var(--shadow-sm)}
.my-detail.dc .dc-card > h2{margin:0 0 12px;font-size:15px;font-weight:700}
.my-detail.dc .dc-card .my-items,
.my-detail.dc .dc-card .my-quote,
.my-detail.dc .dc-card .my-timeline{border:none;padding:0;margin:0}
.my-detail.dc .dc-card .my-q-table{margin-top:10px}
.my-detail.dc .dc-card .my-review-form{border:none;background:none;padding:0;margin:0 0 12px}
/* 详情页联系条（判断 18：双通道） */
.my-detail.dc .my-contact{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:18px;padding:16px 18px;background:var(--brand-50);border:1px solid var(--brand-100);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.my-detail.dc .my-contact-t{flex:1;min-width:180px}
.my-detail.dc .my-contact-t b{display:block;font-size:14.5px;color:var(--text)}
.my-detail.dc .my-contact-t span{font-size:12.5px;color:var(--muted)}
.my-detail.dc .my-contact .btn-tel{flex:none;min-height:44px;padding:0 22px;background:var(--brand);color:#fff;border:none;border-radius:999px;box-shadow:0 2px 8px rgba(16,161,120,.25)}
.my-detail.dc .my-contact .btn-tel:hover{background:var(--brand-dark);color:#fff}
.my-detail.dc .my-contact .btn-tel .ico{width:16px;height:16px;flex:none}
.my-detail.dc .my-contact .btn-copy-wechat{flex:none;width:auto;min-height:44px;padding:0 18px;background:#fff;border:1px solid var(--brand-200);color:var(--brand-strong);font-weight:600;border-radius:var(--radius);font-size:14px}
.my-detail.dc .my-contact .btn-copy-wechat:hover{background:var(--brand-50)}

@media(max-width:767px){
  .dc-hero{padding:24px 16px 22px}
  .dc-step{font-size:11px}
  .dc-step .n{width:22px;height:22px}
  .dc-step:not(:last-child)::before{top:11px;left:calc(50% + 13px);right:calc(-50% + 13px)}
  .my-footbar{bottom:0;border-radius:0;border-left:none;border-right:none}
}
@media(max-width:480px){
  .dc-steps{margin-top:14px}
}

/* 商品详情：微信号旁二维码小图标 */
.wx-hover-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-left:6px;border:none;border-radius:4px;background:#e8f7f1;color:#0d9668;cursor:pointer;vertical-align:middle;transition:background .15s,transform .15s}
.wx-hover-icon:hover{background:#0d9668;color:#fff;transform:scale(1.08)}