/* ============================================================
 * 智帮咨询 V4 · 全局升级样式
 * 版本：V4.0
 * 依赖：tokens.css（先加载）+ base.css（先加载）
 * 加载顺序：tokens.css → base.css → v4-upgrade.css → nav.css
 * 覆盖 base.css 的 V3 默认值（footer/cta），提供 V4 白底浅色系统
 * 注：导航栏样式已抽离至 assets/nav.css
 * ============================================================ */

/* ===== V4 共享变量微调 ===== */
:root {
  --radius-lg: 12px;
  --accent-rgb: 200, 100, 42;
  --shadow-card: 0 1px 2px rgba(0,0,0,.03), 0 6px 16px rgba(0,0,0,.04);
  --shadow-float: 0 12px 32px rgba(23,38,51,.08);
}

/* ===== Footer：V4 深灰蓝 + accent 顶条（覆盖 base.css navy footer）===== */
footer.site-footer {
  background: var(--footer-bg);
  color: var(--footer-text);
  position: relative;
  box-shadow: 0 -1px 4px rgba(0,0,0,.06);
}
footer.site-footer::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: var(--accent);
}
.footer-brand h4,
.footer-col h5 { color: var(--footer-heading); }
.footer-brand p { color: var(--footer-text); }
.footer-col a {
  color: #E2E7EC;
  text-decoration: none;
}
.footer-col a:hover {
  color: var(--accent);
  text-decoration: none;
}
.footer-brand p,
.footer-col p { color: var(--footer-subtle); }
.footer-col .hot { background: var(--accent); }
.footer-bottom {
  border-top-color: rgba(255,255,255,.12);
  color: var(--footer-text);
}

/* ===== 按钮：V4 accent 主题 ===== */
.btn-primary {
  background: var(--accent);
  border-color: var(--accent);
  box-shadow: 0 4px 20px rgba(var(--accent-rgb),.35);
}
.btn-primary:hover {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
}
.btn-secondary {
  background: transparent;
  color: var(--accent);
  border-color: var(--accent);
}
.btn-secondary:hover {
  background: var(--accent);
  color: var(--white);
}

/* ===== section-label：V4 accent 色 ===== */
.section-label {
  color: var(--accent);
  background: var(--accent-light);
  border: 1px solid rgba(var(--accent-rgb),.18);
  letter-spacing: .5px;
}

/* ===== 卡片 hover 统一 ===== */
.card:hover,
.door-card:hover,
.pain-quote-card:hover,
.audience-card:hover,
.case-card:hover,
.case-large-card:hover,
.cs-card:hover,
.cap-card:hover,
.mode-card:hover {
  transform: translateY(-2px);
}

/* ===== Hero 信任数据条 ===== */
.hero-trust-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-md);
  max-width: 960px;
  margin: var(--space-lg) auto 0;
  padding: var(--space-md);
  background: var(--white);
  border: 1px solid rgba(26,29,32,.08);
  border-radius: var(--radius-lg);
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
}
.trust-item { text-align: center; }
.trust-item strong {
  display: block;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: var(--fs-h2);
  font-weight: 900;
  color: var(--accent-deep);
  line-height: 1;
  margin-bottom: 4px;
}
.trust-item span {
  color: var(--text-subtle);
  font-size: var(--fs-xs);
}
.trust-item cite {
  display: block;
  font-style: normal;
  font-size: 10px;
  color: var(--text-subtle);
  margin-top: 2px;
}

/* ===== Hero 客户行业范围 ===== */
.hero-client-range {
  margin-top: var(--space-md);
  padding: 12px 14px;
  background: var(--accent-light);
  border: 1.5px dashed rgba(var(--accent-rgb),.35);
  border-radius: var(--radius-sm);
}
.hero-client-range .client-range-label {
  font-size: var(--fs-xs);
  color: var(--text-subtle);
  font-weight: 600;
  margin-bottom: 6px;
  display: block;
}
.hero-client-range .client-range-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.hero-client-range .client-range-tags span {
  font-size: var(--fs-xs);
  color: var(--text-body);
  background: var(--white);
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--border-soft);
}
.hero-client-range .client-range-foot {
  margin-top: 8px;
  font-size: 9px;
  color: var(--text-subtle);
  line-height: 1.4;
}

/* ===== 产品 Hero 信任承诺条 ===== */
.product-hero-commitment {
  margin: var(--space-sm) 0;
  padding: 10px 16px;
  background: var(--accent-light);
  border-left: 3px solid var(--accent);
  border-radius: var(--radius-sm);
  color: var(--text-body);
  font-size: var(--fs-sm);
  line-height: var(--lh-normal);
}

/* ===== 王牌徽章 ===== */
.king-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  font-weight: 600;
  letter-spacing: .5px;
  background: var(--accent-light);
  color: var(--accent);
  border: 1px solid rgba(var(--accent-rgb),.15);
  border-radius: var(--radius-pill);
  box-shadow: none;
}

/* ===== Ribbon 标签 ===== */
.ribbon {
  background: var(--accent);
  box-shadow: 0 4px 12px rgba(var(--accent-rgb),.25);
}

/* ===== 术语注释 ===== */
.term-note {
  display: block;
  margin-top: 6px;
  padding: 6px 10px;
  background: var(--bg-3rd);
  border-radius: var(--radius-sm);
  font-size: var(--fs-xs);
  color: var(--text-body);
  line-height: var(--lh-normal);
  font-weight: 500;
  border-left: 2px solid var(--accent);
}
.term-note::before {
  content: '大白话: ';
  font-weight: 700;
  color: var(--accent);
}

/* ===== 症状区（diagnosis）===== */
.symptom-section {
  padding: var(--space-2xl) 0;
  background: var(--white);
}
.symptom-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-md);
  margin-top: var(--space-lg);
}
.symptom-card {
  background: #fff;
  border: 1px solid rgba(26,29,32,.08);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
}
.symptom-card h3 {
  font-family: var(--font-heading);
  font-size: var(--fs-lg);
  color: var(--text-title);
  margin-bottom: var(--space-sm);
}
.symptom-card p {
  color: var(--text-body);
  line-height: var(--lh-loose);
  font-size: var(--fs-sm);
}
.symptom-card .symptom-tag {
  display: inline-block;
  margin-top: var(--space-sm);
  padding: 4px 10px;
  border-radius: var(--radius-pill);
  background: var(--accent-light);
  color: var(--accent-deep);
  font-size: var(--fs-xs);
  font-weight: 700;
}

/* ===== 分诊框架（triage dark panel）===== */
.triage-panel {
  margin-top: var(--space-lg);
  display: grid;
  grid-template-columns: minmax(260px,.82fr) minmax(0,1.18fr);
  gap: var(--space-lg);
  align-items: stretch;
  background: #263238;
  color: #E8ECF0;
  border-radius: var(--radius-lg);
  padding: var(--space-lg);
  box-shadow: 0 16px 40px rgba(38,50,56,.14);
}
.triage-lead h3 {
  font-family: var(--font-heading);
  font-size: var(--fs-h3);
  line-height: var(--lh-tight);
  color: #F4F6F7;
  margin-bottom: var(--space-sm);
}
.triage-lead p {
  color: #AEB8C1;
  line-height: var(--lh-loose);
  font-size: var(--fs-sm);
}
.triage-list {
  display: grid;
  gap: 10px;
}
.triage-item {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: var(--space-sm);
  padding: 12px;
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.08);
}
.triage-num {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  color: #fff;
  font-family: var(--font-mono);
  font-weight: 800;
  font-size: 15px;
  line-height: 1;
}
.triage-item strong {
  display: block;
  color: #F4F6F7;
  font-family: var(--font-heading);
  margin-bottom: 4px;
}
.triage-item > div > span {
  display: block;
  color: #AEB8C1;
  font-size: var(--fs-sm);
  line-height: var(--lh-normal);
}

/* ===== 方法时间线（3步）===== */
.method-section {
  padding: var(--space-2xl) 0;
  background: var(--white);
}
.method-timeline {
  margin-top: var(--space-lg);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-md);
}
.method-step {
  background: var(--bg-3rd);
  border: 1px solid rgba(26,29,32,.08);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
  transition: border-color var(--duration-base);
}
.method-step:hover {
  border-color: var(--accent);
}
.method-step .method-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  font-family: var(--font-mono);
  font-weight: 800;
  margin-bottom: var(--space-sm);
}
.method-step h3 {
  font-family: var(--font-heading);
  color: var(--text-title);
  font-size: var(--fs-md);
  margin-bottom: var(--space-xs);
}
.method-step p {
  color: var(--text-body);
  line-height: var(--lh-loose);
  font-size: var(--fs-sm);
}

/* ===== 深色节奏区（生产+组织联动）===== */
.dark-zone {
  background: #263238;
  padding: var(--space-2xl) 0;
  border-top: 3px solid var(--accent);
  border-bottom: 3px solid var(--accent);
}
.dark-zone-grid { max-width: 960px; margin: 0 auto; }
.dark-zone-label {
  display: inline-block;
  padding: 4px 12px;
  background: var(--accent-light);
  color: var(--accent);
  border-radius: var(--radius-pill);
  font-size: var(--fs-xs);
  font-weight: 700;
  letter-spacing: .5px;
  margin-bottom: var(--space-md);
}
.dark-zone-main h2 {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: 800;
  color: #E8ECF0;
  line-height: var(--lh-tight);
  margin-bottom: var(--space-md);
}
.dark-zone-desc {
  font-size: var(--fs-base);
  color: #9AA5B0;
  line-height: var(--lh-loose);
  max-width: 720px;
  margin-bottom: var(--space-sm);
}
.dark-zone-steps { margin-top: var(--space-lg); }
.dz-step {
  display: flex;
  gap: var(--space-md);
  padding: var(--space-md) 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.dz-step:last-child { border-bottom: none; }
.dz-step-num {
  flex-shrink: 0;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: var(--accent);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-mono);
  font-weight: 800;
  font-size: 16px;
}
.dz-step-body h4 {
  font-family: var(--font-heading);
  font-size: var(--fs-md);
  font-weight: 700;
  color: #E8ECF0;
  margin-bottom: 6px;
}
.dz-step-body p {
  font-size: var(--fs-sm);
  color: #9AA5B0;
  line-height: var(--lh-loose);
}

/* ===== FAQ（details/summary 折叠）===== */
.faq-section {
  padding: var(--space-2xl) 0;
  background: var(--bg-2nd);
}
.faq-section .section-label {
  background: var(--accent-light);
  color: var(--accent);
  border-color: rgba(var(--accent-rgb),.18);
}
.faq-grid {
  margin-top: var(--space-lg);
  max-width: 880px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.faq-item {
  border: 1px solid rgba(26,29,32,.08);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--white);
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
}
.faq-item:hover { border-color: var(--accent); }
.faq-item summary {
  padding: var(--space-md) var(--space-lg);
  cursor: pointer;
  font-family: var(--font-heading);
  font-size: var(--fs-md);
  font-weight: 700;
  color: var(--text-title);
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: '+';
  font-size: 22px;
  font-weight: 300;
  color: var(--accent);
  transition: transform .2s;
}
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item[open] summary {
  background: var(--accent-light);
  color: var(--accent);
}
.faq-item .faq-body {
  padding: var(--space-md) var(--space-lg);
  background: var(--bg-3rd);
  border-top: 1px solid var(--border-soft);
  font-size: var(--fs-base);
  color: var(--text-body);
  line-height: var(--lh-loose);
}

/* ===== 工业指标卡片 ===== */
.ind-dashboard {
  background: var(--bg-2nd);
  padding: var(--space-lg) 0;
  border-bottom: 1px solid var(--border-soft);
}
.ind-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-md);
}
.ind-card {
  background: var(--white);
  padding: var(--space-md);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  border-left: 3px solid var(--accent);
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
}
.ind-card .ind-label {
  font-size: var(--fs-xs);
  font-weight: 600;
  letter-spacing: .5px;
  color: var(--text-subtle);
}
.ind-card .ind-num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: var(--fs-h3);
  line-height: 1;
  margin: 6px 0;
  color: var(--accent);
  font-weight: 900;
}
.ind-card .ind-meta {
  font-size: var(--fs-xs);
  color: var(--text-subtle);
}
.ind-card .ind-meta s { color: var(--text-subtle); }

/* ===== 对症入座 ===== */
.pain-action {
  margin-top: var(--space-lg);
  padding: var(--space-md);
  background: var(--white);
  border: 2px solid var(--accent);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}
.pain-action-head {
  font-family: var(--font-heading);
  font-weight: 700;
  color: var(--text-title);
  margin-bottom: var(--space-sm);
  font-size: var(--fs-lg);
  text-align: center;
}
.pain-action-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-sm);
}
.pain-action-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: var(--space-sm);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-md);
  background: var(--bg-3rd);
  text-decoration: none;
  transition: transform .15s, box-shadow .15s;
}
.pain-action-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-card);
  border-color: var(--accent);
}
.pain-action-icon { font-size: 28px; line-height: 1; }
.pain-action-label {
  font-weight: 600;
  color: var(--text-title);
  font-size: var(--fs-sm);
  font-family: var(--font-heading);
}
.pain-action-desc {
  color: var(--accent);
  font-size: var(--fs-xs);
  text-align: center;
  font-weight: 600;
}
.pain-action-foot {
  margin-top: var(--space-sm);
  text-align: center;
  color: var(--text-subtle);
  font-size: var(--fs-xs);
  font-weight: 600;
}

/* ===== CTA 区内精简流程 ===== */
.cta-process-compact {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin-top: var(--space-lg);
  padding: var(--space-md);
  background: var(--white);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}
.cta-step {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  font-size: var(--fs-sm);
  color: var(--text-body);
}
.cta-step .step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--accent);
  color: var(--white);
  font-size: 12px;
  font-weight: 700;
  flex-shrink: 0;
}
.cta-step-arrow {
  color: var(--text-subtle);
  font-size: 16px;
}

/* ===== 对比区金句 ===== */
.comp-quote {
  margin-top: var(--space-lg);
  padding: var(--space-md) var(--space-lg);
  text-align: center;
  font-size: var(--fs-lg);
  font-family: var(--font-heading);
  color: var(--text-title);
  border-left: 4px solid var(--accent);
  background: var(--white);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
}
.comp-quote cite {
  display: block;
  margin-top: var(--space-xs);
  font-size: var(--fs-sm);
  color: var(--accent);
  font-style: normal;
  font-weight: 600;
}

/* ===== 对比表拉伸提示 ===== */
.comp-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
.comp-wrap::after {
  display: none;
  content: '← 滑动查看更多 →';
  text-align: center;
  padding: 8px;
  font-size: var(--fs-xs);
  color: var(--text-subtle);
}

/* ===== 首页 proof strip（保留兼容）===== */
.home-proof-strip {
  margin-top: var(--space-md);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-xs);
  max-width: 760px;
}
.home-proof-item {
  padding: 10px 12px;
  border: 1px solid var(--white-10);
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.055);
  color: var(--white-60);
  font-size: var(--fs-xs);
  line-height: var(--lh-normal);
}
.home-proof-item strong {
  display: block;
  margin-bottom: 3px;
  color: var(--white);
  font-family: var(--font-heading);
  font-size: var(--fs-sm);
}

/* ===== factory evidence（旧版兼容）===== */
.factory-evidence-section {
  padding: var(--space-xl) 0;
  background: var(--white);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.evidence-panel {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: var(--space-lg);
  align-items: stretch;
  background: var(--bg-2nd);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,.06), 0 4px 12px rgba(0,0,0,.04);
}
.evidence-lead {
  padding: var(--space-lg);
  background: linear-gradient(135deg, #F7F8FA, #FFFFFF);
}
.evidence-lead .section-label {
  background: var(--accent-light);
  color: var(--accent);
  border-color: rgba(var(--accent-rgb),.20);
}
.evidence-lead h2 { color: var(--text-title); }
.evidence-lead p { color: var(--text-body); }
.evidence-checklist {
  margin-top: var(--space-md);
  display: grid;
  gap: 8px;
}
.evidence-checklist li {
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  background: var(--accent-light);
  color: var(--text-body);
}
.evidence-board {
  padding: var(--space-lg);
  display: grid;
  gap: var(--space-sm);
}
.evidence-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-md);
  padding: var(--space-sm);
  border-radius: var(--radius-md);
  background: var(--bg-2nd);
  border: 1px solid var(--border-soft);
}
.evidence-row strong {
  color: var(--text-title);
  font-family: var(--font-heading);
}
.evidence-row p {
  margin-top: 4px;
  color: var(--text-body);
  font-size: var(--fs-sm);
  line-height: var(--lh-loose);
}
.evidence-metric {
  min-width: 116px;
  text-align: right;
  color: var(--accent);
  font-family: var(--font-mono);
  font-weight: 800;
  font-size: var(--fs-lg);
}

/* ===== 兼容旧版 v4 类名（保留）===== */
.hero-stats-bar.v4-compact {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: var(--space-lg);
}
.hero-aside-proof {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 10px;
}
.hero-aside-proof span {
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,.08);
  color: var(--white-60);
  border: 1px solid var(--white-10);
  font-size: 11px;
  line-height: 1.45;
}
.contact-lite-note {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: var(--space-sm) 0 var(--space-md);
}
.contact-lite-note span {
  padding: 6px 10px;
  border-radius: var(--radius-pill);
  background: var(--bg-2nd);
  border: 1px solid var(--border-soft);
  color: var(--accent);
  font-size: var(--fs-xs);
  font-weight: 700;
}
.contact-form-card.v4-lite .optional-row { opacity: .86; }

/* ===== 响应式 ===== */
@media(max-width:1024px) {
  .ind-dashboard-grid { grid-template-columns: repeat(2, 1fr); }
}
@media(max-width:900px) {
  .symptom-grid,
  .method-timeline { grid-template-columns: 1fr; }
  .triage-panel { grid-template-columns: 1fr; }
}
@media(max-width:768px) {
  .hero-trust-strip { grid-template-columns: 1fr; gap: var(--space-sm); }
  .trust-item strong { font-size: var(--fs-h3); }
  .home-proof-strip,
  .hero-aside-proof,
  .evidence-panel { grid-template-columns: 1fr; }
  .hero-stats-bar.v4-compact { grid-template-columns: repeat(2, 1fr); }
  .evidence-row { grid-template-columns: 1fr; }
  .evidence-metric { text-align: left; }
  .dark-zone-main h2 { font-size: var(--fs-h3); }
  .dz-step { flex-direction: column; gap: var(--space-sm); }
  .comp-wrap::after { display: block; }
  .pain-action-grid { grid-template-columns: 1fr; }
}
@media(max-width:480px) {
  .ind-dashboard-grid { grid-template-columns: 1fr; }
  .cta-process-compact { flex-direction: column; align-items: stretch; gap: 8px; }
  .cta-step-arrow { transform: rotate(90deg); text-align: center; }
  .cta-step { justify-content: center; }
  .home-hero-sub { margin-bottom: var(--space-md); }
  .home-proof-item { padding: 9px 10px; }
}