/* ==========================================================================
   S29 站点皮肤 · 令牌语义重映射层（必须在 modules.css 之后加载）
   依据：01_站点身份与占位符/site-identity.json + 第三包S29 官方文档
     · 语言 es-MX ｜ 国家 México ｜ 域名槽位 .com.mx
     · 定位 墨西哥东北部制造走廊（Monterrey / Saltillo / Reynosa /
       Nuevo Laredo / Nuevo León / Coahuila / Tamaulipas）
       —— 汽车制造（OEM / Tier1 / Tier2）、重工业与钢铁、NOM 标准合规、
          美墨边境 maquiladora 双语文件
     · 主题色 brand primary #1d4ed8（蓝）→ 组件库 --navy-* 同位重映射
     · 强调色 brand accent  #dc2626（红）→ 组件库 --gold-* 同位重映射
       —— #dc2626 白底 4.83:1（正文可用，但#dc2626 底上写深字只有 3.04:1）
          → 实底 CTA 一律**白字**（4.83:1 ✓）
          文字档取 red-700 #b91c1c（白底 6.47:1 / 浅蓝底 5.95:1）
   对比度实测（WCAG 2.1 相对亮度法）：
     #172554 on white = 14.69:1 ✓ ｜ white on #172554 = 14.69:1 ✓
     #1e3a8a on white = 10.36:1 ✓ ｜ white on #1e3a8a = 10.36:1 ✓
     #1d4ed8 on white =  6.70:1 ✓ ｜ white on #1d4ed8 =  6.70:1 ✓
     #b91c1c on white =  6.47:1 ✓ ｜ white on #dc2626 =  4.83:1 ✓
     #dbeafe on #1e3a8a = 8.49:1 ✓ ｜ #dbeafe on #172554 = 12.04:1 ✓
     #fca5a5 on #172554 = 7.74:1 ✓ ｜ #b91c1c on #eff6ff = 5.95:1 ✓
     #1d4ed8 on #eff6ff = 6.16:1 ✓ ｜ #b91c1c on #fef2f2 = 5.91:1 ✓
   换肤只改这一处 —— 51 个组件零改动复用，站内差异只来自配色令牌。
   ========================================================================== */
:root{
  --navy-900:#172554;   /* 深底渐变起点（白字 14.69:1）＝ blue-950 */
  --navy-800:#1e3a8a;   /* 主色深档：头部/深底区块（白字 10.36:1）＝ blue-900 */
  --navy-700:#1d4ed8;   /* ← 主色 brand primary：链接/标题（白底 6.70:1）＝ blue-700 */
  --navy-500:#3b82f6;   /* 强调描边 / hover（白底 3.68:1，仅用于非文字描边）＝ blue-500 */
  --navy-100:#dbeafe;   /* 深底上的正文色（#1e3a8a 上 8.49:1）＝ blue-100 */
  --navy-50:#eff6ff;    /* 浅色交替区块底 ＝ blue-50 */

  /* 强调色：gold 名下实为「品牌强调」角色。实底 CTA 用 brand accent #dc2626 + 白字
     （4.83:1）；red-300 承担描边/图标/深底强调（与 accent 同族）。 */
  --gold-600:#b91c1c;   /* 文字档（白底 6.47:1）＝ red-700 */
  --gold-500:#dc2626;   /* 实底 CTA 底（配 .btn-gold 白字 4.83:1）＝ brand accent red-600 */
  --gold-300:#fca5a5;   /* 深底上的强调（#172554 上 7.74:1）＝ red-300 */
  --gold-50:#fef2f2;    /* 浅强调底（#b91c1c 上 5.91:1）＝ red-50 */

  /* 强调**文字**档：库用 --gold-ink 承载 --accent-ink（kicker / .more / .res /
     .arr / .yr / 认证标记）。默认 #8a6a12 是橄榄金，与本站红强调分叉 → 一并收编。
     深色表面由库内声明 --accent-ink:var(--gold-300) 自动翻到 --gold-300。 */
  --gold-ink:#b91c1c;

  --border:#cdd9f0;     /* 蓝灰边框，跟随主色 */
  --surface:#fff;

  --shadow-sm:0 1px 2px rgba(23,37,84,.06);
  --shadow:0 4px 14px rgba(23,37,84,.08);
  --shadow-lg:0 14px 34px rgba(23,37,84,.14);
  --shadow-gold:0 4px 14px rgba(220,38,38,.28);

  /* assets/img 为空时的降级块底色，跟随蓝色系 */
  --ph-tint:#e6edfb;
}

/* 实底 CTA：#dc2626 底 + 白字（4.83:1）。库默认深字压红底只有 3.04:1，必须翻白。 */
.btn-gold{ color:#fff; }
.btn-gold:hover{ background:#b91c1c; color:#fff; }

/* 降级块在蓝色系皮肤下的底色 */
.img-ph{
  background:
    linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,0) 58%),
    repeating-linear-gradient(45deg, rgba(29,78,216,.045) 0 9px, rgba(29,78,216,0) 9px 18px),
    var(--ph-tint);
}

/* --------------------------------------------------------------------------
   组件库内「写死的 S02 藏蓝/金值」（不走令牌）—— 皮肤层逐点收编。
   来源：对 modules.css 全量色值扫描（同 S08/S11/S14/S17/S23/S26 方法）。
   注意：`.m-cert .ic / .m-quote .q-mark / .m-toc / .m-rel .arr / .m-tl .yr`
   已走 var(--accent-ink)，由上面的 --gold-ink 改写统一收编，此处不再重复声明。
   -------------------------------------------------------------------------- */

/* 01/01 Hero 基类：原 linear-gradient(#061a33,#0a2547,#0f3460) → S29 蓝阶 */
.m-hero{ background:linear-gradient(135deg,#172554,#1e3a8a 60%,#1d4ed8); }
.m-hero::after{ background:radial-gradient(circle,rgba(220,38,38,.26),transparent 68%); }
.m-hero .lead{ color:#dbeafe; }        /* 原蓝白 #d6e4f5 → navy-100 */

/* 08/01 Header 变体 B（全站头部）：原 rgba(6,26,51,.97)/rgba(10,37,71,.94) */
.m-hdr[data-v="b"]{
  background:linear-gradient(180deg,rgba(23,37,84,.97),rgba(30,58,138,.94));
  border-bottom-color:rgba(220,38,38,.38);
}

/* 图标底衬（全库共用 .ic-box） */
.ic-box{ background:rgba(220,38,38,.10); }

/* 01/08 数据统计（深底卡）：标签文字原蓝白 */
.m-stats .l{ color:#dbeafe; }

/* 01/05 信任标识变体 C（深底徽章） */
.m-trust[data-v="c"] .badge{ background:var(--navy-800); border-color:rgba(220,38,38,.42); color:#fff; }

/* 02/05 定制项 hover 图标底（库内两处同名声明，一并收编） */
.m-feat .card:hover .ic-box{ background:rgba(220,38,38,.18); }

/* 02/07 + 06/01 表单聚焦环（两处同选择器） */
.fld input:focus,.fld select:focus,.fld textarea:focus{
  border-color:var(--gold-500); box-shadow:0 0 0 3px rgba(220,38,38,.16); }

/* 03/02 功能清单对比 高亮列 */
.m-cmp .hot{ background:rgba(220,38,38,.07); }

/* 09/02 产品对比 高亮列（保留左右描边） */
.m-pcmp .hot{ background:rgba(220,38,38,.07);
  border-left:2px solid var(--gold-500); border-right:2px solid var(--gold-500); }

/* 03/03 演示块播放钮 */
.m-demo .play span{ background:rgba(23,37,84,.82); }

/* 07/02 资源下载锁（浅红圆底 + 深红图标由令牌承担） */
.m-gate .lock{ background:rgba(220,38,38,.10); color:var(--gold-600); }

/* 08/04 弹窗遮罩 */
.m-modal{ background:rgba(23,37,84,.62); }

/* 深底描边按钮兜底：rgba(15,52,96,*) → navy-800 系 */
.m-hero[data-v="b"] .btn-line-w,.m-cta[data-v="b"] .btn-line-w,.m-hdr[data-v="c"] .btn-line-w,
.m-stats[data-v="b"] .btn-line-w,.m-feat[data-v="c"] .btn-line-w{
  color:var(--navy-700); border-color:rgba(30,58,138,.35); }
.m-hero[data-v="b"] .btn-line-w:hover,.m-cta[data-v="b"] .btn-line-w:hover{
  background:rgba(30,58,138,.07); color:var(--navy-700); }

/* 05/03 色板卡半格：原 #c9a227 金 / #0f3460 藏蓝 → S29 红/蓝 */
.m-sop .swatch.a{ background:linear-gradient(135deg,#fef2f2 50%,#dc2626 50%); }
.m-sop .swatch.c{ background:linear-gradient(135deg,#eff6ff 50%,#1e3a8a 50%); }

/* 03/04 倒计时数字块（库内 §54.15 二次声明写死 rgba(10,37,71,.55) + 金描边）。
   —— 本站 03/04 属禁渲染组件（制造紧迫感，交底禁止词），此条为完整性收编，
      实际不产生渲染；保留可避免「换肤清单漏项」在下一次扫描中报异。 */
.m-count .u b{ background:rgba(30,58,138,.55); border:1px solid rgba(220,38,38,.38); }

/* —— 揭示动画例外（皮肤层处理，不改组件库）——
   01/04 是横向跑马灯：.m-logo .view{overflow:hidden} 裁剪 + .track{animation:marq 32s}
   横向位移。库内 _decorate_reveal() 给每个重复单元统一加 .rv，而 html.js .rv{opacity:0}
   直到 IntersectionObserver 命中才置 .in；被裁剪到可视区外的 item **永远不会命中**
   → 永久 opacity:0，跑马灯转到可见区时是空白（实测首页 16 个 item 中 12 个永不揭示）。
   跑马灯自带位移动画，揭示动画对其无意义 → 皮肤层对 item 直接放行。
   variant b（.track{animation:none;flex-wrap:wrap}）本就不受影响，一并放行无副作用。 */
html.js .m-logo .track .item{ opacity:1 !important; transform:none !important; }

/* ===== S29 补齐模块（MX navy+red） ===== */
.m29-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.m29-metric{border:1px solid var(--border,#cdd9f0);border-top:3px solid #dc2626;background:#fff;padding:20px;text-align:center}
.m29-metric .n{font-size:30px;font-weight:800;color:#1e3a8a;line-height:1.1}
.m29-metric .l{font-size:13px;color:#64748b;margin-top:6px}
.m29-lc{position:fixed;left:22px;bottom:26px;z-index:900;display:flex;flex-direction:column;gap:10px}
.m29-lc-btn{width:54px;height:54px;border-radius:50%;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;font-size:22px;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.m29-wa{background:#25d366}
.m29-chat{background:linear-gradient(135deg,#1e3a8a,#dc2626)}
.m29-pop{position:fixed;left:22px;bottom:92px;z-index:950;width:300px;background:#fff;border:1px solid var(--border,#cdd9f0);border-top:4px solid #dc2626;border-radius:12px;padding:20px;display:none;box-shadow:0 12px 30px rgba(23,37,84,.2)}
.m29-pop.open{display:block}
.m29-pop h4{margin:0 0 6px;color:#172554}
.m29-pop p{margin:0 0 12px;font-size:13px;color:#64748b}
.m29-pop input,.m29-pop textarea{width:100%;box-sizing:border-box;padding:11px;border:1px solid var(--border,#cdd9f0);border-radius:8px;margin-bottom:10px;font-size:14px}
.m29-pop .btn{width:100%}
.m29-top{position:fixed;right:22px;bottom:26px;width:46px;height:46px;border-radius:50%;background:#172554;color:#fff;border:1px solid #dc2626;cursor:pointer;font-size:20px;z-index:900;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:.3s;box-shadow:0 4px 14px rgba(23,37,84,.35)}
.m29-top.show{opacity:1;pointer-events:auto}

/* hero real photo */
.m-hero .m-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;display:block;}
.m-hero .m-hero-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(8,18,40,.85) 0%,rgba(8,18,40,.5) 55%,rgba(8,18,40,.15) 100%);}
.m-hero .wrap,.m-hero .hero-in{position:relative;z-index:2;}

/* === lingomere logo rollout 2026-09-28 === */
a.brand, header .brand, .main-header .brand, .site-header .brand, .m-hdr .brand {
  max-width: none !important;
  overflow: visible !important;
  white-space: nowrap !important;
}
.brand-logo, .brand .mark, .brand .lg, .brand .brand-mark {
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center;
  padding: 0 !important;
  max-width: none !important;
}
.brand-logo-img, .brand .mark img, .brand .lg img, .brand .brand-mark img {
  height: 36px !important;
  width: auto !important;
  max-width: none !important;
  border-radius: 0 !important;
  display: inline-block !important;
}
.brand-text, .brand .mark + span, .brand .lg + span, .brand .brand-mark + span {
  display: none !important;
}
.brand-logo::after, .brand .mark::after, .brand .lg::after, .brand .brand-mark::after {
  display: none !important;
}

/* === LOGO放大后导航换行修复 20260928 === */
.m-hdr .bar, .bar.bar--nav {
  flex-wrap: nowrap !important;
  min-height: var(--header-h, 88px) !important;
  gap: 14px !important;
}
.m-hdr .bar .nav, .bar .nav {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
.m-hdr .bar .nav ul, .bar .nav ul {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 2px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.m-hdr .bar .nav li, .bar .nav li {
  white-space: nowrap !important;
}
.m-hdr .bar .nav a.top, .bar .nav a.top {
  font-size: 13.5px !important;
  padding: 9px 10px !important;
  white-space: nowrap !important;
}
.m-hdr .brand, .bar .brand {
  flex: 0 0 auto !important;
}

/* ============================================================
   m-cust 卡片化改造 (2026-09-30) — 仅本站 skin, 不触碰共享 modules.css
   3 个 fieldset x 3 个带真实图片的单选卡片 (radio 交互与 name/type 不变)
   ============================================================ */
.m-cust .form{ max-width:none; }
.m-cust .opts{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.m-cust[data-v="b"] .opts{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.m-cust .opt.cust-opt{
  display:flex; flex-direction:column; align-items:stretch; gap:0; padding:0;
  border:1px solid var(--border); border-radius:14px; overflow:hidden;
  background:var(--surface); cursor:pointer; text-align:left; min-width:0;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.m-cust .opt.cust-opt .cust-img{
  display:block; width:100%; height:110px; object-fit:cover;
  background:var(--navy-50); border-radius:0;
}
.m-cust .opt.cust-opt .cust-body{
  display:flex; align-items:flex-start; gap:8px; padding:10px 12px 12px;
  font-size:13.5px; line-height:1.35; color:var(--navy-700);
  flex:1 1 auto; min-width:0;
}
.m-cust .opt.cust-opt input[type="radio"]{ flex:0 0 auto; margin-top:2px; accent-color:var(--gold-600); }
.m-cust .opt.cust-opt .cust-txt{ overflow-wrap:anywhere; }
.m-cust .opt.cust-opt:hover{ border-color:var(--gold-500); box-shadow:var(--shadow-sm); }
.m-cust .opt.cust-opt:has(input:checked){
  border-color:var(--gold-600); box-shadow:0 0 0 2px rgba(201,162,39,.45); background:var(--gold-50);
}
@media (max-width:900px){ .m-cust .opts{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .m-cust .opts{ grid-template-columns:minmax(0,1fr); } }