/* ============================================================
 * 北极星AI服务 v1 · M1 落地页样式
 * 设计 Token 锁定自 Spec §8（对齐纪要）
 * 对标：Stripe（信任克制）+ Linear（工艺感）+ Notion（信息架构）
 * 主题：浅色 warm-neutral + 单个深色 Battle Card 对比锚点
 * ============================================================ */

:root {
  /* —— 素极专业 v2 令牌（2026-09-04 官网改版，对齐 overview.md：
       白 #FFF + 软底 #F6F8FA，墨 #171C26 / 次 #525B6B / 弱 #8B93A1，
       单一主色点缀深空蓝 #1D4ED8，发丝边 #E5E9F0，克制、不发光晕）—— */
  --color-primary: #1D4ED8;        /* 深空蓝（唯一主色，克制使用） */
  --color-primary-weak: #EAF0FD;   /* 主色浅底（标签 / 聚焦 / 高亮卡） */
  --color-primary-press: #163FA8;
  --color-result: #1F9D55;         /* 语义结果色（仅极少数正向信号） */
  --color-result-weak: #E7F6ED;

  /* —— 中性色阶（素极灰阶）—— */
  --bg: #F6F8FA;        /* 页面软底 */
  --surface: #FFFFFF;   /* 表面（卡片 / 白底区） */
  --fg: #171C26;        /* 墨（主文字） */
  --fg-2: #525B6B;      /* 次级文字 */
  --muted: #8B93A1;     /* 弱化文字 */
  --border: #E5E9F0;    /* 发丝边 1px */

  /* —— 深色锚点（页脚 CTA 深空蓝带 / Battle Card 用）—— */
  --dark: #171C26;
  --dark-2: #101D45;    /* 深空蓝带 */
  --dark-fg: #F5F8FF;
  --dark-muted: #A9B6D6;
  --dark-border: rgba(255, 255, 255, 0.12);

  /* —— 圆角（克制的圆角）—— */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-pill: 999px;

  /* —— 阴影（轻、不发散，保克制）—— */
  --shadow-sm: 0 1px 2px rgba(23, 28, 38, 0.03), 0 2px 10px rgba(23, 28, 38, 0.04);
  --shadow-md: 0 4px 14px rgba(23, 28, 38, 0.05), 0 14px 34px rgba(23, 28, 38, 0.06);

  /* —— 动效（标准缓动，禁弹性）—— */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --motion-fast: 150ms;
  --motion-base: 250ms;

  /* —— 字体：正文与标题 Noto Sans SC 为主，数据用 JetBrains Mono 承载可测量感 —— */
  --font-display: "Noto Sans SC", "Sora", "Inter", system-ui, sans-serif;
  --font-body: "Noto Sans SC", "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  --maxw: 1080px;
}

/* —— Reset —— */
*,
*::before,
*::after {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1,
h2,
h3 {
  font-family: var(--font-display);
  color: var(--fg);
  margin: 0;
  letter-spacing: -0.01em;
}
p {
  margin: 0;
}
a {
  color: inherit;
  text-decoration: none;
}
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
img {
  max-width: 100%;
  display: block;
}

/* —— 布局容器 —— */
.container {
  width: 100%;
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 20px;
}
.section {
  padding: 72px 0;
}
.section + .section {
  border-top: 1px solid var(--border);
}

/* —— 通用文字 —— */
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--color-primary);
  margin: 0 0 14px;
}
.eyebrow .dot {
  width: 7px;
  height: 7px;
  border-radius: var(--radius-pill);
  background: var(--color-result);
}
.section-title {
  font-size: clamp(24px, 3.4vw, 34px);
  font-weight: 600;
  line-height: 1.25;
}
.section-sub {
  color: var(--fg-2);
  max-width: 62ch;
  margin-top: 12px;
}
.hl-result {
  color: var(--color-result);
}

/* —— 按钮 —— */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--font-body);
  font-weight: 600;
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color var(--motion-fast) var(--ease-standard),
    border-color var(--motion-fast) var(--ease-standard),
    color var(--motion-fast) var(--ease-standard),
    transform var(--motion-fast) var(--ease-standard),
    box-shadow var(--motion-fast) var(--ease-standard);
}
.btn:active {
  transform: translateY(1px);
}
.btn-primary {
  background: var(--color-primary);
  color: #fff;
}
.btn-primary:hover {
  background: var(--color-primary-press);
}
.btn-ghost {
  background: var(--surface);
  color: var(--fg);
  border-color: var(--border);
}
.btn-ghost:hover {
  border-color: var(--fg-2);
}
.btn-sm {
  font-size: 14px;
  padding: 9px 16px;
}
.btn-lg {
  font-size: 16px;
  padding: 14px 24px;
}
.btn-block {
  width: 100%;
}
.cta-arrow {
  transition: transform var(--motion-fast) var(--ease-standard);
}
.btn:hover .cta-arrow {
  transform: translateX(3px);
}

/* —— 焦点可达性 —— */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* —— Lucide 图标尺寸档（16/20/24）—— */
.lucide {
  stroke-width: 1.75;
  flex: none;
}
.lucide-icon.icon-16 {
  width: 16px;
  height: 16px;
}
.lucide-icon.icon-20 {
  width: 20px;
  height: 20px;
}
.lucide-icon.icon-24 {
  width: 24px;
  height: 24px;
}

/* ============================================================
 * 顶部栏
 * ============================================================ */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(247, 248, 250, 0.85);
  backdrop-filter: saturate(180%) blur(10px);
  border-bottom: 1px solid var(--border);
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 60px;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 18px;
  letter-spacing: -0.01em;
}
.brand-logo {
  width: 32px;
  height: 32px;
  object-fit: contain;
  border-radius: var(--radius-sm);
  flex: none;
}
.brand-text {
  display: inline-flex;
  align-items: baseline;
  gap: 1px;
}
.brand .brand-ai {
  color: var(--color-primary);
  margin: 0 1px;
}
.brand-sub {
  display: none;
  font-size: 12px;
  color: var(--muted);
  font-weight: 400;
  margin-left: 8px;
}

/* ============================================================
 * 多页面导航（桌面水平 + 移动折叠）
 * ============================================================ */
.site-nav {
  display: flex;
  align-items: center;
  gap: 28px;
}
.site-nav .nav-link {
  font-size: 15px;
  font-weight: 500;
  color: var(--fg-2);
  transition: color var(--motion-fast) var(--ease-standard);
}
.site-nav .nav-link:hover {
  color: var(--fg);
}
.site-nav .nav-link.active {
  color: var(--color-primary);
}
.nav-toggle {
  display: none;
}
.nav-toggle > summary {
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  padding: 6px;
  color: var(--fg);
}
.nav-toggle > summary::-webkit-details-marker {
  display: none;
}
.nav-toggle > summary .lucide-icon {
  width: 22px;
  height: 22px;
}
.nav-menu {
  position: absolute;
  top: 60px;
  right: 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  padding: 8px;
  display: grid;
  gap: 2px;
  min-width: 168px;
  z-index: 60;
}
.nav-menu a {
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  font-size: 15px;
  color: var(--fg-2);
}
.nav-menu a:hover {
  background: var(--bg);
  color: var(--fg);
}
.nav-menu .nav-cta {
  justify-content: center;
  margin-top: 6px;
  text-align: center;
}

/* —— 诊断介绍页 —— */
.dx-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
}
.dx-intro {
  margin-top: 18px;
  display: grid;
  gap: 10px;
}
.dx-intro li {
  position: relative;
  padding-left: 22px;
  color: var(--fg-2);
}
.dx-intro li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 10px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--color-primary);
}
.dx-steps {
  display: grid;
  gap: 18px;
}
.dx-step {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 18px 20px;
}
.dx-icon {
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-sm);
  background: var(--color-primary-weak);
  color: var(--color-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.dx-step h3 {
  font-size: 16px;
  font-weight: 600;
}
.dx-step p {
  color: var(--fg-2);
  font-size: 14px;
  margin-top: 4px;
}

/* === 诊断维度（S/D/T/O） === */
.dx-dims {
  background: var(--bg-2);
}
.dx-dims-intro {
  color: var(--fg-2);
  font-size: 15px;
  line-height: 1.7;
  max-width: 720px;
  margin-top: 12px;
}
.dx-dim-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 24px;
}
.dx-dim {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 18px 18px 20px;
}
.dx-dim-head {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--color-primary);
}
.dx-dim-head .lucide-icon {
  width: 22px;
  height: 22px;
}
.dx-dim-code {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 18px;
}
.dx-dim-name {
  font-weight: 600;
  font-size: 15px;
  color: var(--fg);
}
.dx-dim-max {
  margin-left: auto;
  font-size: 12px;
  color: var(--muted);
  font-family: var(--font-mono);
}
.dx-dim-desc {
  font-size: 13px;
  color: var(--fg-2);
  line-height: 1.65;
  margin-top: 12px;
}
.dx-dims-note {
  font-size: 12.5px;
  color: var(--muted);
  margin-top: 18px;
  line-height: 1.6;
}
@media (max-width: 820px) {
  .dx-dim-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* —— 案例页 —— */
.case-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 32px;
}
.case-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 22px;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.case-icon {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-sm);
  background: var(--color-primary-weak);
  color: var(--color-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0;
}
.case-body {
  flex: 1 1 auto;
  min-width: 0;
}
.case-tag {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  color: var(--color-primary);
  background: var(--color-primary-weak);
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  margin-bottom: 8px;
}
.case-card p {
  color: var(--fg-2);
  font-size: 14px;
  line-height: 1.65;
  margin: 0;
}

/* —— 关于页 —— */
.about-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 48px;
  align-items: start;
}
.about-bio {
  color: var(--fg-2);
  margin-top: 16px;
  text-indent: 2em;
  font-size: 15.5px;
  line-height: 1.75;
}
.about-who-bio {
  color: var(--fg-2);
  margin-top: 16px;
  text-indent: 2em;
  font-size: 15px;
  line-height: 1.8;
}
.about-principles {
  display: grid;
  gap: 16px;
  margin-top: 32px;
}
.about-principle {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 16px 18px;
}
.about-principle h3 {
  font-size: 15px;
  font-weight: 600;
}
.about-principle p {
  color: var(--fg-2);
  font-size: 13.5px;
  margin-top: 4px;
}

@media (max-width: 768px) {
  .site-nav {
    display: none;
  }
  .nav-toggle {
    display: inline-flex;
  }
  .nav-menu {
    top: 52px;
    right: 12px;
  }
  .dx-grid,
  .about-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .about-principles {
    margin-top: 0;
  }
  .case-grid {
    grid-template-columns: 1fr;
  }
  .te-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .te-honesty {
    flex-direction: row;
  }
}
@media (max-width: 480px) {
  .nav-menu {
    left: 12px;
    right: 12px;
    min-width: auto;
  }
  .te-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
 * 区块 1 · Hero
 * ============================================================ */
.hero {
  padding: 80px 0 64px;
  background: var(--bg);
}
.hero-inner {
  max-width: 880px;
  margin: 0 auto;
  text-align: center;
}
.hero .eyebrow {
  display: flex;
  justify-content: flex-start;
}
.hero-title {
  font-size: clamp(30px, 5vw, 50px);
  line-height: 1.18;
  font-weight: 600;
  letter-spacing: -0.02em;
  white-space: pre-line;
}
.hero-title-note {
  margin-top: 16px;
  font-size: clamp(20px, 3.4vw, 28px);
  font-weight: 500;
  text-align: center;
  color: var(--fg-2);
  letter-spacing: -0.01em;
}
.hero-guides {
  margin-top: 24px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}
.hero-cta {
  margin-top: 32px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
}
.hero-note {
  margin-top: 28px;
  font-size: 13.5px;
  color: var(--muted);
  line-height: 1.7;
  max-width: 70ch;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  padding: 12px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}

/* ============================================================
 * 区块 2 · 信任条
 * ============================================================ */
.trust-strip {
  background: var(--surface);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.trust-strip .container {
  padding-top: 22px;
  padding-bottom: 22px;
}
.trust-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px;
}
.trust-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: var(--fg-2);
  line-height: 1.5;
}
.trust-item .lucide-icon {
  color: var(--color-primary);
  margin-top: 2px;
}

/* ============================================================
 * 区块 3 · S0 免费诊断钩子
 * ============================================================ */
.s0-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 40px;
  align-items: start;
}
.s0-intro li {
  position: relative;
  padding-left: 26px;
  color: var(--fg-2);
  margin-bottom: 10px;
}
.s0-intro li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 8px;
  height: 8px;
  border-radius: var(--radius-pill);
  background: var(--color-result);
}
.s0-panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 24px;
  box-shadow: var(--shadow-sm);
}
.s0-values li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
  font-size: 14.5px;
  color: var(--fg-2);
}
.s0-values li:last-child {
  border-bottom: none;
}
.s0-values .lucide-icon {
  color: var(--color-result);
  margin-top: 3px;
}
.s0-cta-row {
  margin-top: 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.s0-foot {
  margin-top: 18px;
  font-size: 12.5px;
  color: var(--muted);
}

/* ============================================================
 * 区块 4 · 五大场景服务
 * ============================================================ */
.pkg-head {
  max-width: 60ch;
  margin-bottom: 36px;
}
.pkg-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.pkg-card {
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 22px;
  transition: border-color var(--motion-fast) var(--ease-standard),
    box-shadow var(--motion-fast) var(--ease-standard),
    transform var(--motion-fast) var(--ease-standard);
}
.pkg-card:hover {
  border-color: var(--color-primary);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}
.pkg-card.is-free {
  background: var(--color-primary-weak);
  border-color: var(--color-primary);
}
.pkg-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.pkg-icon {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: var(--radius-md);
  background: var(--bg);
  color: var(--color-primary);
}
.pkg-card.is-free .pkg-icon {
  background: var(--surface);
}
.pkg-tag {
  font-size: 12px;
  font-weight: 600;
  color: var(--color-result);
  background: var(--color-result-weak);
  border-radius: var(--radius-pill);
  padding: 3px 10px;
}
.pkg-name {
  font-size: 17px;
  font-weight: 600;
  margin-top: 14px;
}
.pkg-pos {
  font-size: 14.5px;
  color: var(--fg-2);
  margin-top: 8px;
  line-height: 1.55;
}
.pkg-meta {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
  display: grid;
  gap: 8px;
  font-size: 13.5px;
}
.pkg-card.is-free .pkg-meta {
  border-top-color: rgba(199, 62, 58, 0.18);
}
.pkg-meta .row {
  display: flex;
  gap: 8px;
  color: var(--fg-2);
}
.pkg-meta .row b {
  color: var(--fg);
  font-weight: 600;
  flex: none;
}
.pkg-meta .price {
  font-family: var(--font-mono);
  font-weight: 500;
  color: var(--fg);
}
.pkg-card .btn {
  margin-top: 18px;
}
.pkg-foot {
  margin-top: 28px;
  font-size: 12.5px;
  color: var(--muted);
  max-width: 90ch;
}

/* ============================================================
 * 区块 5 · B/A 分客群 CTA + 留资
 * ============================================================ */
.lead-section {
  background: var(--surface);
}
.lead-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
}
.lead-guides {
  margin-top: 24px;
  display: grid;
  gap: 12px;
}
.guide {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.guide-tag {
  flex: none;
  font-size: 12px;
  font-weight: 700;
  border-radius: var(--radius-pill);
  padding: 3px 10px;
  margin-top: 1px;
}
.guide-b .guide-tag {
  color: var(--color-primary);
  background: var(--color-primary-weak);
}
.guide-a .guide-tag {
  color: var(--color-result);
  background: var(--color-result-weak);
}
.guide p {
  font-size: 14.5px;
  color: var(--fg-2);
  line-height: 1.55;
}

.lead-form-wrap {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 24px;
}
.lead-form .field {
  margin-bottom: 16px;
  border: none;
  padding: 0;
  margin-inline: 0;
  min-inline-size: 0;
}
.lead-form label,
.lead-form legend {
  display: block;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--fg);
  margin-bottom: 7px;
}
.req {
  color: var(--color-primary);
}
.lead-form input[type="text"],
.lead-form input[type="email"],
.lead-form input[type="tel"],
.lead-form textarea {
  width: 100%;
  font-family: var(--font-body);
  font-size: 15px;
  color: var(--fg);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 11px 13px;
  transition: border-color var(--motion-fast) var(--ease-standard),
    box-shadow var(--motion-fast) var(--ease-standard);
}
.lead-form input[type="text"]::placeholder,
.lead-form input[type="email"]::placeholder,
.lead-form input[type="tel"]::placeholder,
.lead-form textarea::placeholder {
  color: var(--muted);
}
.lead-form input[type="text"]:focus,
.lead-form input[type="email"]:focus,
.lead-form input[type="tel"]:focus,
.lead-form textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-primary-weak);
}
.lead-form textarea {
  resize: vertical;
  min-height: 76px;
}
.lead-form .field-row {
  display: flex;
  gap: 12px;
}
.lead-form .field-row .field {
  flex: 1 1 0;
  min-width: 0;
}
.lead-form .field-hint {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: -6px 0 16px;
  font-size: 12.5px;
  color: var(--muted);
}
.lead-form .field-hint .lucide-icon {
  width: 14px;
  height: 14px;
  flex: none;
  color: var(--color-primary);
}
.radio-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.radio-pill {
  flex: 1 1 0;
  min-width: 140px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  color: var(--fg-2);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 11px 13px;
  cursor: pointer;
  transition: border-color var(--motion-fast) var(--ease-standard),
    background-color var(--motion-fast) var(--ease-standard);
}
.radio-pill input {
  accent-color: var(--color-primary);
}
.radio-pill:has(input:checked) {
  border-color: var(--color-primary);
  background: var(--color-primary-weak);
  color: var(--fg);
}
.lead-form .contact-field .radio-row {
  margin-bottom: 10px;
}
.consent {
  display: grid;
  gap: 10px;
  margin: 18px 0;
}
.check {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 13px;
  color: var(--fg-2);
  line-height: 1.5;
  cursor: pointer;
}
.check input {
  margin-top: 3px;
  accent-color: var(--color-primary);
  flex: none;
}
.form-error {
  margin: 10px 0 0;
  font-size: 13px;
  color: #b42318;
  background: #fef3f2;
  border: 1px solid #fecdca;
  border-radius: var(--radius-sm);
  padding: 9px 12px;
}
.form-promise {
  margin-top: 12px;
  font-size: 12.5px;
  color: var(--muted);
  display: flex;
  gap: 7px;
  align-items: center;
}
.form-promise .lucide-icon {
  color: var(--color-result);
}
.lead-success {
  text-align: center;
  padding: 16px 8px;
}
.lead-success .lucide-icon {
  color: var(--color-result);
}
.lead-success h3 {
  font-size: 20px;
  margin-top: 8px;
}
.lead-success p {
  color: var(--fg-2);
  margin-top: 8px;
  font-size: 14.5px;
}

/* ============================================================
 * 区块 6 · 信任背书入口
 * ============================================================ */
.trust-entry .container {
  max-width: var(--maxw);
}
.te-head {
  max-width: 64ch;
  margin-bottom: 32px;
}
.te-intro {
  color: var(--fg-2);
  margin-top: 12px;
}
.te-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.te-honesty {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 20px;
  padding: 14px 16px;
  background: var(--color-primary-weak);
  border: 1px solid var(--border);
  border-left: 3px solid var(--color-primary);
  border-radius: var(--radius-md);
}
.te-honesty .lucide-icon {
  color: var(--color-primary);
  flex-shrink: 0;
  margin-top: 1px;
}
.te-honesty p {
  font-size: 13px;
  line-height: 1.6;
  color: var(--fg-2);
}
.te-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 18px;
  transition: border-color var(--motion-fast) var(--ease-standard),
    box-shadow var(--motion-fast) var(--ease-standard);
}
.te-card:hover {
  border-color: var(--color-primary);
  box-shadow: var(--shadow-sm);
}
.te-tag {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  color: var(--color-primary);
  background: var(--color-primary-weak);
  border-radius: var(--radius-pill);
  padding: 2px 8px;
}
.te-card .lucide-icon {
  color: var(--color-primary);
  margin-top: 12px;
}
.te-card h3 {
  font-size: 15px;
  margin-top: 8px;
}
.te-card p {
  font-size: 13px;
  color: var(--fg-2);
  margin-top: 6px;
  line-height: 1.55;
}
.te-status {
  display: inline-block;
  margin-top: 10px;
  font-size: 11.5px;
  color: var(--color-result);
  border: 1px solid var(--color-result);
  border-radius: var(--radius-pill);
  padding: 2px 9px;
}
.te-cta {
  margin-top: 28px;
}

/* ============================================================
 * 区块 7 · Battle Card（深色锚点）
 * ============================================================ */
.battle {
  background: var(--dark-2);
  color: var(--dark-fg);
  border-top: 1px solid var(--dark-border);
  border-bottom: 1px solid var(--dark-border);
}
.battle .eyebrow {
  color: #9db4f0;
}
.battle .eyebrow .dot {
  background: #7c9bee;
}
.battle .section-title {
  color: var(--dark-fg);
}
.battle-note {
  color: var(--dark-muted);
  font-size: 13px;
  margin-top: 12px;
}
.battle-table-wrap {
  margin-top: 32px;
  overflow-x: auto;
  border: 1px solid var(--dark-border);
  border-radius: var(--radius-md);
}
.battle-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 720px;
  font-size: 14px;
}
.battle-table th,
.battle-table td {
  text-align: left;
  padding: 14px 16px;
  border-bottom: 1px solid var(--dark-border);
  vertical-align: top;
  color: var(--dark-fg);
  line-height: 1.55;
}
.battle-table thead th {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-muted);
  letter-spacing: 0.02em;
}
.battle-table tbody tr:last-child td {
  border-bottom: none;
}
.battle-table .col-dim {
  font-weight: 600;
  color: var(--dark-fg);
  width: 110px;
}
.battle-table .col-we,
.battle-table thead .col-we {
  background: var(--color-primary);
  color: #ffffff;
  font-weight: 600;
}

/* ============================================================
 * 区块 8 · FAQ
 * ============================================================ */
.faq-head {
  margin-bottom: 32px;
  max-width: 60ch;
}
.faq-list {
  display: grid;
  gap: 10px;
  max-width: 840px;
}
.faq-item {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.faq-item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  font-size: 16px;
  font-weight: 600;
  color: var(--fg);
  cursor: pointer;
  list-style: none;
}
.faq-item summary::-webkit-details-marker {
  display: none;
}
.faq-item summary .lucide-icon {
  color: var(--muted);
  transition: transform var(--motion-fast) var(--ease-standard);
  flex: none;
}
.faq-item[open] summary .lucide-icon {
  transform: rotate(180deg);
}
.faq-item .faq-a {
  padding: 0 20px 18px;
  color: var(--fg-2);
  font-size: 14.5px;
  line-height: 1.7;
}

/* ============================================================
 * 区块 9 · 页脚 CTA
 * ============================================================ */
.footer-cta {
  background: var(--bg);
  text-align: center;
}
.footer-cta .inner {
  max-width: 640px;
  margin: 0 auto;
}
.footer-cta .section-title {
  font-size: clamp(26px, 4vw, 38px);
}
.footer-cta .sub {
  color: var(--fg-2);
  margin-top: 14px;
}
.footer-cta .btn {
  margin-top: 26px;
}
.footer-cta .promise {
  margin-top: 16px;
  font-size: 13px;
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.footer-cta .promise .lucide-icon {
  color: var(--color-result);
}
.site-foot {
  border-top: 1px solid var(--border);
  background: var(--surface);
  padding: 28px 0;
}
.site-foot .container {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  align-items: center;
  justify-content: space-between;
}
.site-foot .copy {
  font-size: 13px;
  color: var(--fg-2);
}
.site-foot .comp {
  font-size: 12.5px;
  color: var(--muted);
}
.site-foot .comp a,
.site-foot a {
  color: inherit;
  text-decoration: none;
}
.site-foot .comp a:hover {
  text-decoration: underline;
}
.site-foot .beian-group {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.site-foot .beian-divider {
  opacity: 0.6;
}
.site-foot .beian-icon {
  width: 16px;
  height: 18px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 4px;
}

/* ============================================================
 * 响应式
 * ============================================================ */
@media (max-width: 1024px) {
  .trust-grid,
  .te-grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .pkg-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 768px) {
  .container {
    padding: 0 16px;
  }
  .section {
    padding: 48px 0;
  }
  .header-inner {
    height: 52px;
  }
  .brand {
    font-size: 16px;
    gap: 8px;
  }
  .brand-logo {
    width: 28px;
    height: 28px;
  }
  .brand-sub {
    display: inline;
    font-size: 11px;
    margin-left: 6px;
  }
  .hero {
    padding: 48px 0 36px;
  }
  .hero-title {
    font-size: clamp(26px, 7vw, 38px);
  }
  .hero-sub p {
    padding-left: 12px;
  }
  .s0-grid,
  .lead-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .trust-grid,
  .te-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .trust-item {
    font-size: 13px;
  }
  .pkg-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .lead-form-wrap {
    padding: 18px;
  }
  .lead-form .field-row {
    flex-direction: column;
    gap: 0;
  }
  .radio-pill {
    flex: 1 1 100%;
    min-width: auto;
  }
  .hero-cta .btn,
  .s0-cta-row .btn,
  .pkg-card .btn {
    width: 100%;
  }
}
@media (max-width: 480px) {
  .hero-title {
    font-size: 26px;
  }
  .section-title {
    font-size: 24px;
  }
  .hero-cta,
  .s0-cta-row {
    flex-direction: column;
  }
  .hero-cta .btn,
  .s0-cta-row .btn,
  .pkg-card .btn,
  .footer-cta .btn {
    width: 100%;
  }
  .lead-form-wrap {
    padding: 16px;
  }
  .site-foot .container {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
}

/* ============================================================
 * 无障碍：减少动效
 * ============================================================ */
@media (prefers-reduced-motion: reduce) {
  * {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}

/* ============================================================
 * M3 / M4 共享：语义状态色 + 三色卡（勿用紫粉）
 * ============================================================ */
:root {
  --status-green: #1f9d55;
  --status-green-bg: #e6f4ec;
  --status-yellow: #b7791f;
  --status-yellow-bg: #fdf3e2;
  --status-red: #c0392b;
  --status-red-bg: #fbeae8;
  --status-unknown: #6b7280;
  --status-unknown-bg: #f1f3f5;
}

/* —— M3 / M4 通用页头（复用 .site-header） —— */
.sub-back {
  font-size: 13px;
  font-weight: 500;
  color: var(--fg-2);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.sub-back:hover {
  color: var(--color-primary);
}

/* ============================================================
 * M3 诊断问卷页
 * ============================================================ */
.m3-intro {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 22px 24px;
  margin-bottom: 8px;
}
.m3-intro h1 {
  font-size: clamp(24px, 3.4vw, 32px);
  font-weight: 600;
}
.m3-intro p {
  color: var(--fg-2);
  margin-top: 10px;
  font-size: 14.5px;
}
.m3-meta {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 14px;
  font-size: 13px;
  color: var(--muted);
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  padding: 6px 12px;
}
.m3-meta .lucide-icon {
  color: var(--color-result);
}
.m3-missing {
  text-align: center;
  padding: 56px 20px;
  color: var(--fg-2);
}
.m3-missing .lucide-icon {
  color: var(--color-primary);
}
.m3-missing h2 {
  font-size: 20px;
  margin-top: 10px;
}

.survey-group {
  margin-top: 40px;
}
.survey-group > h2 {
  font-size: 19px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
}
.survey-group > h2 .grp-idx {
  font-family: var(--font-mono);
  font-size: 13px;
  color: #fff;
  background: var(--color-primary);
  border-radius: var(--radius-sm);
  padding: 3px 9px;
}
.survey-group > .grp-sub {
  color: var(--muted);
  font-size: 13px;
  margin-top: 6px;
}

.q-block {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 18px 20px;
  margin-top: 14px;
}
.q-block.sa {
  border-left: 3px solid var(--color-primary);
}
.q-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}
.q-id {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  color: var(--color-primary);
}
.q-title {
  font-weight: 600;
  font-size: 15px;
  color: var(--fg);
}
.q-title .req {
  color: var(--color-primary);
}
.q-hint {
  font-size: 12.5px;
  color: var(--muted);
  margin-top: 6px;
}

.opt-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}
.opt-pill {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--fg-2);
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 10px 13px;
  cursor: pointer;
  transition: border-color var(--motion-fast) var(--ease-standard),
    background-color var(--motion-fast) var(--ease-standard);
}
.opt-pill input {
  accent-color: var(--color-primary);
  flex: none;
}
.opt-pill:has(input:checked) {
  border-color: var(--color-primary);
  background: var(--color-primary-weak);
  color: var(--fg);
}
.scale-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}
.scale-pill {
  flex: 1 1 120px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 14px;
  color: var(--fg-2);
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 10px 13px;
  cursor: pointer;
  transition: border-color var(--motion-fast) var(--ease-standard),
    background-color var(--motion-fast) var(--ease-standard);
}
.scale-pill b {
  font-family: var(--font-mono);
  font-size: 16px;
  color: var(--fg);
}
.scale-pill small {
  font-size: 12px;
  color: var(--muted);
}
.scale-pill:has(input:checked) {
  border-color: var(--color-primary);
  background: var(--color-primary-weak);
}
.scale-pill:has(input:checked) b {
  color: var(--color-primary);
}
.q-input,
.q-textarea {
  width: 100%;
  font-family: var(--font-body);
  font-size: 15px;
  color: var(--fg);
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 11px 13px;
  margin-top: 12px;
  transition: border-color var(--motion-fast) var(--ease-standard),
    box-shadow var(--motion-fast) var(--ease-standard);
}
.q-textarea {
  resize: vertical;
  min-height: 76px;
}
.q-input:focus,
.q-textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-primary-weak);
  background: var(--surface);
}
.m3-actions {
  margin-top: 32px;
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.m3-error {
  margin-left: auto;
  font-size: 13px;
  color: #b42318;
  background: #fef3f2;
  border: 1px solid #fecdca;
  border-radius: var(--radius-sm);
  padding: 9px 12px;
}
.m3-success {
  text-align: center;
  padding: 56px 20px;
}
.m3-success .lucide-icon {
  color: var(--color-result);
}
.m3-success h2 {
  font-size: 22px;
  margin-top: 10px;
}
.m3-success p {
  color: var(--fg-2);
  margin-top: 10px;
  font-size: 15px;
}

/* ============================================================
 * M4 报告查看页
 * ============================================================ */
.report {
  max-width: 920px;
}
.report-hero {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 28px;
}
.report-hero .rh-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.rh-maturity {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  flex: none;
}
.rh-maturity .m-code {
  font-family: var(--font-display);
  font-size: 26px;
  font-weight: 700;
  line-height: 1;
  color: var(--color-primary);
}
.rh-maturity .m-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--fg-2);
}
.report-hero .rh-title {
  font-size: clamp(20px, 3vw, 26px);
  font-weight: 600;
  margin-top: 12px;
}
.report-hero .rh-sub {
  color: var(--fg-2);
  font-size: 13.5px;
  margin-top: 6px;
}
.seg-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-primary);
  background: var(--color-primary-weak);
  border-radius: var(--radius-pill);
  padding: 5px 12px;
  margin-top: 12px;
}
.seg-badge .lucide-icon {
  width: 15px;
  height: 15px;
}
/* ① 诊断可信度徽章（水位：自评草案/初步诊断/较完整诊断） */
.conf-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 600;
  border-radius: var(--radius-pill);
  padding: 5px 12px;
  margin-top: 12px;
  margin-left: 8px;
}
.conf-badge .lucide-icon { width: 15px; height: 15px; }
.conf-badge.c-draft { color: #8a6d1f; background: #fdf3dc; border: 1px solid #f0d99a; }
.conf-badge.c-prelim { color: #1f6f8b; background: #e3f3f8; border: 1px solid #a9dceb; }
.conf-badge.c-solid { color: #1f7a44; background: #e4f6ec; border: 1px solid #a8dcc0; }
/* ① 基准溯源 / 校准状态 chip（每张卡） */
.ind-source {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  background: var(--surface-2, #f2f3f5);
  border-radius: var(--radius-pill);
  padding: 2px 8px;
}
.ind-calib {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  color: #8a6d1f;
  background: #fdf3dc;
  border: 1px solid #f0d99a;
  border-radius: var(--radius-pill);
  padding: 2px 8px;
}
/* ④ 报告免责 footer */
.report-disclaimer {
  margin-top: 40px;
  padding-top: 16px;
  border-top: 1px solid var(--border, #e6e8eb);
  font-size: 12px;
  line-height: 1.6;
  color: var(--muted);
}

.report-section {
  margin-top: 40px;
}
.report-section > h2 {
  font-size: 20px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
}
.report-section > h2 .sec-idx {
  font-family: var(--font-mono);
  font-size: 12px;
  color: #fff;
  background: var(--color-primary);
  border-radius: var(--radius-sm);
  padding: 3px 9px;
}
.report-section > .sec-sub {
  color: var(--muted);
  font-size: 13px;
  margin-top: 6px;
}

/* ===== AI 现状洞察价值流地图（OpenGroup EA 价值流方法论 G178e） ===== */
.vs-section .vs-map {
  display: flex;
  align-items: stretch;
  margin-top: 18px;
  overflow-x: auto;
  padding-bottom: 6px;
}
.vs-stage {
  flex: 1 1 0;
  min-width: 118px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 12px 12px 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.vs-num {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  background: var(--color-primary);
  border-radius: var(--radius-sm);
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vs-name {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--fg);
}
.vs-crit {
  font-size: 11.5px;
  color: var(--muted);
  line-height: 1.4;
}
.vs-in,
.vs-out {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  border-radius: 4px;
  padding: 1px 5px;
  margin-right: 4px;
}
.vs-in {
  background: rgba(31, 72, 224, 0.1);
  color: var(--color-primary);
}
.vs-out {
  background: rgba(31, 157, 85, 0.12);
  color: #1f9d55;
}
.vs-arrow {
  flex: 0 0 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  font-size: 18px;
  font-weight: 700;
}
.vs-cap {
  flex: 0 0 118px;
  min-width: 118px;
  border: 1px dashed var(--color-primary);
  border-radius: var(--radius-md);
  padding: 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  background: rgba(31, 72, 224, 0.04);
}
.vs-cap-name {
  font-size: 13px;
  font-weight: 700;
  color: var(--color-primary);
}
.vs-cap-sub {
  font-size: 10.5px;
  color: var(--muted);
  margin-top: 2px;
  letter-spacing: 0.02em;
}
.vs-foot {
  font-size: 12px;
  color: var(--muted);
  margin-top: 12px;
  line-height: 1.5;
}

.ind-cat {
  margin-top: 22px;
}
.ind-cat > h3 {
  font-size: 14px;
  font-weight: 600;
  color: var(--fg-2);
  letter-spacing: 0.02em;
}
.ind-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-top: 12px;
}
.ind-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 14px 16px;
}
.ind-card.green {
  border-left: 3px solid var(--status-green);
}
.ind-card.yellow {
  border-left: 3px solid var(--status-yellow);
}
.ind-card.red {
  border-left: 3px solid var(--status-red);
}
.ind-card.unknown {
  border-left: 3px solid var(--status-unknown);
}
.ind-card.pending {
  border-left: 3px solid var(--border);
  background: #f6f7f9;
}
.ind-tag {
  font-size: 11px;
  font-weight: 600;
  border-radius: var(--radius-pill);
  padding: 2px 9px;
  white-space: nowrap;
}
.ind-tag.pending {
  color: var(--muted);
  background: #eaecef;
}
/* 本期范围层级徽章（核心 / 中优先 / 本期后置） */
.ind-scope {
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1.5;
  border-radius: var(--radius-pill);
  padding: 1px 7px;
  white-space: nowrap;
}
.ind-scope.core { color: #1F48E0; background: #e7edff; }
.ind-scope.mid { color: #9a7400; background: #fff3d6; }
.ind-scope.postpone { color: #6b7280; background: #eef0f2; }
/* 本期后置项降权：置灰弱化，不与核心项争注意力 */
.ind-card.postpone { opacity: 0.7; filter: saturate(0.85); }
.ind-card.postpone .ind-name { color: #6b7280; }
.ind-val-pending {
  color: var(--muted);
  font-style: italic;
}
.ind-top {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.ind-name {
  font-weight: 600;
  font-size: 14.5px;
  margin-right: auto;
}
.ind-dot {
  width: 10px;
  height: 10px;
  border-radius: var(--radius-pill);
  flex: none;
}
.ind-dot.green {
  background: var(--status-green);
}
.ind-dot.yellow {
  background: var(--status-yellow);
}
.ind-dot.red {
  background: var(--status-red);
}

/* M4 §3 成熟度定级：等级徽章右侧靠右，与描述同行业 */
.mat-card .mat-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
}
.mat-card .mat-desc {
  flex: 1 1 auto;
  min-width: 0;
}
.mat-card .mat-level {
  flex: none;
  text-align: right;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
  padding-left: 18px;
  border-left: 1px solid var(--border);
  min-width: 104px;
}
.mat-card .mat-level .m-code {
  font-family: var(--font-display);
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
  color: var(--color-primary);
}
.mat-card .mat-level .m-name {
  font-size: 13px;
  color: var(--fg-2);
}
@media (max-width: 560px) {
  .mat-card .mat-row {
    flex-direction: column-reverse;
    align-items: flex-start;
  }
  .mat-card .mat-level {
    flex-direction: row;
    align-items: baseline;
    gap: 8px;
    padding-left: 0;
    border-left: none;
    border-bottom: 1px solid var(--border);
    padding-bottom: 10px;
    width: 100%;
  }
}
.ind-dot.unknown {
  background: var(--status-unknown);
}
.ind-val {
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--fg);
  margin-top: 8px;
}
.ind-bench {
  font-size: 12px;
  color: var(--muted);
  margin-top: 4px;
  line-height: 1.5;
}
.ind-diag {
  display: inline-block;
  font-size: 11.5px;
  font-weight: 600;
  border-radius: var(--radius-pill);
  padding: 2px 9px;
  margin-top: 8px;
}
.ind-diag.green {
  color: var(--status-green);
  background: var(--status-green-bg);
}
.ind-diag.yellow {
  color: var(--status-yellow);
  background: var(--status-yellow-bg);
}
.ind-diag.red {
  color: var(--status-red);
  background: var(--status-red-bg);
}
.ind-diag.unknown {
  color: var(--status-unknown);
  background: var(--status-unknown-bg);
}

.ind-reason {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 4px;
  line-height: 1.45;
}

.dp-tt { display: flex; flex-direction: column; gap: 8px; }
.dp-tt-row { display: flex; gap: 10px; font-size: 13px; line-height: 1.55; }
.dp-tt-row b { flex: 0 0 96px; color: var(--color-primary, #2b6cff); font-weight: 600; }
.dp-tt-row span { flex: 1; }

.gap-list {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}
.gap-item {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 16px 18px;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.gap-band {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: var(--radius-sm);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  flex: none;
}
.gap-body {
  flex: 1;
}
.gap-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.gap-tag {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: var(--color-primary);
  border-radius: var(--radius-sm);
  padding: 2px 8px;
}
.gap-name {
  font-weight: 600;
  font-size: 15.5px;
}
.gap-impact {
  font-size: 12px;
  color: var(--muted);
  margin-left: auto;
}
.gap-dir {
  font-size: 14px;
  color: var(--fg-2);
  margin-top: 8px;
  line-height: 1.6;
}
.gap-signals {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.gap-signal {
  font-size: 11.5px;
  color: var(--fg-2);
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  padding: 2px 9px;
}

.roadmap {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}
.phase {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 16px 18px;
  border-top: 3px solid var(--color-primary);
}
.phase .p-label {
  font-weight: 600;
  font-size: 14.5px;
}
.phase .p-action {
  font-size: 14px;
  color: var(--fg-2);
  margin-top: 8px;
  line-height: 1.6;
}

/* —— M4 §5 场景优先级 Top3（S0 场景层，2026-09-03）—— */
.sc-track-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; align-items: center; }
.sc-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; color: var(--fg-2);
  background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius-pill); padding: 3px 11px;
}
.sc-chip b { color: var(--fg); font-family: var(--font-mono); font-weight: 700; }
.sc-chip .lucide-icon { color: var(--color-primary); }
.sc-top-list { display: grid; gap: 14px; margin-top: 16px; }
.sc-top-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  border-top: 3px solid var(--color-primary);
  padding: 18px 20px; display: flex; gap: 16px;
}
.sc-rank {
  flex: none; width: 42px; height: 42px;
  border-radius: var(--radius-sm);
  background: var(--color-primary-weak);
  color: var(--color-primary);
  font-family: var(--font-mono); font-weight: 700; font-size: 15px;
  display: flex; align-items: center; justify-content: center;
}
.sc-body { flex: 1; min-width: 0; }
.sc-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.sc-id { font-family: var(--font-mono); font-size: 12px; font-weight: 700; color: var(--muted); }
.sc-name { font-weight: 600; font-size: 16px; }
.sc-tag {
  font-size: 11.5px; color: var(--color-primary);
  background: var(--color-primary-weak);
  border-radius: var(--radius-pill); padding: 2px 10px; font-weight: 600;
}
.sc-tier {
  font-size: 11.5px; color: var(--fg-2);
  background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius-pill); padding: 2px 10px;
}
.sc-score {
  margin-left: auto; font-size: 11.5px; color: var(--muted);
  display: flex; align-items: center; gap: 8px; white-space: nowrap;
}
.sc-score b { font-family: var(--font-mono); color: var(--fg); }
.sc-bar { width: 72px; height: 6px; border-radius: 999px; background: var(--bg); overflow: hidden; display: inline-block; }
.sc-bar i { display: block; height: 100%; border-radius: 999px; background: var(--color-primary); }
.sc-reasons { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 6px; }
.sc-reasons li { display: flex; gap: 8px; font-size: 13.5px; color: var(--fg-2); line-height: 1.55; }
.sc-reasons li .lucide-icon { color: var(--color-primary); flex: none; margin-top: 2px; }
.sc-attrib {
  margin-top: 14px; background: var(--bg);
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 12px 14px; display: grid; gap: 6px;
}
.sc-attrib-t {
  font-size: 12px; font-weight: 600; color: var(--muted);
  display: flex; align-items: center; gap: 6px;
}
.sc-attrib-row { display: flex; gap: 10px; font-size: 13px; line-height: 1.55; }
.sc-attrib-row .lucide-icon { color: var(--color-primary); flex: none; margin-top: 3px; }
.sc-attrib-row b { flex: 0 0 72px; color: var(--fg); font-weight: 600; }
.sc-attrib-row span { flex: 1; color: var(--fg-2); }
.sc-watch {
  margin-top: 18px; background: var(--surface);
  border: 1px dashed var(--border);
  border-radius: var(--radius-md); padding: 14px 18px;
}
.sc-watch h4 {
  margin: 0 0 8px; font-size: 13.5px; font-weight: 600; color: var(--fg-2);
  font-family: var(--font-body); display: flex; gap: 8px; align-items: center;
}
.sc-watch ul { margin: 0; padding-left: 18px; display: grid; gap: 4px; }
.sc-watch li { font-size: 13px; color: var(--fg-2); }
.sc-redline {
  margin-top: 18px; background: var(--color-primary-weak);
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-md); padding: 14px 18px;
  font-size: 13px; color: var(--fg-2); line-height: 1.7;
  display: flex; gap: 8px;
}
.sc-redline .lucide-icon { color: var(--color-primary); flex: none; margin-top: 2px; }
.sc-note { margin-top: 14px; font-size: 12px; color: var(--muted); }

/* —— M4 §5 基线回填（2026-09-04，客户回流校准）—— */
.bf-box {
  margin-top: 18px; background: var(--surface);
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-md); padding: 16px 18px;
}
.bf-head { display: flex; gap: 10px; align-items: flex-start; }
.bf-head > .lucide-icon { color: var(--color-primary); flex: none; margin-top: 2px; }
.bf-head b { font-size: 14.5px; color: var(--fg); font-weight: 600; }
.bf-head p { margin: 4px 0 0; font-size: 12.5px; color: var(--muted); line-height: 1.6; }
.bf-row { margin-top: 12px; display: grid; gap: 6px; }
.bf-row label { font-size: 13px; color: var(--fg-2); display: flex; flex-wrap: wrap; gap: 4px; align-items: baseline; }
.bf-row label b { color: var(--fg); font-weight: 600; }
.bf-row input {
  width: 100%; box-sizing: border-box; font-size: 14px; color: var(--fg);
  background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius-sm); padding: 8px 12px; outline: none;
}
.bf-row input:focus { border-color: var(--color-primary); }
.oc-inline { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.oc-inline select {
  font-size: 13px; color: var(--fg-2); background: var(--bg);
  border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 8px 10px; outline: none;
}
.bf-check { display: flex; gap: 8px; align-items: center; font-size: 13px; color: var(--fg-2); cursor: pointer; }
.bf-check input { width: auto; }
.bf-actions { margin-top: 14px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.bf-msg { font-size: 12.5px; color: var(--color-primary); }
.bf-msg.err { color: var(--color-primary); }
.bf-note { margin-top: 10px; font-size: 11.5px; color: var(--muted); }
.bf-done {
  display: flex; gap: 8px; align-items: center; font-size: 14px; color: var(--fg-2);
  background: var(--color-result-weak); border: 1px solid var(--color-result);
  border-radius: var(--radius-sm); padding: 12px 14px;
}
.bf-done .lucide-icon { color: var(--color-result); flex: none; }

.cta-box {
  background: var(--color-primary-weak);
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-lg);
  padding: 22px 24px;
  margin-top: 16px;
}
.cta-box p {
  color: var(--fg);
  font-size: 14.5px;
  line-height: 1.7;
}
.pkg-ref-label {
  margin-top: 16px;
  font-size: 12.5px;
  color: var(--muted);
}
.pkg-ref {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-top: 10px;
}
.pkg-ref .pr {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 12px 14px;
}
.pkg-ref .pr b {
  font-size: 14px;
}
.pkg-ref .pr span {
  display: block;
  font-size: 12.5px;
  color: var(--fg-2);
  margin-top: 4px;
}

.compliance-box {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 20px 22px;
  margin-top: 16px;
}
.compliance-box h3 {
  font-size: 15px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.compliance-box h3 .lucide-icon {
  color: var(--color-primary);
}
.compliance-box dl {
  margin: 14px 0 0;
  display: grid;
  gap: 12px;
}
.compliance-box dt {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--fg-2);
}
.compliance-box dd {
  margin: 4px 0 0;
  font-size: 13.5px;
  color: var(--fg);
  line-height: 1.6;
}
.report-error {
  text-align: center;
  padding: 64px 20px;
  color: var(--fg-2);
}
.report-error .lucide-icon {
  color: var(--color-red);
}
.report-error h2 {
  font-size: 20px;
  margin-top: 12px;
}

/* === 工作台：联系方式不可解密(历史密钥不匹配) 区分提示 === */
.tc-unrec { color: var(--muted); font-style: italic; font-size: 12px; }

/* === M4 §6 90天跟踪清单（T8） === */
.track-checklist {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}
.tc-item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 12px 14px;
}
.tc-ico {
  color: var(--color-primary);
  flex: none;
  margin-top: 1px;
}
.tc-body {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.tc-phase {
  font-family: var(--font-mono);
  font-size: 11.5px;
  font-weight: 700;
  color: var(--color-primary);
}
.tc-title {
  font-size: 14px;
  color: var(--fg);
  line-height: 1.55;
}
.tc-focus {
  font-size: 11.5px;
  color: var(--muted);
}

/* §6 90 天清单：按阶段分模块（同时间范围归同一模块） */
.tc-group {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.tc-group + .tc-group {
  margin-top: 12px;
}
.tc-group-h {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  background: var(--color-primary-weak);
  font-weight: 700;
  font-size: 14px;
  color: var(--fg);
}
.tc-group-h .tc-dot {
  width: 8px;
  height: 8px;
  border-radius: var(--radius-pill);
  background: var(--color-primary);
  flex: none;
}
.tc-focus-tag {
  margin-left: auto;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--color-primary);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  padding: 2px 10px;
}
.tc-group .tc-item {
  border: none;
  border-top: 1px solid var(--border);
  border-radius: 0;
}
.tc-group .tc-item:first-of-type {
  border-top: none;
}

/* === M4 §9 服务方向与回报参考（T5 去价格版） === */
.roi-box {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}
.roi-item {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 14px 16px;
  border-left: 3px solid var(--color-primary);
}
.roi-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.roi-pack {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: var(--color-primary);
  border-radius: var(--radius-sm);
  padding: 2px 8px;
}
.roi-name {
  font-weight: 600;
  font-size: 15px;
}
.roi-outcome,
.roi-payback {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13.5px;
  color: var(--fg-2);
  margin-top: 8px;
  line-height: 1.5;
}
.roi-outcome .lucide-icon,
.roi-payback .lucide-icon {
  color: var(--color-primary);
  flex: none;
}
.roi-note {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 6px;
}

/* === M4 指标卡置信度徽章（T3） === */
.ind-confidence {
  font-size: 10.5px;
  font-weight: 600;
  border-radius: var(--radius-pill);
  padding: 1px 7px;
  white-space: nowrap;
}
.ind-confidence.c-measured { color: #1F7A3D; background: #e3f6ea; }
.ind-confidence.c-self { color: #9a7400; background: #fff3d6; }
.ind-confidence.c-pending { color: #6b7280; background: #eef0f2; }
.ind-calibration {
  font-size: 11px;
  color: var(--muted);
  margin-top: 4px;
  line-height: 1.45;
}

/* ---- 三色卡溯源（2026-09-12 加固）：数值来源 + 判色依据 + 基准版本 ---- */
.ind-confidence.c-self-weak { color: #9a5b00; background: #ffe9cf; }
.ind-provenance {
  display: flex; align-items: flex-start; gap: 5px;
  font-size: 11px; color: var(--fg-2);
  margin-top: 5px; line-height: 1.45;
}
.ind-provenance .lucide-icon { width: 13px; height: 13px; flex: none; margin-top: 2px; color: var(--muted); }
.ind-foot {
  display: flex; align-items: center; gap: 8px;
  margin-top: 8px; flex-wrap: wrap;
}
.ind-ver {
  font-size: 10.5px; color: var(--muted);
  font-family: var(--font-mono);
  border: 1px dashed var(--border);
  border-radius: var(--radius-pill);
  padding: 1px 7px;
}
/* ---- 缺口证据类型标签 ---- */
.gap-signal-kind {
  font-style: normal;
  font-size: 10px;
  opacity: 0.72;
  margin-left: 5px;
}
.gap-signal[data-kind="indicator_red"] { border-color: rgba(192, 57, 43, 0.35); }
.gap-signal[data-kind="short_board"] { border-color: rgba(192, 57, 43, 0.22); }
/* ---- 场景排序审计：单项可信度 + 权重说明 ---- */
.sc-conf {
  font-size: 11px; color: var(--fg-2);
  background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius-pill); padding: 2px 9px;
  cursor: help;
}
.sc-note.sc-weights {
  display: flex; align-items: flex-start; gap: 6px;
  line-height: 1.65;
}
.sc-note.sc-weights .lucide-icon { width: 14px; height: 14px; flex: none; margin-top: 3px; color: var(--muted); }
.sc-note.sc-ver { font-family: var(--font-mono); font-size: 11px; }

@media (max-width: 768px) {
  .ind-grid,
  .pkg-ref {
    grid-template-columns: 1fr;
  }
  .report-hero .rh-top {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}

/* —— 服务详情（S1–S4 物料）—— */
.svc-detail {
  border-top: 1px solid var(--border);
}
.svc-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
}
.svc-icon {
  flex: none;
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: var(--radius-md);
  background: var(--color-primary-weak);
  color: var(--color-primary);
}
.svc-pos {
  color: var(--fg-2);
  font-size: 15px;
  line-height: 1.78;
  max-width: 82ch;
  margin: 0 0 18px;
}
.svc-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  margin-top: 4px;
}
.svc-col {
  min-width: 0;
}
.svc-label {
  margin: 20px 0 10px;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--fg);
}
.svc-col > .svc-label:first-child {
  margin-top: 0;
}
.svc-label-out {
  color: var(--muted);
}
.svc-list,
.svc-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 9px;
}
.svc-list li,
.svc-steps li {
  position: relative;
  padding-left: 18px;
  color: var(--fg-2);
  font-size: 14px;
  line-height: 1.62;
}
.svc-list li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 9px;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--color-primary);
}
.svc-list-out li::before {
  background: var(--muted);
}
.svc-steps {
  counter-reset: step;
}
.svc-steps li {
  counter-increment: step;
}
.svc-steps li::before {
  content: counter(step);
  position: absolute;
  left: 0;
  top: 1px;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: var(--color-primary-weak);
  color: var(--color-primary);
  font-size: 10px;
  font-weight: 700;
  display: grid;
  place-items: center;
}
.svc-outcome {
  color: var(--fg);
  font-size: 14.5px;
  line-height: 1.7;
  padding: 12px 14px;
  border-left: 3px solid var(--color-primary);
  background: var(--bg);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.svc-detail .btn {
  margin-top: 28px;
}

/* —— M2 提案模板入口 / 模板页 —— */
.prop-entry {
  border-top: 1px solid var(--border);
}
/* 诊断→场景服务 桥梁（现挂诊断页，置于「场景先行」下方） */
.bridge-section {
  border-top: 1px solid var(--border);
}
/* 紧跟 .scene-first 时，避免两道下/上边框叠成粗线 */
.scene-first + .bridge-section {
  border-top: none;
}
.bridge-grid {
  display: grid;
  gap: 10px;
  margin-top: 22px;
}
.bridge-row {
  display: grid;
  grid-template-columns: 1.4fr 24px 1fr 1.7fr;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.bridge-domain {
  font-size: 14px;
  font-weight: 600;
  color: var(--fg);
}
.bridge-arrow {
  display: flex;
  justify-content: center;
  color: var(--muted);
}
.bridge-svc {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--color-primary);
}
.bridge-what {
  font-size: 13px;
  color: var(--muted);
}
.bridge-note {
  margin-top: 14px;
  font-size: 12.5px;
  color: var(--muted);
}
.bridge-cta {
  margin-top: 22px;
}
@media (max-width: 720px) {
  .bridge-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .bridge-arrow {
    display: none;
  }
}
.prop-sec {
  padding: 22px 0;
  border-top: 1px solid var(--border);
}
.prop-sec-title {
  margin: 0 0 12px;
  font-size: 16px;
  font-weight: 600;
  color: var(--fg);
}
.prop-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 9px;
}
.prop-list li {
  position: relative;
  padding-left: 18px;
  color: var(--fg-2);
  font-size: 14px;
  line-height: 1.62;
}
.prop-list li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 9px;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--color-primary);
}
.prop-note {
  margin-top: 26px;
  padding-top: 18px;
  border-top: 1px solid var(--border);
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
  max-width: 90ch;
}

@media (max-width: 768px) {
  .svc-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

/* —— 服务密度三档（对外承诺区块，文案源见 content.js 的 serviceLevels） */
.tier-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: 4px;
}
@media (max-width: 900px) {
  .tier-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}
.tier-range {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  color: var(--muted);
}

/* —— 报告：个性化痛点开场（★ 读懂您）—— */
.pz-section > h2 { color: var(--color-primary); }
.pz-card {
  margin-top: 16px;
  border: 1px solid var(--color-primary-weak, #d8e3ff);
  background: linear-gradient(180deg, var(--color-primary-weak, #eef3ff) 0%, #fff 100%);
  border-radius: var(--radius-md, 12px);
  padding: 18px 20px;
}
.pz-row { display: flex; gap: 14px; padding: 10px 0; border-bottom: 1px dashed var(--border); }
.pz-row:last-child { border-bottom: 0; }
.pz-label {
  flex: none; width: 132px; font-size: 12.5px; font-weight: 600;
  color: var(--muted); padding-top: 2px; letter-spacing: .02em;
}
.pz-val { flex: 1; font-size: 14.5px; color: var(--fg); line-height: 1.7; }
.pz-val.primary { font-size: 16px; font-weight: 600; color: var(--fg); }
.pz-foot { margin: 14px 0 0; font-size: 13px; color: var(--muted); line-height: 1.7; }

/* —— 报告：为什么现在要动（§6）—— */
.whynow-section > h2 { color: var(--color-red, #c0392b); }
.whynow-foot {
  margin-top: 16px; padding: 12px 16px; font-size: 13.5px; line-height: 1.7;
  background: var(--color-red-weak, #fdecec); color: var(--fg);
  border-left: 3px solid var(--color-red, #c0392b); border-radius: 8px;
}

/* —— 报告：§7 CTA 零成本第一步 —— */
.cta-step {
  margin-top: 14px; padding: 14px 16px; font-size: 13.5px; line-height: 1.75;
  background: var(--color-primary-weak, #eef3ff); border-radius: 10px;
  border-left: 3px solid var(--color-primary, #2b6cff);
}
.cta-step b { color: var(--color-primary, #2b6cff); }


/* ============================================================
 * 素极专业 v2 · 局部规范层（2026-09-04 官网改版）
 * 设计依据 overview.md：白/软底两档 + 墨阶文字 + 单主色深空蓝 +
 * 发丝边；页脚以同色系深空蓝收尾（不引入第二种 hue）。
 * 内容结构零改动，仅视觉层覆盖。
 * ============================================================ */
.eyebrow .dot {
  background: var(--color-primary);
}
.hero {
  background: linear-gradient(180deg, #ffffff 0%, #f1f5fd 100%);
  border-bottom: 1px solid var(--border);
  padding-top: 96px;
  padding-bottom: 84px;
}
.hero-note {
  color: var(--muted);
}
.trust-strip {
  background: var(--surface);
}
.pkg-card {
  background: var(--surface);
}
.s0-panel,
.lead-form-wrap,
.battle-card {
  background: var(--surface);
}
.section + .section {
  border-color: var(--border);
}

/* 页脚 CTA：深空蓝带收尾（同色系深蓝，不用第二种 hue） */
.footer-cta {
  background: var(--dark-2);
  padding: 92px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.footer-cta .eyebrow {
  color: #9db4f0;
}
.footer-cta .eyebrow .dot {
  background: #7c9bee;
}
.footer-cta .section-title {
  color: #ffffff;
}
.footer-cta .sub {
  color: #c3cef0;
}
.footer-cta .btn-primary {
  background: #ffffff;
  color: var(--dark-2);
  border-color: #ffffff;
}
.footer-cta .btn-primary:hover {
  background: #eaf0fd;
  color: var(--color-primary);
  border-color: #eaf0fd;
}
.footer-cta .promise {
  color: #aebee6;
}
.footer-cta .promise .lucide-icon {
  color: #7ee0ae;
}

/* 页脚：白底 + 发丝边 */
.site-foot {
  background: #ffffff;
}
.site-foot .comp a {
  color: var(--muted);
}

/* ============================================================
 * 素极专业 v2 · 结构层（首页逐区块，2026-09-04）
 * Hero 双列（左文案 / 右 S0 成果卡）、S0 数字核对条（等宽读数）、
 * 服务卡协议徽章（等宽编号）、信任带图标插槽。
 * ============================================================ */
.hero-inner.v2 {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 56px;
  align-items: center;
  max-width: 1080px;
  text-align: left;
}
.hero-inner.v2 .hero-main {
  min-width: 0;
}
.hero-inner.v2 .hero-title {
  font-size: clamp(28px, 3.9vw, 44px);
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.hero-inner.v2 .hero-title-note {
  text-align: left;
  font-size: clamp(13.5px, 1.5vw, 15px);
  color: var(--muted);
  margin-top: 12px;
}
.hero-inner.v2 .hero-guides {
  margin: 22px 0 0;
  max-width: 640px;
  text-align: left;
}
.hero-inner.v2 .hero-cta {
  justify-content: flex-start;
  margin-top: 30px;
}
.hero-inner.v2 .hero-note {
  margin-top: 18px;
  font-size: 13px;
  line-height: 1.7;
  max-width: 62ch;
}

/* 右侧 S0 成果卡 */
.hero-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-top: 3px solid var(--color-primary);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  padding: 26px 26px 24px;
}
.hc-head {
  display: flex;
  align-items: center;
  gap: 12px;
}
.hc-badge {
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 500;
  color: var(--color-primary);
  background: var(--color-primary-weak);
  border-radius: var(--radius-sm);
  padding: 4px 9px;
  letter-spacing: 0.02em;
}
.hc-head b {
  display: block;
  font-size: 17px;
  font-weight: 600;
  color: var(--fg);
}
.hc-head .hc-sub {
  font-size: 12px;
  color: var(--muted);
}
.hc-list {
  list-style: none;
  margin: 18px 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
.hc-list li {
  display: flex;
  gap: 9px;
  align-items: flex-start;
  font-size: 13.5px;
  color: var(--fg-2);
  line-height: 1.6;
}
.hc-list .lucide-icon {
  color: var(--color-primary);
  flex: none;
  margin-top: 2px;
}
.hero-card .btn {
  margin-top: 18px;
}
.hc-note {
  margin-top: 12px;
  font-size: 12px;
  color: var(--muted);
}

/* 信任带：图标装进 36×36 浅蓝插槽 */
.trust-item .lucide-icon {
  width: 22px;
  height: 22px;
  padding: 7px;
  box-sizing: content-box;
  background: var(--color-primary-weak);
  color: var(--color-primary);
  border-radius: var(--radius-sm);
  flex: none;
  margin-top: 0;
}

/* S0 数字核对条（等宽读数承载可测量感） */
.s0-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding-bottom: 16px;
  margin-bottom: 16px;
  border-bottom: 1px solid var(--border);
}
.s0-metric {
  text-align: left;
}
.s0-metric b {
  display: block;
  font-family: var(--font-mono);
  font-size: 25px;
  font-weight: 500;
  color: var(--color-primary);
  line-height: 1.1;
  letter-spacing: -0.01em;
}
.s0-metric span {
  font-size: 11.5px;
  color: var(--muted);
}

/* 服务卡：协议编号徽章（等宽） */
.pkg-code {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  color: var(--color-primary);
  background: var(--color-primary-weak);
  border-radius: var(--radius-sm);
  padding: 3px 8px;
  letter-spacing: 0.03em;
}
.pkg-top {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.pkg-top .pkg-tag {
  margin-left: auto;
}

@media (max-width: 920px) {
  .hero-inner.v2 {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .s0-metrics {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ============================================================
 * 素极专业 v2 · 页面结构层（services / diagnosis / cases / about）
 * ============================================================ */

/* —— services：对比表「我们」列高亮（已并入 .battle-table 上方块） —— */

/* —— services：FAQ 双栏全展开（第 1 项默认展开保持） —— */
.faq-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 18px;
  align-items: start;
}
.faq-item {
  break-inside: avoid;
}

/* —— diagnosis：口径读数面板（右侧，表面卡 + 等宽读数） —— */
.dx-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 18px 14px 14px;
  margin-bottom: 20px;
}
.dx-metrics .s0-metric {
  text-align: center;
}
.dx-metrics .s0-metric b {
  font-size: 24px;
}

/* —— cases：占位案例编号 C-01…C-04 —— */
.cb-top {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}
.case-code {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  color: var(--color-primary);
  background: var(--color-primary-weak);
  border-radius: var(--radius-sm);
  padding: 2px 8px;
  letter-spacing: 0.02em;
}

/* —— about：我们是谁 / 引文 / 三原则 卡片化 —— */
.about-grid .about-who-bio {
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--color-primary);
  border-radius: var(--radius-md);
  padding: 18px 20px;
  font-size: 14.5px;
  line-height: 1.8;
}
.about-bio {
  color: var(--fg-2);
  border-left: 2px solid var(--border);
  padding-left: 14px;
  margin-top: 18px;
  font-size: 13.5px;
}

@media (max-width: 920px) {
  .faq-list {
    grid-template-columns: 1fr;
  }
  .dx-metrics {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ============================================================
 * 素极专业 v2 · 首页微调（2026-09-04 下午）
 * ============================================================ */
/* Hero 右侧 S0 成果卡整体下移（与左列错位呼吸） */
.hero-inner.v2 .hero-card {
  margin-top: 44px;
}
@media (max-width: 920px) {
  .hero-inner.v2 .hero-card {
    margin-top: 0;
  }
}

/* 留资表单：hook 输入框固定 2 行、禁止右下角拉动 */
.lead-form textarea {
  resize: none;
  min-height: 58px;
  max-height: 58px;
  overflow-y: auto;
  line-height: 1.6;
}

/* 留资表单：角色 / 主营赛道选项等宽一行（联系方式频道保持原尺寸） */
.radio-row-sm {
  gap: 8px;
}
.radio-pill-sm {
  flex: 1 1 0;
  min-width: 96px;
  font-size: 12.5px;
  padding: 6px 12px;
  gap: 6px;
}
.radio-pill-sm input {
  width: 13px;
  height: 13px;
}
@media (max-width: 640px) {
  .radio-row-sm .radio-pill-sm {
    flex: 1 1 44%;
  }
}

/* ============================================================
 * 素极专业 v2 · 设计稿 §12/§13 落地（2026-09-04）
 * 场景先行区 · 双 CTA 模型 · S0–S4 速查条 · 诊断页重排
 * ============================================================ */

/* 诊断页：口径读数独立面板（右列） */
.dx-panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 26px 22px;
  align-self: stretch;
}
.dx-panel .dx-metrics {
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
}

/* 场景先行区（白底段 + 居中 chip 选择器） */
.scene-first {
  background: var(--surface);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.sf-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-start;
  margin-top: 24px;
}
.sf-chip {
  font-size: 13px;
  color: var(--fg-2);
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  padding: 8px 18px;
  white-space: nowrap;
}
.sf-chip.active {
  color: var(--color-primary);
  background: var(--color-primary-weak);
  border-color: var(--color-primary);
  font-weight: 600;
}
.sf-copy {
  margin-top: 18px;
  font-size: 13px;
  color: var(--muted);
  line-height: 1.7;
}

/* 诊断页三步流程改横排三卡 */
.dx-steps-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

/* 全站底部 S0–S4 速查条（软底段 + 居中 chip） */
.sprint-bar {
  background: var(--bg);
  border-top: 1px solid var(--border);
  padding: 56px 0;
}
.sp-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-start;
  margin-top: 22px;
}
.sp-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--color-primary-weak);
  border-radius: var(--radius-pill);
  padding: 9px 18px;
}
.sp-chip b {
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 600;
  color: var(--color-primary);
}
.sp-chip span {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--fg-2);
}

/* 双 CTA 模型：页脚深蓝带 主实心白钮 + 次幽灵描边钮 */
.footer-cta .cta-row {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 28px;
}
.footer-cta .cta-row .btn {
  margin-top: 0;
}
.footer-cta .btn-ghost {
  border-color: rgba(255, 255, 255, 0.45);
  color: #ffffff;
  background: transparent;
}
.footer-cta .btn-ghost:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.7);
}

@media (max-width: 920px) {
  .dx-steps-grid {
    grid-template-columns: 1fr;
  }
  .dx-grid {
    grid-template-columns: 1fr;
  }
}

/* 诊断页读数面板：标题 + 热力示意 + 图例（素极 v2 增强） */
.dx-panel-head {
  margin: 0 0 14px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--muted);
  text-transform: uppercase;
}
.dx-panel .dx-metrics {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
}
.dx-heat {
  margin-top: 16px;
}
.dx-heat-t {
  margin: 0 0 10px;
  font-size: 12.5px;
  color: var(--fg-2);
  font-weight: 500;
}
.dx-heat-row {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 0;
  font-size: 13px;
}
.dx-dot {
  width: 9px;
  height: 9px;
  border-radius: var(--radius-pill);
  flex: none;
}
.dx-dot.green {
  background: var(--color-result);
}
.dx-dot.yellow {
  background: #d9a406;
}
.dx-dot.red {
  background: #c23a3a;
}
.dx-heat-name {
  color: var(--fg);
  font-weight: 500;
}
.dx-heat-bench {
  margin-left: auto;
  font-family: var(--font-mono);
  font-size: 11.5px;
  color: var(--muted);
  text-align: right;
}
.dx-legend {
  margin: 14px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  font-size: 11.5px;
  color: var(--muted);
  line-height: 1.7;
}

/* M4 客户视角 VS 图：Top 落点徽章（7–8 阶段允许换行） */
.vs-map {
  flex-wrap: wrap;
}
.vs-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
}
.vs-pill {
  font-family: var(--font-mono);
  font-size: 10.5px;
  font-weight: 500;
  color: #ffffff;
  background: var(--color-primary);
  border-radius: var(--radius-pill);
  padding: 2px 8px;
  white-space: nowrap;
}

/* 留资成功态：案例号 + 入口指引（2026-09-04） */
.lead-case-line {
  margin-top: 14px;
  font-size: 14px;
  color: var(--fg-2);
}
.lead-case-line b {
  font-family: var(--font-mono);
  font-size: 17px;
  color: var(--color-primary);
  letter-spacing: 0.02em;
}
.lead-case-note {
  margin-top: 8px;
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.7;
}
.lead-case-note b {
  color: var(--fg-2);
}

/* M3 门禁：案例号输入卡（2026-09-04） */
.m3-gate {
  max-width: 460px;
  margin: 64px auto 0;
  background: var(--surface);
  border: 1px solid var(--border);
  border-top: 3px solid var(--color-primary);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  padding: 32px 30px 28px;
  text-align: center;
}
.m3-gate .gate-icon {
  color: var(--color-primary);
  margin-bottom: 12px;
}
.m3-gate h2 {
  font-size: 20px;
  font-weight: 600;
  color: var(--fg);
  margin: 0 0 8px;
}
.m3-gate .gate-desc {
  font-size: 13.5px;
  color: var(--muted);
  line-height: 1.7;
  margin: 0 0 20px;
}
.m3-gate .gate-input {
  width: 100%;
  box-sizing: border-box;
  font-family: var(--font-mono);
  font-size: 16px;
  letter-spacing: 0.03em;
  text-align: center;
  color: var(--fg);
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 11px 14px;
  outline: none;
}
.m3-gate .gate-input:focus {
  border-color: var(--color-primary);
}
.m3-gate .btn {
  width: 100%;
  margin-top: 14px;
}
.m3-gate .gate-err {
  margin: 12px 0 0;
  font-size: 13px;
  color: #c23a3a;
}

/* Hero：按钮行与 A/B panel 同网格对齐（2026-09-04） */
.hero-inner.v2 .hero-cta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  max-width: 640px;
}
.hero-inner.v2 .hero-cta .btn {
  width: 100%;
  justify-content: center;
}
@media (max-width: 640px) {
  .hero-inner.v2 .hero-cta {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
 * 案例作品（2026-09-13）：案例页两区 + 案例详情页 case-01
 * 沿用素极专业令牌：浅色底、发丝边、单一主色；不用发光晕。
 * ============================================================ */
:root {
  --cw-y: #b7791f; /* 琥珀（接入类判定） */
  --cw-r: #c2413b; /* 砖红（暂不做 / 不做项） */
}

/* —— 案例页：两区说明 —— */
.zone-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-top: 28px;
}
.zone-chip {
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--muted);
  border-radius: var(--radius-md);
  padding: 14px 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.zone-chip.zone-live {
  border-left-color: var(--color-result);
}
.zone-label {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 600;
  color: var(--fg);
}
.zone-desc {
  font-size: 13px;
  line-height: 1.65;
  color: var(--fg-2);
}

/* —— 案例卡：上线态 / 占位态 —— */
.case-card-live {
  border-color: var(--color-primary);
  border-left: 3px solid var(--color-primary);
}
.case-svc {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  color: var(--fg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 2px 7px;
  letter-spacing: 0.03em;
}
/* 场景锚 chip：与「服务编号」并列呈现，两个维度分开（16 号 §4.6 两个锚） */
.case-scene {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  color: var(--color-primary);
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-sm);
  padding: 1px 7px;
  letter-spacing: 0.02em;
}
.cb-metric {
  font-family: var(--font-mono);
  font-size: 15px;
  font-weight: 500;
  color: var(--color-primary);
  margin: 0 0 8px !important;
}
.cb-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 14px;
  flex-wrap: wrap;
}
.cb-status {
  font-size: 12px;
  font-weight: 600;
  border-radius: var(--radius-pill);
  padding: 3px 10px;
}
.cb-status-live {
  color: var(--color-result);
  background: var(--color-result-weak);
}
.cb-status-planned {
  color: var(--muted);
  background: var(--bg);
  border: 1px solid var(--border);
}
.cb-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--color-primary);
  text-decoration: none;
}
.cb-link:hover {
  color: var(--color-primary-press);
}

/* —— 案例详情页 —— */
.case-work .te-head,
#cases .te-head {
  max-width: none;
}
.case-work .te-head .section-title,
#cases .te-head .section-title {
  max-width: 720px;
}
.case-work .te-head .te-intro {
  max-width: 62ch;
}
.cw-hero {
  background: linear-gradient(180deg, var(--color-primary-weak), var(--bg));
  padding-bottom: 48px;
}
.cw-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--fg-2);
  text-decoration: none;
  margin-bottom: 20px;
}
.cw-back:hover {
  color: var(--color-primary);
}
.cw-title {
  font-family: var(--font-display);
  font-size: clamp(26px, 4vw, 40px);
  font-weight: 700;
  line-height: 1.25;
  max-width: 880px;
  margin: 0;
}
.cw-lede {
  color: var(--fg-2);
  font-size: 16.5px;
  line-height: 1.8;
  max-width: 66ch;
  margin: 16px 0 0;
}
.cw-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 22px;
}
.cw-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  padding: 5px 12px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--fg-2);
}
.cw-badge .lucide-icon {
  color: var(--color-primary);
}
.cw-meta {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-top: 28px;
}
.cw-meta-row {
  background: var(--surface);
  padding: 14px 18px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.cw-meta-row b {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: 0.02em;
}
.cw-meta-row span {
  font-size: 14px;
  color: var(--fg);
  line-height: 1.6;
}

/* —— 口径声明 —— */
.cw-notice {
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--color-primary);
  border-radius: var(--radius-md);
  padding: 24px 26px;
}
.cw-notice-head {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.cw-notice-icon {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border-radius: var(--radius-sm);
  background: var(--color-primary-weak);
  color: var(--color-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.cw-notice-head h3 {
  font-family: var(--font-display);
  font-size: 17px;
  margin: 0 0 6px;
}
.cw-notice-head p {
  color: var(--fg-2);
  font-size: 14.5px;
  line-height: 1.75;
  margin: 0;
}
.cw-notice-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--border);
}
.cw-can h4,
.cw-cannot h4 {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13.5px;
  margin: 0 0 10px;
}
.cw-can h4 {
  color: var(--color-result);
}
.cw-cannot h4 {
  color: var(--cw-r);
}
.cw-can ul,
.cw-cannot ul,
.cw-list-card ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.cw-can li,
.cw-cannot li {
  font-size: 13.5px;
  line-height: 1.75;
  color: var(--fg-2);
  padding-left: 16px;
  position: relative;
  margin-bottom: 6px;
}
.cw-can li::before,
.cw-cannot li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 6px;
  height: 6px;
  border-radius: var(--radius-pill);
}
.cw-can li::before {
  background: var(--color-result);
}
.cw-cannot li::before {
  background: var(--cw-r);
}
.cw-footnote {
  font-size: 12.5px;
  color: var(--muted);
  margin: 18px 0 0;
  line-height: 1.7;
}

/* —— 通用小块 —— */
.cw-cols {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 32px;
  align-items: start;
}
.cw-cols-2 {
  grid-template-columns: 1fr 1fr;
  margin-top: 24px;
}
.cw-col p,
.cw-p {
  color: var(--fg-2);
  line-height: 1.85;
  margin: 0 0 14px;
}
.cw-label {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  color: var(--fg);
  letter-spacing: 0.02em;
  margin: 0 0 10px;
}
.cw-label-gap {
  margin-top: 36px;
}
.cw-note {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.7;
  margin: 0 0 14px;
}
.cw-spiral ol {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: cw-sp;
}
.cw-spiral li {
  counter-increment: cw-sp;
  position: relative;
  padding: 10px 0 10px 34px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--fg-2);
  border-bottom: 1px solid var(--border);
}
.cw-spiral li:last-child {
  border-bottom: none;
}
.cw-spiral li::before {
  content: counter(cw-sp);
  position: absolute;
  left: 0;
  top: 10px;
  width: 22px;
  height: 22px;
  border-radius: var(--radius-pill);
  background: var(--color-primary-weak);
  color: var(--color-primary);
  font-family: var(--font-mono);
  font-size: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.cw-facts {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 28px;
}
.cw-fact {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cw-fact b {
  font-family: var(--font-mono);
  font-size: 26px;
  font-weight: 500;
  color: var(--fg);
}
.cw-fact span {
  font-size: 14px;
  color: var(--fg-2);
}
.cw-fact em {
  font-size: 12px;
  font-style: normal;
  color: var(--muted);
  margin-top: 4px;
}

/* —— 闭环步骤 —— */
.cw-flow {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.cw-step {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.cw-step-n {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--color-primary);
}
.cw-step b {
  font-size: 14.5px;
}
.cw-step span:last-child {
  font-size: 13px;
  color: var(--fg-2);
  line-height: 1.65;
}

/* —— 表格 —— */
.cw-table-wrap {
  margin-top: 20px;
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
}
.cw-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 620px;
  font-size: 14px;
}
.cw-table th,
.cw-table td {
  text-align: left;
  padding: 13px 16px;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  line-height: 1.6;
}
.cw-table thead th {
  font-family: var(--font-display);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: 0.02em;
  background: var(--bg);
}
.cw-table tbody tr:last-child td {
  border-bottom: none;
}
.cw-table td b {
  font-weight: 600;
  color: var(--fg);
}
.cw-table td {
  color: var(--fg-2);
}
.cw-vd {
  white-space: nowrap;
}
.cw-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: var(--radius-pill);
  margin-right: 7px;
  vertical-align: middle;
}
.cw-dot-g {
  background: var(--color-result);
}
.cw-dot-y {
  background: var(--cw-y);
}
.cw-dot-r {
  background: var(--cw-r);
}
.cw-hi {
  margin: 20px 0 0;
  padding: 16px 20px;
  background: var(--color-primary-weak);
  border-radius: var(--radius-md);
  font-size: 14.5px;
  line-height: 1.8;
  color: var(--fg);
}
.cw-hi-plain {
  background: var(--bg);
  border: 1px solid var(--border);
}

/* —— 时间线 —— */
.cw-tl {
  border-left: 2px solid var(--border);
  padding-left: 24px;
  margin-top: 8px;
}
.cw-tl-item {
  position: relative;
  padding-bottom: 28px;
}
.cw-tl-item:last-child {
  padding-bottom: 0;
}
.cw-tl-day {
  font-family: var(--font-mono);
  font-size: 12.5px;
  font-weight: 500;
  color: var(--color-primary);
  background: var(--color-primary-weak);
  border-radius: var(--radius-sm);
  padding: 3px 9px;
  display: inline-block;
  margin-bottom: 10px;
}
.cw-tl-item::before {
  content: "";
  position: absolute;
  left: -30px;
  top: 5px;
  width: 9px;
  height: 9px;
  border-radius: var(--radius-pill);
  background: var(--color-primary);
  border: 2px solid var(--bg);
}
.cw-tl-body h4 {
  font-family: var(--font-display);
  font-size: 16px;
  margin: 0 0 8px;
}
.cw-tl-body p {
  color: var(--fg-2);
  font-size: 14px;
  line-height: 1.8;
  margin: 0;
}
.cw-tl-hi {
  margin-top: 10px !important;
  padding-left: 14px;
  border-left: 2px solid var(--color-result);
  color: var(--fg) !important;
}

/* —— 衔接链 —— */
.cw-chain {
  display: flex;
  flex-direction: column;
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-bottom: 24px;
}
.cw-chain-item {
  background: var(--surface);
  padding: 14px 18px;
  display: grid;
  grid-template-columns: auto auto auto 1fr;
  gap: 12px;
  align-items: center;
}
.cw-chain-from,
.cw-chain-to {
  font-size: 14px;
  font-weight: 600;
  color: var(--fg);
  white-space: nowrap;
}
.cw-chain-to {
  color: var(--color-primary);
}
.cw-chain-arrow {
  color: var(--muted);
  display: inline-flex;
}
.cw-chain-note {
  font-size: 13px;
  color: var(--fg-2);
  line-height: 1.6;
}
.cw-svc-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--color-primary);
  border-radius: var(--radius-md);
  padding: 22px 24px;
}
.cw-svc-card h4 {
  font-family: var(--font-display);
  font-size: 17px;
  margin: 0 0 4px;
}
.cw-svc-entry {
  font-family: var(--font-mono);
  font-size: 12.5px;
  color: var(--color-primary);
  margin: 0 0 10px !important;
}
.cw-svc-card p {
  color: var(--fg-2);
  font-size: 14px;
  line-height: 1.8;
  margin: 0 0 16px;
}

/* —— 会 / 不会 两卡 —— */
.cw-list-card {
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 20px 22px;
  background: var(--surface);
}
.cw-list-card h4 {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13.5px;
  margin: 0 0 12px;
}
.cw-list-yes {
  border-left: 3px solid var(--color-result);
}
.cw-list-yes h4 {
  color: var(--color-result);
}
.cw-list-no {
  border-left: 3px solid var(--muted);
}
.cw-list-no h4 {
  color: var(--fg-2);
}
.cw-list-card li {
  font-size: 13.5px;
  line-height: 1.75;
  color: var(--fg-2);
  padding-left: 16px;
  position: relative;
  margin-bottom: 8px;
}
.cw-list-card li:last-child {
  margin-bottom: 0;
}
.cw-list-card li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 6px;
  height: 6px;
  border-radius: var(--radius-pill);
  background: var(--muted);
}
.cw-list-yes li::before {
  background: var(--color-result);
}

/* —— 边界 + 收尾 CTA —— */
.cw-limit {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
.cw-limit li {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 16px 18px;
  font-size: 13.5px;
  line-height: 1.75;
  color: var(--fg-2);
}
.cw-cta {
  margin-top: 40px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 28px 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.cw-cta h3 {
  font-family: var(--font-display);
  font-size: 20px;
  margin: 0 0 8px;
}
.cw-cta p {
  color: var(--fg-2);
  font-size: 14px;
  margin: 0;
  max-width: 52ch;
  line-height: 1.75;
}
.cw-cta-btns {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

@media (max-width: 920px) {
  .zone-grid,
  .cw-meta,
  .cw-notice-cols,
  .cw-facts,
  .cw-cols-2,
  .cw-limit {
    grid-template-columns: 1fr;
  }
  .cw-flow {
    grid-template-columns: repeat(2, 1fr);
  }
  .cw-cols {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .cw-chain-item {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .cw-chain-arrow {
    display: none;
  }
}
@media (max-width: 640px) {
  .cw-flow {
    grid-template-columns: 1fr;
  }
  .cw-cta {
    padding: 22px;
  }
  .cw-cta-btns .btn {
    width: 100%;
    justify-content: center;
  }
}

/* ============================================================
 * 案例作品 · 效果图页（case-01.html）
 * 口径：只放效果图 + 口径声明 + 联系入口；完整资料留在案例库，不上官网。
 * ============================================================ */
.cw-figs {
  display: grid;
  gap: 24px;
}
.cw-fig {
  margin: 0;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 26px 28px 22px;
}
.cw-fig-tag {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: var(--color-primary);
  background: var(--color-primary-weak);
  border-radius: var(--radius-sm);
  padding: 3px 8px;
}
.cw-fig-head h3,
.cw-metrics-wrap h3 {
  font-family: var(--font-display);
  font-size: 19px;
  margin: 12px 0 6px;
}
.cw-fig-sub {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--fg-2);
  max-width: 62ch;
}
.cw-fig-canvas {
  margin: 22px 0 4px;
}
.cw-fig-canvas svg {
  display: block;
  width: 100%;
  height: auto;
}
.cw-svg-lab {
  font-family: var(--font-body);
  font-size: 14px;
  fill: var(--fg-2);
}
.cw-svg-val {
  font-family: var(--font-mono);
  font-size: 17px;
  font-weight: 600;
}
.cw-svg-seg {
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 600;
}
.cw-svg-anno {
  font-family: var(--font-body);
  font-size: 12.5px;
  font-weight: 600;
}
.cw-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-top: 14px;
}
.cw-legend span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12.5px;
  color: var(--fg-2);
}
.cw-lg {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 3px;
}
.cw-lg-hit {
  background: #1d4ed8;
}
.cw-lg-miss {
  background: #eef1f6;
  border: 1px solid var(--border);
}
.cw-lg-ok {
  background: #a9c0f5;
}
.cw-lg-arch {
  background: #1d4ed8;
}
.cw-lg-hold {
  background: #c3cad6;
}
.cw-fig-base {
  margin: 16px 0 0;
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.7;
  color: var(--muted);
}
.cw-fig-note {
  margin: 12px 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--border);
  font-size: 13.5px;
  line-height: 1.8;
  color: var(--fg-2);
}
.cw-metrics-wrap {
  margin-top: 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 26px 28px 24px;
}
.cw-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 20px;
}
.cw-metric {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 16px 18px;
}
.cw-metric b {
  display: block;
  font-family: var(--font-mono);
  font-size: 26px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--fg);
}
.cw-metric b span {
  margin-left: 3px;
  font-size: 13px;
  color: var(--muted);
}
.cw-metric em {
  display: block;
  margin-top: 8px;
  font-style: normal;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--fg);
}
.cw-metric i {
  display: block;
  margin-top: 4px;
  font-style: normal;
  font-size: 12px;
  line-height: 1.6;
  color: var(--muted);
}
.cw-limits-head .section-title {
  margin-bottom: 18px;
}
.cw-limits {
  margin: 0 0 4px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 12px;
}
.cw-limits li {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 15px 18px 15px 40px;
  font-size: 13.5px;
  line-height: 1.8;
  color: var(--fg-2);
}
.cw-limits li::before {
  content: "";
  position: absolute;
  left: 18px;
  top: 22px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--bg);
  border: 1px solid var(--muted);
}
/* 案例卡上的迷你效果图 */
.case-figure {
  margin: 0 0 10px;
}
.case-figure svg {
  display: block;
  width: 100%;
  max-width: 260px;
  height: auto;
}
.case-figure-cap {
  display: block;
  margin-top: 6px;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--muted);
}
/* 真实客户案例区 · 脱敏效果图 */
.lc-shot {
  margin: 12px 0 0;
}
.lc-shot img {
  display: block;
  width: 100%;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.lc-shot figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--muted);
}

@media (max-width: 920px) {
  .cw-metrics {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  .cw-metrics {
    grid-template-columns: 1fr;
  }
  .cw-fig,
  .cw-metrics-wrap {
    padding: 20px 18px;
  }
}


/* ==========================================================================
   案例作品页 · 图表组件补充 v1.1（2026-09-14）
   .cw-arch    分层架构图  —— 案例作品 02 · 效果图 01
   .cw-report  数据报告样张 —— 案例作品 01 · 效果图 03
   设计纪律：沿用「素极专业 v2」令牌；单一主色 #1D4ED8；发丝边 1px；无阴影发散。
   为什么用 HTML 而不是 SVG：中文长句在 SVG <text> 里不会自动换行，
   这几层的「它回答什么问题」是完整句子，必须能折行 → 用 grid 堆叠。
   ========================================================================== */

/* —— .cw-arch 分层架构图 —— */
.cw-arch {
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
  overflow: hidden;
}
.cw-arch-cap {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px 14px;
  padding: 12px 18px;
  background: var(--bg);
  font-size: 12px;
  letter-spacing: 0.02em;
  color: var(--muted);
}
.cw-arch-cap b {
  font-family: var(--font-body);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--fg);
}
.cw-arch-cap-end {
  background: var(--color-primary-weak);
}
.cw-arch-cap-end b {
  color: var(--color-primary-press);
}
.cw-arch-row {
  display: grid;
  grid-template-columns: 42px 118px 1fr 96px;
  align-items: center;
  gap: 6px 16px;
  padding: 13px 18px;
  border-top: 1px solid var(--border);
}
.cw-arch-n {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--muted);
}
.cw-arch-name {
  font-size: 14.5px;
  font-weight: 600;
  color: var(--fg);
}
.cw-arch-q {
  font-size: 13.5px;
  line-height: 1.65;
  color: var(--fg-2);
}
.cw-arch-out {
  font-family: var(--font-mono);
  font-size: 11.5px;
  text-align: right;
  color: var(--muted);
}
.cw-arch-row.cw-arch-key {
  background: var(--color-primary-weak);
}
.cw-arch-row.cw-arch-key .cw-arch-name {
  color: var(--color-primary-press);
}
.cw-arch-row.cw-arch-key .cw-arch-n {
  color: var(--color-primary);
}
.cw-arch-cut {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 4px 16px;
  padding: 9px 18px;
  border-top: 1px dashed var(--color-primary);
  border-bottom: 1px dashed var(--color-primary);
  background: #FBFCFE;
  font-size: 12px;
  font-weight: 600;
  color: var(--color-primary-press);
}
.cw-arch-cut + .cw-arch-row {
  border-top: 0;
}
.cw-lg-base {
  background: #525B6B;
}
.cw-lg-muted {
  background: #C3CAD6;
}

/* —— .cw-report 数据报告样张 —— */
.cw-report {
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
  overflow: hidden;
}
.cw-report-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 14px;
  padding: 13px 18px;
  background: var(--bg);
  border-bottom: 1px solid var(--border);
}
.cw-report-doc {
  font-family: var(--font-mono);
  font-size: 11.5px;
  letter-spacing: 0.02em;
  color: var(--muted);
}
.cw-report-title {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--fg);
}
.cw-report-wrap {
  overflow-x: auto;
}
.cw-report table {
  width: 100%;
  min-width: 620px;
  border-collapse: collapse;
}
.cw-report th,
.cw-report td {
  padding: 11px 18px;
  text-align: left;
  vertical-align: top;
  border-top: 1px solid var(--border);
}
.cw-report thead th {
  border-top: 0;
  background: #FBFCFE;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--muted);
}
.cw-report td:first-child {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--fg);
}
.cw-rep-num {
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 600;
  color: var(--fg);
}
.cw-rep-num.hi {
  color: var(--color-primary);
}
.cw-rep-base {
  font-family: var(--font-mono);
  font-size: 12.5px;
  white-space: nowrap;
  color: var(--fg-2);
}
.cw-rep-cal {
  font-size: 12.5px;
  line-height: 1.65;
  color: var(--muted);
}
.cw-report-foot {
  margin: 0;
  padding: 12px 18px;
  border-top: 1px solid var(--border);
  background: var(--bg);
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.7;
  color: var(--muted);
}
/* —— 案例四段叙事骨架（16 号 §4.6）：业务场景 → 问题 → 解决方案 → 落地实现 —— */
.cw-story-head {
  max-width: 720px;
  margin-bottom: 26px;
}
.cw-story {
  display: grid;
  gap: 12px;
}
.cw-story-step {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 18px;
  padding: 20px 22px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface);
}
.cw-story-n {
  font-family: var(--font-mono);
  font-size: 19px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--color-primary);
}
.cw-story-body h3 {
  margin: 0 0 7px;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 500;
  color: var(--fg);
}
.cw-story-body p {
  margin: 0;
  font-size: 14px;
  line-height: 1.78;
  color: var(--fg-2);
}
.cw-story-metas {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 11px;
}
.cw-story-fact,
.cw-story-ref {
  display: inline-block;
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  font-size: 12px;
  line-height: 1.5;
}
.cw-story-fact {
  background: var(--bg);
  color: var(--fg-2);
}
.cw-story-ref {
  background: var(--color-primary-weak);
  color: var(--color-primary);
}
.cw-story-foot {
  margin: 18px 0 0;
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--muted);
}
@media (max-width: 640px) {
  .cw-story-step {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 18px;
  }
}
@media (max-width: 820px) {
  .cw-arch-row {
    grid-template-columns: 34px 1fr;
  }
  .cw-arch-q {
    grid-column: 2;
  }
  .cw-arch-out {
    grid-column: 2;
    text-align: left;
  }
}
@media (max-width: 640px) {
  .cw-arch-cap,
  .cw-arch-row,
  .cw-arch-cut {
    padding-left: 14px;
    padding-right: 14px;
  }
  .cw-report-head,
  .cw-report th,
  .cw-report td,
  .cw-report-foot {
    padding-left: 14px;
    padding-right: 14px;
  }
}