/* ==========================================================================
   wap.css — 移动端（≤767px）专属样式层
   桌面零加载、零回归：仅当视口 ≤767px 时才被 <link media> 命中。
   思路：不做「栅格降列」，做移动原生组件（底部 tab、全屏抽屉、2 列紧凑卡、
   横滑图集、手风琴、卡片化表格、底部动作栏）。
   ========================================================================== */
@media (max-width: 767px) {

  :root {
    color-scheme: light;
    --tap: 44px;
    --safe-b: env(safe-area-inset-bottom, 0px);
    --safe-t: env(safe-area-inset-top, 0px);
    --tabbar-h: 56px;
    --m-gutter: 16px;
    --m-gap: 12px;
    -webkit-tap-highlight-color: transparent;
  }

  /* ---------- 防错基线 ---------- */
  /* 用 clip 而非 hidden：hidden 会把 body 变成滚动容器，破坏页头 position:sticky */
  html { overflow-x: clip; }
  body { overflow-x: clip; }
  body {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    padding-bottom: calc(var(--tabbar-h) + var(--safe-b) + 4px);
  }
  a:active, button:active, [role="button"]:active { opacity: .82; }
  :focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; }
  img { max-width: 100%; height: auto; }

  /* ---------- 容器与节奏 ---------- */
  .wrap { padding-left: var(--m-gutter); padding-right: var(--m-gutter); max-width: none; }
  .section { padding: 30px 0; }
  .section-head { margin-bottom: 18px; gap: 10px; }
  .section-head h2 { font-size: 21px; }
  .ab-sec { padding: 34px 0; }

  /* ---------- 页头：紧凑化，去掉常驻大按钮 ---------- */
  .utility { display: none; }                    /* 顶部深色信息条撤掉 */
  .site-header { position: sticky; top: 0; z-index: 100; }
  .site-header .hd-main { padding-top: 8px; padding-bottom: 8px; min-height: 56px; }
  .site-header .brand .brand-txt small { display: none; }
  .site-header .brand .brand-txt b { font-size: 15px; }
  .site-nav { display: none; }                   /* 主导航进抽屉 */
  .header-actions { margin-left: auto; gap: 8px; }
  .header-actions .btn { display: none; }        /* 移动端去掉页头 Request a quote（与 tab 重复） */
  .menu-btn, .header-actions .menu-btn { display: grid; width: var(--tap); height: var(--tap); }
  .site-header iframe, .site-header .u-mail { display: none; }

  /* ---------- D1 全屏抽屉菜单 ---------- */
  .m-nav {
    position: fixed; inset: 0; z-index: 300;
    background: var(--paper);
    min-height: 100vh; min-height: 100dvh;
    display: none; flex-direction: column;
    overflow-y: auto; overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  .m-nav.open { display: flex; }
  .m-nav-head {
    position: sticky; top: 0; z-index: 2;
    display: flex; align-items: center; justify-content: space-between;
    padding: calc(var(--safe-t) + 12px) var(--m-gutter) 12px;
    border-bottom: 1px solid var(--line);
    background: var(--paper);
  }
  .m-nav-logo { display: flex; align-items: center; gap: 10px; font-family: var(--display); font-weight: 600; font-size: 16px; color: var(--ink); }
  .m-nav-logo .mark { width: 34px; height: 34px; display: grid; place-items: center; background: var(--steel); border-radius: var(--r-sm); }
  .m-nav-logo .mark svg { width: 22px; height: 22px; }
  .m-nav-close {
    width: var(--tap); height: var(--tap); display: grid; place-items: center;
    border: 1px solid var(--line-2); border-radius: var(--r-sm);
    background: #fff; color: var(--steel); font-size: 26px; line-height: 1;
  }
  .m-nav-title {
    font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
    color: var(--faint); padding: 20px var(--m-gutter) 6px;
  }
  .m-nav a.m-nav-i {
    display: flex; align-items: center; min-height: 50px; padding: 12px var(--m-gutter);
    font-size: 16px; font-weight: 500; color: var(--ink-2);
    border-bottom: 1px solid var(--line);
    border-inline-start: 3px solid transparent;
  }
  .m-nav a.m-nav-i:active { background: var(--paper-2); }
  .m-nav-lang { display: flex; flex-wrap: wrap; gap: 8px; padding: 16px var(--m-gutter); }
  .m-nav-lang a {
    flex: 1 1 auto; text-align: center; min-height: 40px; display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid var(--line-2); border-radius: var(--r-sm); font-family: var(--mono); font-size: 13px; color: var(--ink-2);
  }
  .m-nav-lang a.on { background: var(--steel); color: #fff; border-color: var(--steel); }
  .m-nav-foot {
    margin-top: auto; display: flex; gap: 10px;
    padding: 16px var(--m-gutter) calc(var(--safe-b) + 16px);
    border-top: 1px solid var(--line); background: var(--paper-2);
  }
  .m-nav-foot a {
    flex: 1; min-height: var(--tap); display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    border-radius: var(--r-sm); font-weight: 600; font-size: 15px;
  }
  .m-nav-foot .m-nav-wa { background: #25D366; color: #fff; }
  .m-nav-foot .m-nav-quote { background: var(--amber); color: #1b1200; }

  /* ---------- D2 底部 tab 栏 ---------- */
  .m-tabbar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
    display: grid; grid-template-columns: repeat(5, 1fr);
    background: rgba(255,255,255,.96);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    border-top: 1px solid var(--line);
    padding-bottom: var(--safe-b);
  }
  .m-tabbar .tab {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
    min-height: var(--tabbar-h); padding: 6px 2px;
    font-size: 10.5px; color: var(--faint); font-weight: 500; position: relative;
  }
  .m-tabbar .tab svg { width: 22px; height: 22px; }
  .m-tabbar .tab.on { color: var(--ink); }
  .m-tabbar .tab.on svg { color: var(--amber); }
  .m-tabbar .tab-quote { color: var(--amber-ink); }
  .m-tabbar .tab-quote svg { color: var(--amber); }

  /* 悬浮球与 tab 栏冲突：移动端撤下（WA 在抽屉/页内 CTA/页脚） */
  .wa-float { display: none !important; }

  /* ---------- D10 首页机器卡：2 列紧凑 ---------- */
  .bs-grid.is-4, .bs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--m-gap); }
  .bs-card { border-radius: var(--r-sm); }
  .bs-fig.is-wide { aspect-ratio: 4 / 3; }
  .bs-body { padding: 10px 11px 12px; }
  .bs-row { gap: 6px; }
  .bs-brand { font-size: 10.5px; }
  .bs-price { font-size: 14px; }
  .bs-model { font-size: 15px; margin: 3px 0 8px; }
  .bs-specs { gap: 4px; }
  .bs-specs dt { font-size: 9.5px; }
  .bs-specs dd { font-size: 12px; }

  /* ---------- 首页信任三卡：压实 ---------- */
  .trust { gap: 10px; }
  .trust .item { padding: 16px; }
  .trust .item b { font-size: 15px; }
  .trust .item span { font-size: 13.5px; line-height: 1.5; }

  /* ---------- Hero 压缩 ---------- */
  .hero-hd-in { padding: 40px 0 44px; }
  .hero-hd h1 { font-size: clamp(26px, 8vw, 34px); }
  .hero-hd-lede { font-size: 15px; line-height: 1.55; }
  .hero-hd-cta .btn { flex: 1 1 100%; }
  .hero-hd-facts { margin-top: 22px; gap: 14px 18px; }
  .hero-hd-facts dd { font-size: 22px; }

  /* ---------- 品牌墙：紧凑 4 列 ---------- */
  .br-wall, .br-wall.is-plain { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }

  /* ---------- 触控：按钮与链接 ≥44px ---------- */
  .btn, .btn-lg { min-height: var(--tap); display: inline-flex; align-items: center; justify-content: center; }
  .ab-link { min-height: 36px; display: inline-flex; align-items: center; }
  input, select, textarea { font-size: 16px; }   /* 防 iOS 聚焦缩放 */

  /* 语言切换 select 在抽屉里；页头里的隐藏 */
  .lang { display: none; }

  /* ---------- D8 单机页底部动作栏 + 图集横滑 ---------- */
  .m-actbar {
    position: fixed; left: 0; right: 0; bottom: calc(var(--tabbar-h) + var(--safe-b));
    z-index: 85; display: flex; align-items: center; gap: 8px;
    padding: 8px 12px; background: rgba(255,255,255,.97);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    border-top: 1px solid var(--line);
  }
  .m-actbar-p { font-family: var(--mono); font-weight: 700; font-size: 18px; color: var(--ink); margin-inline-end: auto; white-space: nowrap; }
  .m-actbar-p i { font-style: normal; font-size: 11px; color: var(--faint); margin-inline-start: 2px; }
  .m-actbar .btn { min-height: 42px; padding: 0 15px; font-size: 14px; flex: 0 0 auto; }
  .m-actbar-sp { height: 62px; }

  .gal-thumbs { display: flex; gap: 8px; overflow-x: auto; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; padding-bottom: 4px; }
  .gal-thumb { flex: 0 0 auto; scroll-snap-align: start; }
  .gal-arw { display: none; }        /* 触屏用横滑代替箭头 */
  .gal-main img, .gal-main { border-radius: var(--r-sm); }

  /* ---------- D3 数据表卡片化（JS 补 data-label） ---------- */
  .af-scroll { overflow: visible; }
  table.af-t.m-cards, table.calc-t.m-cards, .prose table.m-cards, .bl-body table.m-cards { display: block; width: 100%; }
  table.m-cards thead { display: none; }
  table.m-cards tbody, table.m-cards tr { display: block; }
  table.m-cards tr {
    background: #fff; border: 1px solid var(--line); border-radius: var(--r-sm);
    padding: 12px 14px; margin-bottom: 10px;
  }
  table.m-cards td {
    display: flex; align-items: baseline; justify-content: space-between; gap: 14px;
    width: 100%; border: 0; padding: 5px 0; text-align: start;
  }
  table.m-cards td::before {
    content: attr(data-label); flex: none; color: var(--faint);
    font-size: 12px; font-family: var(--sans); letter-spacing: 0;
  }
  table.m-cards td:first-child {
    display: block; padding: 0 0 8px; margin-bottom: 6px;
    border-bottom: 1px solid var(--line); font-size: 15px; font-weight: 600;
  }
  table.m-cards td:first-child::before { content: none; }

  /* ---------- D7 FAQ 手风琴 ---------- */
  .faq { display: block; }
  .faq .fq.m-acc > p { display: none; margin-top: 10px; }
  .faq .fq.m-acc.open > p { display: block; }
  .faq .fq.m-acc > b {
    position: relative; display: block; padding-inline-end: 28px;
    cursor: pointer; min-height: 44px; padding-top: 10px; padding-bottom: 10px;
  }
  .faq .fq.m-acc > b::after {
    content: "+"; position: absolute; inset-inline-end: 2px; top: 8px;
    font-size: 22px; line-height: 1; color: var(--amber); font-weight: 600;
  }
  .faq .fq.m-acc.open > b::after { content: "\2013"; }

  /* ---------- 表单单列 + 计算器单列 + 数据板 2×2 ---------- */
  .form .row, .form-grid { grid-template-columns: 1fr; gap: 12px; }
  .form .row > div { width: 100%; }
  .calc-in, .calc-fields { grid-template-columns: 1fr; gap: 12px; }
  .calc-pick { width: 100%; }
  .ab-plate-in .ab-figgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; }
  .ab-plate-in .ab-fig { border: 0; border-bottom: 1px solid var(--line); padding: 18px 16px; }
  .ab-plate-in .ab-fig:nth-child(odd) { border-right: 1px solid var(--line); }
  .ab-plate-in .ab-fig:nth-child(n+3) { border-bottom: 0; }
  .ab-fig b { font-size: 26px; }
  .ab-fig span { font-size: 12.5px; }

  /* ---------- 内容页：图片满宽、表格横滑 ---------- */
  .prose img, .bl-body img, .bl-art-body img, .bl-art-fig img { width: 100%; height: auto; border-radius: var(--r-sm); }
  .prose table, .bl-body table, .bl-art-body table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .prose h2, .bl-body h2, .bl-art-body h2 { font-size: 20px; }
  .prose h3, .bl-body h3, .bl-art-body h3 { font-size: 17px; }
}

/* 平板不接管（保持 app.css 的 768~1080 行为） */