/* ============================================================
   手机端 UI 整体优化（mobile-tune.css）· 2026-11-04 定稿
   只服务 ≤560px 手机端 + 底部固定询盘条，桌面端不受影响
   ============================================================ */

/* ---------- 0. 根治微信强制放大字体 ---------- */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

/* ---------- 底部固定询盘条（手机端） ---------- */
.mob-cta-bar { display: none; }

@media (max-width: 560px) {
  .mob-cta-bar {
    display: block;
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 95;
    background: #FFFFFF;
    border-top: 1px solid #E3E9EB;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  }
  .mob-cta-bar a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 46px;
    border-radius: 999px;
    background: var(--primary, #1E7F8F);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    letter-spacing: 0.2px;
  }
  /* 给固定条留出空间，避免挡住页脚内容 */
  .footer { padding-bottom: 76px; }

  /* ---------- 1. 间距 8pt 网格 ---------- */
  .container { padding: 0 16px; }
  .section { padding: 40px 0; }

  /* ---------- 2. 导航 72 → 56px ---------- */
  .nav-inner { height: 56px; }
  .mobile-menu { top: 56px; }

  /* ---------- 3. 首页 hero：紧凑靠上 + CTA 全宽堆叠 ---------- */
  /* 微信里 100vh 垂直居中会把内容挤到屏幕底部，改自然高度、内容靠上 */
  .hero { height: auto; min-height: 0; padding: 88px 0 40px; }
  .hero-inner { padding-top: 0; padding-bottom: 0; }
  /* 导航栏已有 USHOW.，品牌行重复且占高，手机端隐藏 */
  .hero-brand { display: none; }
  .hero .kicker { font-size: 10.5px; letter-spacing: 1px; margin-bottom: 12px; }
  .hero h1 { font-size: 25px; line-height: 1.14; margin-bottom: 14px; }
  .hero p { font-size: 14px; margin-bottom: 18px; }
  .hero-tags {
    display: flex; flex-wrap: nowrap; overflow: hidden;
    gap: 8px; font-size: 10px; letter-spacing: 0.8px; margin-bottom: 20px;
  }
  .hero-tags span { white-space: nowrap; }
  .hero-ctas { flex-direction: column; gap: 10px; }
  .hero-ctas .btn { width: 100%; height: 46px; font-size: 15px; }

  /* ---------- 4. 板块标题压缩 ---------- */
  .section-head { margin-bottom: 28px; }
  .section-head h2 { font-size: 22px; }
  .section-head p { font-size: 13.5px; }
  .apple-section-title { padding: 32px 0 18px; }
  .apple-section-title h2 { font-size: 22px; }
  .apple-section-title p { font-size: 13.5px; }
  .apple-hero-text { padding: 32px 0 18px; }
  .apple-hero-text h1 { font-size: 26px; }
  .apple-hero-text p { font-size: 14px; }

  /* ---------- 5. 卡片：描述两行截断，高度整齐 ---------- */
  .apple-grid { gap: 12px; }
  .apple-product-body { padding: 12px 10px 14px; }
  .apple-product-body h3 { font-size: 14px; }
  .apple-product-body p {
    font-size: 11.5px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* ---------- 6. 列表页：胶囊更紧凑 ---------- */
  .series-bar { gap: 6px; padding-bottom: 20px; }
  .series-chip { padding: 7px 12px; font-size: 12.5px; }
  .series-pager { padding-top: 26px; }

  /* ---------- 7. 详情页 ---------- */
  .apple-detail-hero { padding: 20px 0 36px; gap: 22px; }
  .apple-detail-info h1 { font-size: 24px; }
  .apple-detail-info .apple-lead { font-size: 14px; margin-bottom: 20px; }
  .apple-detail-media { border-radius: 16px; }
  /* CTA 区全宽堆叠 */
  .pd-actions, .apple-detail-info .hero-ctas { flex-direction: column; }
  .pd-actions .btn, .apple-detail-info .btn { width: 100%; }
  /* 色卡一行改为横向滑动：每张占 44%，保持一行不折行 */
  .pd-cardlib-row {
    gap: 10px;
    overflow-x: auto;
    padding-bottom: 6px;
    scrollbar-width: none;
  }
  .pd-cardlib-row::-webkit-scrollbar { display: none; }
  .pd-cardlib-row figure { flex: 0 0 44%; }
  .pd-cardlib-row img { border-radius: 12px; }
  /* 2×2 图间距收紧 */
  .pd-merged-grid { gap: 12px; }
  /* 规格表 */
  .apple-spec-table th, .apple-spec-table td { font-size: 12.5px; padding: 9px 0; }

  /* ---------- 8. 询盘表单 ---------- */
  .inquiry-card { padding: 20px 16px; border-radius: 14px; }
  .inquiry-form label { font-size: 13px; }
  .inquiry-form input, .inquiry-form textarea { font-size: 15px; min-height: 44px; }
  .inquiry-submit { height: 46px; }

  /* ---------- 9. 展会胶片带 ---------- */
  .expo-frame { height: 260px; }
  .expo-rail { grid-auto-columns: 56px; }
}


/* ---------- 极简约版首屏（手机端）：砍标签行、CTA 一主一次 ---------- */
@media (max-width: 560px) {
  /* 1. 标签行是首屏最大噪音源，隐藏（信息在页脚/关于区都有） */
  .hero-tags { display: none; }

  /* 2. 描述收紧 */
  .hero p { font-size: 13.5px; line-height: 1.55; margin-bottom: 22px; }

  /* 3. CTA 一主一次：实心主按钮 + 无框文字链接 */
  .hero-ctas { flex-direction: column; gap: 6px; align-items: stretch; }
  .hero-ctas .btn { width: 100%; height: 46px; font-size: 15px; }
  .hero-ctas .btn-outline-light {
    background: transparent;
    border: none;
    box-shadow: none;
    color: rgba(255, 255, 255, 0.92);
    font-size: 13.5px;
    height: 34px;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  /* 4. Featured 区块头部收紧（文案不动，只收排版） */
  .section-head p { font-size: 13px; line-height: 1.55; }
}


/* ---------- 10. Company News 手机端重排版（2026-11-04 黄哥反馈太大） ---------- */
@media (max-width: 560px) {
  .news { padding: 44px 0; }
  .news-head { grid-template-columns: 1fr; gap: 28px; }
  .news-badge { font-size: 11px; letter-spacing: 1.4px; padding: 4px 10px; }
  .news-head-left h2 { font-size: 22px; margin-bottom: 10px; }
  .news-head-left p { font-size: 13px; margin-bottom: 18px; }
  .news-list { gap: 10px; }
  .news-item { padding: 13px 14px; border-radius: 10px; }
  .news-item:hover { transform: none; } /* 手机无 hover */
  .news-date { font-size: 11px; margin-bottom: 5px; }
  .news-item h3 { font-size: 14px; margin-bottom: 4px; }
  .news-item p { font-size: 12.5px; margin-bottom: 0; }
}

/* ---------- 11. Why Choose USHOW 手机端 2×2 紧凑 ---------- */
@media (max-width: 560px) {
  .cred-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .cred-card { padding: 16px 10px 14px; border-radius: 12px; }
  .cred-ico { width: 38px; height: 38px; margin-bottom: 8px; border-radius: 10px; font-size: 18px; }
  .cred-card h3 { font-size: 13px; margin-bottom: 5px; }
  .cred-card p {
    font-size: 11.5px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}