/* ============================================================
   ProcessPort 化工港 · 设计系统 Warm Copper
   暖石墨 + 铜金主色；主色本身是暖色，故风险信号色改用「告警红」，
   只用于风险与延期。语义色为避让暖铜主色做了重排（warning→亮金黄、alert→鲜红、danger→暗砖红）。
   ============================================================ */

:root {
  color-scheme: light;

  /* 深色面（暖石墨） */
  --ink-deep: #26201A;
  --ink-deep-2: #33291F;

  /* 主色（铜金） */
  --primary: #C67A33;
  --primary-hover: #A9631F;
  --primary-soft: #F6ECDD;
  --primary-ink: #96530F;

  /* 表面 */
  --surface-page: #F5F7FA;
  --surface-card: #FFFFFF;
  --surface-sunken: #EDF1F6;

  /* 文字 */
  --text-main: #0F1E2E;
  --text-muted: #46546A;
  --text-subtle: #647085;
  --text-inverse: #F1EAE1;

  /* 描边 */
  --border: #DCE4EE;
  --border-strong: #C4D0E0;

  /* 语义色（避让暖铜主色：warning 移到更亮的金黄，与铜拉开明度） */
  --success: #1F9E6E;
  --success-soft: #E6F5EF;
  --success-ink: #0F7A55;
  --warning: #E4B23A;
  --warning-soft: #FBF3DE;
  --warning-ink: #7A5711;
  --danger: #A83B32;
  --danger-soft: #F7E7E5;
  --danger-ink: #8E2C23;

  /* 告警红 —— 主色已是暖色，风险信号改用鲜红，只用于风险与延期；比 danger 更鲜更跳 */
  --alert: #DB3B2F;
  --alert-soft: #FBE9E7;
  --alert-ink: #B12A1F;

  /* 形状 */
  --radius-card: 6px;
  --radius-control: 4px;
  --radius-pill: 999px;

  /* 阴影 */
  --shadow-xs: 0 1px 2px rgba(15, 30, 46, .06);
  --shadow-card: 0 4px 16px rgba(15, 30, 46, .07);
  --shadow-float: 0 12px 32px rgba(15, 30, 46, .14);

  /* 字体 */
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC",
               "Microsoft YaHei", "Segoe UI", Roboto, sans-serif;
  --font-mono: "SF Mono", "SFMono-Regular", ui-monospace, Menlo, Consolas, monospace;

  /* 字号阶梯（完整梯级：此前 15/18/20/28 被引用却未定义，导致该处 var() 失效回落到继承值） */
  --fs-9: 9px;   --fs-10: 10px; --fs-11: 11px; --fs-12: 12px;
  --fs-13: 13px; --fs-14: 14px; --fs-15: 15px; --fs-16: 16px;
  --fs-18: 18px; --fs-19: 19px; --fs-20: 20px; --fs-24: 24px;
  --fs-28: 28px; --fs-32: 32px; --fs-44: 44px;

  /* 主色上的高对比墨字（铜底按钮/高亮项文字）；on-dark 正文统一走 --text-inverse */
  --primary-contrast: #201509;
  /* 数字护照“在线/有效”指示绿（区别于语义 success，仅用于护照状态点） */
  --accent-live: #4FD1A5;

  /* 图纸网格（深色面叠加用） */
  --blueprint-grid:
    linear-gradient(rgba(198, 122, 51, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(198, 122, 51, .08) 1px, transparent 1px);
  --blueprint-grid-size: 32px 32px;

  /* 尺寸 */
  --nav-height: 62px;
  --console-head-height: 56px;
  --sidebar-width: 220px;
  --container-max: 1180px;

  /* 外壳 A 内容宽度两档：宽档=目录/网格页，窄档=表单/结果/阅读页 */
  --page-wide: 1200px;
  --page-narrow: 960px;
}

/* ---------- reset ---------- */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

body {
  font-family: var(--font-sans);
  background: var(--surface-page);
  color: var(--text-main);
  font-size: var(--fs-14);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
a:hover { color: var(--primary); }
img { display: block; max-width: 100%; }
button { font: inherit; cursor: pointer; }
h1, h2, h3, h4 { margin: 0 0 .4em; font-weight: 600; line-height: 1.28; }
h1 { font-size: var(--fs-32); }
h2 { font-size: var(--fs-24); }
h3 { font-size: var(--fs-19); }
h4 { font-size: var(--fs-16); }
p { margin: 0 0 .8em; }
table { border-collapse: collapse; width: 100%; }

/* ---------- 排版工具 ---------- */
.num { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.muted { color: var(--text-muted); }
.subtle { color: var(--text-subtle); }
.strong { font-weight: 600; }
.small { font-size: var(--fs-12); }
.tiny { font-size: var(--fs-11); }
.nowrap { white-space: nowrap; }
.center { text-align: center; }
.right { text-align: right; }
.eyebrow {
  font-family: var(--font-mono);
  font-size: var(--fs-10);
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: var(--primary);
}

/* ---------- 布局工具 ---------- */
.container { max-width: var(--container-max); margin: 0 auto; padding: 0 24px; }
.section { padding: 48px 0; }
.grid { display: grid; gap: 16px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
.row { display: flex; align-items: center; gap: 12px; }
.row-wrap { display: flex; flex-wrap: wrap; gap: 12px; }
.col { display: flex; flex-direction: column; gap: 12px; }
.between { justify-content: space-between; }
.fill { flex: 1; min-width: 0; }
.spacer { margin-top: auto; }

@media (max-width: 1080px) {
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
}

/* ---------- 基础控件 ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 8px 16px; border-radius: var(--radius-control);
  border: 1px solid transparent; font-size: var(--fs-13); font-weight: 500;
  transition: background .15s, border-color .15s, color .15s;
}
.btn-primary { background: var(--primary); color: var(--primary-contrast); font-weight: 600; }
.btn-primary:hover { background: var(--primary-hover); color: #fff; }
.btn-ghost { border-color: var(--border-strong); color: var(--text-main); background: var(--surface-card); }
.btn-ghost:hover { border-color: var(--primary); color: var(--primary); }
.btn-on-dark { border-color: rgba(255, 255, 255, .28); color: var(--text-inverse); }
.btn-on-dark:hover { border-color: var(--primary); color: var(--primary); }

.card {
  background: var(--surface-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-xs);
}

.chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 9px; border-radius: var(--radius-control);
  border: 1px solid var(--border); background: var(--surface-card);
  font-size: var(--fs-11); color: var(--text-muted);
}
.chip-on { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-ink); font-weight: 600; }

/* 表格内/正文里的行内链接（此前 account-link 与 ops-pp__link 各自复刻同一样式） */
.link { color: var(--primary-ink); }
.link:hover { text-decoration: underline; }

/* ---------- 状态语义 ---------- */
.tone-success { color: var(--success-ink); }
.tone-warning { color: var(--warning-ink); }
.tone-danger { color: var(--danger-ink); }

.badge-success { background: var(--success-soft); color: var(--success-ink); border: 1px solid var(--success); }
.badge-warning { background: var(--warning-soft); color: var(--warning-ink); border: 1px solid var(--warning); }
.badge-danger  { background: var(--danger-soft);  color: var(--danger-ink);  border: 1px solid var(--danger); }
.badge-success, .badge-warning, .badge-danger, .badge-alert {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 2px 8px; border-radius: var(--radius-control);
  font-size: var(--fs-11); font-weight: 600;
}

/* 告警橙：仅风险与延期 */
.badge-alert,
.tone-alert,
.is-delayed,
.is-overdue,
.is-missing,
.risk-flag {
  color: var(--alert-ink);
}
.badge-alert, .risk-flag {
  background: var(--alert-soft);
  border: 1px solid var(--alert);
}
.is-delayed, .is-overdue, .is-missing { font-weight: 600; }
.dot-alert { background: var(--alert); }

/* ============================================================
   外壳 A · 前台（营销 + 买家）
   ============================================================ */
.site-header { position: sticky; top: 0; z-index: 40; }
.site-header__inner {
  display: flex; align-items: center; gap: 22px; height: var(--nav-height);
}
.site-header--light {
  background: var(--surface-card);
  border-bottom: 1px solid var(--border);
}
.site-header--dark {
  background: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, .10);
}
.site-header--dark,
.site-header--dark a { color: var(--text-inverse); }

.wordmark { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-16); font-weight: 600; }
.wordmark__mark {
  width: 18px; height: 18px; border: 2px solid var(--primary);
  border-radius: 3px; position: relative; flex: none;
}
.wordmark__mark::before, .wordmark__mark::after {
  content: ""; position: absolute; background: var(--primary);
}
.wordmark__mark::before { left: 2px; top: 6px; width: 10px; height: 2px; }
.wordmark__mark::after  { left: 6px; top: 2px; width: 2px; height: 10px; }
.wordmark__accent { color: var(--primary); }
.wordmark__suffix { font-weight: 400; opacity: .55; font-size: var(--fs-13); }

.site-nav { display: flex; align-items: center; gap: 22px; flex: 1; }
.site-nav__link { font-size: var(--fs-13); padding: 20px 0; }
.site-nav__link.is-active { box-shadow: inset 0 -2px 0 var(--primary); font-weight: 600; }

.site-header__actions { display: flex; align-items: center; gap: 12px; }
.site-header__login { font-size: var(--fs-13); }

.role-switch, .locale-switch, .ws-switch {
  display: flex; gap: 2px; padding: 2px;
  border-radius: var(--radius-control);
  background: var(--surface-sunken); border: 1px solid var(--border);
}
.site-header--dark .role-switch,
.site-header--dark .locale-switch {
  background: rgba(255, 255, 255, .10); border-color: rgba(255, 255, 255, .16);
}
.role-switch__item, .locale-switch__item, .ws-switch__item {
  padding: 3px 9px; border-radius: 3px; border: 0; background: transparent;
  font-size: var(--fs-11); color: var(--text-muted); line-height: 1.7;
}
.site-header--dark .role-switch__item,
.site-header--dark .locale-switch__item { color: rgba(232, 239, 247, .66); }
.role-switch__item.is-active, .locale-switch__item.is-active, .ws-switch__item.is-active {
  background: var(--primary-soft); color: var(--primary-ink); font-weight: 600;
}
.site-header--dark .role-switch__item.is-active,
.site-header--dark .locale-switch__item.is-active {
  background: var(--primary); color: var(--primary-contrast);
}

.site-footer { background: var(--ink-deep); color: rgba(232, 239, 247, .62); padding: 36px 0 26px; }
.site-footer a { color: rgba(232, 239, 247, .78); }
.site-footer__inner { display: flex; flex-direction: column; gap: 16px; }
.site-footer__brand .wordmark { color: var(--text-inverse); }
.site-footer__tagline { margin: 8px 0 0; font-size: var(--fs-12); }
.site-footer__links { display: flex; flex-wrap: wrap; gap: 20px; font-size: var(--fs-13); }
.site-footer__rights {
  margin: 0; padding-top: 14px; font-size: var(--fs-11);
  border-top: 1px solid rgba(255, 255, 255, .10);
}

/* ============================================================
   外壳 B · 控制台（供应商 / 运营）
   ============================================================ */
.console { display: flex; min-height: 100vh; }

.console-nav {
  width: var(--sidebar-width); flex: none;
  background: var(--ink-deep); color: var(--text-inverse);
  display: flex; flex-direction: column; padding: 16px 0;
}
.console-nav a { color: inherit; }
.console-nav__brand { padding: 0 16px 14px; border-bottom: 1px solid rgba(255, 255, 255, .10); }
.console-nav__group {
  padding: 14px 16px 6px; font-size: var(--fs-9);
  letter-spacing: 1.6px; text-transform: uppercase; opacity: .42;
}
.console-nav__list { display: flex; flex-direction: column; }
.console-nav__item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 16px; font-size: var(--fs-13);
  border-left: 2px solid transparent; opacity: .78;
}
.console-nav__item i { width: 15px; text-align: center; font-size: var(--fs-12); }
.console-nav__item:hover { opacity: 1; background: rgba(255, 255, 255, .05); color: inherit; }
.console-nav__item.is-active {
  opacity: 1; background: rgba(198, 122, 51, .18);
  border-left-color: var(--primary); color: #E8B87F; font-weight: 500;
}
.console-nav__back {
  margin-top: auto; padding: 14px 16px 0; font-size: var(--fs-12); opacity: .45;
  border-top: 1px solid rgba(255, 255, 255, .08);
}
.console-nav__back:hover { opacity: .85; }

.console-main { flex: 1; min-width: 0; display: flex; flex-direction: column; background: var(--surface-page); }
.console-head {
  height: var(--console-head-height); flex: none;
  display: flex; align-items: center; gap: 14px; padding: 0 24px;
  background: var(--surface-card); border-bottom: 1px solid var(--border);
}
.console-head__title { margin: 0; font-size: var(--fs-16); font-weight: 600; }
.console-head__actions { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.console-head__who { display: flex; align-items: center; gap: 7px; font-size: var(--fs-12); color: var(--text-muted); }
.console-head__dot { width: 7px; height: 7px; border-radius: var(--radius-pill); background: var(--success); }
.console-body { padding: 24px; flex: 1; }

/* ---------- 外壳 A 内容容器（统一宽度/居中/内边距，标题缩进由此一致）----------
   此前各页面各自设 .*-page 的 max-width/margin/padding，值散乱（1200/1100/1000/960/900/无），
   还有 account/join/logistics/passport/tracking/parts 漏设导致全宽贴边、compliance/order 漏 margin 靠左。
   统一在此治理：新增外壳 A 页面时把根类并入下面的选择器组即可，不要再在页面 CSS 里写根容器宽度。
   home（长页 flush）与 login（居中卡片）是有意的例外，不并入。 */
.equipment-page, .projects-page, .parts-page, .certificates-page, .capability-page,
.logistics-page, .passport-page, .tracking-page, .account-page, .join-page, .rfq-page,
.solutions-page, .selection-page, .compliance-page, .order-page, .ed-page {
  width: 100%; max-width: var(--page-wide); margin: 0 auto; padding: 32px 24px 64px;
}
/* 窄档：表单/结果/阅读类页面 */
.selection-page, .compliance-page, .order-page, .ed-page { max-width: var(--page-narrow); }

/* ---------- 页面头（外壳 A）/ 控制台引导（外壳 B）/ KPI 行 ----------
   这些是跨页共享的结构原语，统一定义在此，避免散落于各叶子页面 CSS 造成分歧。 */
.page-head { margin-bottom: 24px; }
.page-title { font-size: var(--fs-24); color: var(--text-main); }
.page-lead { margin-top: 8px; max-width: 70ch; color: var(--text-muted); }
.console-lead { color: var(--text-muted); margin-bottom: 16px; max-width: 70ch; }
.kpi-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 16px; margin-bottom: 20px; }

/* 内容卡片面板：控制台分区与买家详情页的分区容器。
   此前 14 个 *-block 各自复刻同一套外壳（padding 18/20/24 漂移、h2 尺寸不一），此处统一为单一来源。
   新增分区时把类名并入下面两组选择器即可，不要再在页面 CSS 里重复外壳与 h2 覆盖。 */
.account-block, .ed-block, .join-block, .logistics-block, .ops-home-block,
.order-block, .parts-block, .passport-block, .rfq-block, .risk-block,
.sup-home-block, .sup-prod-block, .sup-qual-block, .tower-block {
  background: var(--surface-card); border: 1px solid var(--border);
  border-radius: var(--radius-card); box-shadow: var(--shadow-xs);
  padding: 20px; margin-bottom: 20px;
}
.account-block h2, .ed-block h2, .join-block h2, .logistics-block h2, .ops-home-block h2,
.order-block h2, .parts-block h2, .passport-block h2, .rfq-block h2, .risk-block h2,
.sup-home-block h2, .sup-prod-block h2, .sup-qual-block h2, .tower-block h2 {
  font-size: var(--fs-16); margin: 0 0 14px; color: var(--text-main);
}

/* ============================================================
   共享组件
   ============================================================ */
.spec-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); gap: 8px; }
.spec-grid__cell {
  background: var(--surface-card); border: 1px solid var(--border);
  border-left: 2px solid var(--ink-deep); border-radius: var(--radius-control); padding: 7px 10px;
}
.spec-grid__label { font-size: var(--fs-10); letter-spacing: .6px; color: var(--text-subtle); text-transform: uppercase; }
.spec-grid__value { font-size: var(--fs-13); margin-top: 2px; }
.spec-grid__unit { color: var(--text-muted); margin-left: 4px; font-size: var(--fs-11); }

.cert-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.cert-badge {
  padding: 3px 9px; border-radius: var(--radius-control);
  border: 1px solid var(--border-strong); background: var(--surface-card);
  font-family: var(--font-mono); font-size: var(--fs-11); color: var(--text-main);
}

.tier-badge {
  display: inline-flex; padding: 2px 8px; border-radius: var(--radius-control);
  font-size: var(--fs-11); font-weight: 600; border: 1px solid;
}
.tier-badge--standard  { background: var(--surface-sunken); color: var(--text-muted); border-color: var(--border); }
.tier-badge--certified { background: var(--primary-soft);  color: var(--primary-ink); border-color: var(--primary); }
.tier-badge--preferred { background: var(--success-soft);  color: var(--success-ink); border-color: var(--success); }
.tier-badge--cobrand   { background: var(--ink-deep);      color: var(--text-inverse); border-color: var(--ink-deep); }

.timeline { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0; }
.timeline__node { display: flex; align-items: center; gap: 7px; padding-right: 16px; position: relative; font-size: var(--fs-12); }
.timeline__node::after {
  content: ""; position: absolute; right: 4px; top: 50%; width: 8px; height: 1px; background: var(--border);
}
.timeline__node:last-child::after { display: none; }
.timeline__dot { width: 9px; height: 9px; border-radius: var(--radius-pill); background: var(--border-strong); flex: none; }
.timeline__meta { color: var(--text-subtle); font-size: var(--fs-11); }
.timeline__node--done    .timeline__dot { background: var(--success); }
.timeline__node--done    .timeline__label { color: var(--text-muted); }
.timeline__node--current .timeline__dot { background: var(--primary); box-shadow: 0 0 0 3px rgba(198, 122, 51, .22); }
.timeline__node--current .timeline__label { font-weight: 600; }
.timeline__node--pending .timeline__label { color: var(--text-subtle); }
/* 延期节点 —— 告警橙的合法用点 */
.timeline__node--delayed .timeline__dot { background: var(--alert); box-shadow: 0 0 0 3px var(--alert-soft); }
.timeline__node--delayed .timeline__label { color: var(--alert-ink); font-weight: 600; }

.steps { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 18px; }
.steps__item { display: flex; align-items: center; gap: 7px; font-size: var(--fs-12); }
.steps__index {
  width: 20px; height: 20px; border-radius: var(--radius-pill);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: var(--fs-11); border: 1px solid var(--border-strong); color: var(--text-muted);
}
.steps__item--done .steps__index { background: var(--success); border-color: var(--success); color: #fff; }
.steps__item--done .steps__label { color: var(--text-muted); }
.steps__item--current .steps__index { background: var(--primary); border-color: var(--primary); color: var(--primary-contrast); }
.steps__item--current .steps__label { font-weight: 600; }
.steps__item--todo .steps__label { color: var(--text-subtle); }

.kpi-card {
  background: var(--surface-card); border: 1px solid var(--border);
  border-radius: var(--radius-card); padding: 12px 14px;
}
.kpi-card__label { font-size: var(--fs-10); letter-spacing: .6px; color: var(--text-subtle); text-transform: uppercase; }
.kpi-card__value { font-size: var(--fs-24); font-weight: 600; margin-top: 3px; }
.kpi-card__delta { font-size: var(--fs-11); margin-top: 2px; }

.data-table { font-size: var(--fs-12); }
.data-table__th {
  text-align: left; font-weight: 500; color: var(--text-subtle);
  padding: 7px 8px; border-bottom: 1px solid var(--border); white-space: nowrap;
}
.data-table__td { padding: 8px; border-bottom: 1px solid var(--surface-sunken); }
.data-table__row:hover { background: var(--surface-sunken); }
.data-table .right { text-align: right; }

/* 开发脚手架 —— 阶段 5 结束后应无人引用 */
.scaffold { padding: 40px; text-align: center; }
.scaffold__badge {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: var(--fs-11); color: var(--text-subtle);
  border: 1px dashed var(--border-strong); border-radius: var(--radius-control);
  padding: 4px 10px; margin-bottom: 14px;
}
.scaffold__title { margin: 0 0 6px; }
.scaffold__body { margin: 0; color: var(--text-muted); }

/* 应用容器与 toast */
.app-surface { display: block; min-height: 60vh; }
.app-surface--flush { padding: 0; }

/**
 * 首页外壳：hero 现在是自带全屏大图的沉浸式段，透明导航直接叠在图上，
 * 不再需要页面级深色带与图纸网格铺底（已去除，配合 home.css 的沉浸式 hero）。
 */
.shell-site--hero { background: var(--surface-page); }

.toast {
  position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%);
  background: var(--ink-deep); color: var(--text-inverse);
  padding: 10px 18px; border-radius: var(--radius-control);
  font-size: var(--fs-13); box-shadow: var(--shadow-float); z-index: 90;
}

/**
 * [hidden] 必须真的隐藏。
 * UA 样式表里的 `[hidden]{display:none}` 会被作者样式里任何 display 声明盖掉
 * （作者样式优先级高于 UA，与选择器特异性无关）——本项目的 `.console{display:flex}`
 * 就踩过这个坑：外壳明明带着 hidden 属性，却照样占满一屏。
 */
[hidden] { display: none !important; }

/* ---------- 展示组件 ---------- */
.photo-card {
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--surface-card); border: 1px solid var(--border);
  border-radius: var(--radius-card); transition: border-color .15s, box-shadow .15s;
}
.photo-card:hover { border-color: var(--primary); box-shadow: var(--shadow-card); color: inherit; }
.photo-card__figure { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--surface-sunken); }
.photo-card--tall .photo-card__figure { aspect-ratio: 3 / 4; }
.photo-card__figure img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.photo-card:hover .photo-card__figure img { transform: scale(1.03); }
.photo-card__body { display: block; padding: 11px 13px; }
.photo-card__title { display: block; font-size: var(--fs-13); font-weight: 600; }
.photo-card__meta { display: block; font-size: var(--fs-11); color: var(--text-muted); margin-top: 3px; }

.section-head { margin-bottom: 24px; max-width: 720px; }
.section-head__title { margin: 6px 0 0; }
.section-head__lead { margin: 10px 0 0; color: var(--text-muted); font-size: var(--fs-16); line-height: 1.65; }
.section-head--dark .section-head__title { color: var(--text-inverse); }
.section-head--dark .section-head__lead { color: rgba(232, 239, 247, .72); }

.stat-band { display: flex; flex-wrap: wrap; }
.stat-band__item {
  flex: 1 1 0; min-width: 140px; padding: 12px 20px;
  border-right: 1px solid rgba(255, 255, 255, .10);
}
.stat-band__item:last-child { border-right: 0; }
.stat-band__value { font-size: var(--fs-24); font-weight: 600; line-height: 1.2; }
.stat-band__unit { font-size: var(--fs-12); opacity: .62; margin-top: 2px; }
.stat-band__note { font-size: var(--fs-10); opacity: .45; margin-top: 3px; }

/* ---------- 工艺流程图 ---------- */
.process-flow { display: block; width: 100%; height: auto; background: var(--surface-card); border: 1px solid var(--border); border-radius: var(--radius-card); padding: 24px; }
.process-flow__line { stroke: var(--primary); stroke-width: 2; }
.process-flow__arrow { fill: var(--primary); }
.process-flow__unit-box { text-decoration: none; }
.process-flow__rect { fill: var(--primary-soft); stroke: var(--primary); stroke-width: 1.5; }
.process-flow__text { font-size: var(--fs-12); font-weight: 500; text-anchor: middle; dominant-baseline: middle; }
.process-flow__unit-box:hover .process-flow__rect { fill: var(--primary); }
.process-flow__unit-box:hover .process-flow__text { fill: white; }
.process-flow-empty { padding: 40px 20px; text-align: center; color: var(--text-muted); }

/* ---------- 能力网格 ---------- */
.capability-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px; }
.capability-card { background: var(--surface-card); border: 1px solid var(--border); border-radius: var(--radius-card); padding: 16px; transition: box-shadow .15s; }
.capability-card:hover { box-shadow: var(--shadow-card); }
.capability-card__title { margin: 0 0 12px; font-size: var(--fs-14); font-weight: 600; }
.capability-card__specs { margin: 0; padding: 0 0 0 20px; font-size: var(--fs-12); color: var(--text-muted); line-height: 1.6; }
.capability-card__specs li { margin-bottom: 4px; }

/* ---------- 证书列表与验真 ---------- */
.cert-list { display: flex; flex-direction: column; gap: 24px; }
.cert-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.cert-card { background: var(--surface-card); border: 1px solid var(--border); border-radius: var(--radius-card); padding: 16px; }
.cert-card__header { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; }
.cert-card__name { margin: 0; font-size: var(--fs-14); font-weight: 600; }
.cert-card__number { font-size: var(--fs-11); color: var(--text-muted); font-family: var(--font-mono); }
.cert-card__issuer { font-size: var(--fs-12); color: var(--text-subtle); margin-bottom: 6px; }
.cert-card__expiry { font-size: var(--fs-11); color: var(--text-muted); margin-top: 6px; }
.cert-verify-form { background: var(--surface-sunken); border-radius: var(--radius-card); padding: 20px; display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-start; }
.cert-verify__input { flex: 1; min-width: 150px; padding: 8px 12px; border: 1px solid var(--border); border-radius: var(--radius-control); font-size: var(--fs-13); }
.cert-verify__button { padding: 8px 20px; background: var(--primary); color: white; border: none; border-radius: var(--radius-control); font-weight: 500; cursor: pointer; transition: background .15s; }
.cert-verify__button:hover { background: var(--primary-hover); }
.cert-verify__result { width: 100%; margin-top: 12px; padding: 12px; border-radius: var(--radius-control); font-size: var(--fs-12); display: none; }
.cert-verify__result.success { display: block; background: var(--success-soft); color: var(--success-ink); }
.cert-verify__result.error { display: block; background: var(--danger-soft); color: var(--danger-ink); }

/* ---- 阶段 1C 组件 ---- */
.filter-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.filter-chip {
  padding: 6px 14px; border: 1px solid var(--border); border-radius: var(--radius-pill);
  background: var(--surface-card); color: var(--text-muted); cursor: pointer;
  font-size: var(--fs-13); line-height: 1.4;
}
.filter-chip.is-active { background: var(--primary-soft); color: var(--primary-ink); border-color: var(--primary); }

.metric-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; }
.metric-grid__item { padding: 16px; background: var(--surface-card); border: 1px solid var(--border); border-radius: var(--radius-card); }
.metric-grid__value { font-size: var(--fs-24); color: var(--text-main); font-weight: 600; }
.metric-grid__label { margin-top: 4px; font-size: var(--fs-13); color: var(--text-subtle); }

.compare-tray {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
  display: flex; align-items: center; gap: 16px; padding: 12px 24px;
  background: var(--ink-deep); color: #fff; box-shadow: var(--shadow-card);
}
.compare-tray.hidden { display: none; }
.compare-tray__title { font-size: var(--fs-13); opacity: .8; white-space: nowrap; }
.compare-tray__chips { display: flex; flex-wrap: wrap; gap: 8px; flex: 1; }
.compare-tray__chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; background: var(--ink-deep-2); border-radius: var(--radius-pill); font-size: var(--fs-13); }
.compare-tray__remove { background: none; border: none; color: #fff; cursor: pointer; font-size: var(--fs-16); line-height: 1; }
.compare-tray__clear { padding: 6px 14px; background: var(--primary); border: none; border-radius: var(--radius-control); color: #fff; cursor: pointer; }

/* ---- 阶段 2 · 偏差表 ---- */
.deviation-table { width: 100%; border-collapse: collapse; }
.deviation-table th, .deviation-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--border); font-size: var(--fs-14); vertical-align: top; }
.deviation-table th { color: var(--text-subtle); font-weight: 500; }
.deviation-row__note { color: var(--text-muted); }
.deviation-status { display: inline-block; padding: 2px 10px; border-radius: var(--radius-pill); font-size: var(--fs-12); }
.deviation-status--accepted { background: var(--success-soft); color: var(--success-ink); }
.deviation-status--pending { background: var(--warning-soft); color: var(--warning-ink); }
.deviation-status--rejected { background: var(--danger-soft); color: var(--danger-ink); }

/* ---- 阶段 2 · 线索评分与接力轨 ---- */
.lead-score { display: grid; gap: 4px; grid-template-columns: 1fr auto; align-items: center; }
.lead-score__dim { display: grid; grid-template-columns: 72px 1fr 20px; gap: 8px; align-items: center; grid-column: 1 / -1; }
.lead-score__label { font-size: var(--fs-12); color: var(--text-subtle); }
.lead-score__bar { height: 6px; background: var(--surface-sunken); border-radius: var(--radius-pill); overflow: hidden; }
.lead-score__fill { display: block; height: 100%; background: var(--primary); }
.lead-score__val { font-size: var(--fs-12); color: var(--text-main); text-align: right; }
.lead-score__total { grid-column: 1 / -1; justify-self: end; font-size: var(--fs-16); color: var(--primary-ink); font-weight: 600; }

.relay-track { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; }
.relay-stage { display: flex; flex-direction: column; gap: 2px; min-width: 96px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radius-card); background: var(--surface-card); border-top: 3px solid var(--border-strong); }
.relay-stage--done { border-top-color: var(--success); }
.relay-stage--current { border-top-color: var(--primary); }
.relay-stage--pending { opacity: .6; }
.relay-stage--overdue { border-top-color: var(--alert); background: var(--alert-soft); }
.relay-stage__dept { font-weight: 600; color: var(--text-main); font-size: var(--fs-14); }
.relay-stage__owner { font-size: var(--fs-12); color: var(--text-muted); }
.relay-stage__dwell { font-size: var(--fs-12); color: var(--text-subtle); }
.relay-stage__overdue { font-size: var(--fs-11); color: var(--alert-ink); font-weight: 600; }

/* 国别合规矩阵组件 */
.compliance-matrix { display: grid; gap: 12px; }
.compliance-matrix__group { padding: 14px 16px; background: var(--surface-card); border: 1px solid var(--border); border-radius: var(--radius-card); }
.compliance-matrix__group--risk { background: var(--alert-soft); border-color: var(--alert); }
.compliance-matrix__label { font-size: var(--fs-12); color: var(--text-subtle); margin-bottom: 8px; letter-spacing: .04em; text-transform: uppercase; }
.compliance-matrix__group--risk .compliance-matrix__label { color: var(--alert-ink); }
.compliance-matrix__items { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; }
.compliance-matrix__items li { font-size: var(--fs-14); color: var(--text-main); }
.compliance-matrix__group--risk .compliance-matrix__items li { color: var(--alert-ink); }

/* 付款节点条组件 */
.milestone-pay { list-style: none; padding: 0; margin: 0; display: flex; gap: 4px; flex-wrap: wrap; }
.milestone { flex: 1 1 120px; min-width: 120px; padding: 12px; border: 1px solid var(--border); border-radius: var(--radius-card); background: var(--surface-card); display: grid; gap: 4px; position: relative; }
.milestone__dot { width: 10px; height: 10px; border-radius: 50%; background: var(--border-strong); }
.milestone--done .milestone__dot { background: var(--success); }
.milestone--current .milestone__dot { background: var(--primary); }
.milestone--current { border-color: var(--primary); }
.milestone__label { font-size: var(--fs-14); color: var(--text-main); }
.milestone__pct { font-size: var(--fs-16); color: var(--text-main); font-weight: 600; }
.milestone__amount { font-size: var(--fs-12); color: var(--text-muted); }
.milestone__bond { font-size: var(--fs-12); color: var(--primary-ink); background: var(--primary-soft); border-radius: var(--radius-pill); padding: 1px 8px; justify-self: start; }

/* ---- 数字护照卡 ---- */
.passport-card { display:flex; gap:16px; padding:16px; background:var(--surface-card); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-xs); }
.passport-card__qr { flex:0 0 auto; fill:var(--ink-deep); background:#fff; padding:6px; border:1px solid var(--border); border-radius:var(--radius-control); }
.passport-card__body { display:flex; flex-direction:column; gap:6px; }
.passport-card__row { display:flex; gap:10px; align-items:baseline; }
.passport-card__k { color:var(--text-subtle); font-size:var(--fs-12); min-width:56px; }
.passport-card__v { color:var(--text-main); font-size:var(--fs-14); }
.passport-card__family { color:var(--text-muted); font-size:var(--fs-13); }
.passport-card__warranty { align-self:flex-start; margin-top:4px; padding:2px 10px; border-radius:var(--radius-pill); font-size:var(--fs-12); }
.passport-card__warranty--active { background:var(--success-soft); color:var(--success-ink); }
.passport-card__warranty--expired { background:var(--surface-sunken); color:var(--text-subtle); }

/* ---- 质量档案 ---- */
.quality-dossier__meter { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.quality-dossier__meter-k { color:var(--text-subtle); font-size:var(--fs-12); }
.quality-dossier__bar { flex:1; height:8px; background:var(--surface-sunken); border-radius:var(--radius-pill); overflow:hidden; }
.quality-dossier__fill { display:block; height:100%; background:var(--success); }
.quality-dossier__pct { color:var(--text-main); font-size:var(--fs-13); }
.quality-dossier__list { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:8px; }
.quality-doc { display:flex; align-items:center; gap:8px; padding:8px 12px; background:var(--surface-card); border:1px solid var(--border); border-radius:var(--radius-control); font-size:var(--fs-13); }
.quality-doc__dot { width:8px; height:8px; border-radius:50%; background:var(--success); flex:0 0 auto; }
.quality-doc__label { color:var(--text-main); }
.quality-doc__miss { margin-left:auto; font-size:var(--fs-12); }
.quality-doc--missing { border-color:var(--alert); background:var(--alert-soft); }
.quality-doc--missing .quality-doc__dot { background:var(--alert); }
.quality-doc--missing .quality-doc__miss { color:var(--alert-ink); }

/* ---- 可运输性 ---- */
.oversize { display:flex; flex-direction:column; gap:12px; }
.oversize__dims { display:flex; gap:12px; flex-wrap:wrap; }
.oversize__cell { display:flex; flex-direction:column; gap:2px; padding:8px 14px; background:var(--surface-sunken); border-radius:var(--radius-control); }
.oversize__axis { color:var(--text-subtle); font-size:var(--fs-11); }
.oversize__val { color:var(--text-main); font-size:var(--fs-15); }
.oversize__result { display:flex; align-items:center; gap:10px; }
.oversize__mode-k { color:var(--text-subtle); font-size:var(--fs-12); }
.oversize__mode { color:var(--text-main); font-weight:500; }
.oversize__flag { padding:2px 10px; border-radius:var(--radius-pill); font-size:var(--fs-12); }
.oversize__flag--alert { background:var(--alert-soft); color:var(--alert-ink); }