/* wap.css — 移动端原生层（≤767px 专用；用 <link media="(max-width:767px)"> 引入，桌面零加载）
   依据《移动端技术研究》README/06：移动原生组件，不做"栅格降列"。
   铁律：1fr 不是"能缩到 0" → 一律 minmax(0,1fr) + 子项 min-width:0
   铁律：fixed 抽屉的祖先链不得有 filter/backdrop-filter/transform/contain */

@media (max-width:767px){

  /* ---------- 0. 安全区 & 基础 ---------- */
  :root{ --tabbar-h:60px; --safe-b:env(safe-area-inset-bottom,0px); }
  html{ -webkit-text-size-adjust:100%; }
  body{ padding-bottom:calc(var(--tabbar-h) + var(--safe-b) + 6px); }
  a,button,summary{ -webkit-tap-highlight-color:transparent; }
  input,select,textarea{ font-size:16px !important; }        /* 防 iOS 聚焦缩放 */

  /* 坑#1：header 的 backdrop-filter 会为 fixed 后代建立 containing block → 困住抽屉 */
  .head{ backdrop-filter:none !important; -webkit-backdrop-filter:none !important; background:var(--paper); position:sticky; top:0; z-index:60; }
  .head.scrolled{ box-shadow:0 6px 20px rgba(19,41,75,.10); }

  /* ---------- 1. 溢出根治 ---------- */
  .wrap{ padding-left:16px; padding-right:16px; }
  .sec-head{ flex-wrap:wrap; align-items:flex-start; gap:8px 12px; }
  .sec-head .more{ margin-left:auto; }
  .mkstrip{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .mkstrip a{ min-width:0; padding:14px 12px; }
  .mkstrip span{ font-size:15px; min-width:0; overflow-wrap:anywhere; }
  .famgrid,.grid-4,.grid-3,.cd-cols2,.cd-cols3,.capgrid,.ansgrid,.contact-grid,.grid-2{ grid-template-columns:minmax(0,1fr) !important; }
  .famgrid>*,.grid-4>*,.grid-3>*,.cd-cols2>*,.cd-head>*{ min-width:0; }
  .stats{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .stats>div{ min-width:0; overflow:hidden; }
  .stats dt,.stats dd{ min-width:0; overflow-wrap:anywhere; word-break:break-word; }
  .ansdetail .stats{ grid-template-columns:minmax(0,1fr) !important; }
  .ansdetail,.ansmain,.ansaside{ grid-template-columns:minmax(0,1fr) !important; }
  .ansaside,.ansaside .panel{ min-width:0; max-width:100%; }
  .ansaside .panel .btn,.ansaside .panel a,.ansaside .panel p{ max-width:100%; min-width:0; overflow-wrap:anywhere; word-break:break-word; }
  .btn-block{ white-space:normal; }
  .foot-cta-b{ flex-wrap:wrap; }
  .foot-cta-b .btn{ flex:1 1 100%; justify-content:center; text-align:center; white-space:normal; }
  .foot-cta>div,.foot-cta-b{ min-width:0; max-width:100%; }
  .foot-grid,.foot-ans{ grid-template-columns:minmax(0,1fr) !important; }
  .foot-ans ul,.ansstrip ul{ grid-template-columns:minmax(0,1fr) !important; }
  main,section,div{ min-width:0; }
  table{ min-width:0 !important; }
  .scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .kwgrid{ gap:6px; }

  /* ---------- 2. 触控目标 ≥44 ---------- */
  .btn,.btn-wa,.more,.footer a,.foot a,.nav a{ min-height:44px; display:inline-flex; align-items:center; }
  .cd-cur button{ min-height:44px; padding:0 18px; }
  .cd-badges span{ min-height:32px; display:inline-flex; align-items:center; }
  summary{ min-height:44px; display:flex; align-items:center; justify-content:space-between; gap:10px; cursor:pointer; }
  summary::after{ content:"+"; font-family:var(--mono); font-size:18px; color:var(--amber-d); }
  details[open]>summary::after{ content:"–"; }
  .pager a{ min-height:44px; display:inline-flex; align-items:center; padding:0 14px; }
  .anschip,.kwchip,.pill{ min-height:44px; display:inline-flex; align-items:center; }
  .langdd>summary{ min-height:44px; }

  /* ---------- 3. 顶部：汉堡 + 全屏抽屉 ---------- */
  .head-row{ min-height:60px; padding:8px 16px !important; flex-wrap:nowrap !important; max-width:100%; overflow:hidden; }
  .head-row>.brand{ min-width:0; flex:1 1 auto; overflow:hidden; }
  .brand-name{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .head-right{ flex:0 0 auto; display:flex; align-items:center; gap:8px; margin-left:0 !important; }
  .head-right>.btn-wa{ display:none; }             /* WhatsApp 已在 tabbar，header 不再占位 */
  .nav{ display:none !important; }                 /* 桌面横排导航在移动端隐藏，走抽屉 */
  .brand-name{ font-size:18px; }
  .brand-co img{ height:22px; }
  .m-burger{ display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; margin-left:4px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--card); color:var(--ink); }
  .m-burger svg{ width:22px; height:22px; }

  .m-nav{ display:none; position:fixed; inset:0; z-index:200; background:var(--paper); flex-direction:column; }
  .m-nav.open{ display:flex; }
  .m-nav-top{ display:flex; align-items:center; justify-content:space-between; padding:12px 16px; border-bottom:1px solid var(--line); }
  .m-nav-close{ width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--card); font-size:22px; line-height:1; color:var(--ink); }
  .m-nav ul{ list-style:none; margin:0; padding:8px 16px; overflow-y:auto; flex:1; }
  .m-nav a{ display:flex; align-items:center; min-height:52px; font-size:17px; color:var(--ink); border-bottom:1px solid var(--line); font-weight:600; }
  .m-nav-foot{ padding:14px 16px calc(var(--safe-b) + 16px); border-top:1px solid var(--line); display:flex; flex-direction:column; gap:10px; }

  /* ---------- 4. 底部 tabbar ---------- */
  .m-tabbar{ position:fixed; left:0; right:0; bottom:0; z-index:120; background:rgba(255,255,255,.97);
    backdrop-filter:blur(8px); border-top:1px solid var(--line);
    display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
    padding-bottom:var(--safe-b); height:calc(var(--tabbar-h) + var(--safe-b)); }
  .m-tabbar a{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
    font-family:var(--mono); font-size:10.5px; letter-spacing:.02em; color:var(--muted); text-decoration:none; min-width:0; }
  .m-tabbar a svg{ width:20px; height:20px; }
  .m-tabbar a.on{ color:var(--ink); font-weight:700; }
  .m-tabbar a.on svg{ color:var(--amber-d); }
  .m-tabbar a.m-wa{ color:#25D366; }
  .m-tabbar a.m-wa svg{ color:#25D366; }

  /* 悬浮 WhatsApp 与 tabbar 重叠 → 移动端上移 */
  .wa-float{ bottom:calc(var(--tabbar-h) + var(--safe-b) + 12px) !important; }
  .wa-float .wa-float-t{ display:none; }

  /* ---------- 5. 卡片化表格（.spec/.rtx/.fact 窄屏变卡片） ---------- */
  .spec thead,.rtx thead,.fact thead{ display:none; }
  .spec tr,.rtx tr,.fact tr{ display:block; border-bottom:1px solid var(--line); padding:10px 0; }
  .spec td,.rtx td,.fact td,.spec th,.fact th{ display:flex; justify-content:space-between; gap:12px; border:0; padding:6px 0; text-align:right; }
  .spec td:first-child,.spec th:first-child{ font-weight:600; }
  .cd-specs{ grid-template-columns:minmax(0,1fr) !important; }
  .grid{ grid-template-columns:minmax(0,1fr) !important; }
  .cd-cta,.hero-cta{ flex-wrap:wrap; }
  .cd-cta .btn,.hero-cta .btn{ flex:1 1 100%; min-width:0; justify-content:center; white-space:normal; }
  .cd-cur{ align-self:flex-start; }

  /* D10 横滑画廊：缩略图不再 4 列小格，改单行横滑 + scroll-snap */
  .thumbs{ display:flex; flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch;
    scroll-snap-type:x mandatory; gap:8px; margin-top:10px; padding-bottom:6px; scrollbar-width:none; }
  .thumbs::-webkit-scrollbar{ display:none; }
  .thumbs img{ flex:0 0 auto; width:72px; height:72px; aspect-ratio:auto; scroll-snap-align:start;
    border-radius:var(--r-sm); border:1px solid var(--line); object-fit:cover; }
  /* 主图也支持左右滑（横向 snap 卡片） */
  .cd-main{ aspect-ratio:4/3; }
}

/* 超窄屏（≤400）：品牌只留标记，避免把名字截成 "Jetour US…" */
@media (max-width:400px){
  .brand-name{ display:none; }
}

/* ---------- 平板 768–980：抽屉同款全屏、默认不常显 ---------- */
@media (min-width:768px) and (max-width:980px){
  .m-nav{ display:none; position:fixed; inset:0; z-index:200; background:var(--paper); flex-direction:column; }
  .m-nav.open{ display:flex; }
}