/* ==========================================================================
   华清检测 · 移动端触屏优化补丁 (≤720px)
   引入位置:index.html <head> 末尾,在内联 <style> 之后,保证 source order 胜出
   不使用 !important,通过 source order + 选择器覆盖既有 ≤720 块

   注意:本文件全部用 hex/rgb 不用 oklch,因 headless Chrome 旧版对 oklch
   渲染差异会导致 Lighthouse 看到 fallback 颜色,A11y 检测失真。
   ========================================================================== */

/* 装饰性小字对比度修复 (Lighthouse A11y · 全屏尺寸,非媒体查询) */
:root { --accent-on-light: #127a48; }  /* 浅底专用,对比度 4.6 */

/* 浅色 section 的装饰性小字 */
.eyebrow .num,
.cats-cell .num,
.cats-cell .count span { color: #1a7a44; }   /* 浅底 5.2 */
.cats-cell .count span:first-child { color: #1a7a44; }  /* 覆盖 line 652 更高特异性的 :first-child */
.eyebrow .name { color: #5b6b75; }          /* 浅底 5.0 */
.stats .eyebrow,
.pagefoot .credit a { color: var(--accent-on-light); }   /* 浅底 4.6 */

/* 深色 section(.cta 和 .industries 用 #050a0e)上的 .eyebrow 用亮色 */
.cta .eyebrow .num,
.industries .eyebrow .num { color: #3eaa6e; }        /* 深底 5.87 */
.cta .eyebrow .name,
.industries .eyebrow .name { color: #b5bcc2; }       /* 浅灰 深底 8.4 */

/* 按钮白字 on 亮绿底 3.02 → 4.58,加深按钮背景
   只改 .btn-brand(主 CTA)和 .btn-primary(表单),不碰 .btn-secondary(透明+黑字) */
.hero-cta .btn.btn-brand,
.form-submit .btn-primary,
.cta .btn-primary { background: #0d7e48; }
.cta .btn-primary:hover { background: #158050; }

/* 辅助文字上调(覆盖原 .hero-badge font-size:10px 等) */
@media (max-width: 720px) {
  .field label,
  .eyebrow,
  .meta,
  .ref-id { font-size: 12px; }

  .hero-badge { font-size: 11px; padding: 5px 9px; }

  .testi-foot .foot-num { font-size: 44px; }

  /* 表单输入框触屏达标 ≥44px (iOS HIG / Material 规范) */
  .field .input,
  .field .textarea,
  .field select {
    padding: 14px 0;
    min-height: 44px;
    box-sizing: border-box;
  }
  .field .textarea { min-height: 110px; }

  /* checkbox 单列化,降低误点 */
  .checkbox-group {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  /* hero 顶部留白收紧,首屏不被顶下 */
  .hero {
    padding-top: 96px;
    padding-bottom: 56px;
  }

  /* hero h1 在小屏进一步收(原 clamp 下限 40px 在 ≤375 偏大) */
  .hero h1 { font-size: clamp(32px, 9vw, 44px); }
}