/* Brand-led website pages and the interactive one-to-many deployment map. */

.btn--primary,
.btn--nav { background: var(--color-brand-primary); border-color: var(--color-accent-text); }
.btn--primary:hover,
.btn--nav:hover { background: var(--color-brand-primary-hover); border-color: var(--color-brand-primary-hover); }
.site-nav__link[aria-current='page'] { color: var(--color-accent-text); }
.site-nav__link[aria-current='page']::after { transform: scaleX(1); }
.site-nav__link::after { background: var(--color-brand-primary); }
.link-arrow { color: var(--color-accent-text); }
.skip-link { background: var(--color-brand-primary); }

.page-hero {
  position: relative;
  overflow: hidden; /* 排版底纹的轨道比视口宽，必须在这一层裁掉 */
  /* 内距与首页首屏共用同一对 token（tokens.css 的 --hero-pad-block-*）。
     两页首屏高度必须一致，所以这里不能再写自己的 clamp —— 各写一套就是差 180px 的由来。 */
  padding-block: var(--hero-pad-block-top) var(--hero-pad-block-bottom);
  background:
    radial-gradient(ellipse at 86% 12%, color-mix(in srgb, var(--color-brand-primary) 8%, transparent), transparent 33%),
    linear-gradient(180deg, var(--color-bg) 0%, var(--color-surface-tint) 100%);
}
/* 内页首屏的文字层要压在排版底纹之上（底纹是 z-index:0 的兄弟节点）。 */
.page-hero__inner { position: relative; z-index: 1; max-width: 1200px; }
.page-hero__layout {
  display: grid;
  /* 图文各占 50%（全站统一比例） */
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(40px, 5vw, 64px);
}
/* 单列首屏（没有右侧媒体时，目前只有联系页）：
   文案占满内容宽并放宽到 720px —— 联系页的任务是把号码交出去，
   让文案只占半幅会把联系方式推到折线以下。 */
.page-hero__layout--solo { grid-template-columns: minmax(0, 1fr); }
.page-hero__layout--solo .page-hero__copy { max-width: 720px; }
.page-hero__copy { min-width: 0; max-width: 560px; }
.page-hero__eyebrow,
.section-head__eyebrow {
  margin-bottom: 12px;
  color: var(--color-accent-text);
  font-size: 15px;
  font-weight: 600;
}
.page-hero__title {
  /* 与产品页 H1 共用 `--hero-title-*` 一把尺（2026-09-29 一致性）：
     字号/行高/字距与 `.section-head__title--hero` 完全同源。 */
  max-width: 14ch;
  font-size: var(--hero-title-size);
  line-height: var(--hero-title-line);
  letter-spacing: var(--hero-title-tracking);
  font-weight: 650;
  text-wrap: balance;
  white-space: pre-line;
}
.page-hero__body {
  max-width: 50ch;
  margin-top: 16px;
  color: var(--color-secondary);
  font-size: 17px;
  line-height: 1.7;
  text-wrap: pretty;
}
.page-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; margin-top: 26px; }
/* 「本页内容」索引：长页首屏里的一行锚点（config: SITE.pageIndex）。
   视觉上必须**比行动按钮轻得多** —— 它是页内导航，不是行动；
   所以用次文字色 + 小字号 + 竖线分隔，不做成按钮或芯片。
   只配了 pageIndex 的页面才有这一行，短页不出现。 */
.page-index {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid var(--color-border-light);
}
.page-index__label { color: var(--color-secondary); font-size: 12px; font-weight: 600; }
.page-index__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.page-index__item + .page-index__item {
  margin-left: 12px;
  padding-left: 12px;
  border-left: 1px solid var(--color-border-light);
}
.page-index__link {
  color: var(--color-secondary);
  font-size: 13px;
  text-decoration: none;
}
.page-index__link:hover { color: var(--color-accent-text); }
.page-index__link:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.page-hero__art { position: relative; min-width: 0; margin: 0; }
.page-hero__art-frame {
  position: relative;
  aspect-ratio: 547 / 324;
  overflow: hidden;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-media);
  background: var(--color-surface-tint);
  box-shadow: 0 24px 64px var(--palette-shadow-strong);
}
/* 同上：picture 选源但不参与布局，img 的 height: 100% 仍然对着 .page-hero__art-frame 算。 */
.page-hero__art picture { display: contents; }
.page-hero__art img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ── 深色主题下的媒体：压一档亮度 + 浮层降一档不透明度 ────────────────────
 *
 * 站内 11 张素材都是在浅色语境下生成的概念图（无 alpha、整体偏亮）。
 * 深色页面里它们会变成"贴在黑底上的一块亮斑"——图本身没错，是反差太跳。
 * 不改图、不动 `assets/`（那是素材工作，另排期），只做两件事：
 *
 *   1. **压亮度**：`brightness(.86)` 把最亮的一档压下来，比叠一层黑更干净 ——
 *      叠黑会把暗部一起埋掉，整张图变成灰雾；`brightness` 只动亮度曲线。
 *      同时轻微降饱和：亮色图在深底上"过艳"是同一个问题的另一面。
 *   2. **图上的玻璃浮层降一档**：见 tokens.css 的 --color-surface-overlay / -wash。
 *
 * 只作用于 `<img>`：SVG 画的图解（拓扑、工位示意）走的是 CSS 变量，本来就是主题化的，
 * 再压一层会变成"深色下比浅色下更暗"，而不是更协调。 */
[data-theme='dark'] .reference-media img,
[data-theme='dark'] .page-hero__art img,
[data-theme='dark'] .scenario-case-card__media img,
[data-theme='dark'] .home-product__software-frame img,
[data-theme='dark'] .product-lines img {
  filter: brightness(.86) saturate(.94);
}
.page-hero__art-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, var(--color-scrim-weak) 42%, var(--color-scrim-strong));
  pointer-events: none;
}
/* 图片上的说明卡：**首页首屏与内页首屏共用一套**（2026-09-29）。
   两处是同一张图、同一个说明，样式必须是同一份 —— 复制一份出来迟早会漂。
   内页放在 `.page-hero__art`（figure）里，首页放在 `reference-media.js` 渲染的
   视窗里，两者的定位上下文都是 `position: relative` 的媒体容器，所以用同一套
   right/bottom/left 值即可。 */
.page-hero__art-card,
.media-card {
  position: absolute;
  z-index: 1;
  right: clamp(14px, 2vw, 22px);
  bottom: clamp(14px, 2vw, 22px);
  left: clamp(14px, 2vw, 22px);
  display: grid;
  justify-items: center;
  padding: clamp(12px, 1.5vw, 18px) clamp(14px, 1.8vw, 22px);
  border: 1px solid var(--color-glass-border);
  border-radius: var(--radius-control);
  /* AR 玻璃层：去白底，半透明 + 模糊，文字居中浮在画面上 */
  background: var(--color-glass-fill);
  box-shadow: none;
  backdrop-filter: blur(14px) saturate(1.15);
  -webkit-backdrop-filter: blur(14px) saturate(1.15);
  text-align: center;
}
.page-hero__art-kicker,
.media-card__kicker { color: var(--color-on-media-kicker); font-size: 12px; font-weight: 650; }
.page-hero__art-title,
.media-card__title {
  margin-top: 0;
  /* 照片上的说明卡标题：压在图片上，两种主题下都是白字（不跟随主题）。 */
  color: var(--color-on-media);
  font-size: clamp(15px, 1.6vw, 18px);
  line-height: 1.4;
  letter-spacing: -.015em;
  text-align: center;
}
.page-hero__art-detail,
.media-card__detail { margin-top: 6px; color: var(--color-on-media-dim); font-size: 13px; line-height: 1.5; text-align: center; }

.section-head__title { text-wrap: balance; }
.section-head__intro { max-width: 66ch; text-wrap: pretty; }
.site-header__inner { gap: clamp(14px, 2.2vw, 32px); }
.site-nav__list { gap: clamp(14px, 2vw, 28px); }
.brand__logo-slot img { display: block; }

/* 产品页「作业流程」三步：横向流程条，一条渐变细线串起三个序号节点。
   2026-09-29 随 `processSection` 与 config 的 `extension` 段一起还原 ——
   产品页分区顺序是固定契约（见 pages.js 该分支的注释）。 */
.process-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  position: relative;
  gap: clamp(24px, 4vw, 56px);
  margin-top: clamp(32px, 4vw, 52px);
  counter-reset: process;
}
.process-flow::before {
  position: absolute;
  content: '';
  top: 19px;
  left: 9%;
  right: 9%;
  height: 1px;
  background: linear-gradient(90deg, var(--color-brand-primary), color-mix(in srgb, var(--color-brand-accent) 85%, transparent));
}
.process-step { position: relative; z-index: 1; padding-right: clamp(8px, 2vw, 28px); }
.process-step__index {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin-bottom: 20px;
  border: 1px solid var(--color-brand-soft);
  border-radius: 50%;
  background: var(--color-surface-raised);
  color: var(--color-accent-text);
  font-size: 12px;
  font-weight: 650;
}
.process-step__title { font-size: clamp(19px, 2.1vw, 24px); font-weight: 620; letter-spacing: -.02em; }
.process-step__body { max-width: 31ch; margin-top: 10px; color: var(--color-secondary); line-height: 1.7; }

/* 精简过程提示（产品家族之后）：收紧留白与步距，标题仍用全站 section-title 尺
   （门禁：一页只能有一种 section-title 字号）。 */
.page-content-section--compact { padding-block: clamp(40px, 5vw, 64px); }
.process-flow--compact .process-step__index {
  width: 32px;
  height: 32px;
  margin-bottom: 12px;
}
.process-flow--compact .process-step__title { font-size: clamp(16px, 1.6vw, 18px); }
.process-flow--compact .process-step__body { font-size: 14px; max-width: 40ch; }

/* 六模块嵌在产品家族内：去掉整段 tinted 分区的上下大留白，
   视觉上是「AI-SOP 子区」，不是与产品家族并列的另一大节。 */
.platform--embed {
  margin-top: clamp(36px, 4vw, 56px);
  padding: clamp(20px, 2.5vw, 28px);
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-card);
  background: var(--color-surface-muted);
}
.platform--embed .platform__eyebrow {
  display: inline-flex;
  margin-bottom: 10px;
  color: var(--color-accent-text);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: .04em;
}
.platform--embed .platform__heading {
  font-size: clamp(22px, 2.2vw, 28px);
  margin-bottom: 18px;
}

.topology-section { overflow: clip; }
.topology-section__head { max-width: 900px; margin-bottom: 20px; }
/* 部署页主/次行动行：与其它页面的 .page-close__actions 节奏一致，
   使部署页也有一个视觉最强的直接联系入口（DESIGN.md §1/§3/§4）。 */
.topology-section__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px; margin-top: 24px; }
.topology-section__head .section-head__eyebrow,
.topology-preview__copy .section-head__eyebrow { margin: 0 0 16px; color: var(--color-accent-text); font-weight: 600; }
.topology-section__head .section-head__title,
.topology-preview__copy .section-head__title { font-size: var(--section-title-size); line-height: 1.25; letter-spacing: -.03em; }
main[data-page='delivery'] .topology-section__head .section-head__title { font-size: var(--section-title-size); line-height: 1.16; }
.topology-section__head .section-head__intro,
.topology-preview__copy .section-head__intro { margin-top: 16px; max-width: 64ch; color: var(--color-secondary); font-size: var(--body-size); }
.topology-configurator { display: block; }
.topology-node {
  position: relative;
  min-width: 0;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-card);
  background: var(--color-surface-glass);
  box-shadow: 0 7px 22px color-mix(in srgb, var(--color-text) 5%, transparent);
}
.topology-node--software { display: grid; align-content: center; min-height: 90px; padding: 16px 20px; border-color: var(--color-accent-line); }
.topology-node--software.is-hosting,
.topology-node--server.is-hosting { border-color: var(--color-accent-line); background: var(--color-surface-raised); }
.topology-node--server { display: flex; align-items: center; gap: 12px; min-width: 0; min-height: 90px; padding: 12px 18px; }
.topology-node__heading { display: flex; align-items: center; gap: 11px; min-width: 0; }
.topology-node__heading--select { width: 100%; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.topology-node__heading--select:focus-visible { outline: 2px solid var(--color-brand-primary); outline-offset: 4px; border-radius: var(--radius-control); }
.topology-node__mark { flex: 0 0 11px; width: 11px; height: 11px; border-radius: 50%; background: var(--color-brand-primary); box-shadow: 0 0 0 5px color-mix(in srgb, var(--color-brand-primary) 12%, transparent); }
.topology-node__title { min-width: 0; margin: 0; overflow-wrap: anywhere; font-size: clamp(16px, 1.8vw, 21px); font-weight: 630; }
.topology-node__role { margin: 8px 0 0 22px; color: var(--color-secondary); font-size: 14px; }
.topology-node__kind { margin-left: auto; color: var(--color-accent-text); font-size: 12px; white-space: nowrap; }
.topology-node--server .topology-node__role { margin: 2px 0 0; font-size: 12px; }
.topology-node--server .topology-node__kind { margin-left: auto; color: var(--color-secondary); }
.topology-node--edge { min-height: 168px; padding: 15px 16px 13px; }
.topology-node--edge .topology-node__heading { gap: 10px; }
.topology-node--edge .topology-node__index { margin-left: auto; color: var(--color-secondary); font-size: 12px; font-variant-numeric: tabular-nums; }
.topology-node__badges { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin: 10px 0 0 21px; }
.topology-node__workcell { color: var(--color-accent-text); font-size: 11px; font-weight: 650; overflow-wrap: anywhere; }
.topology-node--edge .topology-node__role { margin: 5px 0 0 21px; font-size: 12px; }
.topology-workcells { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin: 12px 0 0 21px; }
.topology-workcell-chip { display: inline-flex; align-items: center; gap: 5px; min-width: 0; min-height: 36px; padding: 6px 8px; border: 1px solid var(--color-border-muted); border-radius: var(--radius-control); background: var(--color-surface-raised); color: var(--color-secondary); font: inherit; font-size: 11px; text-align: left; cursor: pointer; }
.topology-workcell-chip:hover,
.topology-workcell-chip.is-selected { border-color: var(--color-accent-line-soft); background: var(--color-surface-tint); color: var(--color-accent-text); }
.topology-workcell-chip:focus-visible { outline: 2px solid var(--color-brand-primary); outline-offset: 2px; }
.topology-workcell-chip__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.topology-workcell-chip__cameras { margin-left: auto; color: var(--color-secondary); white-space: nowrap; }
.topology-host-tag { display: inline-flex; align-items: center; min-height: 20px; padding: 2px 7px; border-radius: var(--radius-control); background: var(--color-brand-soft); color: var(--color-accent-text); font-size: 10px; font-weight: 650; }
@keyframes topology-flow { to { stroke-dashoffset: -48; } }

.topology-summary { display: grid; gap: 12px; padding: 16px 20px 18px; border-top: 1px solid var(--color-border-light); background: var(--color-surface-overlay); }
.topology-summary__copy { min-width: 0; }
.topology-summary__label { display: block; margin-bottom: 5px; color: var(--color-accent-text); font-size: 12px; font-weight: 650; }
.topology-summary__text { color: var(--color-secondary); font-size: 13px; line-height: 1.7; }
.topology-summary__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.topology-summary .btn { min-height: 42px; padding-inline: 16px; font-size: 13px; }
.btn--secondary { display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--color-border-muted); border-radius: var(--radius-control); background: var(--color-surface-raised); color: var(--color-text); font-weight: 550; transition: background 180ms ease, border-color 180ms ease; }
.btn--secondary:hover { border-color: var(--color-accent-line-soft); background: var(--color-surface-muted); }

.site-footer { border-top-color: var(--color-border-light); }
.module-tab[aria-selected='true'] { background: var(--color-brand-primary); border-color: var(--color-accent-text); }
.module-media { display: block; padding: clamp(22px, 4vw, 48px); background: linear-gradient(140deg, var(--color-surface-muted), var(--color-bg) 68%); border-color: var(--color-border-light); text-align: left; }
.module-media__graphic { display: grid; align-content: center; width: 100%; min-height: 150px; }
.module-media__caption { display: flex; align-items: center; gap: 8px; color: var(--color-secondary); font-size: 12px; }
.module-media__caption-mark { width: 7px; height: 7px; border-radius: 50%; background: var(--color-brand-primary); }
.module-media__caption-name { color: var(--color-accent-text); font-weight: 650; }
.module-media__caption-current { color: var(--color-text); font-weight: 600; }
.module-media__flow { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 32px; }
.module-media__flow::before { position: absolute; z-index: 0; top: 19px; left: 12%; right: 12%; height: 1px; background: var(--color-topology-line); content: ''; }
.module-media__flow-node { position: relative; z-index: 1; display: grid; justify-items: center; gap: 10px; min-width: 0; color: var(--color-secondary); text-align: center; }
.module-media__flow-index { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--color-topology-line); border-radius: 50%; background: var(--color-surface-raised); color: var(--color-accent-text); font-size: 11px; font-variant-numeric: tabular-nums; }
.module-media__flow-node.is-active .module-media__flow-index { border-color: var(--color-accent-text); background: var(--color-brand-primary); color: #fff; box-shadow: 0 0 0 6px color-mix(in srgb, var(--color-brand-primary) 12%, transparent); }
.module-media__flow-label { font-size: 13px; line-height: 1.4; text-wrap: balance; }

.page-content-section { padding-block: var(--section-pad-block, 96px); }
.page-content-section--close { padding-top: 0; }
.page-content-section--close.page-close { margin-top: 0; }
.page-content-section--close .page-close { margin-top: 0; }
.page-close__action { margin-top: 24px; }
.page-content-section--tint { background: var(--color-section); }
.editorial-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 72px); align-items: start; }
.editorial-split__title { max-width: 14ch; font-size: var(--section-title-size); line-height: 1.25; letter-spacing: -.03em; text-wrap: balance; }
.editorial-split__body { display: grid; gap: 14px; max-width: 67ch; color: var(--color-secondary); line-height: 1.75; }
.editorial-list { display: grid; border-top: 1px solid var(--color-border); }
/* 章节头是整宽的，行列表跟在它下面时要留出间距（原先行列表在右栏里，靠 grid 的 gap）。 */
.section-head + .editorial-list { margin-top: 34px; }
.editorial-list__item { display: grid; grid-template-columns: minmax(150px, .65fr) 1fr; gap: 22px; padding: 18px 0; border-bottom: 1px solid var(--color-border); }
.editorial-list__item h3 { font-size: 17px; }
.editorial-list__item p { color: var(--color-secondary); line-height: 1.7; }
/* 应用场景：四张独立作业图以横向展开卡片呈现。 */
.scenario-feature__head { max-width: 820px; margin-bottom: 28px; }
.scenario-feature__head .section-head__intro { max-width: 72ch; }
.scenario-case-gallery { display: flex; align-items: stretch; gap: 12px; }
.scenario-case-card {
  display: flex;
  flex: .86 1 0;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-media);
  background: var(--color-surface);
  color: var(--color-text);
  text-align: left;
  cursor: pointer;
  transition: flex-grow var(--motion-standard) var(--motion-ease), border-color var(--motion-standard) var(--motion-ease), box-shadow var(--motion-standard) var(--motion-ease);
}
.scenario-case-card.is-active { flex-grow: 4.4; border-color: var(--color-accent-text); box-shadow: 0 16px 40px color-mix(in srgb, var(--color-brand-primary) 10%, transparent); }
.scenario-case-card:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.scenario-case-card__heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 28px; }
.scenario-case-card__title { font-size: 15px; font-weight: 650; line-height: 1.45; }
.scenario-case-card__index { color: var(--color-secondary); font-size: 11px; font-variant-numeric: tabular-nums; }
.scenario-case-card__media { display: grid; place-items: center; overflow: hidden; width: 100%; aspect-ratio: 16 / 9; border-radius: var(--radius-card); background: var(--color-surface-muted); }
.scenario-case-card__image { display: block; width: 100%; height: 100%; object-fit: cover; }
.scenario-case-card:not(.is-active) .scenario-case-card__image { opacity: .76; }
.scenario-case-card__summary { display: none; color: var(--color-secondary); font-size: 13px; line-height: 1.65; }
.scenario-case-card.is-active .scenario-case-card__summary { display: block; }
.scenario-case-card:not(.is-active) .scenario-case-card__media { flex: 1 1 auto; aspect-ratio: auto; min-height: 180px; }
.scenario-case-card:not(.is-active) .scenario-case-card__image { object-fit: cover; }
.scenario-case-gallery__note { margin: 14px 0 0; color: var(--color-secondary); font-size: 12px; line-height: 1.6; }
@media (prefers-reduced-motion: reduce) {
  .scenario-case-card { transition: none; }
  .scenario-case-card__image { transition: none; }
}
/* ---------- SectorCards：应用场景页「按行业看」----------
   合并了原先的 .scenario-gallery（示例行业三行）与 .client-wall（客户墙）：
   两者讲同一批数据，且客户墙用近似商标字标 + 装饰连线，既重复又杂乱。
   现在一张卡 = 一个行业大类，卡内一次给全：现场作业 / 接入后 / 客户名 / 配置入口。
   客户名是**纯文字**，不画商标、不铺连线。 */
.sector-cards__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 30px;
}
.sector-card {
  display: grid;
  align-content: start;
  gap: 14px;
  padding: 24px 24px 22px;
  border: 1px solid var(--color-border-muted);
  border-top: 3px solid var(--color-brand-primary);
  border-radius: var(--radius-card);
  background: var(--color-surface-raised);
}
.sector-card__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 12px;
}
.sector-card__title {
  margin: 0;
  font-size: 19px;
  font-weight: 650;
  letter-spacing: -.02em;
}
.sector-card__count {
  padding: 2px 9px;
  border-radius: var(--radius-control);
  background: var(--color-brand-soft);
  color: var(--color-accent-text);
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}
.sector-card__subtitle {
  margin: -6px 0 0;
  color: var(--color-text);
  font-size: 15px;
  font-weight: 600;
}
.sector-card__facts {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 14px 0 0;
  border-top: 1px solid var(--color-border-light);
}
.sector-card__fact { display: grid; gap: 3px; }
.sector-card__fact dt {
  color: var(--color-secondary);
  font-size: 12px;
  font-weight: 600;
}
.sector-card__fact dd {
  margin: 0;
  color: var(--color-secondary);
  font-size: 14px;
  line-height: 1.7;
}
/* 这类现场里的具体作业：挂在「现场作业」那一句下面，不另起标签。
   用「短横线 + 一行一条」而不是逗号连排 —— 作业名要能被逐条扫读、逐条对照自己的工序；
   连成一串就退化回一句话了。字号比正文小一档、颜色同为次要色，不抢上面的现场描述。 */
.sector-card__tasks {
  display: grid;
  gap: 4px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}
.sector-card__task {
  position: relative;
  padding-left: 14px;
  color: var(--color-secondary);
  font-size: 13px;
  line-height: 1.6;
}
/* 标记与模块面板、`.home-proof__note` 同一套：6px 主蓝圆点。
   这里用 5px、颜色压到 --color-topology-line 之上的一档 —— 行业卡里已经有一层
   主蓝（顶部 3px 边、能力标签、数量徽标），再用满蓝圆点会让次要信息抢主信息的重。 */
.sector-card__task::before {
  content: "";
  position: absolute;
  top: .62em;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--color-brand-primary);
  opacity: .55;
}
/* `.sector-card__capabilities` / `.sector-card__capability` 2026-09-29 删除：
   行业卡的能力标签与卡内「具体作业」清单语义重叠（一个是概括词、一个是访客自己的话），
   同一张卡两层说同一件事。标签、渲染与 config 字段一起删，不留死样式。
   注意：**「透明底 + 虚线边」这套"分类标签"视觉语言仍然保留**，
   模块阶段标签（`.module-panel__stage`）还在用它。 */
.sector-card__customers {
  display: grid;
  gap: 8px;
  padding-top: 14px;
  border-top: 1px solid var(--color-border-light);
}
.sector-card__customers-label {
  color: var(--color-secondary);
  font-size: 12px;
  font-weight: 600;
}
/* 客户名：等权重文字；取得官方 Logo 的客户在名字前加图。
   不用近似商标、不用首字方块冒充 Logo。 */
.sector-card__customer-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.sector-card__customer {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 9px;
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-control);
  background: var(--color-surface-soft);
  color: var(--color-text);
  font-size: 13px;
}
/* Logo 固定高度、按原始比例缩放，不改客户名行高；
   它不是控件，所以不参与 44px 触控目标（DESIGN.md §5）。 */
.sector-card__customer-logo {
  display: block;
  flex: 0 0 auto;
  height: 18px;
  width: auto;
  max-width: 72px;
  object-fit: contain;
}
.sector-card__industries {
  margin: 0;
  color: var(--color-secondary);
  font-size: 12px;
  line-height: 1.6;
}
/* 区块的统一行动出口：三张卡的下一步是同一处，所以放在**网格之外**居中。
   放进卡内会变成三个按钮指向同一个地址 —— 那是在制造"它们各去一处"的错觉。
   （卡片本身因此不可点，能力标签也刻意不带 hover，见上面的注释。） */
/* 区块出口：一个区块读完的去向（产品家族 / 项目实践共用，文案在 config 的 cta）。
   一律文字链接、左对齐、与正文同一起始边 —— 不做成按钮，不与页面级主行动抢视觉重量。
   密度规则（为什么只有这两处）写在 config/content.js 的 productLines.cta 注释里。 */
.section-exit {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 28px;
}

.sector-cards__cta {
  display: flex;
  justify-content: center;
  margin-top: 26px;
}

/* 关于页收尾。2026-09-29 删掉旧的自成一档实现：
   · `.join-us-section__title` 用过 clamp(38px, 4.2vw, 56px) —— 全站唯一一个第三档字号，
     夹在 H1 的 68px 与章节标题的 44px 之间；
   · `.join-us-section__link` 是 112px 高的独有大横条。
   两者都换成全站既有组件（section-head + 主按钮 + 次链接），
   字号回到 --section-title-size，由 design-consistency 的「跨页章节标题同尺」看着。
   这里只剩锚点定位与行动行的对齐。 */
.join-us-section { scroll-margin-top: calc(var(--header-height) + 16px); }
.join-us-section__actions { align-items: center; }
/* 列数跟随实际条目数：原来写死 3 列，而联系方式只有电话 + 邮箱两条，
   第三列永远是空的。改成 auto-fit 后增删联系方式都不用回来改列数，
   上限 880px 是为了让两个条目各自接近 440px —— 再宽下去电话号与邮箱
   会被拉成一整行，视觉重量压过下面的「联系前准备」。 */
.contact-page-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; max-width: 880px; margin-top: 0; }
.contact-page-item { display: grid; gap: 8px; padding: 24px 0; border-top: 1px solid var(--color-border); }
.contact-page-item__label { color: var(--color-secondary); font-size: 14px; }
.contact-page-item__value { color: var(--color-text); font-size: clamp(20px, 3vw, 28px); font-weight: 600; letter-spacing: -.02em; overflow-wrap: anywhere; }
.contact-page-item__note { color: var(--color-secondary); font-size: 13px; }
.page-close { margin-top: 32px; }

/* 同色连续分区作为一个章节阅读，缩短交界处的空档。
   `data-page` 用的是**页面标识 = HTML 文件名**（见 config/page-meta.js）。
   2026-09-29 之前这里写着 `ai-sop`（文件名）而页面标识是 `products`（角色名），
   那条规则从来没匹配上过 —— 两套命名并存就是这么坑人的，规则已随命名统一。 */
main[data-page='home'] [data-metric='cases-section'] .section__inner { padding-top: 32px; }
main[data-page='delivery'] .topology-section .section__inner { padding-block: clamp(56px, 5.8vw, 80px); }
/* 原先这里还有一条 `main[data-page='ai-sop'] .light-guide.section`，
   已删除：`.light-guide.section` 这个区块 2026-09-28 就随产品页重构消失了，
   规则是死的（id 还写错了）。死 CSS 由 `npm --prefix Anx开发版 run css:lint` 复查。 */

@media (max-width: 1050px) {
}
@media (max-width: 767px) {
  /* 内页首屏收紧（2026-09-30）：上/下留白与标题-说明间距都压一档 */
  .page-hero { padding-block: 28px 28px; }
  .page-hero__layout { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .page-hero__copy { max-width: 640px; }
  .page-hero__title { font-size: var(--hero-title-size); }
  .page-hero__body { margin-top: 10px; font-size: var(--body-size); }
  .page-hero__actions { gap: 12px; margin-top: 18px; }
  .page-hero__art-frame { border-radius: var(--radius-card); }
  /* 说明卡手机紧凑版（2026-09-29）：桌上那版是"叠加在图上"的完整卡，
     在 390px 宽下实测盖住图片高度的 44%（91 / 204px）—— 图和卡都废了。
     手机上只留标题一行、缩小内距，覆盖率降到约 17%：
     信息还在（这是"紧凑版"不是"删掉"），关键画面不再被盖。
     kicker 与 detail 隐藏：kicker「AI-SOP 平台流程」与首屏 eyebrow 重复，
     detail 在下方规格条里有更完整的版本。 */
  .page-hero__art-card,
  .media-card { right: 10px; bottom: 10px; left: 10px; padding: 10px 12px; border-radius: var(--radius-control); }
  .page-hero__art-kicker,
  .media-card__kicker,
  .page-hero__art-detail,
  .media-card__detail { display: none; }
  .page-hero__art-title,
  .media-card__title {
    margin-top: 0;
    font-size: 13px;
    line-height: 1.4;
    text-align: center;
  }
  .page-content-section { padding-block: var(--section-pad-block, 52px); }
  /* 手机：横向流程条转纵向 —— 细线由横改竖，序号节点移到左侧成为导轨 */
  .process-flow { grid-template-columns: minmax(0, 1fr); gap: 26px; margin-top: 32px; }
  .process-flow::before { top: 18px; bottom: 22px; left: 18px; right: auto; width: 1px; height: auto; background: linear-gradient(180deg, var(--color-brand-primary), color-mix(in srgb, var(--color-brand-accent) 85%, transparent)); }
  .process-step { padding: 0 0 0 58px; }
  .process-step__index { position: absolute; top: 0; left: 0; margin: 0; }
  .process-step__body { max-width: 42ch; }

  .topology-section__head { margin-bottom: 28px; }
  .topology-section__head .section-head__intro { font-size: var(--body-size); }
  .topology-node--software { min-height: 66px; padding: 12px 14px; }
  .topology-node--server { min-height: 66px; padding: 10px 13px; }
  .topology-node__role { margin-left: 21px; font-size: 12px; }
  .topology-map__edges,
  .topology-node--edge { min-height: 0; padding: 14px; }
  .topology-node--edge .topology-node__title { font-size: 16px; }
  .topology-node--edge .topology-node__role { margin-bottom: 10px; }
  .topology-summary { gap: 16px; padding: 18px; }
  /* 手机端拓扑：**地图先出现，操作与摘要相邻**（2026-09-29，外部设计评估：
     "理顺手机上的编辑与摘要关系"）。
     原来的顺序是「统计+操作」→ 607px 的地图 →「摘要+行动」，
     等于把"编辑"和"读到结果"隔开一整屏：点了「添加边缘算力机」之后
     既看不到新节点、也看不到摘要，得往下滚。
     改成 flex 列：**顺序是 工位数工具条 → 图例 → 地图 → 统计与摘要**，
     编辑完立刻能读到结果。

     2026-09-30 修订：这里原先还有一条 `.topology-canvas { order: -1 }`，
     把地图提到整节最前。那时"编辑入口"是图上的节点，先看图先得结果；
     现在主入口是工位数输入框，用户明确要求"编辑工位数量更靠上" ——
     地图提到最前会把输入框压到图下面，与这个要求相反。所以去掉那条，
     只保留"地图在摘要之前"这一半（它才是"编辑完立刻读结果"的关键）。 */
  .topology-configurator { display: flex; flex-direction: column; }
  .topology-overview { margin-top: 10px; }
  .topology-summary__actions { display: grid; grid-template-columns: 1fr; }
  .topology-summary__actions .btn { width: 100%; }
  .topology-map--preview .topology-node--software { padding: 12px; }
  .topology-map--preview .topology-node--software .topology-node__role { margin-left: 20px; font-size: 10px; }
  .topology-map--preview .topology-node--server { min-height: 52px; }
  .topology-map--preview .topology-node--edge { min-height: 0; padding: 11px 9px; }
  .topology-map--preview .topology-node--edge .topology-node__heading { gap: 6px; }
  .topology-map--preview .topology-node--edge .topology-node__title { font-size: 12px; }
  .topology-map--preview .topology-node--edge .topology-node__index { display: none; }
  .topology-map--preview .topology-node--edge .topology-node__role { margin-left: 17px; font-size: 10px; }
  .topology-map--preview .topology-node__workcell { margin-left: 17px; font-size: 10px; }
  .editorial-split { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .editorial-split__title { max-width: 18ch; }
  .editorial-list__item { grid-template-columns: minmax(0, 1fr); gap: 6px; padding: 17px 0; }

  .scenario-case-gallery { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .scenario-case-card { padding: 10px; }
  .scenario-case-card:not(.is-active) { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 10px; }
  .scenario-case-card:not(.is-active) .scenario-case-card__media { grid-column: 1; grid-row: 1; display: block; width: 76px; min-height: 52px; aspect-ratio: 4 / 3; }
  .scenario-case-card:not(.is-active) .scenario-case-card__heading { grid-column: 2; grid-row: 1; }
  .scenario-case-card:not(.is-active) .scenario-case-card__summary { display: none; }
  .scenario-case-card.is-active .scenario-case-card__media { aspect-ratio: 16 / 9; }
  .scenarios-hero { padding-block: 24px 16px; }
  .scenario-feature { padding-block: 20px 32px; }
  .scenario-feature__head { margin-bottom: 14px; }
  .product-lines--hero { padding-block: 24px 22px; }
  /* 页首标题与小字：手机再紧一档 */
  /* 标题字号见文末「全站标题与首页对齐」 */
  .product-lines--hero .section-head__intro,
  .scenarios-hero .section-head__intro { margin-top: 8px; font-size: 14px; line-height: 1.6; }
  .product-lines .module-tabs { margin-top: 16px; }
  /* 产品线标签：一行横滑，不再 wrap 成多行（2026-09-30 移动端）。
     触控高度由 --tab-height=44px 保证；边缘 fade 避免截断感。 */
  .product-lines .module-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    gap: 8px;
    scrollbar-width: none;
    mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 28px), transparent);
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 28px), transparent);
  }
  .product-lines .module-tabs::-webkit-scrollbar { display: none; }
  .product-lines .module-tabs > * { flex: 0 0 auto; min-height: var(--tab-height); }
  main[data-page='contact'] .page-hero__title { max-width: none; }
  .sector-cards__grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .contact-page-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .contact-page-item { padding-block: 19px; }
  main[data-page='home'] [data-metric='cases-section'] .section__inner { padding-top: 24px; }
  main[data-page='delivery'] .topology-section .section__inner { padding-block: 44px 48px; }
  .module-media { min-height: var(--module-panel-height-mobile, 185px); padding: 18px; }
  .module-media__graphic { min-height: 140px; }
  .module-media__flow { gap: 8px; margin-top: 25px; }
  .module-media__flow-index { width: 34px; height: 34px; }
  .module-media__flow::before { top: 17px; }
  .module-media__flow-label { font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
}

/* 首页客户区（2026-09-29 第三轮：全量客户名走马灯）。
     第一行 = 小标题 + 行业说明 + 「按行业看客户」，回答"这是谁在用、覆盖哪些行业"；
     第二行 = 一条缓慢横向滚动的客户名带。
   改成走马灯的理由与四条约束写在 scripts/customer-strip.js 的文件头。 */
.customer-strip__head {
  display: grid;
  gap: 6px;
  width: 100%;
  margin-bottom: 18px;
}
.customer-strip__label {
  font-size: 14px;
  font-weight: 650;
  letter-spacing: -.01em;
  color: var(--color-text);
}
.customer-strip__intro {
  margin: 0;
  max-width: 68ch;
  color: var(--color-secondary);
  font-size: 14px;
  line-height: 1.65;
}
.customer-strip__more {
  justify-self: start;
  font-size: 13px;
  white-space: nowrap;
}
.customer-marquee {
  position: relative;
  display: flex;
  gap: 0 44px;
  width: 100%;
  overflow: hidden; /* 轨道比容器宽，在这一层裁掉；否则整页横向溢出 */
}
.customer-marquee__track {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0 44px;
  margin: 0;
  padding: 0;
  list-style: none;
  will-change: transform;
}
.customer-marquee__name {
  color: var(--color-secondary);
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -.01em;
  white-space: nowrap;
}
/* 双份轨道 + translateX(-50%) = 无缝循环（第二份由 customer-strip.js 标注 aria-hidden）。 */
@keyframes customer-marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(calc(-100% - 44px)); }
}
.customer-marquee__track {
  animation: customer-marquee-scroll 46s linear infinite;
}
/* WCAG 2.2.2：自动开始且超过 5 秒的移动内容要能停下来 —— 鼠标悬停与键盘聚焦都暂停。 */
.customer-marquee:hover .customer-marquee__track,
.customer-marquee:focus-within .customer-marquee__track {
  animation-play-state: paused;
}

/* 减弱动效：不走马，改为静态换行铺开。**内容必须全可见** ——
   "谁在用"是信息，不能因为关掉动效就有一半滚在视口外。 */
@media (prefers-reduced-motion: reduce) {
  .customer-marquee { flex-wrap: wrap; gap: 8px 28px; }
  .customer-marquee__track {
    animation: none;
    flex-wrap: wrap;
    gap: 8px 28px;
  }
  /* 副本在静态形态下没有意义，直接隐藏；真名单已经全部铺开了。 */
  .customer-marquee__track[data-clone] { display: none; }
}

/* ---------- HomeBeats：工位问题 / 交付证据 / 收束 ---------- */.site-problems__inner {
  display: grid;
  gap: 26px;
}
.site-problems__head {
  max-width: 640px;
}
.site-problems__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.site-problems__item {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 22px 22px 24px;
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-card);
  background: var(--color-surface-raised);
}
.site-problems__index {
  color: var(--color-accent-text);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: .04em;
}
.site-problems__title {
  margin: 0;
  font-size: 18px;
  font-weight: 650;
  letter-spacing: -.02em;
}
.site-problems__body {
  margin: 0;
  color: var(--color-secondary);
  font-size: 14px;
  line-height: 1.65;
}
.site-problems__conclusion-text {
  margin: 0;
  flex: 1 1 280px;
  color: var(--color-text);
  font-size: 15px;
  font-weight: 550;
  line-height: 1.6;
}

.home-close {
  /* 去渐变：改用与全站一致的浅分区底 + 一条细分隔线，
     与「继续了解」明确分段。 */
  border-top: 1px solid var(--color-border-light);
  background: var(--color-section);
  /* 作为页面最后一拍，给足上下留白，不再挤成一条 */
  padding-block: clamp(40px, 5vw, 64px);
}
.home-close__inner { display: block; }
.home-close__card {
  display: grid;
  /* 左文字 / 右行动，各占 50%（与全站图文比例一致）。
     原版把标题、说明、按钮挤在同一条 62ch 窄栏里、右侧整片留白，
     收束力度反而弱于前面的卡片区；改为一张白卡浮在浅分区底上。 */
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 26px 48px;
  align-items: center;
  padding: clamp(26px, 3.4vw, 44px);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-media);
  background: var(--color-surface-raised);
}
.home-close__copy { display: grid; gap: 12px; min-width: 0; }
.home-close__title {
  margin: 0;
  /* 桌面沿用章节标题字号，让四字 + 七字标题使用完整的文字列。 */
  max-width: none;
  font-size: var(--section-title-size);
  font-weight: 650;
  letter-spacing: -.025em;
  line-height: 1.2;
  text-wrap: balance;
  white-space: pre-line;
}
.home-close__body {
  margin: 0;
  max-width: 46ch;
  color: var(--color-secondary);
  font-size: 15px;
  line-height: 1.7;
}
.home-close__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 22px;
}

@media (max-width: 959px) {
  .site-problems__grid,
  .site-evidence__grid {
    grid-template-columns: 1fr;
  }
  .home-close__card { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .home-close__actions { gap: 12px 20px; }
}

/* ---------- Home sales narrative (PPT 6拍) ---------- */
.site-problems__row {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(220px, .9fr);
  gap: 20px 28px;
  align-items: start;
}
.site-problems__title-main {
  margin: 8px 0 0;
  font-size: var(--section-title-size);
  font-weight: 650;
  letter-spacing: -.025em;
  line-height: 1.2;
}
.site-problems__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.site-problems__item {
  display: grid;
  gap: 8px;
  padding: 18px 18px 20px;
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-card);
  background: var(--color-surface-raised);
}
.site-problems__aside {
  display: grid;
  gap: 12px;
  padding: 20px;
  border-radius: var(--radius-card);
  background: linear-gradient(135deg, var(--color-brand-soft) 0%, var(--color-accent-soft) 100%);
}
.site-problems__conclusion-text {
  margin: 0;
  color: var(--color-text);
  font-size: 15px;
  font-weight: 550;
  line-height: 1.65;
}

.home-product__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 32px 48px;
  align-items: center;
}
.home-product__title {
  margin: 8px 0 0;
  font-size: var(--section-title-size);
  font-weight: 650;
  letter-spacing: -.025em;
  line-height: 1.2;
  /* 极窄内容列允许自然折行；首页手机字号在末尾单独设置。 */
  text-wrap: pretty;
}
.home-product__lead {
  margin: 12px 0 0;
  color: var(--color-secondary);
  font-size: 15px;
  line-height: 1.7;
  max-width: 42ch;
}
/* 首页工作三步沿用共用的编号行列表。 */
/* 技术讲解与场景入口同一行（2026-09-30 链路终点）。 */
.home-process__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 20px;
  margin-top: 10px;
}
.home-product__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 20px;
  margin-top: 22px;
}
.home-product__visual {
  min-width: 0;
}

.home-proof__inner {
  display: grid;
  /* 图文各占 50%（全站统一比例） */
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 28px 40px;
  align-items: center;
}
.home-proof__title {
  margin: 8px 0 0;
  font-size: var(--section-title-size);
  font-weight: 650;
  letter-spacing: -.025em;
  line-height: 1.2;
}
.home-proof__lead {
  margin: 12px 0 0;
  color: var(--color-secondary);
  font-size: 15px;
  line-height: 1.7;
  max-width: 42ch;
}
/* ---------- 首页收束：最终联系入口 ----------
   首页最后一拍。原先的问题：
     · `.home-close` 用了与全站无关的蓝绿渐变底，且标题用 `clamp(28px,2.8vw,40px)`
       （内页章节标题是 44px），与其它章节不成一套；
     · 收束文案挤在 `max-width:720px` 里，标题折行，行动行比标题宽，
       左边缘看着不齐。
   现改为：统一左边距的左右两栏，标题用全站章节标题字号，去掉渐变。
   注：原先它上面还有一条 `.home-path`「继续了解」卡片行，指向的三个页面
   导航里都有，属于重复入口，已整段移除。 */

@media (max-width: 959px) {
  .site-problems__row {
    grid-template-columns: 1fr;
  }
  .site-problems__grid {
    grid-template-columns: 1fr;
  }
  .home-product__layout,
  .home-proof__inner {
    grid-template-columns: 1fr;
    gap: 22px;
  }
}

/* ---------- Topology direct-edit canvas（四层网络图） ---------- */
.topology-canvas {
  position: relative;
  display: grid;
  /* 34px：2026-09-30 收紧（原 52px）。四层之间原本各空 52px，一屏里白掉 156px；
     层间连线由 motifs.js 按真实 rect 推算，gap 变小只是让线变短，逻辑不受影响。 */
  gap: 34px;
  margin-top: 12px;
}
/* 层间连线：由 motifs.js 的 attachTopologyNetwork() 按真实 rect 逐条生成，
   必须 pointer-events:none，不能挡住底下的节点与编辑控件。 */
.topology-links {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  pointer-events: none;
}
.topology-link { fill: none; stroke: var(--color-topology-line); stroke-width: 2; }
/* 中控平台是软件能力：用虚线区分"运行在…之上"，与硬件数据链路区分 */
.topology-link--control {
  stroke: var(--color-brand-primary);
  stroke-dasharray: 5 9;
  opacity: .55;
}
/* 预览角标与图例：说明这是配置示意，以及三种关系语义。 */
.topology-canvas__caption {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  margin: 0;
  padding: 4px 10px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-control);
  background: var(--color-surface);
  color: var(--color-secondary);
  font-size: 12px;
}
.topology-legend {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  /* 10px：2026-09-30 收紧（原 18px）。图例是"读图辅助"，
     它上面现在是工位数工具条，两者要读成一组。 */
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
}
.topology-legend__item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--color-secondary);
  font-size: 12px;
}
.topology-legend__swatch {
  display: inline-block;
  width: 22px;
  height: 0;
  border-top: 2px solid var(--color-topology-line);
  flex: 0 0 auto;
}
.topology-legend__swatch--control {
  border-top-color: var(--color-accent-text);
  border-top-style: dashed;
}
.topology-legend__swatch--data {
  border-top-style: solid;
}
.topology-legend__swatch--optional {
  width: 10px;
  height: 10px;
  border: 2px solid var(--color-border-muted);
  border-radius: 2px;
  background: var(--color-surface);
}
.topology-workcell-chip--static {
  cursor: default;
  pointer-events: none;
}
/* 各层居中排列。原实现把两层都锁在固定 596px（2 列 ×291px），
   结果加第 3 台机器起就只能不断换行、整个网络挤在画布左侧半页，
   右侧大片空白（实测 1440px 画布 1200 / 层宽仅 596）。现改为自适应栅格。 */
.topology-tier {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: start;
  gap: 14px;
}
/* 核心层：中控平台 / 中央服务器 两列等宽，随可用宽度伸缩，
   与下层边缘机层保持同一居中轴。 */
/* 核心层：中控平台 / 中央服务器 两列等宽，撑满自身行宽后居中，
   与下层边缘机层同一中轴。
   注意两点：
   ① `width: 100%` 不能省——只写 max-width 时，作为网格项的该层会
      「收缩到内容宽」（实测仅 412px = 199+199+14），比下面 1200px 宽的
      边缘机层窄一大截，显得头重脚轻；
   ② flex-basis 用 0 而不是固定 px，否则容器同样会收缩到两卡基准宽之和。 */
.topology-tier--core { width: 100%; max-width: 900px; margin-inline: auto; }
.topology-tier--core > .topology-node { flex: 1 1 0; }
.topology-tier--core.is-core-single > .topology-node { flex: 1 1 100%; }
/* 边缘机层：列数由脚本按机器数算出（--topology-cols），使各行填满且无落单行。
   只看最小卡宽的 auto-fit 会产出「3+1」这类畸形排列，故改为显式列数。 */
.topology-tier--edges {
  display: grid;
  grid-template-columns: repeat(var(--topology-cols, 2), minmax(0, 1fr));
  gap: 14px;
}
.topology-tier--edges > .topology-node--edge { min-width: 0; }
/* 层容量说明：仅在机器数会让该层换行时由脚本插入 */
.topology-node--software,
.topology-node--server { max-width: none; }

/* 顶部工具条（2026-09-30）：工位数 → 自动生成。
   两块：第一行"填数字 + 统计 + 微调入口"，第二行算力参考一行文字带。
   **刻意不做成卡片**：它是这一节的输入控件，不是内容卡；
   包一层卡框只会白白多出 40px 上下内距与一条边线。
   （上一版是三块纵向堆叠：字段区 / 建议卡 / 统计条，实测整节 784px 高。） */
.topology-overview {
  display: grid;
  gap: 8px;
  text-align: left;
}
.topology-gen {
  display: grid;
  gap: 8px;
}
.topology-gen__field {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
}
/* 数字输入框：**独立类名，不复用 `.topology-editor__input`**。
   复用的那次踩到了：那个类在编辑器上下文里是 `width: 100%`，
   而这里要的是固定宽度 —— 结果输入框被拉满一整行，把标签挤到看不见的地方。
   原生步进箭头也藏起来（`appearance: textfield`）：它两态各占约 18px，
   而这一行要放下标签、提示、统计与微调入口。 */
.topology-gen__label {
  color: var(--color-text);
  font-size: 15px;
  font-weight: 600;
}
.topology-count {
  width: 64px;
  height: 34px;
  margin: 0;
  padding: 0 8px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-control);
  background: var(--color-surface-raised);
  color: var(--color-text);
  font: inherit;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
  text-align: center;
  appearance: textfield;
  -moz-appearance: textfield;
}
.topology-count::-webkit-outer-spin-button,
.topology-count::-webkit-inner-spin-button { appearance: none; margin: 0; }
.topology-count:focus-visible {
  border-color: var(--color-focus);
  outline: 2px solid var(--color-focus);
  outline-offset: 1px;
}
.topology-gen__hint { color: var(--color-secondary); font-size: 13px; }
/* 统计并入同一行：它随上图变化，紧挨着输入才读得出"我改了什么、变成了什么"。
   `margin-left: auto` 把它推到右侧，与左侧输入区形成一条可扫读的基线。 */
.topology-gen__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  margin-left: auto;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

/* 算力参考：一行文字带，不是一张卡。
   它是"结论"，不该像内容卡那样占掉 100px；用左侧 3px 主蓝竖条
   把它与普通说明文区分开，同时不引入底色块。
   免责句与型号同处一行 —— 那是"参考"与"承诺"的分界线，门禁会断言它必须在场。 */
.topology-recommend {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  margin: 0;
  padding: 6px 0 6px 12px;
  border-left: 3px solid var(--color-brand-primary);
}
.topology-recommend__label { color: var(--color-secondary); font-size: 13px; }
.topology-recommend__model { color: var(--color-text); font-size: 15px; font-weight: 650; }
.topology-recommend__basis { color: var(--color-secondary); font-size: 12px; line-height: 1.5; }

/* 逐台微调：默认收起，作为工具条**尾部**的入口。
   展开后按钮强制换到下一行（`flex-basis: 100%`），不会把工具条挤歪。 */
.topology-advanced { flex: 0 0 auto; }
.topology-advanced__summary {
  color: var(--color-accent-text);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}
.topology-advanced[open] { flex: 1 1 100%; }
.topology-advanced[open] .topology-overview__actions { margin-top: 10px; }

.topology-overview__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.topology-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-control);
  background: var(--color-surface-raised);
  color: var(--color-accent-text);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.topology-btn--primary {
  border-color: var(--color-accent-text);
  background: var(--color-brand-primary);
  color: #fff;
}
.topology-btn--ghost { background: var(--color-surface-soft); color: var(--color-secondary); }
.topology-btn--danger { border-color: var(--color-alert-border); color: var(--color-alert-text); }
.topology-btn:disabled { opacity: .5; cursor: not-allowed; }

.topology-node {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 16px 16px 14px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-card);
  background: var(--color-surface-raised);
  text-align: left;
  cursor: pointer;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}
.topology-node.is-selected {
  border-color: var(--color-accent-text);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-brand-primary) 14%, transparent);
}
.topology-node.is-compact { padding-bottom: 12px; }
.topology-node--software,
.topology-node--server {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  max-width: 340px;
  padding: 15px 18px;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.topology-node--software { border-color: var(--color-accent-line); }
.topology-node__body {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.topology-node__heading {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.topology-node__mark {
  flex: 0 0 auto;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--color-brand-primary);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--color-brand-primary) 12%, transparent);
}
.topology-node__title { font-size: 16px; font-weight: 650; }
.topology-node__kind {
  margin-left: auto;
  color: var(--color-secondary);
  font-size: 11px;
  white-space: nowrap;
}
.topology-node__role {
  margin: 0;
  color: var(--color-secondary);
  font-size: 12px;
}
.topology-node__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.topology-node__workcell {
  color: var(--color-secondary);
  font-size: 12px;
}
.topology-host-tag {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 2px 8px;
  border-radius: var(--radius-control);
  background: var(--color-brand-soft);
  color: var(--color-accent-text);
  font-size: 11px;
  font-weight: 650;
}
.topology-workcells {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.topology-workcell-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  /* 触控尺寸用设计标记，**不写死 36px**：那是编辑器控件的高度档，
     不是移动端触控目标的档。`experience-check` 断言手机上所有工位芯片 ≥44px，
     写死 36px 会让这条断言失败（而且手机上本来就该给 44px 的可点区域）。 */
  min-height: var(--control-touch-height);
  padding: 6px 10px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-control);
  background: var(--color-surface-raised);
  color: var(--color-secondary);
  font: inherit;
  font-size: 12px;
  text-align: left;
  cursor: pointer;
}
.topology-workcell-chip.is-selected {
  border-color: var(--color-accent-line-soft);
  background: var(--color-surface-tint);
  color: var(--color-accent-text);
}
.topology-workcell-chip__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.topology-workcell-chip__cameras {
  margin-left: auto;
  color: var(--color-secondary);
  white-space: nowrap;
}
/* 名称与「1 路」之间加分隔点：避免「工位 01」+「1 路」连读成「011 路」 */
.topology-workcell-chip__cameras::before {
  content: '·';
  margin-right: 5px;
  opacity: .6;
}

.topology-editor {
  display: grid;
  gap: 10px;
  margin-top: 4px;
  padding: 12px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-card);
  background: var(--color-surface-muted);
}
.topology-editor__row {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}
.topology-editor__label {
  color: var(--color-secondary);
  font-size: 12px;
}
.topology-editor__input {
  width: 100%;
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-control);
  background: var(--color-surface-raised);
  color: var(--color-text);
  font: inherit;
  font-size: 13px;
}
/* 只读的模型事实（例：一工位一摄像头），不做成输入控件 */
.topology-editor__static {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  color: var(--color-secondary);
  font-size: 13px;
}
.topology-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  cursor: pointer;
  font-size: 13px;
}
.topology-check input { width: 16px; height: 16px; margin: 0; accent-color: var(--color-accent-text); }

.topology-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px 18px;
  margin-top: 16px;
  padding: 16px 18px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-card);
  background: var(--color-surface-tint);
}
.topology-summary__text {
  margin: 6px 0 0;
  color: var(--color-text);
  font-size: 13px;
  line-height: 1.65;
}
.topology-summary__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

@media (max-width: 959px) {
  .topology-workcells { grid-template-columns: 1fr; }
  .topology-editor__row { grid-template-columns: 1fr; }
  /* 手机：核心层单列堆叠，每个节点占满整行。
     边缘机层无需覆盖——它的 auto-fit 栅格在窄屏自动收敛为单列。 */
  .topology-tier--core { max-width: none; }
  .topology-tier--core > .topology-node,
  .topology-tier--core.is-core-single > .topology-node { flex: 1 1 100%; }
  .topology-node--software,
  .topology-node--server { max-width: none; }
}

/* 首页「AI-SOP 如何工作」的示意：与部署拓扑、产品线共用「节点 + 连线 + 标签」语言，
   替代原先与其它页面无关联的抽象色块。 */
.home-product__flow {
  display: grid;
  gap: 14px;
  padding: clamp(20px, 3.4vw, 36px);
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-media);
  background: var(--color-surface-soft);
}
.hp-node {
  display: grid;
  gap: 3px;
  justify-items: center;
  padding: 12px 14px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-card);
  background: var(--color-surface-raised);
  text-align: center;
}
.hp-node__title { font-size: 14px; font-weight: 640; }
.hp-node__sub { color: var(--color-secondary); font-size: 11px; }
.hp-link { display: flex; justify-content: center; color: var(--color-accent-text); }
.hp-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}.hp-step {
  display: grid;
  gap: 6px;
  justify-items: center;
  padding: 14px 10px;
  border: 1px solid var(--color-brand-primary);
  border-radius: var(--radius-card);
  background: var(--color-brand-soft);
  text-align: center;
}
.hp-step__index {
  color: var(--color-accent-text);
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.hp-step__label { font-size: 13px; font-weight: 600; }

/* ---------- ProductLines：产品介绍页三条产品线 ---------- */
/* 产品页页首：产品家族即首屏，H1 使用统一的内页标题尺。 */
.product-lines--hero {
  padding-block: clamp(48px, 8vw, 96px) clamp(40px, 6vw, 72px);
}
/* 页首大字标题（产品 / 场景 / 交付 / 关于共用一把尺）：
   2026-09-29 收成全局规则，避免只有产品页父容器下的 H1 吃到 hero 尺。 */
.section-head__title--hero {
  max-width: 14ch;
  font-size: var(--hero-title-size);
  line-height: var(--hero-title-line);
  letter-spacing: var(--hero-title-tracking);
  font-weight: 650;
  text-wrap: balance;
  white-space: pre-line;
}

/* 应用场景页首容器：大字 H1，与产品页同一节奏 */
.scenarios-hero {
  padding-block: clamp(48px, 8vw, 96px) clamp(36px, 5vw, 64px);
}
/* 2026-09-29 交付包批次 1：区块内**只剩一组选择器**（那一排标签）。
   原先这里还有一套 `.pl-overview-card` 总览卡，和标签行切的是同一个面板 ——
   同一组三个选项摆两遍。卡片连同其样式一起移除，防它长回来的断言在 site-shots.mjs。
   卡片唯一承载过的信息是"这是哪一条线"，那本来就在面板的 `tag` + 标题里。 */

/* lead 与结构性事实行同处一块：lead 讲"三条线各自干什么"（左，可折行），
   事实行讲"这个家族有多大"（右，贴边）。两者是不同性质的信息，
   靠 flex 的两端分开，不用分隔符硬连成一句。 */
.product-lines__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px 24px;
}
.product-lines__meta .section-head__intro { flex: 1 1 46ch; margin: 0; }
/* 数字用 tabular-nums：三项都是"数字 + 量词"，等宽数字让它们对齐成一条规格行。 */
.product-lines__facts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.product-lines__fact {
  color: var(--color-secondary);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
/* 项间用中点分隔，而不是竖线：这一行是"规格摘要"，
   竖线在这里会和下面能力行的分隔线撞成同一种视觉重量。 */
.product-lines__fact + .product-lines__fact::before {
  content: '·';
  margin: 0 8px;
  color: var(--color-border-muted);
}

.product-lines__panel {
  display: grid;
  /* 图文各占 50%（全站统一比例），列间隔按交付包规格定为 32px。 */
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 32px;
  align-items: start;
  margin-top: 24px;
  perspective: 1600px;
}
/* 切换轻淡入：不改变媒体外框，保证即时测量与阅读位置稳定。 */
.product-lines__panel.is-flip .product-line-panel:not([hidden]),
.product-lines__panel.is-flip .product-line__art {
  animation: product-line-flip 0.55s ease both;
  transform-origin: center top;
}
@keyframes product-line-flip {
  from {
    opacity: 0.35;
  }
  to {
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce) {
  .product-lines__panel.is-flip .product-line-panel:not([hidden]),
  .product-lines__panel.is-flip .product-line__art {
    animation: none;
  }
}

/* 产品技术讲解：一个问题展开，其余保持可扫读。 */
.product-depth__list {
  display: grid;
  gap: 8px;
  margin-top: 26px;
}
.product-depth__item {
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-card);
  background: var(--color-surface);
  overflow: hidden;
}
.product-depth__trigger {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 18px;
  min-height: 66px;
  padding: 14px 20px;
  border: 0;
  background: transparent;
  color: var(--color-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.product-depth__trigger:focus-visible,
.product-depth__theory summary:focus-visible { outline: 2px solid var(--color-focus); outline-offset: -3px; }
.product-depth__trigger-index {
  flex: 0 0 108px;
  color: var(--color-secondary);
  font-size: 13px;
}
.product-depth__trigger-title { flex: 1; font-size: 18px; font-weight: 650; }
.product-depth__trigger-mark { color: var(--color-accent-text); font-size: 23px; line-height: 1; }
.product-depth__trigger[aria-expanded='true'] .product-depth__trigger-mark { transform: rotate(45deg); }
.product-depth__panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  gap: 16px 28px;
  padding: 0 20px 20px;
  border-top: 1px solid var(--color-border-light);
}
.product-depth__panel[hidden] { display: none; }
.product-depth__facts { display: grid; gap: 0; margin: 0; }
.product-depth__fact { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 10px; padding: 15px 0; border-bottom: 1px solid var(--color-border-light); }
.product-depth__fact dt { color: var(--color-accent-text); font-size: 13px; font-weight: 650; }
.product-depth__fact dd { margin: 0; color: var(--color-secondary); font-size: 14px; line-height: 1.65; }
.product-depth__software { margin: 16px 0 0; }
.product-depth__software picture { display: contents; }
.product-depth__software-image { display: block; width: 100%; height: 180px; object-fit: cover; object-position: center top; border: 1px solid var(--color-border-muted); border-radius: var(--radius-media); }
.product-depth__software figcaption { margin-top: 8px; color: var(--color-secondary); font-size: 12px; line-height: 1.55; }
.product-depth__flow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  padding: 20px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-media);
  background: var(--color-section);
}
.product-depth__flow span { padding: 8px 11px; border: 1px solid var(--color-border-muted); border-radius: var(--radius-control); background: var(--color-surface); font-size: 13px; font-weight: 600; }
.product-depth__flow small { flex-basis: 100%; color: var(--color-secondary); line-height: 1.5; }
.product-depth__panel > .link-arrow { grid-column: 1 / -1; justify-self: start; }
.product-depth__research { margin-top: 34px; border-top: 1px solid var(--color-border-muted); }
.product-depth__research > summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; min-height: 70px; cursor: pointer; list-style: none; }
.product-depth__research > summary::-webkit-details-marker { display: none; }
.product-depth__research > summary strong { font-size: var(--module-title-size); line-height: 1.3; }
.product-depth__research > summary span { color: var(--color-accent-text); font-size: 13px; }
.product-depth__research-content { display: grid; gap: 8px; }
.product-depth__research-content > p { margin: 0; color: var(--color-secondary); font-size: 14px; line-height: 1.65; }
.product-depth__theories { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.product-depth__theory { min-width: 0; border: 1px solid var(--color-border-muted); border-radius: var(--radius-card); background: var(--color-surface); }
.product-depth__theory summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; min-height: 54px; padding: 12px 14px; cursor: pointer; list-style: none; }
.product-depth__theory summary::-webkit-details-marker { display: none; }
.product-depth__theory-status { color: var(--color-accent-text); font-size: 12px; }
.product-depth__theory p { margin: 0; padding: 0 14px 8px; color: var(--color-secondary); font-size: 13px; line-height: 1.6; }
.product-depth__theory a { display: inline-block; padding: 0 14px 14px; color: var(--color-accent-text); font-size: 13px; }
.product-depth__exploration { margin-top: 6px !important; }
@media (max-width: 767px) {
  /* 展开说明：收间距，收起态更紧（2026-09-30） */
  .product-depth__list { gap: 10px; margin-top: 22px; }
  .product-depth__item { border-radius: 16px; }
  .product-depth__trigger { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 10px; min-height: 56px; padding: 12px 14px; }
  .product-depth__trigger-index { grid-column: 1; font-size: 12px; }
  .product-depth__trigger-title { grid-column: 1; font-size: 16px; }
  .product-depth__trigger-mark { grid-column: 2; grid-row: 1 / 3; font-size: 20px; }
  .product-depth__panel { grid-template-columns: minmax(0, 1fr); gap: 6px; padding: 0 14px 12px; }
  .product-depth__fact { grid-template-columns: 68px minmax(0, 1fr); gap: 8px; padding: 9px 0; }
  .product-depth__software { margin-top: 0; }
  .product-depth__software-image { height: 150px; }
  .product-depth__research { margin-top: 18px; }
  .product-depth__research > summary { min-height: 72px; }
  .product-depth__research > summary strong { font-size: 18px; }
  .product-depth__theories { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .product-depth__theory summary { align-content: center; min-height: 66px; padding: 8px; font-size: 13px; line-height: 1.3; }
  .product-depth__theory-status { font-size: 11px; }
  .product-depth__theory[open] { grid-column: 1 / -1; }
  .product-depth__theory[open] summary { min-height: 48px; }
  /* 图解槽：全宽 4:3，禁止按高度反推宽度导致横向溢出 */
  .product-line__art {
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 4 / 3;
    max-width: 100%;
    padding: 12px;
  }
  .pl-figure { gap: 6px; }
  .pl-figure__caption { flex-wrap: wrap; gap: 4px 8px; font-size: 11px; line-height: 1.45; }
  /* 触控目标：区块出口与文字链统一 ≥44px */
  main[data-page='ai-sop'] .link-arrow {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding-block: 10px;
  }
}

.product-line-panel { display: grid; gap: 14px; }
.product-line__tag {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 10px;
  border-radius: var(--radius-control);
  background: var(--color-brand-soft);
  color: var(--color-accent-text);
  font-size: 12px;
  font-weight: 650;
}
.product-line__title {
  margin: 0;
  font-size: var(--module-title-size);
  font-weight: 650;
  line-height: 1.25;
  letter-spacing: -.02em;
}
.product-line__summary {
  margin: 0;
  max-width: 46ch;
  color: var(--color-secondary);
  line-height: 1.75;
}
.product-line__caps {
  display: grid;
  gap: 0;
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--color-border-light);
}
.product-line__cap {
  display: grid;
  grid-template-columns: minmax(120px, .55fr) minmax(0, 1fr);
  gap: 8px 20px;
  align-items: baseline;
  padding: 14px 0;
  border-bottom: 1px solid var(--color-border-light);
}
.product-line__cap-title { margin: 0; font-size: 15px; font-weight: 620; }
.product-line__cap-body { margin: 0; color: var(--color-secondary); font-size: 14px; line-height: 1.7; }
.product-line__note {
  margin: 4px 0 0;
  color: var(--color-secondary);
  font-size: 13px;
  line-height: 1.7;
}

/* 五条产品线共用一个固定高度的图解槽：切换标签时，右侧媒体不跳动。
   AI-SOP、AR光导、动作捕捉、IoT+Agent 使用对应媒体；中台系统保留 DOM 拓扑图。

   注意**没有** `aria-hidden`：AI-SOP 那格放的是有替代文字和图注的真实图片，
   整体隐藏会把这些一起从无障碍树里抹掉。
   纯装饰的子元素（节点示意图、箭头）各自标 `aria-hidden`。 */
.product-line__art {
  display: grid;
  place-items: center;
  height: 480px;
  padding: clamp(14px, 1.8vw, 18px);
  overflow: hidden;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-media);
  background: var(--color-surface-soft);
}
/* 标签行与图解槽的间距：标签行是这一块的入口，下面紧跟内容。 */
.product-lines .module-tabs { margin-top: 26px; }

/* 产品配图共用 3:2 画面框；图片保持完整，说明留在可读图注中。 */
.pl-figure {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto auto;
  gap: 8px;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
}
/* 媒体框填满可用高度；源图通过 object-fit:contain 完整显示。 */
.pl-figure__media {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  aspect-ratio: auto;
  overflow: hidden;
  border-radius: var(--radius-card);
  background: var(--color-surface);
}
.pl-figure__media .media-picture { display: block; width: 100%; height: 100%; }
.pl-figure__image { display: block; width: 100%; height: 100%; object-fit: contain; }
/* 图注可以换行，外层面板尺寸固定，因此不会带动整页上下跳动。 */
.pl-figure__caption {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: 2px 7px;
  text-align: center;
  font-size: 12px;
  line-height: 1.6;
}
.pl-figure__caption-text { color: var(--color-secondary); }
/* 概念插画不是现场实拍 —— 这句话跟图一起出现，别删（config 的 usageNote）。 */
.pl-figure__note { color: var(--color-secondary); font-size: 11px; }
.pl-figure__caption-text + .pl-figure__note::before {
  content: '·';
  margin-right: 7px;
  opacity: .7;
}
.product-line__exploration {
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  margin-bottom: 12px;
  padding: 0 9px;
  border-radius: var(--radius-control);
  background: var(--color-brand-soft);
  color: var(--color-accent-text);
  font-size: 12px;
  font-weight: 620;
}

/* 图外的链路文字（工位画面 → AI-SOP → 过程记录）。
   刻意不画进图片里：图片里的文字读屏读不到、放大就糊、也选不中。 */
.pl-flow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0;
}
.pl-flow__label {
  font-size: 13px;
  font-weight: 620;
  letter-spacing: -.01em;
  white-space: nowrap;
}
.pl-flow__arrow { color: var(--color-accent-text); font-size: 13px; }

/* 中台拓扑示意由 DOM 节点组成，与媒体共用父级固定槽位。 */
.pl-art {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  align-content: center;
  margin-block-end: 0;
}

/* AR光导：外置投影 + 作业面上的三个工位区。
   ⚠️ 这组类名（`.pl-art--worktop` / `.pl-art__projector` / `.pl-worktop` /
   `.pl-worktop__zone--a|b|c`）在仓库里**一直没有对应的 CSS** ——
   已核对 2026-09-29 发布归档（zhongjun-web-20260929-0520.tgz），归档里同样没有，
   属既有缺口而非本次改动引入。原先靠 `.product-line__art` 的 198px 最小高度兜着，
   只表现为"三个词挤成一行"；批次 1 把图解槽统一成 3:2 之后，
   空缺被放大成"一大片空白里横着一行字"，所以在**只补样式、DOM 与 config 文字一字未动**
   的前提下，把类名本身就说明了的那个形状画出来：投影在上，作业面在下，面上分三区。 */
.pl-art--worktop {
  display: grid;
  /* 必须显式给一列 1fr：默认的 auto 列会按内容定宽，
     于是 `.pl-worktop` 的 `width: 100%` 变成"相对自己"而塌成内容宽度。 */
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
  justify-items: center;
  gap: 16px;
}
/* 「作业面上分三区」这个形状是 AR光导那条线先用起来的（.pl-art--worktop）。
   应用场景页的装配工位示意复用它，只换顶部那个器件：那边是外置投影，这边是固定相机。
   两者共用同一套外观，所以选择器写在一起 —— 改一处两页同时生效。 */
.pl-art__projector,
.pl-art__sensor {
  padding: 6px 12px;
  border: 1px solid var(--color-brand-primary);
  border-radius: var(--radius-control);
  background: var(--color-surface-raised);
  color: var(--color-accent-text);
  font-size: 12px;
  font-weight: 620;
}
.pl-worktop {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  padding: 14px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-card);
  background: var(--color-surface-raised);
}
.pl-worktop__zone {
  display: grid;
  place-items: center;
  min-height: 58px;
  border: 1px dashed var(--color-border-muted);
  border-radius: var(--radius-control);
  color: var(--color-secondary);
  font-size: 13px;
  font-weight: 600;
}
.pl-node {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-card);
  background: var(--color-surface-raised);
  text-align: center;
}
.pl-node__title { font-size: 14px; font-weight: 640; }
.pl-node__sub { color: var(--color-secondary); font-size: 11px; }
.pl-node--core { border-color: var(--color-accent-text); box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-brand-primary) 12%, transparent); }
.pl-arrow { display: inline-flex; color: var(--color-accent-text); }

/* AR光导：作业面上的分区指引 */

/* ---------- ProjectProof：项目实践 ---------- */
.project-proof__phases {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-top: 28px;
}
.project-phase {
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 24px 24px 22px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--radius-media);
  background: var(--color-surface-raised);
}
.project-phase__tag {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 10px;
  border-radius: var(--radius-control);
  background: var(--color-brand-soft);
  color: var(--color-accent-text);
  font-size: 12px;
  font-weight: 650;
}
.project-phase__title { margin: 0; font-size: 20px; font-weight: 650; line-height: 1.3; }
.project-phase__body { margin: 0; color: var(--color-secondary); line-height: 1.75; }
.project-phase__steps {
  display: grid;
  gap: 0;
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--color-border-light);
}
.project-phase__step {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 12px;
  align-items: baseline;
  padding: 11px 0;
  border-bottom: 1px solid var(--color-border-light);
  font-size: 14px;
}
.project-phase__step-index {
  color: var(--color-accent-text);
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
/* ---------- 项目实践：深案例四段式 ----------
   「现场问题 → 部署组合 → 运行画面 → 可核实结果」（设计规范 §3 第 2 层）。
   这是"重场景落地"定位的核心承载：视启未来用论文证明能力，我们用
   "这一段到底交付了什么、边界在哪"证明落地。
   用单列而非卡片网格：四段是一条因果链，不是四个并列选项。 */
.project-proof__deep {
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px solid var(--color-border-light);
}
.project-proof__deep-title {
  margin: 0 0 18px;
  font-size: 20px;
  font-weight: 650;
  letter-spacing: -.02em;
}
.project-proof__stages {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.project-proof__stage {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 6px 20px;
  padding: 16px 0;
  border-top: 1px solid var(--color-border-light);
}
.project-proof__stage:first-child { border-top: 0; padding-top: 0; }
.project-proof__stage-label {
  color: var(--color-accent-text);
  font-size: 13px;
  font-weight: 650;
}
.project-proof__stage-body {
  margin: 0;
  color: var(--color-secondary);
  font-size: 15px;
  line-height: 1.78;
}
/* 客户原话：只有逐字取得可公开引述时才渲染（quote 为 null 则整块不存在） */
.project-proof__quote {
  margin: 22px 0 0;
  padding: 18px 22px;
  border-left: 3px solid var(--color-brand-primary);
  border-radius: 0 var(--radius-card) var(--radius-card) 0;
  background: var(--color-section);
}
.project-proof__quote p { margin: 0; color: var(--color-text); font-size: 16px; line-height: 1.75; }
.project-proof__quote-source {
  margin-top: 9px;
  color: var(--color-secondary);
  font-size: 13px;
}
.project-proof__deep-note {
  margin: 18px 0 0;
  color: var(--color-secondary);
  font-size: 13px;
  line-height: 1.7;
}

.project-proof__boundaries { margin-top: 32px; }
.project-proof__boundaries-title {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 14px;
  font-size: 15px;
  font-weight: 650;
}
.project-proof__boundaries-title svg { color: var(--color-secondary); }
.project-proof__boundary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.project-boundary {
  padding: 18px 20px;
  border: 1px solid var(--color-border-light);
  border-left: 3px solid var(--color-brand-accent);
  border-radius: var(--radius-card);
  background: var(--color-surface-soft);
}
.project-boundary__title { margin: 0 0 7px; font-size: 15px; font-weight: 640; }
.project-boundary__body { margin: 0; color: var(--color-secondary); font-size: 14px; line-height: 1.72; }
.project-proof__note {
  margin: 22px 0 0;
  color: var(--color-secondary);
  font-size: 13px;
  line-height: 1.7;
}

@media (max-width: 959px) {
  .product-lines__panel { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  /* 手机图解槽不按高度反推宽度（会 360*4/3=480 横向溢出），改为全宽 4:3。 */
  .product-line__art {
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 4 / 3;
    max-width: 100%;
  }
  .product-line__cap { grid-template-columns: minmax(0, 1fr); gap: 5px; }
  .project-proof__phases { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .project-proof__boundary-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  /* 深案例四段式：手机改为上下堆叠，标签在上（96px 标签列在窄屏会把正文压成一条） */
  .project-proof__stage { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 14px 0; }
}

.company-about .section-head__intro { max-width: 62ch; }
.company-about .row-list { margin-top: 34px; }

@media (max-width: 959px) {
  .company-about .row-list { margin-top: 26px; }
}

/* ── 手机触控目标 ≥44px（DESIGN.md §5）──────────────────────────────
   必须放在文件末尾：这些选择器的基础规则定义在本文件较后位置，
   若写进前面的 767px 断点会被后面的基础规则按源码顺序覆盖。
   2026-09-29 收敛：原先列表里还有 workcell-chip--preview、stepper__button、
   mobile-tabs__btn、workcell-config__select、stepper button —— 那些控件在编辑器
   改成弹窗时就已经删了，源码与运行时 DOM 里都不存在。 */
@media (max-width: 767px) {
  /* 手机上 lead 与事实行自然上下排列（flex 换行即可），
     事实行本来就左对齐，不需要桌面那套"贴右"的复位。 */

  .topology-workcell-chip,
  .topology-btn,
  .topology-check {
    min-height: 44px;
  }
  .topology-workcell-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 10px;
    font-size: 12px;
  }
  .topology-workcells {
    grid-template-columns: minmax(0, 1fr);
  }
  /* 工位名必须完整可读：单列后名称独占一行，取消省略号截断。 */
  .topology-workcell-chip__name {
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
    overflow-wrap: normal;
  }
  .topology-workcell-chip__cameras {
    margin-left: 0;
  }
}

/* ── 320px：产品线三个名字必须全部看得见 ────────────────────────────
   交付包规格「手机：…所有产品名能辨认」+ 验收清单「320px 宽检查不溢出」。
   实测 320px：标签内容 322px 挤在 274px 的可用宽度里，
   最后一个「中台系统」被切掉 25px —— 页面本身没有横向溢出（`docScrollWidth == 320`），
   是标签条自己可滚。但"能滚到"不等于"能辨认"，初始状态就得三个都在。

   只收紧**产品线这一条**标签带：平台模块那一条有 6 个标签、宽得多，
   本来就要滚（那是全站既有的 `.module-tabs` 行为），不要跟着一起改。
   收紧后：内容 322 − 48(内距 24→16) − 8(间距 12→8) = 266 ≤ 274 ✅，
   触控目标仍由高度保证（`--tab-height`，不受这里影响）。 */
@media (max-width: 360px) {
  .product-lines .module-tabs { column-gap: 8px; }
  .product-lines .module-tabs > * { padding-inline: 16px; }
}

/* ── 已知边界：≤340px 时"中台系统"那一格会比另两格高 ─────────────────
   实测（`批次-1/量-窄屏区间.mjs`）：390 / 370 / 360 / 350 差 **0**；
   340 差 58；330 差 64；320 差 71；300 差 84。

   原因不在图解槽的高度机制，而在**文本量**：`.pl-art--stack` 里三个节点
   （现场设备 / 中台系统 / 操作留痕，各带一行说明）在 320px 的 240px 宽槽里
   换行成三排，需要约 230px；而 3:2 的槽只有 160px，框被内容顶高。

   试过并否掉的两条路（别再走一遍）：
     · `flex-wrap: nowrap` + `flex: 1 1 0` 把节点压进一排 —— 节点只剩 57px 宽，
       文字疯狂折行，节点反而长到 194–230px，**320px 高度没修好，可读性还更差**
       （该规则已撤，用户 2026-09-29 明确说这点小问题不用管）；
     · 隐去 `.pl-node__sub` —— 能塞进 160px 且等高，但规格明写
       "AR光导和中台系统保留既有原生图解与**准确配置文字**"，不能为了排版删文字。

   结论：这是个**极窄视口的已知边界**，不是回归。验收清单对 320px 的要求是
   "不溢出 + tabs 能操作"，两条都满足（`docScrollWidth == innerWidth`，三个产品名全可见）。
   等高在 **≥350px** 成立。**若将来要连 320px 也等高，正确的做法是给
   `.product-line__art` 在极窄断点加一个 `min-height`（代价是另两格多出空白），
   而不是压缩文字。** */

/* 首页正文共用一张浅色画布：问题、产品证据与部署关系连续阅读。 */
main[data-page='home'] .site-problems,
main[data-page='home'] .home-product,
main[data-page='home'] .home-proof,
main[data-page='home'] .home-close {
  background: color-mix(in srgb, var(--color-bg) 92%, transparent);
  border-top-color: var(--color-border-light);
  padding-block: clamp(36px, 4vw, 58px);
}
html[data-site-bg] main[data-page='home'] .home-close {
  background: color-mix(in srgb, var(--color-bg) 92%, transparent);
}
main[data-page='home'] .home-product,
main[data-page='home'] .home-proof {
  border-top-color: transparent;
  padding-top: 12px;
}
main[data-page='home'] .site-problems__inner { gap: 20px; }
main[data-page='home'] .site-problems__row {
  grid-template-columns: minmax(0, 1.5fr) minmax(0, .9fr);
  align-items: stretch;
}
main[data-page='home'] .site-problems__grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  border-top: 1px solid var(--color-border-light);
}
main[data-page='home'] .site-problems__item {
  padding: 18px 18px 8px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
main[data-page='home'] .site-problems__item + .site-problems__item {
  padding-left: 18px;
  border-left: 1px solid var(--color-border-light);
}
main[data-page='home'] .site-problems__aside {
  align-content: center;
  padding: 0 0 0 22px;
  border-left: 1px solid var(--color-border-light);
  border-radius: 0;
  background: transparent;
}
.home-product__software { margin: 0; }
.home-product__software-frame {
  overflow: hidden;
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-media);
  background: var(--color-surface-soft);
}
.home-product__software-frame img {
  display: block;
  width: 100%;
  height: auto;
}
.home-product__software-caption {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  padding-block: 12px;
  color: var(--color-secondary);
  font-size: 12px;
  line-height: 1.5;
}
.home-product__software-caption strong { color: var(--color-text); }
main[data-page='home'] .home-close { padding-block: 28px 52px; }
main[data-page='home'] .home-close__card {
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

@media (max-width: 959px) {
  main[data-page='home'] .site-problems__row { grid-template-columns: 1fr; }
  main[data-page='home'] .site-problems__aside {
    padding: 16px 0 0;
    border-left: 0;
    border-top: 1px solid var(--color-border-light);
  }
}
@media (max-width: 559px) {
  main[data-page='home'] .site-problems,
  main[data-page='home'] .home-product,
  main[data-page='home'] .home-proof { padding-block: 30px; }
  main[data-page='home'] .home-product,
  main[data-page='home'] .home-proof { padding-top: 8px; }
  main[data-page='home'] .site-problems__grid { grid-template-columns: 1fr; }
  main[data-page='home'] .site-problems__item { padding: 12px 0; }
  main[data-page='home'] .site-problems__item + .site-problems__item {
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid var(--color-border-light);
  }
  main[data-page='home'] .home-close { padding-block: 28px 42px; }
}

/* 首页问题、软件证据、部署组合按一条叙事排布。 */
main[data-page='home'] .site-problems__inner { gap: 14px; }
main[data-page='home'] .site-problems__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
main[data-page='home'] .site-problems__item { align-content: start; gap: 5px; }
main[data-page='home'] .home-product__layout {
  grid-template-areas: 'intro visual' 'details visual';
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px 48px;
  align-items: start;
}
.home-product__copy { grid-area: intro; }
.home-product__details { grid-area: details; min-width: 0; }
.home-product__visual { grid-area: visual; align-self: center; }
main[data-page='home'] .home-product__actions { margin-top: 16px; }

main[data-page='home'] .home-proof__inner {
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}
.home-proof__head { max-width: 760px; }
.home-proof__comparison {
  overflow: hidden;
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-media);
  background: var(--color-surface);
}
.home-proof__shared {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 16px;
  padding: 16px 22px;
  border-bottom: 1px solid var(--color-border-light);
  background: var(--color-surface-soft);
}
.home-proof__shared-label {
  color: var(--color-accent-text);
  font-size: 12px;
  font-weight: 650;
}
.home-proof__shared-title { font-size: 17px; font-weight: 650; }
.home-proof__shared-detail { color: var(--color-secondary); font-size: 13px; }
.home-proof__modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.home-proof__mode { min-width: 0; padding: 20px 22px 22px; }
.home-proof__mode + .home-proof__mode { border-left: 1px solid var(--color-border-light); }
.home-proof__mode-title { margin: 0 0 12px; font-size: 19px; font-weight: 650; }
.home-proof__chain {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.home-proof__chain-node {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 52px;
  padding: 8px;
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-control);
  background: var(--color-surface-muted);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  text-align: center;
}
.home-proof__device-symbols { display: flex; justify-content: center; align-items: center; gap: 4px; min-height: 30px; color: var(--color-accent-text); }
.home-proof__device-symbols svg { flex: 0 0 auto; }
.home-proof__node-label { font-size: inherit; font-weight: 600; }
.home-proof__node-detail { color: var(--color-secondary); font-size: 11px; font-weight: 400; line-height: 1.5; }
.home-proof__chain-node { gap: 6px; padding-block: 14px; }
[data-deployment-mode='multi'] .home-proof__device-symbols:has(svg + svg) svg { width: 18px; height: 18px; }
.home-proof__chain-node:not(:last-child)::after {
  position: absolute;
  right: -14px;
  top: 50%;
  width: 10px;
  color: var(--color-accent-text);
  content: '→';
  font-size: 10px;
  transform: translateY(-50%);
}
.home-proof__mode-summary { margin: 12px 0 0; color: var(--color-secondary); font-size: 14px; line-height: 1.55; }
.home-proof__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px 24px; }
main[data-page='home'] .home-proof__foot .home-proof__note {
  margin: 0;
  padding: 0;
  color: var(--color-secondary);
  font-size: 13px;
  line-height: 1.5;
}

@media (max-width: 959px) {
  main[data-page='home'] .home-product__layout {
    grid-template-areas: 'intro' 'visual' 'details';
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }
}
@media (max-width: 767px) {
  /* 按实际内容区定尺，四字 + 七字标题默认完整显示一行。 */
  main[data-page='home'] :is(.site-problems__title-main, .home-product__title, .home-proof__title, .home-close__title) {
    max-width: none;
    font-size: clamp(18px, 7cqi, 28px);
    line-height: 1.35;
    white-space: nowrap;
  }
  main[data-page='home'] .home-product__visual { width: 100%; justify-self: center; }
  main[data-page='home'] .site-problems,
  main[data-page='home'] .home-product,
  main[data-page='home'] .home-proof { padding-block: 22px; }
  main[data-page='home'] .home-product,
  main[data-page='home'] .home-proof { padding-top: 6px; }
  main[data-page='home'] .site-problems__grid { grid-template-columns: 1fr; }
  main[data-page='home'] .site-problems__item { padding: 10px 0; }
  main[data-page='home'] .site-problems__item + .site-problems__item {
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid var(--color-border-light);
  }
  main[data-page='home'] .site-problems__title-main { margin-top: 0; }
  main[data-page='home'] .site-problems__title { font-size: 16px; }
  main[data-page='home'] .site-problems__body { line-height: 1.5; }
  main[data-page='home'] .home-product__layout { gap: 12px; }
  main[data-page='home'] .home-product__details .row-list__row { padding: 10px 0; }
  main[data-page='home'] .home-product__actions { margin-top: 12px; }
  main[data-page='home'] .home-proof__inner { gap: 14px; }
  main[data-page='home'] .home-proof__lead { margin-top: 8px; line-height: 1.55; }
  .home-proof__shared { padding: 12px 14px; }
  .home-proof__shared-title { font-size: 15px; }
  .home-proof__shared-detail { flex-basis: 100%; font-size: 12px; }
  .home-proof__modes { grid-template-columns: minmax(0, 1fr); }
  .home-proof__mode { padding: 12px 14px 14px; }
  .home-proof__mode + .home-proof__mode {
    border-left: 0;
    border-top: 1px solid var(--color-border-light);
  }
  .home-proof__mode-title { margin-bottom: 8px; font-size: 16px; }
  .home-proof__chain { gap: 12px; }
  .home-proof__chain-node:not(:last-child)::after { right: -10px; width: 8px; }
  .home-proof__chain-node { min-height: 42px; padding: 6px 4px; font-size: 12px; }
  .home-proof__chain-node { gap: 4px; padding-block: 10px; }
  .home-proof__device-symbols { gap: 2px; }
  [data-deployment-mode='multi'] .home-proof__device-symbols:has(svg + svg) svg { width: 16px; height: 16px; }
  .home-proof__node-detail { font-size: 10px; }
  .home-proof__mode-summary { margin-top: 7px; font-size: 12px; }
  .home-proof__foot { display: grid; gap: 12px; }
  .home-proof__foot .link-arrow { justify-self: start; }
}

/* 首页客户由访客手动查看：一条名单，无自动移动或循环副本。 */
.customer-strip__head { align-items: center; }
.customer-strip__viewer { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; gap: 4px; border-block: 1px solid var(--color-border-light); }
.customer-strip__arrow { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: var(--radius-control); background: transparent; color: var(--color-accent-text); cursor: pointer; }
.customer-strip__arrow:hover:not(:disabled) { background: var(--color-surface-soft); }
.customer-strip__arrow:disabled { color: var(--color-secondary); opacity: .35; cursor: default; }
.customer-marquee { display: block; min-width: 0; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; overscroll-behavior-inline: contain; }
/* 无边界回环：两份名单并排，第二份 aria-hidden，滚到头跳到对称位置。 */
.customer-marquee--loop { display: flex; flex-wrap: nowrap; }
.customer-marquee::-webkit-scrollbar { display: none; }
.customer-marquee__track { width: max-content; flex: 0 0 auto; display: flex; flex-wrap: nowrap; gap: 0; animation: none; transform: none; will-change: auto; }
.customer-marquee__name { display: grid; place-items: center; min-height: 52px; padding-inline: 20px; font-size: 16px; border-right: 1px solid var(--color-border-light); }
.customer-marquee__name:last-child { border-right: 0; }

/* 一个板块串起现场问题与解决方式，详细软件界面留在产品页。 */
main[data-page='home'] .home-product { padding-top: 36px; border-top-color: var(--color-border-light); }
main[data-page='home'] .home-product__layout { grid-template-areas: 'intro intro' 'problems details'; align-items: start; gap: 22px 48px; }
.home-product__problems { grid-area: problems; min-width: 0; }
main[data-page='home'] .home-product__problems .site-problems__grid { grid-template-columns: 1fr; gap: 0; }
main[data-page='home'] .home-product__problems .site-problems__item { padding: 16px 0; border-left: 0; }
main[data-page='home'] .home-product__problems .site-problems__item + .site-problems__item { border-top: 1px solid var(--color-border-light); }
main[data-page='home'] .home-product__lead { max-width: 65ch; }
main[data-page='home'] .home-close { padding-block: 24px 32px; }
main[data-page='home'] .home-close__card { gap: 12px; }
.site-footer { padding-block: 18px; }
.site-footer__inner { gap: 6px; }
.site-footer__company { font-size: 13px; line-height: 1.5; }
.site-footer__legal { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px var(--space-4); min-height: 0; font-size: 12px; color: var(--color-secondary); }
.site-footer__filing { margin: 0; font-size: inherit; line-height: 1.5; }
@media (max-width: 767px) {
  .customer-strip__head { align-items: center; }
  .customer-marquee__name { padding-inline: 14px; font-size: 15px; }
  main[data-page='home'] .home-product { padding-top: 22px; }
  main[data-page='home'] .home-product__layout { grid-template-areas: 'intro' 'problems' 'details'; grid-template-columns: minmax(0, 1fr); gap: 14px; }
  main[data-page='home'] .home-product__problems .site-problems__item { padding-block: 10px; }
  .site-footer { padding-block: 12px; }
  .site-footer__company { font-size: 12px; }
  .site-footer__legal { font-size: 11px; }
}

/* 一次作业的一条链路：问题、处理与结果放在同一结构里。 */
main[data-page='home'] .home-product__layout { grid-template-columns: minmax(0, 1fr); grid-template-areas: 'intro' 'process' 'actions'; gap: 18px; }
.home-product__process { grid-area: process; overflow: hidden; border: 1px solid var(--color-border-light); border-radius: var(--radius-media); background: var(--color-surface); }
.home-process__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 16px; padding: 14px 22px; background: var(--color-surface-soft); border-bottom: 1px solid var(--color-border-light); font-size: 13px; }
.home-process__head strong { font-weight: 600; }
.home-process__head span { color: var(--color-secondary); }
.home-process__stages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.home-process__stage { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; padding: 22px; align-content: start; }
.home-process__stage + .home-process__stage { border-left: 1px solid var(--color-border-light); }
.home-process__number { color: var(--color-accent-text); font-size: 12px; line-height: 24px; font-weight: 600; }
.home-process__title { margin: 0; font-size: 17px; line-height: 24px; font-weight: 650; }
.home-process__question { margin-top: 10px; color: var(--color-text); font-size: 13px; line-height: 1.55; }
/* 说明与「可查看」并成一段（2026-09-30）：列宽约 320px，两块上下叠会碎；
   内联在同一段文字流里，读作「做什么 · 可查看什么」。 */
.home-process__meta {
  display: block;
  margin-top: 6px;
  color: var(--color-secondary);
  font-size: 13px;
  line-height: 1.65;
}
.home-process__method {
  display: inline;
  margin: 0;
}
.home-process__output {
  display: inline;
  margin: 0;
  font-size: 12px;
}
.home-process__output-label {
  color: var(--color-text);
  font-weight: 700;
}
.home-process__output-label::before {
  content: '·';
  margin: 0 6px;
  color: var(--color-secondary);
  font-weight: 500;
}
.home-process__output-label::after {
  content: '';
}
.home-process__content > .link-arrow { margin-top: 6px; font-size: 12px; }
main[data-page='home'] .home-product__actions { grid-area: actions; margin-top: 0; }
main[data-page='home'] .home-close__body { max-width: 64ch; }
@media (max-width: 767px) {
  main[data-page='home'] .home-product__layout { gap: 14px; }
  .home-process__head { padding: 12px 14px; font-size: 12px; }
  .home-process__stages { grid-template-columns: minmax(0, 1fr); }
  .home-process__stage { padding: 14px; gap: 8px; }
  .home-process__stage + .home-process__stage { border-left: 0; border-top: 1px solid var(--color-border-light); }
  .home-process__title { font-size: 16px; }
  .home-process__question { margin-top: 5px; }
  .home-process__output { margin-top: 0; white-space: normal; }
  main[data-page='home'] .home-close__body { font-size: 14px; line-height: 1.6; }
}

/* ===== 产品协同 · 手机连续阅读（2026-09-30） =====
   桌面左文右图可以；手机上下两截会「割裂」。
   这里把可见面板拉平成一条阅读流：标签 → 标题 → 说明 → 图解 → 能力 → 备注，
   图插在说明与能力之间，整块用一张浅卡收住。 */
@media (max-width: 767px) {
  .product-lines__panel {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 18px;
    padding: 16px 14px 18px;
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-card);
    background: var(--color-surface);
  }
  .product-lines__copy { display: contents; }
  .product-line-panel { display: contents; }
  .product-line-panel[hidden] { display: none !important; }

  .product-line__exploration { order: 0; align-self: flex-start; }
  .product-line__title { order: 1; margin: 0; font-size: 20px; line-height: 1.3; }
  .product-line__summary { order: 2; margin: 0; font-size: 14px; line-height: 1.65; }
  .product-line__art { order: 3; }
  .product-line__caps {
    order: 4;
    display: grid;
    gap: 0;
    margin: 4px 0 0;
    padding: 0;
    list-style: none;
  }
  .product-line__cap {
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
    padding: 12px 0;
    border-top: 1px solid var(--color-border-light);
  }
  .product-line__cap:first-child { border-top: 0; padding-top: 4px; }
  .product-line__cap-title { font-size: 14px; }
  .product-line__cap-body { font-size: 13px; line-height: 1.6; }
  .product-line__note {
    order: 5;
    margin: 0;
    padding-top: 10px;
    border-top: 1px solid var(--color-border-light);
    color: var(--color-secondary);
    font-size: 12px;
    line-height: 1.55;
  }
  /* 下钻必须排在能力/备注之后（order 默认 0 会顶到标题前，2026-09-30 修） */
  .pl-drill { order: 6; }
  .pl-drill + .pl-drill { order: 7; }
}

/* ===== 内页首屏手机收紧（2026-09-30，置于文末以免被后置基样式覆盖） ===== */
@media (max-width: 767px) {
  .product-lines--hero {
    padding-block: 24px 22px;
  }
  .scenarios-hero {
    padding-block: 24px 16px;
  }
  .product-lines--hero .section-head__title--hero,
  .scenarios-hero .section-head__title--hero { }
  .product-lines--hero .section-head__intro,
  .scenarios-hero .section-head__intro {
    margin-top: 8px;
    font-size: 14px;
    line-height: 1.6;
  }
  .product-lines .module-tabs { margin-top: 16px; }
  .page-hero { padding-block: 28px 28px; }
}

/* ===== AI-SOP 下钻（2026-09-30 方案 C） ===== */
.pl-drill {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--color-border-light);
}
.pl-drill + .pl-drill { margin-top: 16px; }
.pl-drill__title { margin: 0 0 6px; font-size: 15px; font-weight: 700; }
.pl-drill__lead {
  margin: 0 0 10px;
  color: var(--color-secondary);
  font-size: 13px;
  line-height: 1.6;
}
.pl-drill__list { display: grid; gap: 8px; }
.pl-drill__item {
  border: 1px solid var(--color-border-light);
  border-radius: 10px;
  background: var(--color-surface);
  overflow: hidden;
}
.pl-drill__summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  min-height: 48px;
  padding: 10px 12px;
  cursor: pointer;
  list-style: none;
}
.pl-drill__summary::-webkit-details-marker { display: none; }
.pl-drill__index {
  color: var(--color-accent-text);
  font-size: 12px;
  font-weight: 700;
}
.pl-drill__label { flex: 1; font-size: 14px; font-weight: 650; }
.pl-drill__meta { color: var(--color-secondary); font-size: 11px; }
.pl-drill__body {
  padding: 0 12px 12px;
  border-top: 1px solid var(--color-border-light);
}
.pl-drill__text {
  margin: 10px 0 0;
  color: var(--color-secondary);
  font-size: 13px;
  line-height: 1.65;
}
.pl-drill__text strong {
  margin-right: 6px;
  color: var(--color-text);
  font-size: 12px;
}
.pl-drill__points {
  margin: 8px 0 0;
  padding-left: 18px;
  color: var(--color-secondary);
  font-size: 12px;
  line-height: 1.6;
}
.pl-drill__cta { margin: 10px 0 0; }
.pl-drill__cta .link-arrow {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
@media (max-width: 767px) {
  .pl-drill { margin-top: 14px; padding-top: 12px; }
}

/* ===== 产品页手机叙事收紧（2026-09-30，对齐首页节奏） ===== */
@media (max-width: 767px) {
  .product-lines--hero {
    padding-block: 20px 14px;
  }
  .product-lines--hero .section-head__title--hero { }
  .product-lines--hero .section-head__intro {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.55;
  }
  .product-lines .module-tabs {
    margin-top: 12px;
    gap: 6px;
  }
  .product-lines__panel {
    gap: 10px;
    margin-top: 12px;
    padding: 12px 12px 14px;
  }
  .product-line__title {
    font-size: 18px;
    line-height: 1.32;
  }
  .product-line__summary {
    font-size: 13px;
    line-height: 1.6;
  }
  .product-line__art {
    aspect-ratio: 16 / 10;
  }
  .product-line__caps { margin-top: 2px; }
  .product-line__cap {
    gap: 3px;
    padding: 9px 0;
  }
  .product-line__cap-title { font-size: 13px; }
  .product-line__cap-body {
    font-size: 12px;
    line-height: 1.55;
  }
  .product-line__note {
    padding-top: 8px;
    font-size: 11px;
    line-height: 1.5;
  }
  .pl-drill {
    margin-top: 12px;
    padding-top: 10px;
  }
  .pl-drill + .pl-drill { margin-top: 12px; }
  .pl-drill__title {
    margin-bottom: 4px;
    font-size: 14px;
  }
  .pl-drill__lead {
    margin-bottom: 8px;
    font-size: 12px;
    line-height: 1.55;
  }
  .pl-drill__list { gap: 6px; }
  .pl-drill__summary {
    min-height: 44px;
    padding: 8px 10px;
  }
  .pl-drill__label { font-size: 13px; }
  .pl-drill__body { padding: 0 10px 10px; }
  .pl-drill__text {
    margin-top: 8px;
    font-size: 12px;
    line-height: 1.55;
  }
  .metric-band[data-band='ai-sop'] .metric {
    padding: 12px 10px;
    gap: 4px;
  }
}

/* ===== 产品页文案节奏与配图（2026-09-30） ===== */
.product-line__summary {
  max-width: 48ch;
  line-height: 1.7;
}
.product-line__caps {
  margin-top: 10px;
}
.product-line__cap + .product-line__cap {
  margin-top: 2px;
}
.product-line__cap-title {
  letter-spacing: -.01em;
}
.product-line__cap-body {
  max-width: 46ch;
  line-height: 1.65;
}
.product-line__note {
  max-width: 52ch;
  line-height: 1.55;
}
.pl-figure__caption {
  gap: 4px 10px;
}
.pl-figure__note {
  opacity: 0.85;
}
.pl-flow {
  margin-top: 10px;
}
@media (max-width: 767px) {
  .product-line__summary {
    max-width: none;
    line-height: 1.62;
  }
  .product-line__cap-body {
    max-width: none;
    line-height: 1.58;
  }
  .product-line__art {
    border-radius: 16px;
    padding: 10px;
  }
  .pl-figure__caption {
    font-size: 11px;
    line-height: 1.45;
  }
  .pl-drill__lead {
    max-width: 40ch;
  }
}

/* ===== 产品页下钻组件全宽（2026-09-30） ===== */
.pl-drill {
  width: 100%;
  max-width: none;
}
.pl-drill__list {
  width: 100%;
}
.pl-drill__item {
  width: 100%;
  max-width: none;
}
.pl-drill__summary {
  width: 100%;
}
.pl-drill__lead {
  max-width: none;
}
@media (max-width: 767px) {
  .product-lines__panel {
    width: 100%;
    max-width: none;
    padding-inline: 0;
  }
  .product-line__summary,
  .product-line__cap-body,
  .product-line__note {
    max-width: none;
    width: 100%;
    padding-inline: 2px;
  }
  .product-line__title { padding-inline: 2px; }
  .pl-drill {
    width: 100%;
    max-width: none;
    padding-inline: 0;
  }
  .pl-drill__lead {
    max-width: none;
    padding-inline: 2px;
  }
  .pl-drill__list,
  .pl-drill__item {
    width: 100%;
    max-width: none;
  }
}

/* ===== 应用场景页：对齐首页/产品页节奏（2026-09-30） ===== */
.scenarios-hero .section-head__intro {
  max-width: 48ch;
}
.scenario-feature {
  padding-block: clamp(28px, 4vw, 48px);
}
.scenario-feature__head {
  margin-bottom: 18px;
}
.page-content-section--tint .section-head {
  margin-bottom: 22px;
}
.page-close .section-head__intro {
  max-width: 48ch;
}
@media (max-width: 767px) {
  .scenarios-hero {
    padding-block: 20px 12px;
  }
  .scenarios-hero .section-head__title--hero { }
  .scenarios-hero .section-head__intro {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.55;
    max-width: none;
  }
  .scenario-feature {
    padding-block: 18px 22px;
  }
  .scenario-feature__head {
    margin-bottom: 12px;
  }
  .scenario-feature__title {
    font-size: 18px;
  }
  .scenario-feature__lead {
    font-size: 13px;
    line-height: 1.58;
  }
  .page-content-section--tint {
    padding-block: 20px;
  }
  .page-content-section--tint .section-head {
    margin-bottom: 14px;
  }
  .page-content-section--tint .section-head__intro {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.55;
  }
  .editorial-split {
    gap: 14px;
  }
  .editorial-list__item {
    padding: 12px 0;
  }
  .page-close {
    padding-block: 18px 24px;
  }
  .page-close .section-head__intro {
    margin-top: 6px;
    font-size: 13px;
    max-width: none;
  }
}

/* ===== 应用场景页再收紧（2026-09-30） ===== */
@media (max-width: 767px) {
  .scenarios-hero {
    padding-block: 16px 8px;
  }
  .scenarios-hero .section-head__title--hero { }
  .scenarios-hero .section-head__intro {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.5;
  }
  .scenario-feature {
    padding-block: 12px 16px;
  }
  .scenario-feature__head {
    margin-bottom: 10px;
  }
  .scenario-feature__title {
    font-size: 17px;
    line-height: 1.3;
  }
  .scenario-feature__lead {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.55;
  }
  .scenario-case-gallery {
    gap: 6px;
    margin-top: 10px;
  }
  .page-content-section--tint {
    padding-block: 14px;
  }
  .page-content-section--tint .section-head {
    margin-bottom: 10px;
  }
  .page-content-section--tint .section-head__intro {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.5;
  }
  .editorial-list__item {
    padding: 8px 0;
    gap: 3px;
  }
  .editorial-list__item h3 {
    font-size: 13px;
  }
  .editorial-list__item p {
    font-size: 12px;
    line-height: 1.55;
  }
  .page-close {
    padding-block: 12px 18px;
  }
  .page-close .section-head__title {
    font-size: var(--section-title-size);
  }
  .page-close .section-head__intro {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.5;
    max-width: none;
  }
  .page-close__actions {
    margin-top: 12px;
    gap: 10px;
  }
}

/* ===== 全站标题与首页对齐（2026-09-30） =====
   首页手机标题：font-size: clamp(18px, 8.2cqi, 32px); line-height: 1.35;
   字距 --hero-title-tracking；字重 --weight-semibold。
   内页原先各写一套（28–40px），跨页不齐。 */
.site-container {
  container-type: inline-size;
}
.section-head__title--hero,
.page-hero__title,
.product-lines--hero .section-head__title--hero,
.scenarios-hero .section-head__title--hero,
main[data-page='contact'] .page-hero__title,
.section.dspec .section-head__title--hero {
  font-size: clamp(18px, 8.2cqi, 32px);
  line-height: 1.35;
  letter-spacing: var(--hero-title-tracking);
  font-weight: var(--weight-semibold);
  max-width: none;
  white-space: pre-line;
}
.section-head__title--hero + .section-head__intro,
.page-hero__title + .page-hero__body {
  margin-top: 12px;
}
@media (min-width: 768px) {
  .section-head__title--hero,
  .page-hero__title,
  .product-lines--hero .section-head__title--hero,
  .scenarios-hero .section-head__title--hero,
  main[data-page='contact'] .page-hero__title,
  .section.dspec .section-head__title--hero {
    font-size: var(--hero-title-size);
    line-height: var(--hero-title-line);
    letter-spacing: var(--hero-title-tracking);
    font-weight: var(--weight-semibold);
  }
  .section-head__title--hero + .section-head__intro,
  .page-hero__title + .page-hero__body {
    margin-top: 16px;
  }
}

/* ===== 交付页拓扑手机收紧（2026-09-30） ===== */
@media (max-width: 767px) {
  main[data-page='delivery'] .topology-section .section__inner {
    padding-block: 22px 24px;
  }
  .topology-section__head {
    margin-bottom: 14px;
  }
  .topology-section__head .section-head__intro {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.55;
  }
  .topology-section__actions {
    margin-top: 12px;
    gap: 10px;
  }
  .topology-canvas {
    gap: 18px;
    margin-top: 8px;
  }
  .topology-overview {
    margin-top: 10px;
    gap: 10px;
    font-size: 12px;
  }
  .topology-summary {
    gap: 10px;
    padding: 12px 12px 14px;
  }
  .topology-summary__label {
    margin-bottom: 3px;
    font-size: 11px;
  }
  .topology-summary__text {
    font-size: 12px;
    line-height: 1.55;
  }
  .topology-summary__actions {
    gap: 8px;
  }
  .topology-summary .btn {
    min-height: 42px;
    font-size: 12px;
  }
}

/* ===== 拓扑图解化节点（2026-09-30 A+B）=====
   小图标 + 名称的芯片节点，弱化大白卡；线型区分运行/接入。 */
.topology-node__icon {
  flex: 0 0 32px;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: var(--color-brand-soft);
  color: var(--color-accent-text);
}
.topology-node__mark {
  flex: 0 0 8px;
  width: 8px;
  height: 8px;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-brand-primary) 14%, transparent);
}
.topology-node {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}
.topology-node:hover {
  background: var(--color-surface-wash);
}
.topology-node--software,
.topology-node--server {
  border-radius: var(--radius-control);
  border: 1px solid var(--color-border-light);
  background: var(--color-surface-wash);
}
.topology-node--software {
  border-color: color-mix(in srgb, var(--color-brand-primary) 35%, transparent);
}
.topology-node--server {
  border-style: dashed;
  border-color: var(--color-border-muted);
}
.topology-node--edge {
  min-height: 0;
  padding: 12px 14px 14px;
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-card);
  background: var(--color-surface-wash);
}
.topology-node__title {
  font-size: clamp(14px, 1.4vw, 17px);
  font-weight: 650;
}
.topology-node__role {
  margin-top: 2px;
  margin-left: 0;
  font-size: 12px;
}
.topology-node__kind {
  color: var(--color-accent-text);
  opacity: .75;
}
.topology-workcell-chip {
  gap: 6px;
  border-radius: 999px;
  border-color: var(--color-border-light);
  background: var(--color-surface);
}
.topology-workcell-chip__icon {
  color: var(--color-accent-text);
  opacity: .85;
  display: inline-flex;
}
/* 连线：运行=虚线品牌蓝；接入=实线浅灰；节点交汇更轻 */
.topology-link {
  stroke-width: 1.5;
}
.topology-link--control {
  stroke: var(--color-brand-primary);
  stroke-dasharray: 4 8;
  opacity: .45;
}
.topology-link--data {
  stroke: var(--color-topology-line);
  opacity: .95;
}
.topology-legend {
  margin-top: 14px;
}
.topology-legend__item {
  font-size: 11px;
}

/* ===== 拓扑可扩展布局（2026-09-30）=====
   节点更紧凑：加边缘机/工位不把整页撑爆。
   ⚠️ 这里**刻意没有** `overflow: auto` + `max-height`：那会让画布变成页内滚动区，
   手机上就会出现嵌套滚动（用户已明确要求去掉）。见文件末尾的对齐一节。 */
.topology-canvas {
  gap: 28px;
  justify-items: stretch;
  padding: 8px 4px 12px;
}
.topology-tier {
  width: 100%;
}
.topology-tier--core {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}
.topology-node--software,
.topology-node--server {
  min-height: 56px;
  padding: 10px 14px;
}
.topology-node--edge {
  min-height: 0;
  padding: 10px 12px 12px;
}
.topology-workcells {
  gap: 6px;
}
.topology-workcell-chip {
  /* 紧凑档只收水平内距与字号，**不动触控高度**（见文件前半段同名规则上的注释）。 */
  min-height: var(--control-touch-height);
  padding: 6px 10px;
  font-size: 11px;
}
.topology-node__icon {
  flex-basis: 28px;
  width: 28px;
  height: 28px;
  border-radius: 8px;
}
/* 图例左对齐，与工具条、页首说明同一起始边。
   2026-09-30 改版前它居中（那时上面是居中的节点图）；现在它紧跟在
   左对齐的工位数工具条下面，居中会让这一列出现第二个对齐轴。 */
.topology-legend {
  justify-content: flex-start;
}
@media (max-width: 767px) {
  .topology-canvas {
    gap: 16px;
    padding: 4px 0 8px;
  }
  .topology-tier--edges {
    gap: 8px;
  }
  .topology-node--software,
  .topology-node--server {
    min-height: 48px;
    padding: 8px 10px;
  }
  .topology-node--edge {
    padding: 8px 10px 10px;
  }
  .topology-workcells {
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
    margin-top: 8px;
    margin-left: 0;
  }
  .topology-workcell-chip {
    /* 手机端**只收水平内距**：触控高度保持 44px。
       这里原先写死 36px，等于把"手机上最容易点错的一排控件"压到不足指头高度，
       也让 `experience-check` 的「拓扑手机触控尺寸」断言失败。 */
    min-height: var(--control-touch-height);
    padding: 6px 8px;
  }
  .topology-node__badges {
    margin-left: 0;
    margin-top: 6px;
    gap: 4px;
  }
}

/* ===== 拓扑对齐（2026-09-30）===== */
/* ⚠️ 画布**不再是滚动容器**（2026-09-30 用户要求：「手机端拓扑图页面内的滑动就不要了」）。
   原先它带 `overflow: auto` + `max-height: min(72vh, 720px)`（手机 58vh），
   图超出就在这一块内部滚 —— 结果是手机上出现了"页面里还有一个滚动区"：
   手指在图上是滚图、在图外是滚页，两个滚动嵌套，读图和读正文都不顺。
   现在图按自然高度展开，滚动交给整页。节点数与工位数的可扩展性由
   `layoutEdgeColumns()`（按画布实测宽度算列数）保证，不靠滚动兜底。
   下面两条 `justify-items` / 滚动条隐藏保留：前者是居中对齐需要，
   后者是无害的兜底（若将来某个断点又出现横向溢出，至少不出现一条粗滚动条）。 */
.topology-canvas {
  justify-items: center;
  scrollbar-width: none;
}
.topology-canvas::-webkit-scrollbar {
  display: none;
}
.topology-tier--core {
  justify-content: center;
  width: 100%;
}
.topology-tier--edges {
  justify-content: center;
}
.topology-node--software,
.topology-node--server {
  justify-content: center;
  text-align: center;
}
.topology-node--software .topology-node__body,
.topology-node--server .topology-node__body {
  display: grid;
  gap: 2px;
  justify-items: center;
}
.topology-node--software .topology-node__role,
.topology-node--server .topology-node__role {
  margin: 0;
  text-align: center;
}
.topology-node--software .topology-node__kind,
.topology-node--server .topology-node__kind {
  margin-left: 0;
}
.topology-node--software,
.topology-node--server {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px 12px;
}
.topology-node--edge {
  width: 100%;
}
.topology-node__heading--select {
  justify-content: center;
  gap: 8px;
}
.topology-node__badges {
  justify-content: center;
}
.topology-workcell-chip {
  justify-content: flex-start;
  gap: 6px;
}
.topology-workcell-chip__name {
  flex: 1;
}
.topology-workcell-chip__cameras {
  margin-left: 0;
}
.topology-workcell-chip__cameras::before {
  display: none;
}
.topology-workcell-chip__icon {
  flex: 0 0 auto;
}
@media (max-width: 767px) {
  .topology-node--edge {
    width: 100%;
  }
  .topology-tier--edges {
    width: 100%;
  }
}

/* ===== 关于页底色统一（2026-09-30）=====
   开篇 / 词云 / 加入我们 同一白底，去掉蓝灰分区，避免三截拼接。 */
.join-us-section {
  background: transparent;
  border-top: 1px solid var(--color-border-light);
  padding-block: clamp(28px, 4vw, 40px);
}
.company-about--story {
  background: var(--color-bg);
  padding-block: clamp(32px, 5vw, 56px) clamp(20px, 3vw, 32px);
}
.company-story__block {
  margin-top: 22px;
}
.voices-cloud__frame {
  background: transparent;
  border-color: transparent;
  padding-inline: 0;
}

/* 发布前细节：介绍与媒体并排，下钻在其下方完整铺开。 */
.product-line__overview { display: grid; gap: 14px; min-width: 0; }
.product-line__details { min-width: 0; }
@media (min-width: 960px) {
  .product-lines__copy,
  .product-line-panel:not([hidden]) { display: contents; }
  .product-line__overview { grid-column: 1; grid-row: 1; }
  .product-line__art { grid-column: 2; grid-row: 1; }
  .product-line__details {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 32px;
  }
  .product-line__details .pl-drill { margin-top: 0; }
}
@media (max-width: 767px) {
  .product-line__overview { display: contents; }
  .product-line__details { order: 6; width: 100%; }
  .product-lines__panel { padding-inline: 12px; }
  .product-line__art { aspect-ratio: auto; }
  .product-line__art .pl-figure { height: auto; grid-template-rows: auto auto auto; }
  .product-line__art .pl-figure__media { position: relative; height: auto; aspect-ratio: 4 / 3; }
  .product-line__art .pl-figure__image { position: absolute; inset: 0; width: 100%; height: 100%; }
  .product-line__title,
  .product-line__summary,
  .product-line__cap-body,
  .product-line__note,
  .pl-drill__lead { padding-inline: 0; }
  /* ⚠️ 这里**不再**把标签行改成 3 列网格，也不再把它压成小胶囊。
     网格版本（`display: grid; repeat(3, …); overflow: visible`）与循环滑条互斥：
     滑条要一个"可滚动的裁切视口"，网格把容器变成 `overflow: visible` 的等分列，
     于是滑动改了 URL、标签却一动不动（选中项与容器中心差 116.67px）。
     压成小胶囊（`padding-inline: 4px` + `font-size: 11px`）同样不行：
     五格总宽只剩约 289px，比容器还窄，"内容不溢出 → scrollLeft 恒为 0"，
     中心吸附没有可滚的行程。所以这里**保持设计标记宽度**，滑条才有行进空间。 */
  .product-lines .module-tabs.is-loop-slider > * {
    flex: 0 0 auto;
    width: var(--product-tab-width);
    min-width: 0;
  }
  .product-lines .module-tab {
    min-width: 0;
    padding-inline: 8px;
    font-size: clamp(12px, 3.4vw, 14px);
    white-space: nowrap;
  }
}
/* ===== 产品线标签：手机循环滑条（2026-09-30）=====
 *
 * `scripts/product-slider.js` 负责手势、取模循环与"选中项居中"：
 * 它给容器加 `is-loop-slider`，并把选中项滚到容器中心（该文件的 `centre()`）。
 * 这里提供三件它必须先有的东西：
 *   ① **可滚动的裁切视口**（`overflow-x: auto` + 隐藏滚动条）；
 *   ② **两侧内距 = (一格宽 − 间距) / 2** —— 使"滚到中线"与"吸附对齐"成为同一件事；
 *   ③ 每格 `flex: 0 0 auto`，不被压缩，宽度由 `--product-tab-width` 决定。
 *
 * ⚠️ 踩过的坑（2026-09-30，三版才立住，别退回前两版）：
 *   ① 这一节原先**根本不存在**：`product-slider.js` 写出的 `--tab-offset`
 *      没有任何规则消费 —— 滑动改 URL，标签却一动不动；
 *   ② 改成"滚动居中"也不成立：`scrollLeft` **不能为负**，第一格永远滚不到中心
 *      （把内距从 70px 到 220px 逐像素扫过，没有值能让首格居中）；
 *   ③ 改成"整排居中 + 逐格偏移"会**压扁并裁掉邻居**：五格 688px 挤进 344px，
 *      实测格宽 128 → 87，用户看到的就是"只剩一个按钮"。
 * 现在的模型是"内距对齐 + 整排公共左移"，见下。 */
/* 手机循环滑条：**绝对定位的轨道 + 从中心展开**。
 *
 * 为什么必须这样（前三版都栽在这里，别再退回）：
 *   五格各 128px、间距 12px，整排 688px，而 390px 视口里的容器只有约 344px ——
 *   **整排根本放不下**。任何"让整排参与 flex 排版、再靠 translate 挪"的写法都会
 *   溢出并把邻居裁掉：实测 `justify-content: center` 把格宽压到 87px 且只剩一个按钮；
 *   `flex-start` + 内距则让选中项偏出 k×140px。根因是"整排宽度"与"可视宽度"不匹配。
 *
 *   所以这里把轨道**移出文档流**（绝对定位 + `left: 50%`），
 *   每格再按"距选中项几步"从容器中心向两侧展开：
 *     选中项 `translateX(-50%)` 精确居中（与格宽无关）；
 *     第 k 个邻居在 `±k·步长` 处，超出的部分被 `overflow: hidden` 裁掉 ——
 *   于是"看到选中项 + 左右各一个"是必然结果，而不是碰巧。
 *
 *   这也让**循环**有了着落：位置按标签个数取模，末格的下一格就是首格。 */
.product-lines .module-tabs.is-loop-slider {
  position: relative;
  display: block;
  overflow: hidden;
  min-height: var(--tab-height);
  margin-inline: 0;
  padding-inline: 0;
  scrollbar-width: none;
  /* 两端渐隐，提示还有别的标签。`#000` 是遮罩的不透明端，不是颜色常量 ——
     mask 只用 alpha 通道，因此与深浅主题无关。 */
  mask-image: linear-gradient(90deg, transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%);
}
.product-lines .module-tabs.is-loop-slider::-webkit-scrollbar { display: none; }
.product-lines .module-tabs.is-loop-slider > * {
  position: absolute;
  top: 0;
  /* 轨道原点放在容器中心：所有位移都以"居中"为基准，不必再知道容器宽度。 */
  left: 50%;
  width: var(--product-tab-width);
  min-height: var(--tab-height);
  /* `--tab-offset` 由 JS 写：选中项 0，左右邻居 ±1、±2 步（按标签个数取模循环）。
     `translateX(-50%)` 把格子自身的中心对到轨道原点上。 */
  transform: translateX(calc(var(--tab-offset, 0px) - 50%));
  transition: transform var(--motion-fast) var(--motion-ease), opacity var(--motion-fast) var(--motion-ease);
}
/* 手势进行中**不插值**：拖动时每一帧都要跟手，插值会让格子滞后于手指；
  松手后要靠一次干净的重排落位，插值则会让"落位是否完成"变成时序问题
   （门禁实测：松手瞬间读到 −92px、600ms 后才回到 −64px 的居中位）。
   所以跟手与落位都走即时值，动画只留给"点选/键盘切换"这种单次跳转。 */
.product-lines .module-tabs.is-loop-slider.is-dragging > * {
  transition: none;
}
/* 离得远的格子淡出，避免遮罩边缘出现"半截按钮"的杂讯。 */
.product-lines .module-tabs.is-loop-slider > * {
  opacity: var(--tab-opacity, 1);
}

/* 手柄：告知这一排可以左右滑。用次要文字，不抢标题。 */
.product-swipe-hint {
  display: none;
  margin-top: 6px;
  color: var(--color-secondary);
  font-size: 12px;
}
.product-lines .module-tabs.is-loop-slider ~ .product-swipe-hint { display: block; }
/* 收起状态只需一张清楚的缩略图，不沿展开卡片拉成长槽。 */
@media (min-width: 768px) {
  .scenario-case-card:not(.is-active) { align-self: flex-start; }
  .scenario-case-card:not(.is-active) .scenario-case-card__media {
    flex: 0 0 auto;
    aspect-ratio: 4 / 3;
    min-height: 0;
  }
  .scenario-case-card:not(.is-active) .scenario-case-card__image { object-fit: contain; }
}
#contact-prep-title { white-space: pre-line; }

/* 三个内容页的章节标题沿用首页的字号、字重、字距与阅读节奏。 */
main:is([data-page='scenarios'], [data-page='delivery'], [data-page='company']) h2.section-head__title {
  font-size: var(--section-title-size);
  line-height: 1.2;
  font-weight: 650;
  letter-spacing: -.025em;
  text-wrap: pretty;
}
@media (max-width: 767px) {
  main:is([data-page='scenarios'], [data-page='delivery'], [data-page='company']) h2.section-head__title {
    max-width: none;
    line-height: 1.35;
    white-space: nowrap;
  }
}

/* 智慧中台：工具、智慧能力与业务输出的顺序保持清楚。 */
.pl-art--stack { flex-direction: column; flex-wrap: nowrap; padding: 16px; }
.pl-art--stack .pl-node { max-width: 100%; text-align: center; }
.pl-art--stack .pl-arrow { flex: none; }

/* 共用卡片边界：媒体框仍使用媒体圆角，控件仍使用控件圆角。 */
:is(.media-card, .home-product__process, .scenario-case-card, .sector-card,
    .platform__panel, .module-panel, .topology-node, .home-proof__comparison,
    .home-proof__chain-node, .dspec-deliverable, .topology-summary, .voices-cloud__frame) {
  border-width: 1px;
  border-style: solid;
  border-radius: var(--radius-card);
}
:is(.media-card, .home-product__process, .scenario-case-card, .sector-card,
    .platform__panel, .module-panel, .topology-node, .home-proof__comparison,
    .home-proof__chain-node, .dspec-deliverable, .topology-summary, .voices-cloud__frame):not(.is-active):not(.is-selected) {
  border-color: var(--color-border);
}
.home-process__method { margin: 6px 0 0; color: var(--color-secondary); }
.metric-band[data-band='home'] .metric__value { font-size: clamp(48px, 5vw, 72px); }
@media (max-width: 767px) {
  .metric-band[data-band='home'] .metric__value { font-size: clamp(40px, 11vw, 48px); }
}

/* 图片使用媒体圆角，只统一其边框，避免卡片与媒体的职责混淆。 */
.product-line__art { border: var(--border-card); }

/* 部署关系只保留平台与两条链路：标题左齐、平台和节点居中。 */
.home-proof__shared {
  justify-content: center;
  align-items: center;
  padding: 16px 24px;
  text-align: center;
  background: transparent;
}
.home-proof__mode { padding: 24px; }
.home-proof__mode-title { margin-bottom: 20px; text-align: left; }
.home-proof__chain { align-items: stretch; gap: 24px; }
.home-proof__chain-node {
  min-height: 84px;
  padding: 8px 0;
  align-content: center;
  justify-items: center;
  gap: 10px;
  border: 0;
  border-radius: 0;
  background: transparent;
  text-align: center;
}
.home-proof__device-symbols { height: 28px; justify-content: center; align-items: center; }
.home-proof__node-label { font-size: 14px; line-height: 1.4; text-align: center; }
.home-proof__chain-node:not(:last-child)::after {
  content: '';
  top: 50%;
  right: -20px;
  width: 16px;
  height: 1px;
  transform: translateY(-50%);
  background: var(--color-border);
}
.home-proof__foot { justify-content: flex-end; }
@media (max-width: 767px) {
  .home-proof__modes { grid-template-columns: minmax(0, 1fr); }
  .home-proof__mode { padding: 20px 16px; }
  .home-proof__mode + .home-proof__mode { border-left: 0; border-top: 1px solid var(--color-border); }
  .home-proof__mode-title { margin-bottom: 12px; }
  .home-proof__node-label { font-size: 12px; }
  .home-proof__foot .link-arrow { justify-self: end; }
}

/* 行动入口并入部署模块：共用边界，不再另起一个收尾区。 */
.home-proof__foot.home-proof__actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px 24px;
  padding: 18px 24px;
  border-top: 1px solid var(--color-border);
}
.home-proof__action-title { font-size: 16px; font-weight: 550; color: var(--color-text); }
.home-proof__action-links { display: flex; align-items: center; gap: 24px; }
.home-proof__action-links .btn { min-height: 44px; padding: 10px 16px; }
@media (max-width: 767px) {
  .home-proof__foot.home-proof__actions { padding: 16px; flex-wrap: wrap; }
  .home-proof__action-title { width: 100%; font-size: 14px; }
  .home-proof__action-links { width: 100%; justify-content: space-between; gap: 12px; }
}

/* 单路与多路按同一坐标对照；多路先各自采集，再汇入算力节点。 */
.home-proof__chain-node { min-height: 146px; align-content: start; }
.home-proof__device-symbols { height: 100px; display: flex; align-items: center; justify-content: center; }
.home-proof__chain-node:not(:last-child)::after { top: 58px; right: -24px; width: 24px; transform: none; }
[data-deployment-mode='multi'] .home-proof__chain-node:nth-child(-n+2) .home-proof__device-symbols {
  display: grid; grid-template-rows: repeat(3, 28px); gap: 8px;
}
[data-deployment-mode='multi'] .home-proof__device-symbols svg { width: 28px; height: 28px; }
[data-deployment-mode='multi'] .home-proof__chain-node:first-child::after {
  top: 22px; height: 73px;
  background: repeating-linear-gradient(180deg, var(--color-border) 0 1px, transparent 1px 36px);
}
[data-deployment-mode='multi'] .home-proof__chain-node:nth-child(2)::after { display: none; }
.home-proof__merge { position: absolute; top: 22px; right: -24px; width: 24px; height: 73px; overflow: visible; }
.home-proof__merge path { fill: none; stroke: var(--color-border); stroke-width: 1; }

[data-deployment-mode='multi'] .home-proof__device-symbols:has(svg + svg) svg { width: 28px; height: 28px; }

/* 双向闭环保留一套可访问名单；副本仅用于连续滚动。 */
.customer-marquee { display: flex; gap: 0; flex-wrap: nowrap; overflow-x: auto; overflow-anchor: none; scroll-behavior: auto; }
.customer-marquee__track[data-clone] { display: flex; }
.customer-marquee__name { min-width: 112px; flex: 0 0 auto; }
.customer-marquee__name:last-child { border-right: 1px solid var(--color-border-light); }
main[data-page='home'] .customer-strip__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 10px; }
main[data-page='home'] .customer-strip__label { color: var(--color-text); font-weight: 700; }
main[data-page='home'] .customer-strip__intro { margin: 10px 0 0; color: var(--color-secondary); font-size: 13px; line-height: 1.5; }
@media (max-width: 767px) {
  .customer-marquee__name { min-width: 92px; padding-inline: 14px; }
  main[data-page='home'] .customer-strip__intro { font-size: 12px; white-space: nowrap; }
}

/* 紧凑滑动指引与边缘渐隐，手机按实际宽度均分三个或四个客户。 */
.customer-strip__viewer { grid-template-columns: 24px minmax(0, 1fr) 24px; gap: 0; }
.customer-strip__arrow { width: 24px; height: 52px; color: var(--color-secondary); }
.customer-strip__arrow svg { opacity: .55; }
.customer-strip__arrow:hover svg, .customer-strip__arrow:focus-visible svg { opacity: 1; }
.customer-marquee {
  mask-image: linear-gradient(90deg, transparent, var(--color-text) 10px, var(--color-text) calc(100% - 10px), transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, var(--color-text) 10px, var(--color-text) calc(100% - 10px), transparent);
}
.customer-marquee__name { width: var(--customer-cell-width, 112px); min-width: 0; padding-inline: 6px; border-right: 0; white-space: nowrap; color: var(--color-secondary); }
.customer-marquee__name:last-child { border-right: 0; }
.customer-strip__footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; }
main[data-page='home'] .customer-strip__footer .customer-strip__intro { margin: 0; white-space: nowrap; }
.customer-strip__footer .customer-strip__more { flex: 0 0 auto; margin: 0; white-space: nowrap; }
@media (max-width: 767px) {
  .customer-strip__footer { gap: 8px; }
  .customer-strip__footer .customer-strip__more { font-size: 12px; }
  .customer-strip__footer .customer-strip__more svg { width: 13px; height: 13px; }
}

/* 手机名单更紧凑，四字客户名仍完整可读。 */
@media (max-width: 767px) {
  .customer-strip__viewer { grid-template-columns: 18px minmax(0, 1fr) 18px; }
  .customer-strip__arrow { width: 18px; }
  .customer-strip__arrow svg { width: 17px; height: 17px; }
  .customer-marquee__name { padding-inline: 2px; font-size: 13px; min-height: 46px; }
}
@media (max-width: 360px) {
  .customer-marquee__name { padding-inline: 0; font-size: 12px; }
}

/* 仅手机使用部署 Tab，宽屏仍同时呈现两种连接关系。 */
.home-proof__tabs { display: none; }
@media (max-width: 767px) {
  .home-proof__tabs { display: flex; gap: 4px; margin: 16px 16px 0; padding: 4px; background: var(--color-surface-muted); border: var(--border-card); border-radius: var(--radius-control); }
  .home-proof__tab { flex: 1; min-height: 40px; border-radius: var(--radius-control); color: var(--color-secondary); font-size: 14px; }
  .home-proof__tab[aria-selected='true'] { background: var(--color-surface-raised); color: var(--color-text); font-weight: 650; }
  .home-proof__mode-title { display: none; }
  .home-proof__mode + .home-proof__mode { border: 0; }
}

.product-line__name { display: none; }
.scenario-dots { display: none; }
.delivery-disclosure { border-bottom: 1px solid var(--color-border); margin-top: 0; }
.delivery-group-title { margin: 0; padding-block: 12px; font-size: 16px; font-weight: 700; line-height: 1.5; }
.delivery-disclosure .dspec-grid, .delivery-disclosure .dspec-deliverables__grid { margin-block: 12px 20px; }
.delivery-disclosure .dspec-param { padding-block: 12px; }
.delivery-disclosure .dspec-param__body { font-size: 14px; }
.dspec .dspec-deliverables { margin-top: 0; }
main[data-page='delivery'] .dspec { padding-bottom: 0; }
main[data-page='delivery'] .topology-section .section__inner { padding-top: 28px; }
.delivery-period .metric-band > .site-container { width: 100%; }
.delivery-period .metric-band .metric__value { font-size: clamp(40px, 4vw, 64px); line-height: 1.1; }
.delivery-period .metric__number { font-size: inherit; }
.delivery-period .metric-band { padding-block: 0; margin-block: 0; }
.delivery-period-note { padding-bottom: 8px; }
.delivery-period-note .dspec-note { margin-block: 6px 0; }
.topology-save { min-width: 0; }
.topology-save__tools { display: flex; flex-wrap: wrap; gap: 8px; padding-block: 12px; }
.topology-summary__actions { align-items: flex-start; justify-content: space-between; }
.topology-gen__field { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; align-items: stretch; }
.topology-options { display: contents; }
.topology-control, .topology-options .topology-option { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 76px; padding: 10px 8px; border: 1px solid var(--color-border); border-radius: var(--radius-control); background: var(--color-surface); font-size: 13px; line-height: 1.4; font-weight: 600; color: var(--color-text); }
.topology-options .topology-option { cursor: pointer; }
.topology-options .topology-option span { order: -1; }
.topology-control .topology-gen__label { font: inherit; }
.topology-control .topology-count { width: 48px; height: 26px; padding: 0; border: 0; border-radius: 0; background: transparent; font-size: 18px; font-weight: 600; }
.topology-options .topology-option input { appearance: none; width: 24px; height: 24px; margin: 1px 0; border: 1px solid var(--color-border-muted); border-radius: 6px; background: var(--color-surface-raised); display: grid; place-items: center; cursor: pointer; }
.topology-options .topology-option input:checked { background: var(--color-action); border-color: var(--color-action); }
.topology-options .topology-option input:checked::after { content: ''; width: 6px; height: 11px; border: solid var(--color-action-text); border-width: 0 2px 2px 0; transform: translateY(-1px) rotate(45deg); }
.topology-options .topology-option:has(input:checked) { border-color: var(--color-accent-text); }
.topology-control:focus-within, .topology-option:focus-within { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.topology-gen__stats { grid-column: 1 / -1; grid-row: 2; display: flex; justify-content: flex-start; gap: 8px 16px; margin: 0; font-size: 12px; font-weight: 400; color: var(--color-secondary); }
.topology-legend { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; margin-top: 12px; }
.topology-legend__item { align-items: center; }
.topology-save__tools { padding-block: 0; }
.topology-summary__actions { gap: 12px; align-items: center; }
@media (min-width: 768px) {
  .topology-gen__field { max-width: 600px; }
}
@media (max-width: 767px) {
  .topology-gen__field { gap: 8px; }
  .topology-control, .topology-options .topology-option { min-height: 76px; padding: 10px 4px; font-size: 12px; }
  .topology-legend { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .topology-summary__actions { flex-direction: column; align-items: stretch; }
  .topology-summary .topology-summary__actions { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
  .topology-summary .topology-save { width: 100%; }
  .topology-summary .topology-summary__actions > .btn { width: 100%; grid-column: 1 / -1; }
  .topology-save__tools { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .topology-save__tools .topology-btn { min-width: 0; padding-inline: 6px; font-size: 12px; justify-content: center; }
  .topology-save__tools svg { display: none; }
}
.topology-configurator:not(.is-editing) .topology-canvas button { cursor: default; }
.topology-configurator:not(.is-editing) .topology-canvas .is-selected { border-color: var(--color-border); }
@media (max-width: 767px) {
  .delivery-group-title { padding-block: 8px; }
  .delivery-disclosure .dspec-grid, .delivery-disclosure .dspec-deliverables__grid { margin-block: 6px 12px; gap: 8px; }
  .delivery-disclosure .dspec-param { padding-block: 8px; }
  .delivery-disclosure .dspec-param__head { margin-bottom: 4px; }
  .delivery-disclosure .dspec-param__body, .delivery-disclosure .dspec-deliverable__body { font-size: 13px; line-height: 1.55; }
  .delivery-disclosure .dspec-deliverable { padding: 12px; }
  .delivery-period .metric { padding-block: 12px; }
}
.topology-recommend { display: block; margin: 0; padding: 8px 0; border: 0; background: transparent; }
.topology-recommend__summary { display: list-item; cursor: pointer; font-size: 13px; }
.topology-recommend__summary > * { margin-right: 12px; }
.topology-recommend__basis { display: block; margin-top: 8px; line-height: 1.6; }
.company-about--story .voices-cloud { margin-top: 32px; }
.company-about--story .voices-cloud__frame { max-width: 840px; margin: 16px auto 0; padding-block: 16px; }
.voices-cloud__word--w1 { font-size: 11px; font-weight: 400; color: var(--color-secondary); }
.voices-cloud__word--w2 { font-size: 13px; font-weight: 500; }
.company-about--story .voices-cloud__list { gap: 14px 20px; }
.join-us-section .section-head { margin-bottom: 16px; }
.voices-message { margin-top: 16px; }
.voices-cloud__frame > .voices-message { margin-top: 12px; text-align: center; }
.voices-cloud__frame .voices-message__form { margin-inline: auto; text-align: left; }
.voices-message > summary { display: inline-flex; align-items: center; min-height: 44px; padding: 0; border: 0; background: transparent; color: var(--color-secondary); font-size: 13px; list-style: none; cursor: pointer; text-underline-offset: 4px; }
.voices-message > summary:hover { color: var(--color-accent-text); text-decoration: underline; }
.voices-message > summary:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; border-radius: var(--radius-control); }
.voices-message > summary::-webkit-details-marker { display: none; }
.voices-message__form { display: grid; gap: 12px; max-width: 560px; margin-top: 16px; }
.voices-message__form textarea { box-sizing: border-box; width: 100%; resize: vertical; padding: 12px; border: 1px solid var(--color-border); border-radius: var(--radius-control); background: var(--color-surface); color: var(--color-text); font: inherit; }
.voices-message__form button { justify-self: start; }
.voices-message__preview { margin: 0; color: var(--color-secondary); white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; }
main[data-page='contact'] .page-hero { padding-block: 32px 16px; }
main[data-page='contact'] .page-content-section { padding-block: 20px; }
main[data-page='contact'] .contact-page-grid { max-width: none; gap: 20px; }
main[data-page='contact'] .contact-page-item { padding-block: 16px; gap: 6px; }
main[data-page='contact'] .page-close { margin-top: 12px; }
main[data-page='contact'] .editorial-split { gap: 24px; }
main[data-page='contact'] .editorial-list__item { padding-block: 12px; }
main[data-page='contact'] .editorial-list__item p { margin-block: 6px 0; }
main[data-page='contact'] .contact-prep__note { margin-top: 12px; font-size: 13px; }
.contact-dialog { box-sizing: border-box; width: min(840px, calc(100vw - 48px)); max-height: calc(100svh - 48px); padding: 24px; border: 1px solid var(--color-border); border-radius: var(--radius-card); background: var(--color-surface-raised); color: var(--color-text); overflow-y: auto; }
.contact-dialog::backdrop { background: var(--color-scrim-strong); }
.contact-dialog__close { position: absolute; z-index: 3; right: 12px; top: 12px; width: 40px; height: 40px; border: 0; border-radius: var(--radius-control); background: transparent; color: var(--color-secondary); font-size: 26px; cursor: pointer; }
.contact-dialog__entry { padding-block: 40px; }
.contact-dialog .site-container { width: 100%; padding-inline: 0; }
.contact-dialog .page-hero__title { font-size: 36px; max-width: none; }
.contact-dialog .editorial-split__title { font-size: 26px; }
.contact-dialog .page-hero__body { font-size: 14px; }
.contact-dialog .editorial-split { grid-template-columns: 1fr 1fr; }
main[data-page='contact'] .contact-dialog .page-hero { padding-block: 8px 12px; }
@media (max-width: 767px) {
  main[data-page='contact'] .page-hero__eyebrow,
  main[data-page='contact'] .page-hero__body,
  main[data-page='contact'] .page-close,
  main[data-page='contact'] .editorial-split .page-hero__eyebrow,
  main[data-page='contact'] .contact-prep__note { display: none; }
  main[data-page='contact'] .page-hero__title { font-size: 30px; line-height: 1.25; margin: 0; }
  main[data-page='contact'] .editorial-split__title { font-size: 24px; line-height: 1.3; margin: 0; }
  main[data-page='contact'] .contact-page-item { grid-template-columns: 40px minmax(0, 1fr); align-items: baseline; padding-block: 12px; gap: 2px 10px; }
  main[data-page='contact'] .contact-page-item__value { font-size: 18px; }
  main[data-page='contact'] .contact-page-item__note { grid-column: 2; font-size: 11px; }
  main[data-page='contact'] .editorial-list__item { grid-template-columns: 68px minmax(0, 1fr); align-items: baseline; gap: 8px; padding-block: 8px; }
  main[data-page='contact'] .editorial-list__item p { margin: 0; }
  main[data-page='contact'] .editorial-list__item h3 { font-size: 15px; margin: 0; }
  main[data-page='contact'] .editorial-list__item p,
  main[data-page='contact'] .editorial-split__body > p { font-size: 13px; line-height: 1.5; }
  main[data-page='contact'] .editorial-split__body > p { margin-block: 0 8px; }
  main[data-page='contact'] .page-hero { padding-block: 24px 12px; }
  main[data-page='contact'] .page-content-section { padding-block: 16px; }
  main[data-page='contact'] .contact-page-grid { gap: 0; }
  main[data-page='contact'] .editorial-split { gap: 16px; }
  .company-about--story .voices-cloud { margin-top: 24px; }
  .company-about--story .voices-cloud__list { gap: 12px 14px; }
  .company-about--story .voices-cloud__frame { padding-block: 12px; }
}
.scenario-feature { padding-bottom: 20px; }
.sector-cards { padding-top: 20px; }
.sector-cards__body { border: var(--border-card); border-radius: var(--radius-card); background: var(--color-surface); overflow: hidden; }
.sector-cards__body .sector-cards__grid { gap: 0; }
.sector-cards__body .sector-card { display: flex; flex-direction: column; border: 0; border-radius: 0; background: transparent; }
.sector-cards__body .sector-card + .sector-card { border-left: 1px solid var(--color-border); }
.sector-card__head { order: 0; }
.sector-card__customers { order: 1; margin-top: 16px; padding-top: 0; border: 0; }
.sector-card > details { order: 2; margin-top: 16px; }
.sector-card > details .sector-card__tasks { margin-block: 12px; }
.sector-cards__body .sector-cards__cta { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 0; padding: 20px 24px; border-top: 1px solid var(--color-border); }
.scenario-plan__copy { display: grid; gap: 6px; }
.scenario-plan__copy strong { font-size: 16px; font-weight: 550; color: var(--color-text); }
.scenario-plan__copy p { font-size: 13px; color: var(--color-secondary); }
.scenario-plan__actions { display: flex; align-items: center; gap: 24px; }
@media (max-width: 767px) {
  .scenario-case-gallery { position: relative; display: flex; gap: 12px; overflow-x: auto; scrollbar-width: none; touch-action: pan-y; overscroll-behavior-inline: contain; }
  .scenario-feature { padding-bottom: 8px; }
  .sector-cards { padding-top: 12px; }
  .scenario-case-gallery::-webkit-scrollbar { display: none; }
  .scenario-case-gallery::after { content: ''; flex: 0 0 calc(8% - 12px); }
  .scenario-case-gallery .scenario-case-card,
  .scenario-case-gallery .scenario-case-card:not(.is-active) { display: flex; flex-direction: column; flex: 0 0 92%; min-width: 0; gap: 12px; padding: 16px; align-self: stretch; transition: none; }
  .scenario-case-gallery .scenario-case-card .scenario-case-card__media { display: block; flex: 0 0 auto; width: 100%; min-height: 0; aspect-ratio: 16 / 9; }
  .scenario-case-gallery .scenario-case-card .scenario-case-card__image { object-fit: contain; opacity: 1; }
  .scenario-case-gallery .scenario-case-card .scenario-case-card__summary { display: block; font-size: 13px; line-height: 1.6; }
  .scenario-case-card__index { display: none; }
  .scenario-dots { display: flex; justify-content: center; margin-top: 6px; }
  .scenario-dot { width: 36px; min-height: 44px; display: grid; place-items: center; border-radius: var(--radius-control); }
  .scenario-dot::after { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--color-secondary); opacity: .3; }
  .scenario-dot[aria-pressed='true']::after { width: 18px; border-radius: var(--radius-control); opacity: 1; background: var(--color-accent-text); }
  .sector-cards__body .sector-card + .sector-card { border-left: 0; border-top: 1px solid var(--color-border); }
  .sector-cards__body .sector-cards__cta { flex-direction: column; align-items: stretch; padding: 18px 16px; }
  .scenario-plan__actions { justify-content: space-between; gap: 12px; }
  .scenario-plan__actions .btn { min-height: 44px; padding: 10px 14px; }
}
/* 短页面底栏沉底；展开阅读只增加内容高度，不触发浏览器滚动锚定。 */
body { min-height: 100svh; display: flex; flex-direction: column; }
body > main { flex: 1 0 auto; }
body > [data-component='header'], body > [data-component='footer'] { flex-shrink: 0; }
.product-lines { overflow-anchor: none; }
.product-line__details[open] { display: block; }
.product-line__details > .product-line__caps { margin-top: 16px; }
.product-line__details .pl-drill { margin-top: 16px; border-top: 1px solid var(--color-border-light); padding-top: 8px; }
.product-line__media-source { margin-top: 16px; color: var(--color-secondary); font-size: 12px; line-height: 1.6; }
@media (max-width: 767px) {
  .product-lines > .site-container { display: flex; flex-direction: column; }
  .product-lines .section-head { order: 0; }
  .product-lines__panel { order: 1; display: block; padding: 0; border: 0; background: transparent; min-width: 0; }
  .product-lines__copy { position: relative; display: flex; gap: 12px; overflow-x: auto; scrollbar-width: none; touch-action: pan-y; overscroll-behavior-inline: contain; align-items: flex-start; padding-bottom: 2px; }
  .product-lines__copy::-webkit-scrollbar { display: none; }
  .product-lines__copy::after { content: ''; flex: 0 0 calc(8% - 12px); }
  .product-lines .product-line-panel { display: flex; flex-direction: column; flex: 0 0 92%; min-width: 0; gap: 14px; padding: 16px; background: var(--color-surface); border: var(--border-card); border-radius: var(--radius-card); }
  .product-line__overview { display: grid; gap: 10px; }
  .product-line__name { display: block; font-size: 13px; font-weight: 600; color: var(--color-secondary); }
  .product-line__card-art { width: 100%; margin: 0; order: 0; }
  .product-line__details { order: 1; }
  .product-lines .module-tabs { order: 2; display: flex; justify-content: center; gap: 0; margin-top: 8px; overflow: visible; border: 0; padding: 0; }
  .product-lines .module-tabs > .module-tab { display: grid; place-items: center; flex: 0 0 36px; width: 36px; min-height: 44px; padding: 0; font-size: 0; background: transparent; border: 0; border-radius: var(--radius-control); }
  .product-lines .module-tabs > .module-tab::after { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--color-secondary); opacity: .3; }
  .product-lines .module-tabs > .module-tab[aria-selected='true']::after { width: 18px; border-radius: var(--radius-control); opacity: 1; background: var(--color-accent-text); }
  .product-lines .product-swipe-hint { display: none; }
}

/* Desktop composition: mobile rails remain unchanged. */
.product-line__switch { display: none; }
@media (min-width: 768px) {
  .product-lines__panel { display: block; }
  .product-lines__copy { display: flex; align-items: stretch; gap: 12px; width: 100%; }
  .product-line-panel { display: flex; flex: 1 1 0; flex-direction: column; min-width: 0; padding: 0; border: 1px solid var(--color-border); border-radius: var(--radius-card); background: var(--color-surface); overflow: hidden; }
  .product-line-panel.is-active { flex-grow: 8; padding: 24px; gap: 16px; }
  .product-line__switch { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 400px; padding: 16px 8px; border: 0; background: transparent; color: var(--color-text); font: inherit; font-size: 17px; font-weight: 600; writing-mode: vertical-rl; cursor: pointer; }
  .product-line__switch:focus-visible { outline: 2px solid var(--color-focus); outline-offset: -4px; }
  .product-line-panel.is-active .product-line__switch { display: none; }
  .product-line-panel:not(.is-active) > :not(.product-line__switch) { display: none; }
  .product-line-panel.is-active .product-line__name { display: block; font-size: 13px; color: var(--color-secondary); }
  .product-line-panel.is-active .product-line__title { font-size: clamp(24px, 2.3vw, 34px); line-height: 1.25; }
  .product-line-panel.is-active .product-line__summary { font-size: 14px; max-width: none; }
  .product-line-panel.is-active .product-line__card-art { display: block; width: 100%; padding: 0; }
  .product-line__card-art .pl-art { width: 100%; }
  .product-line__card-art img { object-fit: contain; }
  .product-lines__panel > .product-line__art { display: none; }
  .product-lines .module-tabs { margin-bottom: 16px; }
  .scenario-case-gallery { align-items: flex-start; gap: 16px; width: 100%; max-width: none; }
  .scenario-case-gallery .scenario-case-card { align-self: flex-start; }
  .scenario-case-gallery .scenario-case-card .scenario-case-card__media { flex: 0 0 auto; aspect-ratio: 16 / 9; min-height: 0; }
  .scenario-case-gallery .scenario-case-card .scenario-case-card__image { object-fit: contain; opacity: 1; }
  .scenario-case-card:not(.is-active) .scenario-case-card__summary { display: block; font-size: 12px; }
  .sector-cards__body { width: 100%; }
  .company-about--story .voices-cloud__frame { max-width: none; width: 100%; }
  .company-about--story .voices-cloud__list { max-width: 1000px; margin-inline: auto; }
  .page-hero__layout { align-items: center; }
  .home-product__layout { align-items: start; }
}
.contact-dialog--global .section-head__title { font-size: 36px; white-space: pre-line; padding-right: 32px; margin-bottom: 20px; }
.contact-modal__prep-title { font-size: 22px; white-space: pre-line; margin-block: 24px 12px; }
.contact-dialog--global .contact-page-grid { max-width: none; }
.contact-dialog--global .editorial-list__item { padding-block: 12px; }

@media (min-width: 768px) {
  .product-line-panel.is-active .product-line__card-art { height: clamp(280px, 28vw, 400px); }
  .product-line-panel.is-active .pl-figure { height: 100%; grid-template-rows: minmax(0, 1fr) auto; }
  .product-line-panel.is-active .pl-figure__media { height: 100%; aspect-ratio: auto; }
  /* 图文两栏间距：**上限从 56px 收到 40px**（2026-09-30 桌面收紧）。
     `3.4vw` 在 1440px 会算出 49px、1920px 顶到 56px —— 左右两栏之间一条
     近 50px 的空白，比模块之间的间距还大，读起来是"两块内容不像一组"。 */
  .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(24px, 2.6vw, 40px); }
  .hero__copy { transform: none; }
}

@media (min-width: 768px) {
  .product-lines .product-lines__copy > .product-line-panel:not([hidden]) { display: flex; }
}
@media (min-width: 768px) {
  .product-lines .product-lines__copy > .product-line-panel.is-active {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: start;
    align-items: center;
    column-gap: 24px;
    row-gap: 20px;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
  }
  .product-line-panel.is-active .product-line__overview {
    display: grid;
    grid-column: 1;
    grid-row: 1;
    gap: 12px;
    min-width: 0;
  }
  .product-line-panel.is-active .product-line__title { font-size: clamp(22px, 1.9vw, 30px); }
  /* 网格项是 `.product-line__media-tray`（图片 + 按钮），不再是图片本身。
     图片只占 tray 的第一行，按钮紧随其下 —— 这样"按钮贴住图片下边"与
     左列文字多高无关。 */
  .product-line-panel.is-active .product-line__media-tray {
    grid-column: 2;
    grid-row: 1 / 3;
    align-self: start;
    min-width: 0;
  }
  .product-line-panel.is-active .product-line__card-art { height: clamp(280px, 25vw, 360px); min-width: 0; }
  .product-line-panel.is-active > .product-line__details { grid-column: 1; grid-row: 2; }
  .product-lines .product-lines__copy > .product-line-panel[hidden] { display: none; }
  .product-line-panel.is-active .product-line__card-art { height: clamp(320px, 34vw, 520px); }
  .product-line-panel.is-active .product-line__overview { align-self: end; }
  .product-line-panel.is-active .product-line__details { display: block; align-self: start; }
  .product-line-panel.is-active .product-line__details[open] .product-line__caps { grid-template-columns: 1fr; }
}

/* Desktop selection belongs to the product media, not a second navigation row. */
.product-media-switch { display: none; }
@media (min-width: 768px) {
  .product-lines > .site-container > .module-tabs { display: none; }
  /* 媒体列：图片 + "切换产品"按钮在同一个网格项里（JS 把按钮 append 到这里）。
     曾经按钮是 `position: absolute; bottom: 0` 挂在**面板**右下角、靠面板
     `padding-bottom: 56px` 留位 —— 面板高度由较高的那一列决定，图矮时
     （1024px 实测图 328px）按钮被拉到图片下方 193px 处，读起来是"漂在空中"。
     现在把这一列交给 flex：图片在上、按钮紧随其下，与另一列多高无关。 */
  .product-line__media-tray { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
  .product-line__media-tray > .product-line__card-art { flex: 0 0 auto; }
  /* 面板不再需要为绝对定位的按钮预留底部空间。 */
  .product-lines .product-lines__copy > .product-line-panel.is-active { padding-bottom: 0; }
  /* 按钮排：居中、单行不换行；一屏放不下时整体缩字而不是折行
     （折行会让"贴住图片"这条失效 —— 第一行按钮仍在图片下，第二行就飘了）。 */
  .product-media-switch {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 8px;
    width: 100%;
  }
  .product-media-switch__button { min-height: 40px; padding: 8px 10px; border: 1px solid var(--color-border); border-radius: var(--radius-control); background: var(--color-surface); color: var(--color-secondary); font: inherit; font-size: 12px; cursor: pointer; white-space: nowrap; }
  .product-media-switch__button[aria-pressed='true'] { color: var(--color-accent-text); border-color: var(--color-accent-text); }
  .product-media-switch__button:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
}
/* 窄桌面：五个按钮（一行约 362px）在 1024px 的双列里放不下，
   收内距与字号，保证**仍然是一行**。 */
@media (min-width: 768px) and (max-width: 1279px) {
  .product-media-switch__button { padding: 8px 6px; font-size: 11px; }
}

/* One compact first-screen offset across all page introductions. */
.product-lines--hero,
.scenarios-hero,
.company-about--story { padding-top: var(--hero-pad-block-top); }
@media (min-width: 768px) {
  .hero, .page-hero:not(.page-hero--contact) { min-height: 0; align-content: start; }
  .product-lines .product-lines__copy > .product-line-panel.is-active { grid-template-rows: min-content 1fr; align-items: start; }
  .product-line-panel.is-active .product-line__overview { align-self: start; }
  /* 图片高度只由这一条决定（用 `clamp` 随视口走）：**五个产品共用同一个值**，
     所以切换时右侧高度不会变。改这里时不要给单个产品加特例高度 ——
     那正是"图片来回动"的来源。 */
  .product-line-panel.is-active .product-line__card-art { align-self: start; height: clamp(320px, 32vw, 480px); }
}

/* Compact, consistent desktop heading baseline and module rhythm. */
@media (min-width: 768px) {
  .hero, .page-hero, .product-lines--hero, .scenarios-hero, .company-about--story, main[data-page='delivery'] .dspec { padding-top: 24px; }
  .hero-grid, .page-hero__layout { align-items: start; }
  .hero__copy { display: flex; flex-direction: column; }
  .hero__title { order: -2; margin-top: 0; }
  .hero__eyebrow { order: -1; margin-top: 12px; margin-bottom: 0; }
  .page-hero__copy > .page-hero__eyebrow { display: none; }
  .hero__title, .page-hero__title, .section-head__title--hero { margin-top: 0; }
  .section__inner { padding-block: 40px; }
  .section-head, .scenario-feature__head { margin-bottom: 20px; }
  .page-content-section { padding-block: 32px; }
  .company-about--story .voices-cloud { margin-top: 20px; }
  .product-line__details .pl-drill { margin-top: 12px; }
}
@media (min-width: 768px) {
  html main .section.dspec:not(.dspec--compact),
  html .page-content-section.company-about--story { padding-top: 24px; }
}

/* Four work scenes have equal visual weight and retain their native framing. */
.scenarios-hero { padding-bottom: 12px; }
.scenarios-hero .section-head { margin-bottom: 0; }
.scenario-feature { padding-top: 12px; }
/* 桌面：一行两张卡 + 左右箭头翻页（2026-09-30 用户要求）。
   此前是 2 列栅格把**四张全排出来**（两行），这一节因此很长；现在固定一行高度，
   第二组靠箭头翻进来（脚本按 `hidden` 切，见 pages.js 的 applyPage）。 */
.scenario-case-strip { position: relative; }
.scenario-case-gallery__arrow { display: none; }
.scenario-case-pager { display: none; }
@media (min-width: 768px) {
  .page-content-section.scenario-feature { padding-top: 12px; }
  /* 两侧留出箭头的宽度，卡片不会被箭头压住。 */
  .scenario-case-strip { padding-inline: 56px; }
  .scenario-case-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
  .scenario-case-gallery .scenario-case-card { width: 100%; align-self: stretch; gap: 10px; padding: 16px; transition: border-color var(--motion-standard) var(--motion-ease); }
  .scenario-case-gallery .scenario-case-card[hidden] { display: none; }
  .scenario-case-gallery .scenario-case-card .scenario-case-card__media { aspect-ratio: 16 / 9; }
  .scenario-case-gallery .scenario-case-card .scenario-case-card__summary { display: block; font-size: 13px; }
  .scenario-case-pager { display: block; }
  /* 箭头垂直居中于图库中线，圆形、与站点控件同一套半径与描边。 */
  .scenario-case-gallery__arrow {
    display: inline-flex;
    position: absolute;
    top: 50%;
    translate: 0 -50%;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid var(--color-border);
    border-radius: 50%;
    background: var(--color-surface);
    color: var(--color-text);
    cursor: pointer;
  }
  .scenario-case-gallery__arrow.is-previous { left: 0; }
  .scenario-case-gallery__arrow.is-next { right: 0; }
  .scenario-case-gallery__arrow:hover:not(:disabled) { border-color: var(--color-accent-text); color: var(--color-accent-text); }
  .scenario-case-gallery__arrow:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
  /* 到头置灰，不隐藏 —— 隐藏会让两侧布局左右不对称，读起来像少了东西。 */
  .scenario-case-gallery__arrow:disabled { opacity: .35; cursor: not-allowed; }
}