/* ═══════════════════════════════════════════════════════════════════════════
   鲸程企服官网 v3.1 · 浅色商务设计系统  assets/site.css
   构建日期 2026-09-24 · 上位规格 docs/superpowers/specs/2026-09-24-v3-revision-light-no-forms.md §1
   字体、图形、脚本一律本地，不外链任何字体或 CDN。照片不再用于任何装饰位置。

   ── 设计语言三句话 ───────────────────────────────────────────────────────────
   1. 白底（#FFFFFF）为主，浅灰蓝（#F6F8FB）做节奏区块，1px #E5E9F0 细线划分结构；
      品牌蓝 #194E94 是唯一主色，亮蓝 #2287BF 做强调与图形第二色，没有金色。
   2. 结构即信息：区块标题左侧一道 2px 品牌蓝竖线，区块之间一道渐隐蓝发丝线；
      卡片是 3px 圆角 + 1px 描边（不堆投影），卡片底色与所在区块底色互为反色。
   3. 深色只留一处：每页页底转化区（.sec--ink，深蓝渐变）。其余全部浅底，
      数据与图表是视觉主角——深蓝大数字、SVG 条形图/环形图/步骤图自己说话。

   ══ 可用 class 清单（写页面按此，勿新增同类 class）══════════════════════════

   ▌布局与容器
   .container              主容器，最大 1200px，两侧自适应留白（移动 16px）
   .container--narrow      阅读宽度容器，最大 780px（正文长文用）
   .container--wide        最大 1360px（宽表格、四列网格用）
   .sec                    区块，上下 96px（≥1200px 时 112px）；白底
   .sec--tight             上下留白减半（56px）
   .sec--alt               浅灰蓝节奏区块 #F6F8FB
   .sec--paper             白底 + 上下细线的阅读区（表格与 FAQ 放这里）
   .sec--art               纹样底区块（细网格/波纹，替代原来的照片底）
   .sec--ink               深蓝区块，每页最多一个（页底转化区已占用）
   .sec--flush-top         去掉本区块上留白
   .sec-div                区块间的渐隐蓝发丝线（<hr class="sec-div">）
   .grid                   网格；配 .grid--2 / --3 / --4 / --auto 控制列数
   .grid--gap-sm           网格间距 16px（默认 24px）
   .split                  左右两栏 1.25fr/1fr，≤1024 堆叠
   .split--form            左内容 + 右联系卡（首屏用），≤1024 堆叠
   .stack                  纵向堆叠 20px；.stack--tight 12px；.stack--loose 32px

   ▌排版
   .sec-head / .sec-label / .sec-title / .sec-lead    区块标题组
   .page-title / .page-lead                            子页 h1 与导语
   .h3 .lead .prose .fine .note .num .nowrap

   ▌按钮
   .btn .btn--primary（品牌蓝实心）.btn--line（品牌蓝描边）
   .btn--gold（= .btn--line 旧名）.btn--ghost
   .btn--lg .btn--sm .btn--block .btn-row

   ▌首屏
   .hero .hero-inner .hero-copy .hero-title .hero-sub .hero-deco .hero-acts
   .statband .statband-eyebrow                        首屏下方全宽数字带（wave-p2）

   ▌卡片与列表
   .card .card--rule .card--step .card--link .card-num .card-title .card-text
   .card-more .pain-list .pain-label .tick-list .kv-list .tag
   .rowlist .rowlist-item .rowlist-num .rowlist-name .rowlist-body .word-grid .word-item

   ▌数据与图表（src/templates/partials/charts.html）
   .stat-band .stat .stat-num .stat-unit .stat-label .count
   .chart .chart-head .chart-title .chart-note      图表外框
   .bars .bar-row .bar-name .bar-track .bar-seg .bar-seg--before .bar-seg--after
   .bar-val .bar-delta .bars-legend                  条形对比图
   .radial .radial-list .radial-item                 环形放射图
   .donut .donut-legend                              环形占比图
   .steps .step .step-dot .step-no .step-title .step-desc   横向步骤图
   .mtx .mtx-col .mtx-cell .mtx-mark                 视觉矩阵
   .netmap .netmap-cap                               全国网络抽象图
   .counter-band .counter .counter-num               大数字条

   ▌表格
   .table-wrap .table-wrap--paper .data-table .col-hi .cell-growth
   .table-cap-note .compare-note

   ▌FAQ / 时间线 / 流程 / 面包屑
   .faq-list .faq-item .faq-q .faq-a .anchor-nav
   .timeline .timeline-item .timeline-time .timeline-body
   .flow .flow-step .flow-num（旧流程条，新页面优先用 .steps）
   .breadcrumb

   ▌图形与证书
   .art-band .art-grid .art-figure .art-cap .art-band--n3
   .honor-grid .honor-figure .honor-cap .netmap .netmap-cap

   ▌联系组件（替代原表单，src/templates/partials/contact-block.html）
   .contact-block .contact-block--hero .contact-block-head .contact-main
   .phone-label .phone-big .phone-note .contact-qr .qr-placeholder .qr-cap
   .contact-line .contact-line-text .contact-line-actions
   .qr-pop .qr-pop-inner                二维码小卡（吸底栏/悬浮/contact_line 共用）
   .cta-final .cta-final--plain .cta-final-acts
   .case-card .case-card-metric .growth .growth-from .growth-arrow .growth-to

   ▌全站构件（base.html 已输出，页面无需重复）
   .site-header / .header-inner / .brand / .nav / .nav-item / .nav-panel
   .header-cta / .header-phone / .drawer / .drawer-toggle
   .mobile-bar / .dock / .dock-btn / .dock-label
   .site-footer / .footer-top / .footer-cols / .footer-bottom / .footer-legal

   ▌工具类
   .reveal .count .sr-only .center .mt-0 .mt-sm .mt-md .mt-lg
   ═══════════════════════════════════════════════════════════════════════════ */

/* ─────────────────────────── 1. Tokens ─────────────────────────── */
:root {
  /* 底色 */
  --bg: #FFFFFF;
  --band: #F6F8FB;
  --band-2: #EEF2F8;
  --tint: #EAF2FB;
  --tint-soft: #F2F7FD;

  /* 品牌蓝 */
  --brand: #194E94;
  --brand-hi: #2287BF;
  --brand-dark: #123A70;
  --brand-deep: #0E2E5B;
  --brand-12: rgba(25, 78, 148, .12);
  --brand-20: rgba(25, 78, 148, .20);
  --brand-32: rgba(25, 78, 148, .32);

  /* 文字 */
  --fg: #1B2431;
  --fg-dim: #5B6676;
  --fg-faint: #8794A5;

  /* 线 */
  --line: #E5E9F0;
  --line-strong: #D3DBE7;

  /* 页脚（wave-p1）：全站最深的一块，深海蓝 + 浅蓝白字 */
  --footer-bg: #0F2C5C;
  --footer-fg: #EAF0F8;
  --footer-dim: #A9C2E0;
  --footer-line: rgba(255, 255, 255, .13);
  --footer-hi: #7FC4E8;

  /* 深色区块（每页 ≤1 个） */
  --ink: #123A70;
  --ink-2: #0E2E5B;
  --ink-fg: #FFFFFF;
  --ink-dim: #C6D8EE;
  --ink-faint: #9CB5D6;
  --ink-line: rgba(255, 255, 255, .16);
  --ink-accent: #7FC4E8;

  /* 字体 */
  --font: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC",
    "Source Han Sans SC", "Heiti SC", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-num: "DIN Alternate", "DIN Condensed", "Bahnschrift", "Haettenschweiler",
    "Helvetica Neue", "Arial Narrow", "PingFang SC", sans-serif;

  /* 字号阶梯（1.25 为主，显示层放大到 1.333） */
  --fs-hero: clamp(30px, 4.6vw, 54px);
  --fs-h1: clamp(27px, 3.6vw, 42px);
  --fs-h2: clamp(23px, 2.7vw, 34px);
  --fs-h3: clamp(18px, 1.5vw, 21px);
  --fs-lead: clamp(16px, 1.25vw, 18px);
  --fs-body: 16px;
  --fs-sm: 14px;
  --fs-xs: 12.5px;
  --fs-stat: clamp(42px, 5.4vw, 68px);

  /* 间距 */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 96px;
  --sp-10: 128px;

  --r: 3px;
  --r-lg: 5px;
  --gutter: 24px;
  --header-h: 76px;
  /* wave-s2：页头滚动后收起的高度（.site-header.is-stuck 的 height），
     吸顶的页内锚点条按它定位，两条吸顶栏之间才不会露缝 */
  --header-h-stuck: 62px;
  --ease: cubic-bezier(.22, .61, .36, 1);

  /* 纹样：细网格 + 斜向浅蓝渐隐（自绘，无外部引用） */
  --grid-pattern:
    linear-gradient(0deg, rgba(25, 78, 148, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(25, 78, 148, .055) 1px, transparent 1px);
}

/* ─────────────────────────── 2. Reset & base ─────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 16px);
}

body {
  margin: 0;
  font-family: var(--font);
  font-size: var(--fs-body);
  line-height: 1.75;
  color: var(--fg);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

body.is-locked { overflow: hidden; }

img, svg, canvas { display: block; max-width: 100%; }
img { height: auto; }

h1, h2, h3, h4 { margin: 0; font-weight: 700; line-height: 1.28; letter-spacing: -.01em; color: var(--fg); }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; }
li { list-style: none; }

a { color: var(--brand); text-decoration: none; }
a:hover { color: var(--brand-hi); text-decoration: underline; text-underline-offset: 3px; }

:focus-visible {
  outline: 2px solid var(--brand-hi);
  outline-offset: 3px;
  border-radius: 2px;
}

::selection { background: var(--tint); color: var(--brand-dark); }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ─────────────────────────── 3. 布局 ─────────────────────────── */
/* wave-p1（修订单 4 §C-11）：全站只允许一个内容容器宽度。
   原来的 .container--narrow（780）与 .container--wide（1360）已从模板里删干净，
   长正文改成 .readrow 两栏栅格（左小标 + H2 / 右正文）。这里保留两个类名只是兜底：
   万一还有遗漏，它们也和 .container 一样宽，不会再出现「宽度不匹配」。 */
.container,
.container--narrow,
.container--wide {
  width: 100%;
  max-width: 1160px;
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.sec {
  position: relative;
  padding-block: var(--sp-9);
}
.sec--tight { padding-block: var(--sp-7); }
/* wave-r3：提一级特异性。原来写成 .sec--flush-top（0,1,0），会被后面媒体查询里的
   .sec { padding-block: … }（同特异性、位置更靠后）盖掉，≥1200px 时上留白根本没去掉。 */
.sec.sec--flush-top { padding-top: 0; }

.sec--alt { background: var(--band); }

/* 阅读区：白底 + 上下细线，和相邻白底区块拉开层次 */
.sec--paper {
  background: var(--bg);
  border-block: 1px solid var(--line);
}
.sec--alt + .sec--paper,
.sec--paper + .sec--alt { border-top: 0; }

/* 纹样区块：细网格 + 一层浅蓝光晕，不用照片 */
.sec--art {
  background-color: var(--tint-soft);
  background-image:
    radial-gradient(760px 420px at 88% 8%, rgba(34, 135, 191, .10), transparent 66%),
    radial-gradient(620px 380px at 4% 96%, rgba(25, 78, 148, .07), transparent 68%),
    var(--grid-pattern);
  background-size: auto, auto, 34px 34px, 34px 34px;
  border-block: 1px solid var(--line);
}

/* 转化区块：每页最多一个。
   wave-p1（修订单 4 §B-10）：从「最深」降为「中等深度品牌蓝」——
   页面配色顺序必须是 浅（正文区）→ 中（转化区）→ 最深（页脚）。
   background-color 单独写成实色，页脚与它比亮度时取的就是这个值。 */
.sec--ink {
  background-color: #194E94;
  background-image:
    radial-gradient(880px 520px at 84% -6%, rgba(127, 196, 232, .26), transparent 62%),
    linear-gradient(152deg, #16457F 0%, #194E94 46%, #1E6699 100%);
  color: var(--ink-fg);
}
.sec--ink h1, .sec--ink h2, .sec--ink h3,
.sec--ink .sec-title, .sec--ink .page-title, .sec--ink .card-title { color: var(--ink-fg); }
.sec--ink .sec-lead, .sec--ink .card-text, .sec--ink p { color: var(--ink-dim); }
.sec--ink .fine { color: var(--ink-faint); }
.sec--ink .sec-label { color: var(--ink-accent); }
.sec--ink .sec-label::before { background: var(--ink-accent); }
.sec--ink a { color: var(--ink-accent); }
.sec--ink .card { background: rgba(255, 255, 255, .06); border-color: var(--ink-line); }
.sec--ink .card--rule { border-left-color: var(--ink-accent); }
.sec--ink .note { background: rgba(255, 255, 255, .06); border-left-color: var(--ink-accent); color: var(--ink-dim); }
.sec--ink .tick-list > li { color: var(--ink-dim); }
.sec--ink .tick-list > li::before { border-color: var(--ink-accent); }
.sec--ink .tag { border-color: var(--ink-line); background: rgba(255, 255, 255, .08); color: var(--ink-fg); }

.sec-div {
  height: 1px;
  margin: 0;
  border: 0;
  background: linear-gradient(90deg, transparent, var(--line) 18%, var(--line-strong) 50%, var(--line) 82%, transparent);
}

.grid { display: grid; gap: var(--sp-5); }
.grid--gap-sm { gap: var(--sp-4); }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid--auto { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }

.split { display: grid; gap: var(--sp-7); grid-template-columns: 1.25fr 1fr; align-items: start; }
.split--form { display: grid; gap: var(--sp-7); grid-template-columns: minmax(0, 1fr) 400px; align-items: start; }

.stack { display: flex; flex-direction: column; gap: var(--sp-5); }
.stack--tight { gap: var(--sp-3); }
.stack--loose { gap: var(--sp-6); }

.center { text-align: center; }
.mt-0 { margin-top: 0; }
.mt-sm { margin-top: var(--sp-3); }
.mt-md { margin-top: var(--sp-5); }
.mt-lg { margin-top: 40px; }
.nowrap { white-space: nowrap; }

/* ─────────────────────────── 4. 排版 ─────────────────────────── */
.sec-head { margin-bottom: var(--sp-7); max-width: 900px; }
/* wave-r3：区块里只有标题组（页首那种）时不要再挂一段下边距，否则下面空一大块 */
.sec-head:last-child { margin-bottom: 0; }
.container > .sec-head:last-child, .container--narrow > .sec-head:last-child,
.container--wide > .sec-head:last-child { margin-bottom: 0; }

.sec-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: var(--sp-4);
  font-size: var(--fs-sm);
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--brand);
}
.sec-label::before {
  content: "";
  width: 2px;
  height: 1.05em;
  background: var(--brand-hi);
}

.sec-title { font-size: var(--fs-h2); }
.page-title { font-size: var(--fs-h1); }

.sec-lead,
.page-lead {
  margin-top: var(--sp-4);
  max-width: 68ch;
  font-size: var(--fs-lead);
  color: var(--fg-dim);
}

.h3 { font-size: var(--fs-h3); font-weight: 700; }
.lead { font-size: var(--fs-lead); color: var(--fg-dim); max-width: 70ch; }

.prose { max-width: 74ch; }
.prose > * + * { margin-top: var(--sp-5); }
.prose h2 { font-size: var(--fs-h2); margin-top: var(--sp-8); }
.prose h3 { font-size: var(--fs-h3); margin-top: var(--sp-7); }
.prose p { color: var(--fg-dim); }
.prose strong { color: var(--fg); font-weight: 600; }
.prose ul > li,
.prose ol > li { position: relative; padding-left: 1.4em; color: var(--fg-dim); }
.prose ul > li + li,
.prose ol > li + li { margin-top: var(--sp-3); }
.prose ul > li::before {
  content: ""; position: absolute; left: 0; top: .78em;
  width: 6px; height: 6px; background: var(--brand-hi); transform: rotate(45deg);
}
.prose ol { counter-reset: p; }
.prose ol > li { counter-increment: p; }
.prose ol > li::before {
  content: counter(p); position: absolute; left: 0; top: 0;
  font-family: var(--font-num); color: var(--brand); font-size: .95em;
}

.fine { font-size: var(--fs-xs); line-height: 1.75; color: var(--fg-faint); }

.note {
  padding: var(--sp-4) var(--sp-5);
  border-left: 2px solid var(--brand-hi);
  background: var(--tint-soft);
  border-radius: 0 var(--r) var(--r) 0;
  font-size: var(--fs-sm);
  color: var(--fg-dim);
}

.num { font-family: var(--font-num); font-weight: 600; letter-spacing: .01em; }

/* ─────────────────────────── 5. 按钮 ─────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  min-height: 46px;
  padding: 11px 24px;
  border: 1px solid transparent;
  border-radius: var(--r);
  background: none;
  font: inherit;
  font-size: var(--fs-sm);
  font-weight: 600;
  line-height: 1.4;
  color: var(--fg);
  text-align: center;
  cursor: pointer;
  transition: background-color .18s var(--ease), border-color .18s var(--ease),
    color .18s var(--ease), transform .18s var(--ease);
}
.btn:hover { text-decoration: none; }
.btn:active { transform: translateY(1px); }

.btn--primary { background: var(--brand); color: #fff; }
.btn--primary:hover { background: var(--brand-dark); color: #fff; }

.btn--line,
.btn--gold { border-color: var(--brand-32); color: var(--brand); }
.btn--line:hover,
.btn--gold:hover { border-color: var(--brand); background: var(--tint); color: var(--brand-dark); }

.btn--ghost { border-color: var(--line-strong); color: var(--fg); }
.btn--ghost:hover { border-color: var(--brand); color: var(--brand); background: var(--tint-soft); }

.btn--lg { min-height: 54px; padding: 14px 34px; font-size: var(--fs-body); }
.btn--sm { min-height: 38px; padding: 7px 16px; font-size: var(--fs-xs); }
.btn--block { width: 100%; }

.btn-row { display: flex; flex-wrap: wrap; gap: var(--sp-3); align-items: center; }

.sec--ink .btn--primary { background: #fff; color: var(--brand-dark); }
.sec--ink .btn--primary:hover { background: var(--tint); color: var(--brand-dark); }
.sec--ink .btn--line,
.sec--ink .btn--gold,
.sec--ink .btn--ghost { border-color: rgba(255, 255, 255, .34); color: #fff; }
.sec--ink .btn--line:hover,
.sec--ink .btn--gold:hover,
.sec--ink .btn--ghost:hover { border-color: #fff; background: rgba(255, 255, 255, .10); color: #fff; }

/* ─────────────────────────── 6. 首屏 ─────────────────────────── */
/* 浅色首屏：白到浅蓝的斜向渐变 + 一层细网格 + 右侧品牌插画，文字始终在最上层。 */
.hero {
  position: relative;
  isolation: isolate;
  padding-top: calc(var(--header-h) + 60px);
  padding-bottom: var(--sp-9);
  background: var(--bg);
  overflow: hidden;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(1000px 620px at 84% -8%, rgba(34, 135, 191, .16), transparent 62%),
    radial-gradient(840px 520px at 2% 4%, rgba(25, 78, 148, .09), transparent 66%),
    linear-gradient(168deg, #F3F8FD 0%, #FBFCFE 52%, #FFFFFF 100%);
}
.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--grid-pattern);
  background-size: 40px 40px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, .55), transparent 72%);
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .55), transparent 72%);
}

.hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 404px;
  gap: var(--sp-8);
  align-items: start;
}

.hero-title {
  max-width: 17ch;
  font-size: var(--fs-hero);
  line-height: 1.22;
  letter-spacing: -.02em;
  color: var(--brand-dark);
  text-wrap: balance;
}
.hero-sub {
  margin-top: var(--sp-5);
  max-width: 62ch;
  font-size: var(--fs-lead);
  line-height: 1.85;
  color: var(--fg-dim);
}

/* ─────────────────────────── 7. 卡片与列表 ─────────────────────────── */
/* 卡片底色与所在区块互为反色：白区块上用浅灰蓝卡、浅灰蓝区块上用白卡。 */
.card {
  position: relative;
  padding: var(--sp-6);
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: var(--band);
  transition: border-color .2s var(--ease), background-color .2s var(--ease);
}
.card:hover { border-color: var(--brand-32); }

.sec--alt .card,
.sec--art .card,
.sec--paper .card { background: #fff; }
.sec--alt .card:hover,
.sec--art .card:hover,
.sec--paper .card:hover { border-color: var(--brand-32); background: #fff; }

.card--rule { border-left: 2px solid var(--brand); }
.card--rule:hover { border-left-color: var(--brand-hi); }

.card-title { font-size: var(--fs-h3); }
.card-text { margin-top: var(--sp-3); color: var(--fg-dim); }
.card-title + .card-text { margin-top: var(--sp-3); }

.card--step { padding-top: var(--sp-7); }
/* wave-s2：.card-num 是绝对定位的，卡片必须让出一行，否则序号压在 .card-title 上
   （/about/#firms 与 /services/#method 的四大事务所卡原来漏了 .card--step）。
   这条兜底保证以后再加带序号的卡也不会压字。 */
.card:has(> .card-num) { padding-top: var(--sp-7); }
.card-num {
  position: absolute;
  top: var(--sp-4);
  left: var(--sp-6);
  font-family: var(--font-num);
  font-size: 26px;
  font-weight: 700;
  color: var(--brand-32);
}

.card--link { display: block; color: inherit; }
.card--link:hover .card-title { color: var(--brand); }
.card-more { display: inline-block; margin-top: var(--sp-3); font-size: var(--fs-xs); color: var(--brand); }

/* 痛点列表：序号标签写在 HTML 里（<span class="pain-label">痛点一</span>） */
.pain-list { display: grid; gap: var(--sp-4); }
/* wave-s2：四条痛点都是一行短句，全宽横条排下来右边全是空的、这一屏也拉得过长。
   桌面排成 2×2，屏高收掉一半，四条也能一眼看完。 */
@media (min-width: 769px) {
  .pain-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.pain-list > li {
  position: relative;
  padding: var(--sp-4) var(--sp-5) var(--sp-4) 92px;
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: var(--band);
  color: var(--fg-dim);
}
.pain-label {
  position: absolute;
  left: var(--sp-5);
  top: calc(var(--sp-4) + 3px);
  padding-left: 9px;
  border-left: 2px solid var(--brand-hi);
  font-size: var(--fs-sm);
  font-weight: 700;
  color: var(--brand);
  line-height: 1.3;
}

.tick-list { display: grid; gap: var(--sp-3); }
.tick-list > li { position: relative; padding-left: 26px; color: var(--fg-dim); }
.tick-list > li::before {
  content: "";
  position: absolute;
  left: 2px; top: .58em;
  width: 11px; height: 6px;
  border-left: 2px solid var(--brand-hi);
  border-bottom: 2px solid var(--brand-hi);
  transform: rotate(-45deg);
}

.kv-list { display: grid; gap: var(--sp-5); margin: 0; }
.kv-list dt { font-weight: 700; color: var(--fg); }
.kv-list dd { margin: var(--sp-2) 0 0; color: var(--fg-dim); }

.tag {
  display: inline-block;
  padding: 3px 10px;
  border: 1px solid transparent;
  border-radius: 2px;
  background: var(--tint);
  font-size: var(--fs-xs);
  color: var(--brand);
}

/* 长条目列表（五大能力 / 五大保障） */
.rowlist { display: grid; }
.rowlist-item {
  display: grid;
  grid-template-columns: minmax(180px, 250px) 1fr;
  gap: var(--sp-6);
  padding: var(--sp-6) 0;
  border-top: 1px solid var(--line);
}
.rowlist-item:first-child { border-top: 0; padding-top: 0; }
.rowlist-num {
  display: block;
  font-family: var(--font-num);
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
  color: var(--brand-32);
  margin-bottom: var(--sp-3);
}
.rowlist-name { font-size: var(--fs-h3); font-weight: 700; margin: 0; }
.rowlist-body { margin: 0; color: var(--fg-dim); }
.rowlist-body + .rowlist-body { margin-top: var(--sp-3); }

/* 价值观四词大字排 */
.word-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-5); }
.word-item {
  padding: var(--sp-7) var(--sp-4);
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: linear-gradient(180deg, var(--tint), #fff 62%);
  text-align: center;
}
.word-num { display: block; font-family: var(--font-num); font-size: var(--fs-xs); color: var(--brand-32); }
.word-text { display: block; margin-top: var(--sp-3); font-size: 30px; font-weight: 700; letter-spacing: .14em; color: var(--brand-dark); }

/* ─────────────────────────── 8. 数据 ─────────────────────────── */
.stat-band {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--sp-5);
  padding-block: var(--sp-6);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.stat { min-width: 0; }
.stat-num {
  font-family: var(--font-num);
  font-size: var(--fs-stat);
  font-weight: 700;
  line-height: 1;
  color: var(--brand);
  letter-spacing: -.01em;
}
.stat-num { display: block; }   /* wave-r3：写成 <span> 时也要独占一行 */
.stat-unit { margin-left: 4px; font-size: .38em; font-weight: 600; color: var(--brand-hi); }
.stat-label { display: block; margin-top: var(--sp-3); font-size: var(--fs-sm); color: var(--fg-dim); }
.sec--ink .stat-num { color: #fff; }
.sec--ink .stat-unit { color: var(--ink-accent); }
.sec--ink .stat-label { color: var(--ink-dim); }
.sec--ink .stat-band { border-color: var(--ink-line); }

/* 入场前后增长对（「36 → 79」） */
.growth {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: var(--sp-4);
  font-family: var(--font-num);
  font-size: clamp(30px, 3.6vw, 46px);
  font-weight: 700;
  line-height: 1.05;
}
.growth-from { font-size: .56em; color: var(--fg-faint); }
.growth-arrow { font-size: .46em; color: var(--brand-32); }
.growth-to { color: var(--brand); }
.growth-label { margin-top: var(--sp-2); font-size: var(--fs-xs); line-height: 1.7; color: var(--fg-dim); }

.stat-num--sm { font-size: clamp(30px, 3.4vw, 46px); }
.stat-num--dim { color: var(--fg-faint); }

/* ─────────────────────────── 9. 图表组件 ─────────────────────────── */
.chart {
  margin: 0;
  padding: var(--sp-6);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: #fff;
}
.sec--alt .chart, .sec--art .chart { background: #fff; }
.chart-head { margin-bottom: var(--sp-5); }
.chart-title { font-size: var(--fs-h3); font-weight: 700; color: var(--fg); }
.chart-note { margin-top: var(--sp-5); font-size: var(--fs-xs); line-height: 1.75; color: var(--fg-faint); }
.chart svg { width: 100%; height: auto; display: block; }

/* 条形对比图：入场前（浅）/ 入场后（品牌蓝），进入视口时从 0 生长 */
.bars { display: grid; gap: var(--sp-5); }
.bar-row { display: grid; grid-template-columns: minmax(96px, 148px) minmax(0, 1fr); gap: var(--sp-4); align-items: center; }
.bar-name { font-size: var(--fs-sm); font-weight: 600; color: var(--fg); }
.bar-name small { display: block; font-weight: 400; font-size: var(--fs-xs); color: var(--fg-faint); }
.bar-track { display: grid; gap: 7px; min-width: 0; }
.bar-line { display: flex; align-items: center; gap: var(--sp-3); }
.bar-seg {
  height: 15px;
  border-radius: 0 2px 2px 0;
  width: 0;
  transition: width 1.05s var(--ease);
}
.bar-seg--before { background: var(--band-2); border: 1px solid var(--line-strong); border-left: 0; }
.bar-seg--after { background: linear-gradient(90deg, var(--brand) 0%, var(--brand-hi) 100%); }
.is-in .bar-seg,
html:not(.js) .bar-seg { width: var(--w, 0%); }
.bar-val { font-family: var(--font-num); font-size: 17px; font-weight: 700; color: var(--fg-dim); white-space: nowrap; }
.bar-line--after .bar-val { color: var(--brand); font-size: 20px; }
.bar-delta {
  margin-left: auto;
  padding: 2px 9px;
  border-radius: 2px;
  background: var(--tint);
  font-family: var(--font-num);
  font-size: var(--fs-sm);
  font-weight: 700;
  color: var(--brand-dark);
  white-space: nowrap;
}
.bars-legend { display: flex; flex-wrap: wrap; gap: var(--sp-5); margin-bottom: var(--sp-5); font-size: var(--fs-xs); color: var(--fg-dim); }
.bars-legend span { display: inline-flex; align-items: center; gap: 7px; }
.bars-legend i { width: 18px; height: 10px; border-radius: 2px; }
.bars-legend .lg-before { background: var(--band-2); border: 1px solid var(--line-strong); }
.bars-legend .lg-after { background: linear-gradient(90deg, var(--brand), var(--brand-hi)); }

/* 环形放射图（五大能力 / 五大保障） */
.radial { display: grid; grid-template-columns: minmax(260px, 380px) minmax(0, 1fr); gap: var(--sp-7); align-items: center; }
.radial-fig { margin: 0; }
.radial-list { display: grid; gap: var(--sp-4); }
.radial-item { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: var(--sp-4); padding-bottom: var(--sp-4); border-bottom: 1px solid var(--line); }
.radial-item:last-child { border-bottom: 0; padding-bottom: 0; }
.radial-no { font-family: var(--font-num); font-size: 19px; font-weight: 700; color: var(--brand-hi); line-height: 1.5; }
.radial-name { font-size: var(--fs-h3); font-weight: 700; }
.radial-text { margin-top: var(--sp-2); font-size: var(--fs-sm); color: var(--fg-dim); }
/* wave-r3：只淡入，不做 CSS transform——<g class="rd-seg"> 自带 SVG transform="rotate(...)"，
   CSS 的 transform 会整个覆盖掉它，五个节点会全部塌到 12 点方向（reduced-motion 下尤其明显）。 */
.radial svg .rd-seg { transition: opacity .5s var(--ease); }
.js .radial:not(.is-in) svg .rd-seg { opacity: 0; }
.js .radial.is-in svg .rd-seg:nth-of-type(2) { transition-delay: .06s; }
.js .radial.is-in svg .rd-seg:nth-of-type(3) { transition-delay: .12s; }
.js .radial.is-in svg .rd-seg:nth-of-type(4) { transition-delay: .18s; }
.js .radial.is-in svg .rd-seg:nth-of-type(5) { transition-delay: .24s; }

/* 环形占比图 */
.donut { display: grid; grid-template-columns: minmax(180px, 260px) minmax(0, 1fr); gap: var(--sp-6); align-items: center; }
.donut-legend { display: grid; gap: var(--sp-3); }
.donut-legend li { display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; gap: var(--sp-3); align-items: baseline; font-size: var(--fs-sm); color: var(--fg-dim); }
.donut-legend i { width: 12px; height: 12px; border-radius: 2px; }
.donut-legend b { font-family: var(--font-num); font-size: 17px; color: var(--brand); }

/* 横向步骤图（流程） */
.steps { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 0; position: relative; }
.steps::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 13px;
  height: 1px;
  background: var(--line-strong);
}
.step { position: relative; padding: 34px var(--sp-4) 0 0; }
.step-dot {
  position: absolute;
  top: 6px; left: 0;
  width: 15px; height: 15px;
  border-radius: 50%;
  border: 2px solid var(--brand-32);
  background: #fff;
  transition: border-color .4s var(--ease), background-color .4s var(--ease), transform .4s var(--ease);
}
.step-no { display: block; font-family: var(--font-num); font-size: 16px; font-weight: 700; line-height: 1.2; color: var(--brand-hi); }
.step-title { display: block; margin-top: 2px; font-size: var(--fs-sm); font-weight: 700; color: var(--fg); }
.step-desc { display: block; margin-top: var(--sp-2); font-size: var(--fs-xs); line-height: 1.7; color: var(--fg-faint); }
.steps.is-in .step-dot { border-color: var(--brand); background: var(--brand); }
.steps.is-in .step:nth-child(2) .step-dot { transition-delay: .09s; }
.steps.is-in .step:nth-child(3) .step-dot { transition-delay: .18s; }
.steps.is-in .step:nth-child(4) .step-dot { transition-delay: .27s; }
.steps.is-in .step:nth-child(5) .step-dot { transition-delay: .36s; }
.steps.is-in .step:nth-child(6) .step-dot { transition-delay: .45s; }
.steps.is-in .step:nth-child(7) .step-dot { transition-delay: .54s; }
.steps.is-in .step:last-child .step-dot { box-shadow: 0 0 0 5px var(--tint); }

/* 视觉矩阵（模式对比） */
.mtx { display: grid; gap: var(--sp-4); overflow-x: auto; position: relative; /* 让单元格内 sr-only 的绝对定位被矩阵裁切，避免 375px 溢出 */ }
.mtx-row { display: grid; grid-template-columns: minmax(120px, 1.1fr) repeat(var(--cols, 3), minmax(110px, 1fr)); gap: var(--sp-3); align-items: stretch; }
.mtx-head .mtx-cell { font-weight: 700; color: var(--fg); background: none; border: 0; padding-bottom: var(--sp-2); border-bottom: 1px solid var(--line-strong); }
.mtx-head .mtx-cell--hi { color: var(--brand); border-bottom-color: var(--brand); }
.mtx-key { display: flex; align-items: center; font-size: var(--fs-sm); font-weight: 600; color: var(--fg); }
.mtx-cell {
  padding: var(--sp-3) var(--sp-4);
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: #fff;
  font-size: var(--fs-sm);
  color: var(--fg-dim);
}
.mtx-cell--hi { border-color: var(--brand-32); background: var(--tint); color: var(--brand-dark); }
.mtx-mark { display: block; font-family: var(--font-num); font-size: 16px; font-weight: 700; color: var(--brand-hi); }

/* 全国网络抽象图 */
.netmap { margin: 0; padding: var(--sp-5); border: 1px solid var(--line); border-radius: var(--r-lg); background: linear-gradient(180deg, var(--tint-soft), #fff 70%); }
.netmap svg { width: 100%; height: auto; }
.netmap-cap { margin-top: var(--sp-4); font-size: var(--fs-xs); color: var(--fg-faint); }

/* 大数字条 */
.counter-band { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: var(--sp-5); }
.counter { padding: var(--sp-5); border: 1px solid var(--line); border-left: 2px solid var(--brand); border-radius: var(--r); background: #fff; }
.counter-num { font-family: var(--font-num); font-size: clamp(34px, 4vw, 52px); font-weight: 700; line-height: 1; color: var(--brand); }
.counter-label { margin-top: var(--sp-3); font-size: var(--fs-sm); color: var(--fg-dim); }

/* ─────────────────────────── 10. 表格 ─────────────────────────── */
.table-wrap {
  overflow-x: auto;
  position: relative; /* 让表格内 sr-only 的绝对定位被滚动容器裁切，避免小屏溢出 */
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: #fff;
  -webkit-overflow-scrolling: touch;
}
.table-wrap--paper { background: #fff; border-color: var(--line); }

.data-table {
  width: 100%;
  min-width: 680px;
  border-collapse: collapse;
  font-size: var(--fs-sm);
}
.data-table caption {
  padding: var(--sp-4) var(--sp-5);
  border-bottom: 1px solid var(--line);
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--brand);
  text-align: left;
  letter-spacing: .03em;
}
.data-table th,
.data-table td {
  padding: 14px var(--sp-4);
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}
.data-table thead th {
  background: var(--band);
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--fg);
  white-space: nowrap;
}
.data-table tbody th { font-weight: 600; color: var(--fg); }
.data-table tbody td { color: var(--fg-dim); }
.data-table tbody tr:last-child th,
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table tbody tr:hover td,
.data-table tbody tr:hover th { background: #FAFBFD; }

.data-table .col-hi { background: var(--tint); color: var(--fg); }
.data-table thead .col-hi {
  background: #DCEAF8;
  color: var(--brand-dark);
  box-shadow: inset 0 2px 0 var(--brand);
}
.data-table tbody tr:hover .col-hi { background: #E1EDF9; }

.cell-growth {
  font-family: var(--font-num);
  font-size: 26px;
  font-weight: 700;
  line-height: 1.15;
  color: var(--brand);
  white-space: nowrap;
}

.table-cap-note { margin-top: var(--sp-4); font-size: var(--fs-xs); color: var(--fg-faint); }

.compare-note {
  margin-top: var(--sp-6);
  padding-left: var(--sp-5);
  border-left: 2px solid var(--brand);
  font-size: var(--fs-lead);
  color: var(--fg-dim);
}

/* ─────────────────────────── 11. FAQ ─────────────────────────── */
.faq-list { display: grid; gap: var(--sp-3); }

.faq-item {
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: #fff;
  transition: border-color .2s var(--ease);
}
.faq-item[open] { border-color: var(--brand-32); }
.sec--alt .faq-item { background: #fff; }

.faq-q {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-4);
  padding: var(--sp-4) var(--sp-5);
  font-size: var(--fs-lead);
  font-weight: 600;
  color: var(--fg);
  cursor: pointer;
  list-style: none;
}
.faq-q::-webkit-details-marker { display: none; }
.faq-q::after {
  content: "";
  flex: 0 0 auto;
  width: 11px; height: 11px;
  margin-top: .42em;
  margin-left: auto;
  border-right: 2px solid var(--brand-hi);
  border-bottom: 2px solid var(--brand-hi);
  transform: rotate(45deg);
  transition: transform .2s var(--ease);
}
.faq-item[open] .faq-q::after { transform: rotate(-135deg); }
.faq-q:hover { color: var(--brand); }

.faq-a {
  padding: 0 var(--sp-5) var(--sp-5);
  color: var(--fg-dim);
}
.faq-a > * + * { margin-top: var(--sp-3); }

.anchor-nav { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin: 0; padding: 0; list-style: none; }
.anchor-nav a {
  display: inline-block;
  padding: 6px 12px;
  border: 1px solid var(--line-strong);
  border-radius: var(--r);
  font-size: var(--fs-sm);
  color: var(--fg-dim);
  background: #fff;
}
.anchor-nav a:hover { border-color: var(--brand); color: var(--brand); text-decoration: none; }

/* ─────────────────────────── 12. 时间线 / 旧流程条 ─────────────────────────── */
.timeline { display: grid; gap: 0; }
.timeline-item {
  position: relative;
  padding: 0 0 var(--sp-7) var(--sp-7);
  border-left: 1px solid var(--line-strong);
}
.timeline-item:last-child { padding-bottom: 0; border-left-color: transparent; }
.timeline-item::before {
  content: "";
  position: absolute;
  left: -5px; top: .5em;
  width: 9px; height: 9px;
  background: var(--brand);
  transform: rotate(45deg);
}
.timeline-time {
  font-family: var(--font-num);
  font-size: 20px;
  font-weight: 700;
  color: var(--brand);
}
.timeline-body { margin-top: var(--sp-3); color: var(--fg-dim); }

.flow { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--sp-3); }
.flow-step {
  position: relative;
  padding: var(--sp-5) var(--sp-4) var(--sp-4);
  border: 1px solid var(--line);
  border-top: 2px solid var(--brand-32);
  border-radius: var(--r);
  background: #fff;
  font-size: var(--fs-sm);
  color: var(--fg);
}
.sec--alt .flow-step { background: #fff; }
.flow-num {
  display: block;
  margin-bottom: var(--sp-2);
  font-size: 22px;
  font-weight: 700;
  color: var(--brand);
  line-height: 1;
}
.flow-step small { display: block; margin-top: var(--sp-2); color: var(--fg-faint); font-size: var(--fs-xs); }

@media (min-width: 1025px) {
  .flow--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .flow--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

/* ─────────────────────────── 13. 面包屑 ─────────────────────────── */
.breadcrumb {
  padding-top: calc(var(--header-h) + 26px);
  padding-bottom: var(--sp-2);
  font-size: var(--fs-xs);
  color: var(--fg-faint);
}
.breadcrumb ol { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.breadcrumb li { display: flex; align-items: center; gap: var(--sp-2); }
.breadcrumb li + li::before { content: "/"; color: var(--line-strong); }
.breadcrumb a { color: var(--fg-dim); }
.breadcrumb a:hover { color: var(--brand); }
.breadcrumb [aria-current] { color: var(--fg); }

/* ─────────────────────────── 14. 图形带与证书 ─────────────────────────── */
.art-band { padding-block: var(--sp-8); background: var(--band); border-top: 1px solid var(--line); }
.art-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-4); }
.art-band--n3 .art-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.art-figure {
  margin: 0;
  padding: var(--sp-4);
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: #fff;
  transition: border-color .25s var(--ease), transform .25s var(--ease);
}
.art-figure:hover { border-color: var(--brand-32); transform: translateY(-2px); }
.art-figure img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; }
.art-cap {
  margin-top: var(--sp-3);
  padding-left: 10px;
  border-left: 2px solid var(--brand-32);
  font-size: var(--fs-xs);
  line-height: 1.6;
  color: var(--fg-dim);
}

.honor-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: var(--sp-5); }
/* wave-s2：证书正好 5 张，auto-fit 在 1280 宽下只排得下 4 列，第 5 张孤零零另起一行。
   桌面宽度直接排成一行 5 列，证书区收成整齐的一条。 */
@media (min-width: 1025px) {
  .honor-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--sp-4); }
}
.honor-figure {
  margin: 0;
  padding: var(--sp-4);
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: #fff;
}
.honor-figure img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: contain;
  padding: var(--sp-3);
  border: 1px solid var(--line);
  border-radius: 2px;
  background: var(--band);
}
.honor-grid img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: contain;
  padding: var(--sp-4);
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: #fff;
}
.honor-cap {
  margin-top: var(--sp-3);
  padding-left: 10px;
  border-left: 2px solid var(--brand-32);
  font-size: var(--fs-xs);
  line-height: 1.65;
  color: var(--fg-dim);
}

/* ─────────────────────────── 15. 联系组件 ─────────────────────────── */
.contact-block {
  padding: var(--sp-6);
  border: 1px solid var(--line);
  border-top: 2px solid var(--brand);
  border-radius: var(--r-lg);
  background: linear-gradient(180deg, var(--tint-soft), #fff 46%);
}
.contact-block--hero { box-shadow: 0 18px 44px rgba(18, 58, 112, .08); }

.contact-block-head { margin-bottom: var(--sp-5); }
.contact-block-title { font-size: var(--fs-h3); font-weight: 700; color: var(--fg); margin: 0; }
.contact-block-sub { margin-top: var(--sp-3); font-size: var(--fs-sm); color: var(--fg-dim); }

.contact-main { display: grid; gap: var(--sp-5); }
.phone-label { font-size: var(--fs-xs); font-weight: 600; color: var(--brand); letter-spacing: .03em; }
.phone-big {
  display: block;
  margin-top: 6px;
  font-family: var(--font-num);
  font-size: clamp(30px, 3.4vw, 40px);
  font-weight: 700;
  line-height: 1.05;
  color: var(--brand-dark);
  letter-spacing: .01em;
}
.phone-big:hover { color: var(--brand-hi); text-decoration: none; }
.phone-note { margin-top: var(--sp-3); font-size: var(--fs-xs); line-height: 1.7; color: var(--fg-dim); }

/* wave-p1（修订单 4 §18）：二维码一律「大图在上、一行说明在下、整体居中」，
   尺寸由 --qr-size 一处控制：首屏卡 208 / 联系区块 184 / 页脚 168 / 小卡 200。
   原来那种「小二维码 + 右侧一行字」的横排会在卡片里留出一大片空白，已取消。 */
.contact-qr {
  --qr-size: 184px;
  display: grid;
  justify-items: center;
  gap: var(--sp-3);
  text-align: center;
}
.contact-main .contact-qr { padding-top: var(--sp-5); border-top: 1px solid var(--line); width: 100%; }
.sec--ink .contact-main .contact-qr { border-top-color: var(--ink-line); }
.qr-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--qr-size);
  height: var(--qr-size);
  max-width: 100%;
  padding: 10px;
  border: 1px solid var(--line-strong);
  border-radius: var(--r);
  background: #fff;
  font-size: var(--fs-xs);
  line-height: 1.6;
  color: var(--fg-dim);
  text-align: center;
}
.qr-placeholder img { width: 100%; height: 100%; object-fit: contain; }
.qr-cap { max-width: 22em; font-size: var(--fs-sm); line-height: 1.7; color: var(--fg-dim); }
.footer-qr .contact-qr { --qr-size: 168px; }
.footer-qr .qr-cap { color: var(--footer-dim); }

.sec--ink .contact-block {
  background: rgba(255, 255, 255, .07);
  border-color: var(--ink-line);
  border-top-color: var(--ink-accent);
}
.sec--ink .contact-block-title { color: #fff; }
.sec--ink .contact-block-sub, .sec--ink .phone-note { color: var(--ink-dim); }
.sec--ink .phone-label { color: var(--ink-accent); }
.sec--ink .phone-big { color: #fff; }
.sec--ink .phone-big:hover { color: var(--ink-accent); }
.sec--ink .qr-placeholder { background: rgba(255, 255, 255, .10); border-color: rgba(255, 255, 255, .38); color: var(--ink-dim); }
.sec--ink .qr-cap { color: var(--ink-faint); }

/* 一行式联系条（原中插留资条） */
.contact-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--sp-5);
  align-items: center;
  padding: var(--sp-5) var(--sp-6);
  border: 1px solid var(--line);
  border-left: 2px solid var(--brand);
  border-radius: var(--r);
  background: linear-gradient(90deg, var(--tint) 0%, #fff 64%);
}
.contact-line-text { font-size: var(--fs-lead); font-weight: 600; color: var(--fg); }
.contact-line-actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); align-items: center; position: relative; }
.contact-line-actions .btn--primary .num { font-family: var(--font-num); letter-spacing: .02em; }
.sec--ink .contact-line { background: rgba(255, 255, 255, .07); border-color: var(--ink-line); border-left-color: var(--ink-accent); }
.sec--ink .contact-line-text { color: #fff; }

/* 二维码小卡（吸底栏 / 悬浮 / contact_line 共用一个组件） */
.qr-pop {
  position: fixed;
  z-index: 80;
  right: 16px;
  bottom: 92px;
  width: 248px;
  padding: var(--sp-5);
  border: 1px solid var(--line-strong);
  border-radius: var(--r-lg);
  background: #fff;
  box-shadow: 0 22px 48px rgba(18, 58, 112, .18);
}
.qr-pop[hidden] { display: none; }
.qr-pop .contact-qr { --qr-size: 200px; }   /* wave-p1 §18 */
.qr-pop-title { font-size: var(--fs-sm); font-weight: 700; color: var(--fg); margin-bottom: var(--sp-3); }
.qr-pop-phone { display: block; margin-top: var(--sp-3); font-family: var(--font-num); font-size: 21px; font-weight: 700; color: var(--brand-dark); }
.qr-pop-close {
  position: absolute;
  top: 6px; right: 6px;
  width: 30px; height: 30px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: none;
  color: var(--fg-faint);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}
.qr-pop-close:hover { color: var(--brand); }
@media (min-width: 1025px) {
  .qr-pop { right: 74px; bottom: 24px; }
}

/* 页底转化区 */
.cta-final {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 404px;
  gap: var(--sp-8);
  align-items: center;
}
/* wave-p2：.cta-final-side / .cta-final-mark / .cta-phone 已删除 ——
   页底转化区不再有电话、二维码与 logo，版式见 §25 的 .cta-final--plain。 */

/* 案例卡 */
.case-card {
  display: flex;
  flex-direction: column;
  padding: var(--sp-6);
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: #fff;
  color: inherit;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease);
}
.case-card:hover {
  border-color: var(--brand-32);
  box-shadow: 0 10px 28px rgba(18, 58, 112, .08);
  transform: translateY(-2px);
  text-decoration: none;
  color: inherit;
}
.case-card .tag { margin-bottom: var(--sp-3); align-self: flex-start; }
.case-card-metric {
  display: block;
  margin-top: var(--sp-4);
  font-family: var(--font-num);
  font-size: 30px;
  font-weight: 700;
  color: var(--brand);
  line-height: 1.1;
}
.case-card .fine:last-child { margin-top: auto; padding-top: var(--sp-4); color: var(--brand); }
.sec--ink .case-card { background: rgba(255, 255, 255, .07); border-color: var(--ink-line); color: var(--ink-fg); }
.sec--ink .case-card .card-title { color: #fff; }

/* ─────────────────────────── 16. 页头导航 ─────────────────────────── */
.site-header {
  position: fixed;
  inset-inline: 0;
  top: 0;
  z-index: 60;
  height: var(--header-h);
  background: rgba(255, 255, 255, .88);
  backdrop-filter: saturate(140%) blur(12px);
  -webkit-backdrop-filter: saturate(140%) blur(12px);
  border-bottom: 1px solid transparent;
  transition: height .22s var(--ease), background-color .22s var(--ease),
    border-color .22s var(--ease), box-shadow .22s var(--ease);
}
.site-header.is-stuck {
  height: 62px;
  background: rgba(255, 255, 255, .97);
  border-bottom-color: var(--line);
  box-shadow: 0 6px 20px rgba(18, 58, 112, .06);
}

.header-inner {
  display: flex;
  align-items: center;
  gap: var(--sp-5);
  height: 100%;
  max-width: 1360px;
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.brand { display: flex; align-items: center; flex: 0 0 auto; }
.brand:hover { text-decoration: none; }
.brand img { height: 34px; width: auto; }

.nav { margin-left: auto; }
.nav-list { display: flex; align-items: center; gap: 2px; }
.nav-item { position: relative; }
.nav-link {
  display: block;
  padding: 10px 13px;
  border-radius: var(--r);
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--fg-dim);
  white-space: nowrap;
  transition: color .18s var(--ease);
}
.nav-link:hover,
.nav-item:hover > .nav-link,
.nav-item:focus-within > .nav-link { color: var(--brand); text-decoration: none; }
.nav-link.is-current { color: var(--brand); box-shadow: inset 0 -2px 0 var(--brand); }

.nav-item--has-panel > .nav-link::after {
  content: "";
  display: inline-block;
  width: 5px; height: 5px;
  margin-left: 7px;
  vertical-align: 2px;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  transform: rotate(45deg);
  opacity: .6;
}

.nav-panel {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 5;
  display: grid;
  gap: var(--sp-6);
  min-width: 268px;
  padding: var(--sp-5);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: #fff;
  box-shadow: 0 24px 54px rgba(18, 58, 112, .14);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity .18s var(--ease), transform .18s var(--ease), visibility .18s;
}
.nav-item:hover > .nav-panel,
.nav-item:focus-within > .nav-panel,
.nav-panel.is-open { opacity: 1; visibility: visible; transform: none; }

.nav-panel--wide { grid-template-columns: repeat(2, minmax(210px, 1fr)); min-width: 520px; }
.nav-panel--wide.nav-panel--cols4 { grid-template-columns: repeat(4, minmax(160px, 1fr)); min-width: 760px; }
.nav-item:last-child .nav-panel,
.nav-panel--right { left: auto; right: 0; }

.nav-group-title {
  margin-bottom: var(--sp-3);
  padding-bottom: 6px;
  border-bottom: 1px solid var(--line);
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--brand);
}
.nav-group-list { display: grid; gap: 1px; }
.nav-group-list a {
  display: block;
  padding: 7px 10px;
  border-radius: 2px;
  font-size: var(--fs-sm);
  color: var(--fg);
}
.nav-group-list a:hover { background: var(--tint); color: var(--brand); text-decoration: none; }
.nav-group-list a small { display: block; font-size: var(--fs-xs); color: var(--fg-faint); }
.nav-group-list a:hover small { color: var(--fg-dim); }

.header-cta { flex: 0 0 auto; }
.header-phone {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  min-height: 42px;
  padding: 5px 16px;
  border: 1px solid var(--brand);
  border-radius: var(--r);
  background: var(--brand);
  color: #fff;
  line-height: 1.2;
  transition: background-color .18s var(--ease);
}
.header-phone:hover { background: var(--brand-dark); border-color: var(--brand-dark); color: #fff; text-decoration: none; }
.header-phone small { font-size: 11px; font-weight: 400; opacity: .82; }
.header-phone b { font-family: var(--font-num); font-size: 17px; font-weight: 700; letter-spacing: .02em; }

.drawer-toggle { display: none; flex: 0 0 auto; }

/* 移动抽屉 */
.drawer {
  position: fixed;
  inset: 0;
  z-index: 70;
  display: none;
  background: #fff;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 78px var(--gutter) 120px;
}
.drawer.is-open { display: block; }
.drawer-close { position: absolute; top: 18px; right: 16px; }
.drawer-group + .drawer-group { margin-top: var(--sp-5); border-top: 1px solid var(--line); padding-top: var(--sp-5); }
.drawer-group > a {
  display: block;
  font-size: var(--fs-lead);
  font-weight: 700;
  color: var(--fg);
}
.drawer-sub { display: grid; gap: 2px; margin-top: var(--sp-3); }
.drawer-sub a { display: block; padding: 8px 0 8px 14px; border-left: 1px solid var(--line); font-size: var(--fs-sm); color: var(--fg-dim); }
.drawer-sub a:hover { color: var(--brand); border-left-color: var(--brand); text-decoration: none; }
.drawer-foot { margin-top: var(--sp-7); display: grid; gap: var(--sp-3); }

/* ─────────────────────────── 17. 吸底栏 / 悬浮 ─────────────────────────── */
.mobile-bar {
  position: fixed;
  inset-inline: 0;
  bottom: 0;
  z-index: 55;
  display: none;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-3);
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
  background: rgba(255, 255, 255, .97);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-top: 1px solid var(--line);
  box-shadow: 0 -4px 18px rgba(18, 58, 112, .07);
}
.mobile-bar .btn { min-height: 46px; }

.dock {
  position: fixed;
  right: 14px;
  bottom: 22px;
  z-index: 50;
  display: grid;
  gap: 6px;
  justify-items: end;
}
.dock-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: 46px;
  height: 46px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 6px 18px rgba(18, 58, 112, .10);
  font: inherit;
  font-size: 11px;
  font-weight: 600;
  color: var(--brand);
  line-height: 1.15;
  cursor: pointer;
  transition: border-color .18s var(--ease), color .18s var(--ease), background-color .18s var(--ease);
}
.dock-btn svg { width: 18px; height: 18px; }
.dock-btn:hover { border-color: var(--brand); background: var(--tint); color: var(--brand-dark); text-decoration: none; }
.dock-btn[hidden] { display: none; }
.dock-label { display: block; }

@media (max-width: 1440px) and (min-width: 1025px) {
  .dock { right: 8px; bottom: 16px; gap: 5px; }
  .dock-btn { width: 40px; height: 40px; font-size: 10px; }
  .dock-btn svg { width: 16px; height: 16px; }
}

/* ─────────────────────────── 18. 页脚 ─────────────────────────── */
/* wave-p1（修订单 4 §B-10）：页脚是全站最深的一块（深海蓝），
   浅 → 中（转化区）→ 最深（页脚）的顺序到这里收尾。 */
.site-footer {
  background: var(--footer-bg);
  border-top: 0;
  padding-top: var(--sp-8);
  color: var(--footer-fg);
}
.footer-top {
  display: grid;
  /* wave-p1：左栏要放下「品牌 + 热线」与 168px 二维码两列，比例从 1.35/2.65 调到 1.9/2.1 */
  grid-template-columns: minmax(0, 1.9fr) minmax(0, 2.1fr);
  gap: var(--sp-8);
  padding-bottom: var(--sp-7);
}
/* wave-p1：只作用于 logo 本身——原来的 .footer-brand img 会把二维码图片也压成 34px 高 */
.footer-brand > img { height: 34px; width: auto; margin-bottom: var(--sp-4); }
.footer-meta { display: grid; gap: var(--sp-2); font-size: var(--fs-sm); color: var(--footer-dim); }
.footer-meta a { color: #fff; font-family: var(--font-num); font-size: 23px; font-weight: 700; letter-spacing: .02em; }
.footer-meta a:hover { color: var(--footer-hi); text-decoration: none; }
.footer-meta .fine { color: var(--footer-dim); }
.footer-contact { display: flex; gap: var(--sp-6); align-items: flex-start; flex-wrap: wrap; }
.footer-contact .footer-meta { flex: 1 1 200px; min-width: 190px; }
.footer-contact .footer-qr { flex: 0 0 auto; }
.footer-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-5); }
.footer-col-title {
  margin-bottom: var(--sp-3);
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--footer-hi);
  letter-spacing: .04em;
}
.footer-col-list { display: grid; gap: 9px; }
.footer-col-list a { font-size: var(--fs-sm); color: var(--footer-fg); }
.footer-col-list a:hover { color: var(--footer-hi); text-decoration: none; }

.footer-intro {
  padding-block: var(--sp-5);
  border-top: 1px solid var(--footer-line);
  font-size: var(--fs-xs);
  line-height: 1.85;
  color: var(--footer-dim);
}
.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3) var(--sp-5);
  align-items: center;
  padding-block: var(--sp-5);
  border-top: 1px solid var(--footer-line);
  font-size: var(--fs-xs);
  color: var(--footer-dim);
}
.footer-legal { display: flex; flex-wrap: wrap; gap: var(--sp-3) var(--sp-4); }
.footer-legal a { color: var(--footer-dim); }
.footer-legal a:hover { color: var(--footer-hi); }

/* ─────────────────────────── 19. 动效 ─────────────────────────── */
/* 进场动效只在 <html class="js"> 时生效：脚本没跑起来时内容必须照常可见。 */
.js .reveal {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .6s var(--ease), transform .6s var(--ease);
}
.js .reveal.is-in { opacity: 1; transform: none; }
.js .reveal:nth-child(2) { transition-delay: .06s; }
.js .reveal:nth-child(3) { transition-delay: .12s; }
.js .reveal:nth-child(4) { transition-delay: .18s; }

/* ─────────────────────────── 20. 响应式 ─────────────────────────── */
@media (min-width: 1200px) {
  :root { --gutter: 32px; }
  .sec { padding-block: var(--sp-10); }
  .sec--tight { padding-block: var(--sp-8); }
}

/* 桌面端右侧悬浮占右缘 60px：容器同步收窄，保证任何宽度下悬浮都不压内容 */
@media (min-width: 1025px) {
  /* wave-p1：三个类名同一个宽度（§C-11） */
  .container,
  .container--narrow,
  .container--wide { max-width: min(1160px, calc(100vw - 132px)); }
}

@media (max-width: 1100px) {
  .nav-link { padding: 10px 9px; font-size: 13px; }
  .hero-inner { grid-template-columns: minmax(0, 1fr) 360px; gap: var(--sp-6); }
  .cta-final { grid-template-columns: minmax(0, 1fr) 340px; gap: var(--sp-6); }
  .radial { grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
}

@media (max-width: 1024px) {
  :root { --header-h: 62px; }
  body { padding-bottom: 76px; }

  .nav { display: none; }
  .drawer-toggle { display: inline-flex; margin-left: auto; }
  .header-cta { display: none; }
  .mobile-bar { display: grid; }
  .dock { display: none; }

  .hero { padding-top: calc(var(--header-h) + 40px); }
  .hero-inner { grid-template-columns: minmax(0, 1fr); gap: var(--sp-7); }
  .contact-block--hero { max-width: 520px; }

  .split, .split--form { grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
  .cta-final { grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
  .footer-top { grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
  .footer-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .art-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .art-band--n3 .art-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .steps { grid-auto-flow: row; grid-auto-columns: auto; gap: 0; }
  .steps::before { left: 7px; right: auto; top: 6px; bottom: 6px; width: 1px; height: auto; }
  .step { padding: 0 0 var(--sp-5) 34px; }
  .step-dot { top: 5px; }
  .donut { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 767px) {
  :root { --gutter: 16px; --sp-9: 64px; --sp-8: 48px; }

  .sec { padding-block: 64px; }
  .sec--tight { padding-block: 40px; }
  .sec-head { margin-bottom: var(--sp-6); }

  .grid--2, .grid--3, .grid--4 { grid-template-columns: minmax(0, 1fr); }
  .flow { grid-template-columns: minmax(0, 1fr); }

  .contact-line { grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); padding: var(--sp-5); }
  .contact-line-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  .contact-main { grid-template-columns: minmax(0, 1fr); justify-items: start; }

  .stat-band { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-5); }
  .art-band--n3 .art-grid,
  .art-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-cols { grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }

  .card { padding: var(--sp-5); }
  .chart { padding: var(--sp-5); }
  .contact-block { padding: var(--sp-5); }
  .data-table { min-width: 560px; }
  .timeline-item { padding-left: var(--sp-5); }
  .breadcrumb { padding-top: calc(var(--header-h) + 18px); }
  .bar-row { grid-template-columns: minmax(0, 1fr); gap: var(--sp-2); }
  .mtx-row { grid-template-columns: minmax(96px, 1fr) repeat(var(--cols, 3), minmax(96px, 1fr)); }
  .qr-pop { left: 16px; right: 16px; width: auto; }
}

@media (max-width: 400px) {
  .hero-title { font-size: 26px; }
  .stat-band { grid-template-columns: minmax(0, 1fr); }
  .brand img { height: 28px; }
  .mobile-bar .btn { padding-inline: 8px; font-size: 13px; }
  .art-grid, .art-band--n3 .art-grid { grid-template-columns: minmax(0, 1fr); }
  .word-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .word-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .word-text { font-size: 24px; }
}

/* ─────────────────────────── 21. 偏好与打印 ─────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .js .reveal { opacity: 1; transform: none; }
  .bar-seg { width: var(--w, 0%); }
  .js .radial:not(.is-in) svg .rd-seg { opacity: 1; }   /* wave-r3：不要写 transform，见上 */
}

@media print {
  .site-header, .mobile-bar, .dock, .qr-pop, .contact-line, .contact-block,
  .art-band, .drawer { display: none !important; }
  body { padding-bottom: 0; background: #fff; color: #000; }
  .sec, .sec--alt, .sec--paper, .sec--art, .sec--ink, .hero {
    background: #fff !important; color: #000 !important; padding-block: 18px;
  }
  .sec-title, .page-title, .hero-title, .card-title { color: #000 !important; }
  .sec-lead, .card-text, .prose p, .fine, .data-table td { color: #333 !important; }
  .card, .faq-item, .table-wrap, .chart { border-color: #bbb !important; background: #fff !important; }
  .faq-item { break-inside: avoid; }
  .faq-a { display: block !important; }
  a { color: #000; text-decoration: underline; }
  .site-footer { background: #fff; border-top: 1px solid #bbb; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   22. 修订波 R2 新增件  wave-r2
   上位规格 docs/superpowers/specs/2026-09-24-v3-revision-2-partner-focus.md
   §2 栏目结构（.subnav / .next-step）、§3 可视化（.model / .deny-badges /
   .stage-axis / .eqsplit / .floor / .minibar / ✓✗ 标记）、§4 动效（级联、hover 上浮）。
   不新建与既有设计系统重复的 class：卡片仍用 .card，标题仍用 .sec-head，
   条形仍用 .bars，这里只补既有清单里没有的形态。
   ═══════════════════════════════════════════════════════════════════════════ */
/* wave-r2 */

/* ── 放射图单图模式（子页大图，右侧不再重复清单） wave-r2 ── */
.radial--solo { grid-template-columns: minmax(0, 1fr); justify-items: center; }
.radial--solo .radial-fig { width: min(520px, 100%); }   /* wave-r3：独占一屏时把图做大一点，撑住留白 */
.radial-solo-note { max-width: 70ch; text-align: center; }
/* DOM 里清单在前（阅读顺序 + 原句片段连续），视觉上图仍在左 wave-r2 */
.radial-fig { order: 0; }
.radial-body { order: 1; min-width: 0; }

/* ── 栏目内子导航（联营 8 页共用，sticky 在页头之下） wave-r2 ── */
/* wave-s2：页头滚动后会收成 62px（.site-header.is-stuck），但 --header-h 在 ≥1025px
   仍是 76px，锚点条按 76px 吸顶就会和页头之间露出 14px 的缝，内容从缝里滚过去。
   锚点条只有在页面滚动之后才吸顶，那时页头一定已经收起，所以直接按收起后的高度吸顶。 */
.subnav {
  position: sticky;
  top: var(--header-h-stuck);
  z-index: 45;
  background: rgba(255, 255, 255, .94);
  backdrop-filter: saturate(150%) blur(8px);
  -webkit-backdrop-filter: saturate(150%) blur(8px);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.subnav > .container {
  display: flex;
  align-items: center;
  gap: var(--sp-5);
  min-width: 0;
}
.subnav-label {
  flex: 0 0 auto;
  padding: 13px 0;
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--brand);
  letter-spacing: .04em;
  position: relative;
  padding-left: 11px;
}
.subnav-label::before {
  content: "";
  position: absolute;
  left: 0; top: 50%;
  width: 2px; height: 13px;
  margin-top: -6px;
  background: var(--brand);
}
.subnav-list {
  display: flex;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.subnav-list::-webkit-scrollbar { display: none; }
.subnav-list > li { flex: 0 0 auto; }
.subnav-link {
  display: block;
  padding: 14px 13px 12px;
  border-bottom: 2px solid transparent;
  font-size: var(--fs-sm);
  color: var(--fg-dim);
  white-space: nowrap;
}
.subnav-link:hover { color: var(--brand); text-decoration: none; }
.subnav-link.is-current {
  color: var(--brand-dark);
  font-weight: 700;
  border-bottom-color: var(--brand);
  background: linear-gradient(180deg, transparent 40%, var(--tint-soft));
}

/* 子导航吃掉一条 sticky 高度：锚点滚动时再让出一行
   wave-s2：按「收起后的页头 62px + 锚点条 55px」算，锚点落点才正好在条下面 */
.subnav ~ * { scroll-margin-top: calc(var(--header-h-stuck) + 60px); }
html { scroll-padding-top: calc(var(--header-h) + 60px); }

/* ── 页底「下一步」导览卡 wave-r2 ── */
.next-step-sec { background: var(--band); border-top: 1px solid var(--line); }
.next-step {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--sp-5);
  align-items: center;
  padding: var(--sp-6) var(--sp-7);
  border: 1px solid var(--line);
  border-left: 2px solid var(--brand);
  border-radius: var(--r);
  background: #fff;
  transition: border-color .2s var(--ease), transform .2s var(--ease), box-shadow .2s var(--ease);
}
.next-step:hover {
  border-color: var(--brand-32);
  border-left-color: var(--brand-hi);
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(18, 58, 112, .07);
}
.next-step-eyebrow { font-size: var(--fs-xs); color: var(--fg-faint); letter-spacing: .04em; }
.next-step-title { margin-top: 6px; font-size: var(--fs-h2); font-weight: 700; color: var(--brand-dark); line-height: 1.25; }
.next-step-sub { margin-top: var(--sp-3); font-size: var(--fs-sm); color: var(--fg-dim); }
.next-step-go { flex: 0 0 auto; white-space: nowrap; }
.next-step-back { margin-top: var(--sp-4); font-size: var(--fs-xs); }
.next-step-back a { color: var(--fg-faint); }
.next-step-back a:hover { color: var(--brand); }

/* ── 三个「不」徽标 wave-r2 ── */
.deny-badges {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--sp-4);
  list-style: none;
  margin: 0;
  padding: 0;
}
.deny-badge {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 2px var(--sp-4);
  padding: var(--sp-5);
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: #fff;
  transition: border-color .2s var(--ease), transform .2s var(--ease);
}
.sec--alt .deny-badge, .sec--art .deny-badge { background: #fff; }
.deny-badge:hover { border-color: var(--brand-32); transform: translateY(-2px); }
.deny-badge-mark { grid-row: 1 / span 2; color: var(--brand-hi); }
.deny-badge-mark svg { display: block; width: 34px; height: 34px; }
.deny-badge-t { font-size: var(--fs-h3); font-weight: 700; color: var(--brand-dark); }
.deny-badge-d { font-size: var(--fs-sm); line-height: 1.75; color: var(--fg-dim); }

/* ── 共营模型图：机构 ⇄ 鲸程 → 增量 wave-r2 ── */
.model {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 60px minmax(0, 1fr);
  gap: var(--sp-5);
  align-items: stretch;
}
.model-side {
  padding: var(--sp-5);
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: var(--band);
}
.model-side--hi { border-color: var(--brand-32); background: var(--tint); }
.model-side-title {
  padding-bottom: var(--sp-3);
  margin-bottom: var(--sp-4);
  border-bottom: 1px solid var(--line-strong);
  font-size: var(--fs-h3);
  font-weight: 700;
  color: var(--brand-dark);
}
.model-side--hi .model-side-title { border-bottom-color: var(--brand-32); }
.model-items { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; }
.model-items > li {
  position: relative;
  padding-left: 15px;
  font-size: var(--fs-sm);
  color: var(--fg);
}
.model-items > li::before {
  content: "";
  position: absolute;
  left: 0; top: .62em;
  width: 5px; height: 5px;
  background: var(--brand-hi);
  transform: rotate(45deg);
}
.model-side-note { margin-top: var(--sp-4); font-size: var(--fs-xs); color: var(--fg-faint); }
.model-join { display: flex; align-items: center; justify-content: center; }
.model-join svg { width: 46px; height: 46px; }
.model-out {
  grid-column: 1 / -1;
  position: relative;
  margin-top: var(--sp-2);
  padding: var(--sp-5) var(--sp-6);
  border-radius: var(--r);
  background: linear-gradient(110deg, var(--brand) 0%, var(--brand-hi) 100%);
  color: #fff;
  font-size: var(--fs-lead);
  font-weight: 700;
  text-align: center;
}
.model-out::before {
  content: "";
  position: absolute;
  top: -13px; left: 50%;
  margin-left: -8px;
  border: 8px solid transparent;
  border-top: 0;
  border-bottom: 13px solid var(--brand);
}

/* ── 生命周期横轴 wave-r2 ── */
.stage-axis {
  display: grid;
  grid-template-columns: repeat(var(--stages, 4), minmax(0, 1fr));
  gap: 0;
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
}
.stage-axis::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 7px;
  height: 2px;
  background: linear-gradient(90deg, var(--brand) 0%, var(--brand-hi) 100%);
  border-radius: 2px;
}
.stage { position: relative; padding: var(--sp-6) var(--sp-4) 0 0; }
.stage-tick {
  position: absolute;
  top: 0; left: 0;
  width: 16px; height: 16px;
  border-radius: 50%;
  border: 3px solid #fff;
  background: var(--brand);
  box-shadow: 0 0 0 1px var(--brand-32);
  transition: transform .4s var(--ease);
}
.stage-axis.is-in .stage:nth-child(2) .stage-tick { transition-delay: .08s; }
.stage-axis.is-in .stage:nth-child(3) .stage-tick { transition-delay: .16s; }
.stage-axis.is-in .stage:nth-child(4) .stage-tick { transition-delay: .24s; }
.js .stage-axis:not(.is-in) .stage-tick { transform: scale(.4); }
.stage-name { display: block; font-size: var(--fs-h3); font-weight: 700; color: var(--brand-dark); }
.stage-detail { display: block; margin-top: var(--sp-3); font-size: var(--fs-sm); line-height: 1.8; color: var(--fg-dim); }

/* ── 等分示意条（考核三板块） wave-r2 ── */
.eqsplit {
  display: grid;
  grid-template-columns: repeat(var(--parts, 3), minmax(0, 1fr));
  gap: 3px;
  list-style: none;
  margin: 0;
  padding: 0;
  border-radius: var(--r);
  overflow: hidden;
}
.eqsplit-part {
  padding: var(--sp-5) var(--sp-4);
  background: var(--tint);
  border-top: 2px solid var(--brand);
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--brand-dark);
  text-align: center;
}
.eqsplit-part:nth-child(2) { background: #E1EDF9; }
.eqsplit-part:nth-child(3) { background: #DCEAF8; }

/* ── 利润保底基线示意 wave-r2 ── */
.floor { display: grid; gap: var(--sp-5); }
.floor-base {
  display: flex;
  align-items: baseline;
  gap: var(--sp-4);
  padding-bottom: var(--sp-4);
  border-bottom: 2px dashed var(--brand-32);
}
.floor-base-num { font-family: var(--font-num); font-size: clamp(30px, 3.4vw, 44px); font-weight: 700; line-height: 1; color: var(--brand); white-space: nowrap; }
.floor-base-label { font-size: var(--fs-sm); color: var(--fg-dim); }
.floor-base-label--only { font-size: var(--fs-h3); font-weight: 700; color: var(--brand-dark); }
.floor-bar-label { margin-bottom: var(--sp-3); font-size: var(--fs-sm); font-weight: 600; color: var(--fg); }
.floor-bar { display: flex; margin: 0; border-radius: var(--r); overflow: hidden; }
.floor-seg {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: var(--sp-3);
  font-size: var(--fs-xs);
  line-height: 1.6;
  text-align: center;
}
.floor-seg--real { flex: 0 0 66%; background: linear-gradient(110deg, var(--brand), var(--brand-hi)); color: #fff; font-weight: 700; }
.floor-seg--fill {
  flex: 1 1 auto;
  color: var(--brand-dark);
  background:
    repeating-linear-gradient(135deg, var(--tint) 0 7px, #fff 7px 14px);
  border: 1px solid var(--brand-32);
  border-left: 0;
}

/* ── 卡片里的迷你双条 wave-r2 ── */
.minibar { display: grid; gap: 5px; margin-top: var(--sp-3); }
.minibar-line { display: block; height: 9px; }
.minibar-seg { display: block; height: 9px; width: 0; border-radius: 0 2px 2px 0; transition: width .95s var(--ease); }
.minibar-seg--before { background: var(--line-strong); }
.minibar-seg--after { background: linear-gradient(90deg, var(--brand), var(--brand-hi)); }
.is-in .minibar-seg,
html:not(.js) .minibar-seg { width: var(--w, 0%); }

/* 奇数张卡片的最后一张占满一行（如首页五大保障 5 张） wave-r2 */
.card--wide { grid-column: 1 / -1; }

/* ── ✓ / ✗ 标记（matrix 与 compare_table 共用） wave-r2 ── */
.mtx-mark--yes { color: var(--brand); }
.mtx-mark--no { color: var(--fg-faint); }
.mtx-mark--inline { display: inline-block; margin-right: 7px; font-size: 15px; }

/* ── 步骤图：纵向模式与「平台自费」小标 wave-r2 ── */
.steps--v { grid-auto-flow: row; grid-auto-columns: auto; }
.steps--v::before { left: 7px; right: auto; top: 6px; bottom: 6px; width: 1px; height: auto; }
.steps--v .step { padding: 0 0 var(--sp-6) 34px; }
.steps--v .step:last-child { padding-bottom: 0; }
.steps--v .step-dot { top: 5px; }
.steps--v .step-title { font-size: var(--fs-h3); }
.step-tag {
  display: inline-block;
  margin-top: var(--sp-2);
  padding: 2px 8px;
  border-radius: 2px;
  background: var(--tint);
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--brand-dark);
}

/* ── 大数字：非数字值用中文字体 wave-r2 ── */
.counter-num--text { font-family: var(--font); font-size: clamp(26px, 2.6vw, 36px); }
.counter-prefix { font-family: var(--font); font-size: .46em; font-weight: 600; margin-right: 3px; vertical-align: .22em; color: var(--fg-dim); }

/* ── 首屏铺底装饰图（主图不再与联系卡上下叠） wave-r2 ── */
.hero-deco {
  position: absolute;
  /* 右缘留出 60px 给 PC 悬浮（.dock），铺底装饰不压它 */
  right: 60px;
  bottom: -30px;
  width: min(760px, 58vw);
  margin: 0;
  z-index: -1;
  opacity: .30;
  pointer-events: none;
  mask-image: linear-gradient(200deg, #000 30%, transparent 88%);
  -webkit-mask-image: linear-gradient(200deg, #000 30%, transparent 88%);
}
.hero-deco img { display: block; width: 100%; height: auto; }
/* wave-p2：.hero-counters 已删除 —— 五个计数器搬到首屏下方的全宽数字带 .statband（见 §25） */

/* ── wave-r3：中文短标签断行时别把最后一个字甩到下一行 ── */
.counter-label, .step-title, .step-desc, .mtx-cell, .mtx-key, .bar-name, .radial-name,
.stage-name, .stage-detail, .art-cap, .card-title, .stat-label, .next-step-title,
.sec-title, .hero-title, .page-title, .chart-title, .model-side-title {
  text-wrap: balance;
}
/* 首屏在 1280×800 内完整可见：压一点上留白与标题字号 wave-r2 */
.hero { padding-top: calc(var(--header-h) + 44px); padding-bottom: var(--sp-8); }
.hero-title { font-size: clamp(28px, 3.6vw, 46px); max-width: 19ch; }
.hero-sub { margin-top: var(--sp-4); }

/* ── GEO 折叠表：图在上、原表在 <details> 里 wave-r2 ── */
.table-fold { margin-top: var(--sp-6); border-top: 1px solid var(--line); }
.table-fold > summary {
  padding: var(--sp-4) 0;
  cursor: pointer;
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--brand);
  list-style: none;
}
.table-fold > summary::-webkit-details-marker { display: none; }
.table-fold > summary::before { content: "＋ "; font-family: var(--font-num); }
.table-fold[open] > summary::before { content: "－ "; }
.table-fold > summary:hover { color: var(--brand-hi); }

/* ── 相关问题链接组（替代次要位置的重复 FAQ） wave-r2 ── */
.qlinks { display: grid; gap: var(--sp-3); list-style: none; margin: 0; padding: 0; }
.qlinks > li { border-bottom: 1px solid var(--line); }
.qlinks > li:last-child { border-bottom: 0; }
.qlinks a {
  display: block;
  padding: var(--sp-4) 0;
  font-size: var(--fs-lead);
  color: var(--fg);
}
.qlinks a:hover { color: var(--brand); text-decoration: none; }
.qlinks a::after { content: " →"; color: var(--brand-hi); }

/* ── 15 模块矩阵（比 15 张卡更紧、一眼看全） wave-r2 ── */
.modmatrix {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: var(--r);
  overflow: hidden;
}
.modmodule {
  display: block;
  padding: var(--sp-5);
  background: #fff;
  color: inherit;
  transition: background-color .2s var(--ease), transform .2s var(--ease);
}
.modmodule:hover { background: var(--tint-soft); text-decoration: none; }
.modmodule-no { font-family: var(--font-num); font-size: var(--fs-xs); font-weight: 700; color: var(--brand-32); }
.modmodule-name { margin-top: 4px; font-size: var(--fs-lead); font-weight: 700; color: var(--brand-dark); }
.modmodule:hover .modmodule-name { color: var(--brand); }
.modmodule-value { margin-top: 6px; font-size: var(--fs-xs); line-height: 1.7; color: var(--fg-dim); }

/* ── §4 动效：级联加长到 8 个 + 卡片 hover 微上浮 wave-r2 ── */
.js .reveal:nth-child(5) { transition-delay: .24s; }
.js .reveal:nth-child(6) { transition-delay: .30s; }
.js .reveal:nth-child(7) { transition-delay: .36s; }
.js .reveal:nth-child(8) { transition-delay: .42s; }
.card, .case-card, .counter, .art-figure {
  transition: border-color .2s var(--ease), background-color .2s var(--ease),
              transform .2s var(--ease), box-shadow .2s var(--ease);
}
.card:hover, .case-card:hover, .counter:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(18, 58, 112, .06);
}
.js .reveal.is-in .card, .js .reveal.is-in .case-card { will-change: auto; }

/* ── 响应式 wave-r2 ── */
@media (max-width: 1024px) {
  .subnav { top: var(--header-h-stuck); }   /* wave-s2：同上，按收起后的页头高度吸顶 */
  .subnav > .container { gap: var(--sp-4); }
  .subnav-label { display: none; }
  /* wave-r3：横滚时右缘做一道渐隐，告诉用户后面还有 */
  .subnav { position: sticky; -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent 100%);
            mask-image: linear-gradient(90deg, #000 88%, transparent 100%); }
  .model { grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); }
  .model-join { transform: rotate(90deg); padding: var(--sp-2) 0; }
  .stage-axis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-5); }
  .stage-axis::before { display: none; }
  .stage { padding: var(--sp-5) 0 0; border-top: 2px solid var(--brand-32); }
  .stage-tick { top: -9px; }
  /* wave-r3：原来在 ≤1024px 把装饰图改成 position:static，而它在 DOM 里排在 .container 之前，
     结果 375px 第一屏看到的是一张插画、标题被顶到折线以下。改回绝对定位、右上角淡铺底。 */
  /* wave-r3：单栏之后 19ch 的行宽太窄，标题会从「负/责」中间断开 */
  .hero-title { max-width: 24ch; }
  .hero-deco {
    right: -70px; bottom: auto; top: calc(var(--header-h) + 4px);
    width: min(440px, 78%); opacity: .16; margin-top: 0;
    mask-image: linear-gradient(200deg, #000 38%, transparent 92%);
    -webkit-mask-image: linear-gradient(200deg, #000 38%, transparent 92%);
  }
}

@media (max-width: 767px) {
  .next-step { grid-template-columns: minmax(0, 1fr); padding: var(--sp-5); }
  .next-step-go { width: 100%; text-align: center; }
  .eqsplit { grid-template-columns: minmax(0, 1fr); }
  .stage-axis { grid-template-columns: minmax(0, 1fr); }
  .floor-bar { flex-direction: column; }
  .floor-seg--real { flex: 0 0 auto; }
  .floor-seg--fill { border-left: 1px solid var(--brand-32); border-top: 0; }
  .deny-badges { grid-template-columns: minmax(0, 1fr); }
  .modmatrix { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 400px) {
  .modmatrix { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .minibar-seg { width: var(--w, 0%); }
  .js .stage-axis:not(.is-in) .stage-tick { transform: none; }
  .next-step:hover, .card:hover, .case-card:hover, .counter:hover, .deny-badge:hover { transform: none; }
}

@media print {
  .subnav, .next-step-sec, .hero-deco { display: none !important; }
  .table-fold > summary { display: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   23. 修订波 S1 瘦身新增件  wave-s1
   上位规格 docs/superpowers/specs/2026-09-24-v3-revision-3-slim.md
   56 页 → 8 页：栏目内多页路径改成长页 + 页内锚点导航，案例详情改成页内区块与
   <details> 折叠卡。只补既有清单没有的形态：
     .subnav--anchor   页内锚点条（复用 .subnav 的 sticky 与 .subnav-link 样式）
     .footer-nav       页脚 7 项栏目（原 4 列 footer-cols 已不需要）
     .case-sec         /cases/ 里一篇案例的区块头（序号 + 标题 + 地区/方向标签）
     .case-fold        /services/ 里 12 篇企业案例的折叠卡
     .crossbar         身份导流条（企业服务页 →「我是财税机构，了解联营」）
   ═══════════════════════════════════════════════════════════════════════════ */
/* wave-s1 */

/* ── 页内锚点条：同一条 .subnav，只是当前项由 JS 而不是服务端决定 ── */
.subnav--anchor .subnav-link { scroll-margin-inline: var(--sp-5); }
.subnav--anchor .subnav-link.is-current { border-bottom-color: var(--brand-hi); }
/* 锚点 section 让出 sticky 两行的高度（.subnav ~ * 已有同一条，这里只补更深的目标） */
.subnav--anchor ~ * > [id] { scroll-margin-top: calc(var(--header-h-stuck) + 62px); } /* wave-s2 */

/* ── 页脚栏目（7 项，两列排） ── */
.footer-nav .footer-col-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px var(--sp-6);
}

/* ── /cases/ 一篇案例的区块头 ── */
.case-sec-head {
  display: grid;
  gap: var(--sp-3);
  padding-bottom: var(--sp-5);
  border-bottom: 1px solid var(--line);
  margin-bottom: var(--sp-6);
}
.case-sec-no {
  font-family: var(--font-num);
  font-size: var(--fs-sm);
  font-weight: 700;
  color: var(--brand-hi);
  letter-spacing: .06em;
}
.case-sec-title { margin: 0; font-size: var(--fs-h2); font-weight: 700; color: var(--brand-dark); line-height: 1.3; }
.case-sec-tags { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin: 0; }

/* ── /services/ 12 篇企业案例折叠卡 ── */
.case-folds { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); }
.case-fold {
  border: 1px solid var(--line);
  border-left: 2px solid var(--brand-20);
  border-radius: var(--r);
  background: #fff;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.case-fold[open] { border-left-color: var(--brand); box-shadow: 0 8px 24px rgba(18, 58, 112, .05); }
.case-fold:hover { border-color: var(--brand-32); }
.case-fold > summary {
  display: grid;
  gap: 6px;
  padding: var(--sp-5);
  cursor: pointer;
  list-style: none;
}
.case-fold > summary::-webkit-details-marker { display: none; }
.case-fold-no { font-family: var(--font-num); font-size: var(--fs-xs); font-weight: 700; color: var(--brand-32); }
.case-fold-title { font-size: var(--fs-lead); font-weight: 700; color: var(--brand-dark); line-height: 1.45; }
.case-fold-result { font-size: var(--fs-xs); line-height: 1.75; color: var(--fg-dim); }
.case-fold-more { font-size: var(--fs-xs); color: var(--brand); }
.case-fold-more::after { content: " ＋"; }
.case-fold[open] .case-fold-more::after { content: " －"; }
.case-fold-body {
  padding: 0 var(--sp-5) var(--sp-5);
  border-top: 1px solid var(--line);
  margin-top: 0;
}
.case-fold-body .kv-list { margin-top: var(--sp-4); }

/* ── 身份导流条 ── */
.crossbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4) var(--sp-6);
  padding: var(--sp-5) var(--sp-6);
  border: 1px solid var(--line);
  border-left: 2px solid var(--brand-hi);
  border-radius: var(--r);
  background: var(--tint-soft);
}
.crossbar-text { margin: 0; font-size: var(--fs-sm); color: var(--fg-dim); }
.crossbar-text b { color: var(--brand-dark); }

@media (max-width: 1024px) {
  .case-folds { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
  .case-sec-title { font-size: var(--fs-h3); }
  .crossbar { justify-content: flex-start; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   24. 修订波 P1 精修件  wave-p1
   上位规格 docs/superpowers/specs/2026-09-24-v3-revision-4-polish.md（用户逐屏反馈 18 条）
     §B-6  首屏标题重点分层        .hero-title .ht-pre / .ht-key
     §B-7  首屏联系卡上下两段       .contact-block--hero
     §B-8  共营模型图重做           .model2
     §B-9  首页页底转化区去电话二维码 .cta-final--plain
     §B-10 配色顺序 浅→中→最深      （见 §1 的 --footer-* 与 §3 的 .sec--ink）
     §C-11 统一容器宽度 + 长正文两栏 .readrow
     §D-12 五大优势卡              .advrow
     §D-13 五大能力五根支柱         .pillars
     §E-14 中国点阵地图             .cnmap（SVG 由 tools/gen_china_map.py 生成）
     §F-17 图形带标题「服务体系」    （见 partials/art-band.html）
     §18   二维码尺寸规范           （见 §15 的 --qr-size）
   ═══════════════════════════════════════════════════════════════════════════ */
/* wave-p1 */

/* ── §C-11 长正文两栏：左小标 + H2，右正文；容器宽度与其余区块完全一致 ── */
.readrow {
  display: grid;
  grid-template-columns: minmax(0, 330px) minmax(0, 1fr);
  gap: var(--sp-6) var(--sp-8);
  align-items: start;
}
.readrow > .sec-head { margin-bottom: 0; max-width: none; }
.readrow-body { max-width: 68ch; }
.readrow-body > * + * { margin-top: var(--sp-5); }
.readrow-body p { font-size: var(--fs-lead); line-height: 1.95; color: var(--fg-dim); }
.readrow-body .note,
.readrow-body .compare-note { margin-top: var(--sp-6); }
.readrow + .readrow { margin-top: var(--sp-8); padding-top: var(--sp-8); border-top: 1px solid var(--line); }
@media (max-width: 1024px) {
  .readrow { grid-template-columns: minmax(0, 1fr); gap: var(--sp-5); }
  .readrow + .readrow { margin-top: var(--sp-7); padding-top: var(--sp-7); }
}

/* ── §B-6 首屏标题：前半句退成深灰，后半句品牌蓝加重 + 一道蓝细线 ── */
.hero-title .ht-pre {
  display: block;
  font-size: .72em;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--fg-dim);
}
.hero-title .ht-key {
  position: relative;
  display: block;
  margin-top: .12em;
  padding-bottom: .3em;
  font-weight: 800;
  color: var(--brand);
}
.hero-title .ht-key::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 84px; height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--brand), var(--brand-hi));
}

/* ── §B-7 / §18 首屏联系卡：上段电话、下段大二维码，右侧不再留空 ── */
.contact-block--hero { padding: var(--sp-6) var(--sp-6) var(--sp-7); }
.contact-block--hero .contact-qr { --qr-size: 208px; }
.contact-block--hero .phone-big { font-size: clamp(32px, 3.6vw, 42px); }
.contact-main > .contact-phone { display: grid; gap: var(--sp-3); justify-items: start; }
.contact-phone .btn { margin-top: 2px; }
@media (max-width: 400px) {
  .contact-block--hero .contact-qr { --qr-size: 186px; }
}

/* ── §B-9 首页页底转化区：只留文字 + 两个按钮（电话与二维码页脚已有） ── */
/* wave-p2：.cta-final--plain 改成「左文右按钮」，规则移到 §25 */

/* 中等深度转化区上的正文提亮一档，保证对比度 */
.sec--ink .sec-lead,
.sec--ink .card-text,
.sec--ink p { color: #D7E5F5; }
.sec--ink .fine { color: #B9CFE9; }

/* ── §B-8 共营模型图：两组带图标的条目 ⇄ 中间交换箭头 → 底部结果带 ── */
.model2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 118px minmax(0, 1fr);
  align-items: stretch;
  gap: 0 var(--sp-4);
}
.model2-col {
  padding: var(--sp-5) var(--sp-5) var(--sp-4);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: #fff;
}
.model2-col--hi {
  border-color: var(--brand-32);
  background: linear-gradient(180deg, var(--tint) 0%, #fff 56%);
}
.model2-title {
  padding-bottom: var(--sp-3);
  margin-bottom: var(--sp-2);
  border-bottom: 1px solid var(--line);
  font-size: var(--fs-h3);
  font-weight: 700;
  color: var(--brand-dark);
}
.model2-col--hi .model2-title { border-bottom-color: var(--brand-20); }
.model2-items { display: grid; }
.model2-item {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: var(--sp-4);
  align-items: center;
  padding: 13px 0;
}
.model2-item + .model2-item { border-top: 1px solid var(--line); }
.model2-col--hi .model2-item + .model2-item { border-top-color: var(--brand-12); }
.model2-ic {
  display: grid;
  place-items: center;
  width: 40px; height: 40px;
  border: 1px solid var(--brand-20);
  border-radius: 50%;
  background: #fff;
  color: var(--brand-hi);
}
.model2-col--hi .model2-ic { border-color: var(--brand-32); color: var(--brand); }
.model2-ic svg { width: 20px; height: 20px; }
.model2-name { font-size: 16px; font-weight: 600; color: var(--fg); }

.model2-swap { display: grid; align-content: center; justify-items: center; gap: var(--sp-3); }
.model2-swap svg { width: 92px; height: 58px; }
.model2-swap-cap { font-size: var(--fs-xs); letter-spacing: .06em; color: var(--fg-faint); }
.model2-arrow { fill: none; stroke-width: 2.2; stroke-linecap: round; }
.model2-arrow--a { stroke: var(--brand-hi); }
.model2-arrow--b { stroke: var(--brand); }

.model2-funnel { grid-column: 1 / -1; height: 46px; margin-top: var(--sp-4); }
.model2-funnel svg { width: 100%; height: 46px; }
.model2-funnel path { fill: none; stroke: var(--brand-20); stroke-width: 1.5; }

.model2-out {
  grid-column: 1 / -1;
  padding: var(--sp-5) var(--sp-6);
  border-radius: var(--r);
  background: linear-gradient(104deg, var(--brand) 0%, var(--brand-hi) 100%);
  color: #fff;
  font-size: var(--fs-lead);
  font-weight: 700;
  text-align: center;
  letter-spacing: .01em;
}

/* 一处编排好的动效：图进视口 → 两支箭头画出来 → 结果带浮起 */
.model2-arrow { stroke-dasharray: 64; stroke-dashoffset: 0; }
.model2-out { transition: opacity .5s var(--ease), transform .5s var(--ease); }
.js .model2:not(.is-in) .model2-arrow { stroke-dashoffset: 64; }
.js .model2:not(.is-in) .model2-out { opacity: 0; transform: translateY(10px); }
.model2.is-in .model2-arrow { transition: stroke-dashoffset .7s var(--ease); }
.model2.is-in .model2-arrow--b { transition-delay: .18s; }
.model2.is-in .model2-out { transition-delay: .5s; }

@media (max-width: 1024px) {
  .model2 { grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); }
  .model2-swap { padding: var(--sp-2) 0; }
  .model2-swap svg { transform: rotate(90deg); width: 64px; height: 48px; }
  .model2-funnel { display: none; }
  .model2-out { margin-top: var(--sp-4); }
}

/* ── §D-12 五大优势：一排 5 张带图标的卡，字号 18px ── */
.advrow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--sp-4);
  list-style: none;
  margin: 0;
  padding: 0;
}
.adv {
  display: grid;
  justify-items: center;
  gap: var(--sp-3);
  padding: var(--sp-5) var(--sp-3);
  border: 1px solid var(--line);
  border-top: 2px solid var(--brand-hi);
  border-radius: var(--r);
  background: #fff;
  text-align: center;
  transition: border-color .2s var(--ease), transform .2s var(--ease);
}
.adv:hover { border-color: var(--brand-32); transform: translateY(-2px); }
.adv-ic {
  display: grid;
  place-items: center;
  width: 42px; height: 42px;
  border-radius: 50%;
  background: var(--tint);
  color: var(--brand);
}
.adv-ic svg { width: 21px; height: 21px; }
.adv-t { font-size: 18px; font-weight: 700; line-height: 1.4; color: var(--brand-dark); }
@media (max-width: 1024px) { .advrow { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) { .advrow { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ── §D-13 五大能力：一条「鲸程」横梁 + 五根等宽立柱，依次升起 ── */
.pillars { display: grid; }
.pillars-beam {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 54px;
  border-radius: var(--r) var(--r) 0 0;
  background: linear-gradient(90deg, var(--brand) 0%, var(--brand-hi) 100%);
  color: #fff;
  font-size: var(--fs-h3);
  font-weight: 700;
  letter-spacing: .22em;
  text-indent: .22em;
}
.pillars-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 2px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.pillar {
  display: grid;
  justify-items: center;
  align-content: start;
  gap: var(--sp-3);
  padding: var(--sp-6) var(--sp-4) var(--sp-6);
  border: 1px solid var(--line);
  border-top: 0;
  background: linear-gradient(180deg, var(--tint-soft) 0%, #fff 62%);
  text-align: center;
  transform-origin: top center;
}
.pillar:first-child { border-bottom-left-radius: var(--r); }
.pillar:last-child { border-bottom-right-radius: var(--r); }
.pillar-ic {
  display: grid;
  place-items: center;
  width: 46px; height: 46px;
  border: 1px solid var(--brand-20);
  border-radius: 50%;
  background: #fff;
  color: var(--brand);
}
.pillar-ic svg { width: 23px; height: 23px; }
.pillar-name { font-size: var(--fs-h3); font-weight: 700; color: var(--brand-dark); }
.pillar-text { font-size: var(--fs-sm); line-height: 1.75; color: var(--fg-dim); }
.pillar { transition: transform .5s var(--ease), opacity .4s var(--ease); }
.js .pillars:not(.is-in) .pillar { transform: scaleY(.06); opacity: 0; }
.pillars.is-in .pillar:nth-child(2) { transition-delay: .09s; }
.pillars.is-in .pillar:nth-child(3) { transition-delay: .18s; }
.pillars.is-in .pillar:nth-child(4) { transition-delay: .27s; }
.pillars.is-in .pillar:nth-child(5) { transition-delay: .36s; }
@media (max-width: 1024px) {
  .pillars-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px; }
  .pillar { border-radius: 0; }
}
@media (max-width: 560px) {
  /* 五根柱子在小屏保持两列：一列排下来五段太长，两列刚好一屏看完 */
  .pillar { padding: var(--sp-5) var(--sp-3); }
  .pillar-name { font-size: 18px; }
  .pillar-text { font-size: var(--fs-xs); }
  .pillars-beam { letter-spacing: .12em; }
}

/* ── §E-14 中国点阵地图 ── */
.cnmap-fig { margin: 0; }
.cnmap { display: block; width: 100%; height: auto; }
.cnmap-fig > figcaption { margin-top: var(--sp-5); }
.cnm-dots { fill: none; stroke: #B7CCE6; stroke-width: 4.4; stroke-linecap: round; }
.cnm-dots--inset { stroke-width: 2.6; }
.cnm-dash { fill: #8FB2D8; }
.cnm-inset-box { fill: none; stroke: var(--line-strong); stroke-width: 1; }
.cnm-inset-cap { font-family: var(--font); font-size: 12px; fill: var(--fg-faint); }
.cnm-dot { fill: var(--brand-hi); }
.cnm-dot--hq { fill: var(--brand); }
.cnm-halo { fill: var(--brand-hi); opacity: .3; transform-box: fill-box; transform-origin: center; }
.cnm-halo--hq { fill: var(--brand); }
.cnm-ring { fill: none; stroke: var(--brand); stroke-width: 1.2; opacity: .32; }
.cnm-label {
  font-family: var(--font);
  font-size: 16px;
  font-weight: 600;
  fill: var(--fg);
  dominant-baseline: middle;
  paint-order: stroke;
  stroke: #fff;
  stroke-width: 3.5px;
  stroke-linejoin: round;
}
.cnm-label--hq { font-size: 16px; font-weight: 700; fill: var(--brand); }
.cnm-pin { transition: opacity .2s var(--ease); }
.cnm-pin .cnm-dot,
.cnm-pin .cnm-ring { transform-box: fill-box; transform-origin: center; transition: transform .2s var(--ease); }
.cnm-pin:hover .cnm-dot { transform: scale(1.45); }
.cnm-pin:hover .cnm-label { fill: var(--brand); }
.cnmap:hover .cnm-pin { opacity: .4; }
.cnmap:hover .cnm-pin:hover { opacity: 1; }

@keyframes cnm-pulse {
  0%   { transform: scale(1);   opacity: .42; }
  72%  { transform: scale(2.7); opacity: 0; }
  100% { transform: scale(2.7); opacity: 0; }
}
.js .cnmap.is-in .cnm-halo { animation: cnm-pulse 3s var(--ease) infinite; }
.js .cnmap.is-in .cnm-pin:nth-of-type(2) .cnm-halo { animation-delay: .25s; }
.js .cnmap.is-in .cnm-pin:nth-of-type(3) .cnm-halo { animation-delay: .5s; }
.js .cnmap.is-in .cnm-pin:nth-of-type(4) .cnm-halo { animation-delay: .75s; }
.js .cnmap.is-in .cnm-pin:nth-of-type(5) .cnm-halo { animation-delay: 1s; }
.js .cnmap.is-in .cnm-pin:nth-of-type(6) .cnm-halo { animation-delay: 1.25s; }
.js .cnmap.is-in .cnm-pin:nth-of-type(7) .cnm-halo { animation-delay: 1.5s; }
.js .cnmap.is-in .cnm-pin:nth-of-type(8) .cnm-halo { animation-delay: 1.75s; }

/* 375px 下整张图被压到 343px 宽，城市名再放大也只有七八像素、还会互相压。
   小屏只留「总部合肥」一处标注与放大的点位——8 处机构名就在图下面那排锚点里。 */
@media (max-width: 767px) {
  .cnm-pin:not(.cnm-pin--hq) .cnm-label { display: none; }
  .cnm-label--hq { font-size: 36px; stroke-width: 8px; }
  .cnm-dot { r: 10; }
  .cnm-halo { r: 10; }
  .cnm-dot--hq, .cnm-halo--hq { r: 14; }
  .cnm-ring { r: 30; }
  .cnm-dots { stroke-width: 4.8; }
  .cnm-inset-cap { font-size: 26px; }
}

/* ── §B-10 页脚：深底上的 logo 与二维码 ── */
.site-footer .qr-placeholder { border-color: rgba(255, 255, 255, .22); }
.site-footer .footer-col-title::before { background: var(--footer-hi); }

/* ── §A-5 正式版脚注：客户自带的免责句用正式卡片样式，不再是浮在空白上的灰色小字 ── */
.note--legal {
  display: block;
  padding: var(--sp-5) var(--sp-6);
  border: 1px solid var(--line);
  border-left: 2px solid var(--brand);
  border-radius: var(--r);
  background: var(--band);
  font-size: var(--fs-sm);
  line-height: 1.85;
  color: var(--fg-dim);
}
.sec--paper .note--legal, .sec--alt .note--legal { background: #fff; }

@media (prefers-reduced-motion: reduce) {
  .js .pillars:not(.is-in) .pillar { transform: none; opacity: 1; }
  .js .model2:not(.is-in) .model2-arrow { stroke-dashoffset: 0; }
  .js .model2:not(.is-in) .model2-out { opacity: 1; transform: none; }
  .js .cnmap.is-in .cnm-halo { animation: none; }
  .adv:hover { transform: none; }
}

/* wave-p1 §F-16：FAQ 列表与主题标签条同宽、左边缘对齐；答案本身限一个舒服的行长 */
.faq-a > * { max-width: 78ch; }
.faq-q { max-width: 86ch; }

/* wave-p1：首屏联系卡在 ≤1024px 收成一列时不要被拉满整屏宽 */
@media (max-width: 1024px) {
  .contact-block--hero { max-width: 460px; }
}

/* wave-p1：.card-num 默认行高 1.75，26px 字号会占到 45px 高，正好压在 .card--step
   让出的 48px 上边距边缘。压成 line-height:1 之后序号与标题之间才留得出一条缝。 */
.card-num { line-height: 1; }

/* wave-p1：≤767px 时 .rowlist-item 的 minmax(180px,250px) 会把左列撑到 250px，
   右边正文只剩五六十像素、一个字一行。小屏直接堆成一列。 */
@media (max-width: 767px) {
  .rowlist-item { grid-template-columns: minmax(0, 1fr); gap: var(--sp-3); }
  .rowlist-num { margin-bottom: var(--sp-2); }
}

/* ═══════════════════════════════════════════════════════════════════════════
   25. 修订波 P2 精修件  wave-p2
   用户看过 P1 结果后的第二轮反馈（4 条）+ 一条口径问题
     1  首屏左右等高       .hero-copy .hero-acts + .contact-main--tight .contact-wx
     2  数字带独立成条     .statband（hero 正下方，全宽品牌蓝）
     3  页底转化区去电话与二维码，改纯文字 + 按钮  .cta-final--plain .cta-final-acts
     4  导航顺序           （见 src/data/nav.json 与 tools/build.py 的 sitemap 排序）
   ═══════════════════════════════════════════════════════════════════════════ */
/* wave-p2 */

/* ── 1a 首屏左栏：标题 + 副标 + 两枚按钮，和右侧联系卡等高 ── */
.hero-copy { display: flex; flex-direction: column; }
.hero-acts { margin-top: var(--sp-6); }

/* ── 1b 首屏联系卡（紧凑版）：电话在上，二维码与说明并排在下 ── */
.contact-main--tight { gap: 0; }
.contact-main--tight > .contact-phone { padding-bottom: var(--sp-5); }
.contact-wx {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--sp-5);
  padding-top: var(--sp-5);
  border-top: 1px solid var(--line);
}
/* .contact-main .contact-qr 的居中 + 上边线在并排版里要撤掉 */
.contact-wx .contact-qr { padding-top: 0; border-top: 0; width: auto; justify-items: start; }
.contact-wx .qr-cap { max-width: none; margin: 0; text-align: left; }
.contact-block--hero .contact-qr { --qr-size: 144px; }
.contact-block--hero { padding: var(--sp-6); }

/* ── 2 全宽数字带：首屏正下方，品牌蓝实底、白色大数字 ── */
.statband {
  padding-block: var(--sp-7);
  background: #194E94;
  color: #fff;
}
.statband-eyebrow {
  margin: 0 0 var(--sp-5);
  font-size: var(--fs-xs);
  font-weight: 600;
  letter-spacing: .16em;
  color: var(--ink-accent);
}
.statband .counter-band {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
}
.statband .counter {
  padding: 0 var(--sp-5);
  border: 0;
  border-left: 1px solid rgba(255, 255, 255, .18);
  border-radius: 0;
  background: none;
}
.statband .counter:first-child { padding-left: 0; border-left: 0; }
.statband .counter:hover { transform: none; box-shadow: none; }
.statband .counter-num { font-size: clamp(38px, 4.4vw, 56px); color: #fff; }
.statband .counter-prefix { color: var(--ink-dim); }
.statband .stat-unit { color: var(--ink-accent); }
.statband .counter-label { margin-top: var(--sp-3); font-size: var(--fs-sm); color: var(--ink-dim); }

@media (max-width: 1024px) {
  .statband .counter-band { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-6) 0; }
  .statband .counter:nth-child(3n + 1) { padding-left: 0; border-left: 0; }
}
@media (max-width: 767px) {
  .statband { padding-block: var(--sp-6); }
  .statband .counter-band { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-5) 0; }
  .statband .counter { padding-inline: var(--sp-4); }
  .statband .counter:nth-child(3n + 1) { padding-left: var(--sp-4); border-left: 1px solid rgba(255, 255, 255, .18); }
  .statband .counter:nth-child(2n + 1) { padding-left: 0; border-left: 0; }
}

/* ── 3 页底转化区：左边一段文字，右边 1–2 枚按钮 ── */
.cta-final--plain {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--sp-6) var(--sp-8);
  align-items: center;
}
.cta-final--plain .sec-lead { max-width: 62ch; }
.cta-final-acts { display: grid; gap: var(--sp-4); justify-items: stretch; }
.cta-final-acts .btn { white-space: nowrap; text-align: center; }
@media (max-width: 1024px) {
  .cta-final--plain { grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
  .cta-final-acts { grid-auto-flow: column; justify-content: start; justify-items: start; }
}
@media (max-width: 520px) {
  .cta-final-acts { grid-auto-flow: row; }
}

/* ── 1c 首屏左右等高：两栏拉成同高，左栏按钮沉到底、右卡二维码沉到底 ──
   wave-p2：P1 版右栏比左栏长 110px，首屏整体 698px；收紧联系卡的内距与行距、
   首屏上下留白各收一档之后，两栏都落在 450px 上下，首屏整体 ≤620px。 */
.hero { padding-top: calc(var(--header-h) + 36px); padding-bottom: var(--sp-7); }
.hero-inner { align-items: stretch; }
.hero-copy { justify-content: space-between; }
.hero-copy .hero-sub { margin-top: var(--sp-4); }

.contact-block--hero { display: grid; grid-template-rows: auto 1fr; padding: var(--sp-5) var(--sp-6); }
.contact-block--hero .contact-block-head { margin-bottom: var(--sp-4); }
.contact-block--hero .contact-block-sub { line-height: 1.7; }
.contact-main--tight { display: grid; grid-template-rows: auto auto; align-content: space-between; }
.contact-main--tight > .contact-phone { gap: var(--sp-2); padding-bottom: var(--sp-4); }
.contact-block--hero .phone-big { font-size: clamp(30px, 3vw, 36px); }
.contact-wx { padding-top: var(--sp-4); }
.contact-block--hero .contact-qr { --qr-size: 142px; }

@media (max-width: 1024px) {
  .hero-inner { align-items: start; }
}

/* 没有正文的转化区（只有标题 + 按钮）不需要 96px 的上下留白 */
.sec--ink-slim { padding-block: var(--sp-8); }
/* 首屏卡二维码旁那行说明：并排版里它是这一段的标题，字重提一档 */
.contact-block--hero .qr-cap { font-size: var(--fs-body); color: var(--fg); }

/* ═══════════════════════════════════════════════════════════════════════════
   26. 修订波 P3 精修件  wave-p3
   ① /contact/ 首屏两栏等高、信息充实   .sec--contact-hero .contact-hero .contact-hero-*
                                        .contact-block--qr
   ② /contact/ 两个咨询入口卡           .card--enquiry .card-act
   ③ /contact/ 服务网络数字带（浅色版）  .statband--light
   ④ /contact/ 栏目链接紧凑卡           .linkgrid
   ⑤ 没有引导语的联系条（反向口径审计）  .contact-line--bare
   ═══════════════════════════════════════════════════════════════════════════ */
/* wave-p3 */

/* ── ① 首屏：左栏「热线 + 总部」与右栏二维码卡等高 ── */
/* 面包屑与 H1 之间原来空着一整屏的 96px，首屏因此只装得下标题与电话 —— 收到 48px，
   让「两个咨询入口」在 1280px 下就能露头 */
.sec--contact-hero { padding-top: var(--sp-7); padding-bottom: var(--sp-8); }
.sec--contact-hero > .container > .sec-head { margin-bottom: var(--sp-6); }
.contact-hero { align-items: stretch; }          /* .split--form 默认 align-items: start */
.contact-hero-main {
  display: grid;
  grid-template-rows: auto auto auto auto 1fr;
  align-content: start;
  gap: var(--sp-2);
}
.contact-hero-num {
  font-size: clamp(40px, 5vw, 60px);
  line-height: 1.04;
  letter-spacing: -.015em;
}
.contact-hero-note { margin-top: var(--sp-3); max-width: 46ch; }
.contact-hero-acts { margin-top: var(--sp-5); }
/* 总部一栏不做成卡片：一条细线 + 小标 + 一行地址，沉在左栏底部与右卡底边对齐 */
.contact-hero-hq {
  align-self: end;
  margin-top: var(--sp-6);
  padding-top: var(--sp-5);
  border-top: 1px solid var(--line);
}
.contact-hero-hq-text {
  margin-top: var(--sp-2);
  font-size: var(--fs-h3);
  font-weight: 700;
  color: var(--fg);
}

/* 右栏二维码卡：标题在上，二维码在剩下的空间里居中，卡片高度跟着左栏走 */
.contact-block--qr {
  display: grid;
  grid-template-rows: auto 1fr;
  align-items: center;
  padding: var(--sp-6);
  box-shadow: 0 18px 44px rgba(18, 58, 112, .08);
}
.contact-block--qr .contact-block-head { margin-bottom: var(--sp-4); }
.contact-block--qr .contact-qr { --qr-size: 200px; align-self: center; }

/* ── ② 咨询入口卡：说明句长度不同也让两枚按钮落在同一条基线上 ── */
.card--enquiry { display: grid; grid-template-rows: auto 1fr auto; }
.card--enquiry .card-text { max-width: 36ch; }
.card-act { margin-top: var(--sp-5); }

/* ── ③ 服务网络数字带（浅色版）：品牌蓝大字 + 细线分栏，不再是深底白字 ── */
.statband--light .counter-band {
  margin-top: var(--sp-5);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
}
.statband--light .counter {
  padding: var(--sp-2) var(--sp-5);
  border: 0;
  border-left: 1px solid var(--line-strong);
  border-radius: 0;
  background: none;
}
.statband--light .counter:first-child { padding-left: 0; border-left: 0; }
.statband--light .counter:hover { transform: none; box-shadow: none; }
.statband--light .counter-num { font-size: clamp(34px, 3.8vw, 50px); color: var(--brand); }
.statband--light .stat-unit { color: var(--brand-hi); }
.statband--light .counter-label { margin-top: var(--sp-3); font-size: var(--fs-sm); color: var(--fg-dim); }

/* ── ④ 栏目链接：只有栏目名 + 前往，卡片收一档高度 ── */
.linkgrid .card { display: grid; gap: var(--sp-4); padding: var(--sp-5); }
.linkgrid .card-more { justify-self: start; }

/* ── ⑤ 没有引导语的联系条：只剩两枚按钮时不要留一半空栏 ── */
.contact-line--bare { grid-template-columns: minmax(0, 1fr); justify-items: start; }

@media (max-width: 1024px) {
  .contact-hero { align-items: start; }
  /* 堆叠之后左栏没有「撑到和右卡一样高」的需求，1fr 那一行会在地址下面留一块空白 */
  .contact-hero-main { grid-template-rows: none; }
  .contact-hero-hq { align-self: start; }
  .contact-block--qr { max-width: 460px; }
  .statband--light .counter-band { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6) 0; }
  .statband--light .counter:nth-child(2n + 1) { padding-left: 0; border-left: 0; }
}
@media (max-width: 767px) {
  .contact-block--qr { padding: var(--sp-5); }
  .contact-block--qr .contact-qr { --qr-size: 184px; }
  .linkgrid .card { padding: var(--sp-5); }
}
