/* view1025.css —— 噢易云 医院内外网隔离办公解决方案 专用样式 */

:root {
  --brand: #ff6a00;
  --brand-dark: #e25e00;
  --brand-soft: #fff3e9;
  --ink: #1d2330;
  --ink-2: #4a5468;
  --line: #e8ebf1;
  --bg-soft: #f7f9fc;
  --radius: 14px;
  --shadow: 0 8px 30px rgba(29, 35, 48, .06);
  --shadow-lg: 0 16px 48px rgba(29, 35, 48, .12);
  --ink-3: #6b7385;
  /* 方案架构图（双路径对照图）尺寸令牌 */
  --ax-wallw: 1.35rem;       /* 隔离边界色块宽（也＝竖虚线在链路侧里的起点） */
  --ax-barh: 2.05rem;        /* 平台条高（右栏链路行按它对齐，橙线与 OEIDP 线同高） */
  --ax-switchw: 5.4rem;      /* 机构卡宽（**竖虚线画在它的中线上** → 墙线 x ＝色块宽＋半个它） */
  --ax-termw: 3.4rem;        /* 终端簇图标宽（右栏整列另按 20cqw 算，图标仍是这个尺寸） */
  --ax-tile: 2.5rem;         /* 桌面磁贴边长 */
  /* 左栏链路带的「上提量」——让它的中线落在**面板全高**的中线上。
     面板里标题占了上方一条带（上内边距 + 标题行高 + 标题下间距），
     而下内边距更小，于是「标题以下内容区」的中心整体比面板中心低：
         下移量 = (上内边距 + 标题带 − 下内边距) / 2 ≈ 21.9px
     全部用布局量推导，不写死像素：
         1.3rem            = .ax-panel padding-top
         1.1rem * 1.4      = .ax-tt 高（font-size × line-height）
         1.35rem           = .ax-tt margin-bottom
         1.45rem           = .ax-panel padding-bottom
     （<768 单列时面板内边距换成 1.15/1.3，差值不变，仍是 2.74rem） */
  --ax-lift: calc(1.3rem + 1.1rem * 1.4 + 1.35rem - 1.45rem);
  --ax-tile-line: #cfd6e2;   /* 磁贴虚线框 */
  --ax-dash: #c9d2e0;        /* 未连通链路 */
  --ax-wall: rgba(255, 106, 0, .38);  /* 隔离边界虚线 */
}


.section-title { font-size: clamp(1.6rem, 3vw, 2.2rem); margin-bottom: .8rem; }

/* 标题组 → 内容块：全站统一间距 */

.mt-block { margin-top: 2rem; }

/* 二级小标题 + 紧跟其后的正文/表格（同一左边界；宽度铺满容器，原 900px 居中于 09-20 放开） */

.sub-block { max-width: none; }

.sub-block + .sub-block { margin-top: 2.6rem; }

.sub-block p { color: var(--ink-2); font-size: 1rem; line-height: 1.92; margin: 0; }

.sub-head { position: relative; font-size: 1.16rem; margin: 0 0 1.1rem; padding-left: .85rem; line-height: 1.5; }

.sub-head::before { content: ""; position: absolute; left: 0; top: .3em; bottom: .3em; width: 3px; border-radius: 2px; background: linear-gradient(180deg, #ffc79b, var(--brand)); }

/* 连续正文（宽度铺满容器，原 900px 居中于 09-20 放开） */

.lead-block { max-width: none; }

.lead-block p { color: var(--ink-2); font-size: 1rem; line-height: 1.92; margin-bottom: 1.2rem; }

.lead-block p:last-child { margin-bottom: 0; }

/* 架构图下方四条关键要素：纯文字一行，靠色与字重做强调，不用胶囊/边框（避免看起来像可点击按钮） */

.arch-tags { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; margin: 1.6rem 0 0; font-size: .95rem; line-height: 1.9; }

.arch-tags span { color: var(--brand-dark); font-weight: 600; }

.arch-tags span + span::before { content: "丨"; margin: 0 .8rem; color: #cdd3dc; font-weight: 400; }

/* 小屏：改两列网格并去掉竖线分隔，避免折行后行首挂一个孤立竖线 */

@media (max-width: 575.98px) {
  .arch-tags { display: grid; grid-template-columns: repeat(2, auto); justify-content: center; gap: .3rem 1.2rem; }
  .arch-tags span + span::before { content: none; }
}

/* 对照表 */

.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow); }

.data-table { min-width: 580px;margin-top:0 !important; }

.data-table th, .data-table td { padding: .9rem 1.15rem; text-align: left; line-height: 1.75; vertical-align: top; }

.data-table thead th { background: var(--brand-soft); color: var(--brand-dark); font-weight: 700; }

/* 铺满后列宽按内容比例分配，行首标签（如「单终端 + 双网口」）会被挤断行 → 表头与行首不换行 */

.data-table th { white-space: nowrap; }

.data-table tbody tr + tr th, .data-table tbody tr + tr td { border-top: 1px solid var(--line); }

.data-table tbody th { color: var(--ink); font-weight: 600; background:#fff}

.data-table tbody td { color: var(--ink-2); }

/* ===== 方案架构：双路径架构图（2026-09-21 按站内原架构图的内容与布局重画）

原图＝「物理隔离 / 逻辑隔离」两条路径对照。本版只沿用其内容与布局：

① 配色改用页面调色板——面板底 --bg-soft、平台条 --brand、隔离墙品牌橙虚线，

连线用「实线＝当前连通 / 虚线＝切换后连通」替掉原图的蓝色，语义更直白；

② 图标全部换成素材库产品图（Win10 / UOS / 显示器 / 云终端 / 交换机 / OEIDP

+ 机柜与选单界面位图），不再用原图的通用示意图形；

③ 对齐——两侧面板同宽同高、标题同一基线；主体固定三列

（桌面与平台 ｜ 隔离墙 ｜ 终端接入），隔离墙 / 终端簇 / 平台条与资源池

跨面板对齐；连线端点由布局推导（宽度＝列间距 + 半个隔离列），不靠手调坐标。===== */

.arch-lead { max-width: 62rem; margin: 1rem auto 1.6rem !important; text-align: center;
  font-size: .95rem; line-height: 1.85; color: var(--ink-3); }

.ax { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.15rem; }

.ax-panel { display: flex; flex-direction: column;
  padding: 1.3rem 1.35rem 1.45rem; background: var(--bg-soft);
  border: 1px solid var(--line); border-radius: var(--radius); }

/* 两侧标题同字号同基线（原图右侧标题比左侧高、且各自偏离面板中心，已统一为居中） */

.ax-tt { margin: 0 0 1.35rem; text-align: center; font-size: 1.1rem; font-weight: 700;
  line-height: 1.4; letter-spacing: .12em; color: var(--ink-2); }

/* 主体两列：桌面与平台 ｜ 链路侧（隔离边界 + 接入链路）。

本层声明容器：链路宽度用 20cqw 直接取「所在面板的 20%」（100cqw ＝ .ax-body 宽）。

——「隔离边界」不再占独立的中列，而是并进各栏自己的链路侧（＝原图画法）。

⚠️ 列间距为 0：两列正好各占一半，跨列横线的端点才能由宽度令牌直接推出，

不必再用 cqw 去凑（凑出来的值一旦断点改令牌就会错开一两个像素） */

.ax-body { display: grid; align-items: stretch; flex: 1;
  grid-template-columns: 50% 50%;
  gap: 0; container-type: inline-size; width: 100%; }

/* 逻辑隔离面板：桌面与平台占 60%，右侧链路 20% + 云终端 20% */

.ax-body--r { grid-template-columns: 60% 40%; }

/* 左列：顶端贴标题、底部块（平台条 + 资源池）压底 →

两个面板的「平台条—资源池」落在同一水平带上。

列宽＝50%（用户口径：内网办公 / 互联网资料查询 占整块面板的一半），

平台条右缘因此正好落在 50% 分界上——「平台条 → 隔离墙」的横线从这一条线起画。 */

.ax-main { display: flex; flex-direction: column; min-width: 0;
  justify-content: space-between; gap: 1.1rem; }

/* 列内各块一律吃满列宽：连线端点才能由列宽直接推导，不用目测值 */

.ax-grp, .ax-res, .ax-boxes { width: 100%; }

.ax-grp-t, .ax-box-t { display: flex; align-items: center; gap: .38rem; margin: 0 0 .5rem;
  font-size: .84rem; font-weight: 700; color: var(--ink); }

.ax-grp-t::before, .ax-box-t::before { content: ""; flex: none; width: .34rem; height: .34rem;
  border-radius: 50%; background: var(--brand); }

/* 卡片里的标题同原图左对齐；字号与圆点各收一档 ——

卡片净宽 = (列宽 - .5rem)/2 - 2×.3rem，要容下「互联网资料查询」7 字 */

.ax-box-t { gap: .3rem; font-size: .74rem; }

.ax-box-t::before { width: .3rem; height: .3rem; }

/* 逻辑隔离面板：两组桌面并排成卡片，下方用合流括号接同一套平台 */

.ax-boxes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }

/* ⚠️ 卡组的宽度一变，卡片里的磁贴就会从「被挤扁」恢复成原边长（--ax-tile 封顶），

卡片跟着长高 → 右栏 row3 起点下移 → 橙条与链路带整体下沉，

两栏链路带的差会从 3.9px 掉到 17.3px（实测）。所以卡组吃满 60% 的同时，

这里把内边距与行距各收一档，把长高的 12.8px 从「卡片自己的padding」里还回去 ——

卡组总高不变，下方一切照旧，而卡片依然是原来那套留白比例 */

.ax-box { display: flex; flex-direction: column; justify-content: space-between;
  gap: .35rem; padding: .5rem .3rem .6rem; background: #fff;
  border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 4px 14px rgba(29, 35, 48, .05); }

.ax-res { display: flex; flex-direction: column; }

/* 汇流括号（用户口径第 6 版：整体放大）：

宽 =(两组卡片净宽 + 列间距) × 1.3，并**水平居中于左列**；

高 = 4.5rem（原 3rem × 1.5）—— 但**行高一分不加**：

上下各挂 -.65rem 负外边距，框就向卡组与平台条之间的那点间隙里长出去，

平台条、链路、卡组的位置全部原地不动（两栏链路带的差因此不变）。

算账：框 72px + 上 -10.4 + 下 -10.4 ＝ 51.2px ＝ 原来的行占用（48 + .2rem），

所以行 3（平台条）起点分毫不动；框的可见范围则从「卡组底下方 8.8px」

撑到「平台条顶上方 1.6px」—— 正好把这段空档括满 */

.ax-merge { position: relative; flex: 1; min-height: 4.5rem;
  width: calc((100% + .5rem) * .65);
  margin: -.65rem 0 -.65rem calc(17.5% - .1625rem);
  border: dashed var(--ax-dash); border-width: 0 1.5px 1.5px 1.5px;
  border-radius: 0 0 8px 8px; }

/* 括号内的边界色块（「逻辑隔离」）见下面「隔离边界」一节 —— 两条竖腿就是线，

色块自己不再画虚线 */

/* 桌面磁贴：素材库系统图标走 CSS 背景（整页只存一份），虚线框沿用原图语汇 */

.ax-tiles { display: flex; flex-wrap: wrap; gap: .4rem; }

.ax-tile { flex: 0 0 auto; width: var(--ax-tile); height: var(--ax-tile);
  border-radius: 8px; border: 1.5px dashed var(--ax-tile-line);
  background-color: #fff; background-repeat: no-repeat; background-position: center; }

/* 卡片内磁贴左对齐并随卡片宽度收缩（max-width 封顶，与左栏同尺寸） */

.ax-box .ax-tiles { flex-wrap: nowrap; justify-content: flex-start; }

.ax-box .ax-tile { flex: 1 1 0; width: auto; height: auto; min-width: 0;
  max-width: var(--ax-tile); aspect-ratio: 1; }

.ax-tile--win7 { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNC42OSAxMy40NiIgYXJpYS1oaWRkZW49InRydWUiPjxkZWZzLz48ZGVmcy8+PGc+PHBhdGggZmlsbD0iIzViNjQ3OSIgZmlsbC1vcGFjaXR5PSIxIiBkPSJNIDcuNTYgNy40OSBMIDguMDYgNy44NSBMIDguNzEgOC4wNyBMIDkuMzYgOC4yMSBMIDEwLjA4IDguMzUgTCAxMC44NyA4LjM1IEwgMTEuNTkgOC4yOCBMIDEyLjMxIDguMTQgTCAxMi45NiA3LjkyIEwgMTEuNTIgMTIuNzQgTCAxMC45NCAxMy4xIEwgMTAuMjkgMTMuMzIgTCA5LjUgMTMuMzkgTCA4Ljc4IDEzLjQ2IEwgNy45OSAxMy4zOSBMIDcuMjcgMTMuMTcgTCA2LjYyIDEyLjk1IEwgNi4wNCAxMi41OSBMIDcuNTUgNy40OCBMIDcuNTYgNy40OSBNIDMuOTYgNi4wNSBMIDQuNzUgNi4xMiBMIDUuNDcgNi4yNiBMIDYuMTIgNi40OCBMIDYuNyA2Ljc3IEwgNS4zMyAxMS43NCBMIDQuMTEgMTEuMzEgTCAzLjQ2IDExLjA5IEwgMi43NCAxMS4wMiBMIDIuMDIgMTAuOTUgTCAxLjM3IDExLjAyIEwgMC42NSAxMS4xNiBMIDUuNTUxMTJlLTE2IDExLjQ1IEwgNS41NTExMmUtMTYgMTEuMzggTCA1LjU1MTEyZS0xNiAxMS4zMSBMIDAuMDcgMTAuODggTCAwLjIxIDEwLjMgTCAwLjQzIDkuNTggTCAwLjY1IDguNzkgTCAwLjg3IDggTCAxLjAxIDcuMjggTCAxLjIzIDYuNTYgTCAxLjgxIDYuMzQgTCAyLjQ2IDYuMTIgTCAzLjI1IDYuMDUgTCAzLjk3IDYuMDUgTCAzLjk2IDYuMDUgTSA5LjA3IDEuMzcgTCA5LjY1IDEuNjYgTCAxMC4zIDEuODggTCAxMS43NCAyLjE3IEwgMTMuMjUgMi4xNyBMIDE0LjY5IDEuOTUgTCAxMy4xOCA2Ljc3IEwgMTIuNiA3LjA2IEwgMTEuODggNy4yIEwgMTEuMTYgNy4yNyBMIDEwLjM3IDcuMjcgTCA5LjU4IDcuMiBMIDguOTMgNy4wNiBMIDguMjggNi43NyBMIDcuODUgNi40MSBMIDkuMDcgMS4zNyBNIDUuNTQgOC44ODE3OGUtMTYgTCA2LjMzIDAuMDcgTCA3LjA1IDAuMjEgTCA3LjcgMC40MyBMIDguMzUgMC42NSBMIDcuMDUgNS42OSBMIDUuODMgNS4yNiBMIDQuNDYgNS4wNCBMIDMuMDIgNS4wNCBMIDIuMzcgNS4xOCBMIDEuNjUgNS4zMiBMIDEuNzkgNC42NyBMIDIuMDEgMy44OCBMIDIuMjMgMy4wOSBMIDIuNDUgMi4zNyBMIDIuNTkgMS43MiBMIDIuNzMgMS4xNCBMIDIuODcgMC43OCBMIDIuODcgMC42NCBMIDMuNDUgMC4yOCBMIDQuMSAwLjA2IEwgNC44MiAtMC4wMSBMIDUuNTQgLTAuMDEgTCA1LjU0IDguODgxNzhlLTE2Ii8+PC9nPjwvc3ZnPg==); background-size: 52% auto; }

.ax-tile--win10 { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMzAuMzYgMTI5LjY0IiBhcmlhLWhpZGRlbj0idHJ1ZSI+PGRlZnMvPjxkZWZzLz48Zz48cGF0aCBmaWxsPSIjNWI2NDc5IiBmaWxsLW9wYWNpdHk9IjEiIGQ9Ik0gNTkuMDYgNjEuMjIgTCA1OS4wNiA2MC41IEwgNTkuMDYgMTEuNTMgTCA1OS4wNiAxMC4wOSBMIDYwLjUgOS4zNyBMIDYzLjM4IDkuMzcgTCA2Ny43IDguNjUgTCA3Mi4wMiA3LjkzIEwgODMuNTQgNi40OSBMIDk1Ljc4IDQuMzMgTCAxMDguNzQgMi44OSBMIDExMy43OCAyLjE3IEwgMTE5LjU0IDEuNDUgTCAxMjMuODYgMC43MyBMIDEyNi43NCAwLjAxIEwgMTI4LjkgMC4wMSBMIDEzMC4zNCAwLjAxIEwgMTMwLjM0IDAuNzMgTCAxMzAuMzQgMy42MSBMIDEzMC4zNCA2LjQ5IEwgMTMwLjM0IDE1LjEzIEwgMTMwLjM0IDI1LjIyIEwgMTMwLjM0IDM1LjMgTCAxMzAuMzQgNDUuMzggTCAxMzAuMzQgNTMuMyBMIDEzMC4zNCA1Ni45IEwgMTMwLjM0IDU5LjA2IEwgMTMwLjM0IDYxLjIyIEwgMTMwLjM0IDYxLjk0IEwgMTI5LjYyIDYxLjk0IEwgMTI3LjQ2IDYxLjk0IEwgMTI2LjAyIDYxLjk0IEwgNjAuNDggNjEuOTQgTCA1OS4wNCA2MS45NCBMIDU5LjA0IDYxLjIyIEwgNTkuMDYgNjEuMjIgTSAxMzAuMzYgNjguNDIgTCAxMjguOTIgNjguNDIgTCAxMTQuNTIgNjguNDIgTCA3Ny4wNyA2Ny43IEwgNjAuNSA2Ny43IEwgNTkuMDYgNjcuNyBMIDU5LjA2IDY5LjE0IEwgNTkuMDYgMTE4LjgzIEwgNTkuMDYgMTE5LjU1IEwgMTI5LjY0IDEyOS42MyBMIDEzMC4zNiAxMjkuNjMgTCAxMzAuMzYgMTI4LjkxIEwgMTMwLjM2IDk4LjY2IEwgMTMwLjM2IDY4LjQxIEwgMTMwLjM2IDY4LjQyIE0gNTIuNTggNjcuNyBMIDI2LjY1IDY3LjcgTCAxLjQyMTA5ZS0xNCA2Ny43IEwgMS40MjEwOWUtMTQgNjguNDIgTCAxLjQyMTA5ZS0xNCA2OS4xNCBMIDEuNDIxMDllLTE0IDcxLjMgTCAxLjQyMTA5ZS0xNCA3Ni4zNCBMIDEuNDIxMDllLTE0IDgyLjgyIEwgMS40MjEwOWUtMTQgOTAuNzQgTCAxLjQyMTA5ZS0xNCA5Ny45NCBMIDEuNDIxMDllLTE0IDEwNS4xNCBMIDEuNDIxMDllLTE0IDEwOS40NiBMIDEuNDIxMDllLTE0IDExMC45IEwgMS40MjEwOWUtMTQgMTExLjYyIEwgNTIuNTggMTE4LjgyIEwgNTMuMyAxMTguODIgTCA1My4zIDY4LjQxIEwgNTMuMyA2Ny42OSBMIDUyLjU4IDY3LjY5IEwgNTIuNTggNjcuNyBNIDUyLjU4IDExLjUzIEwgMC43MiAxOC43MyBMIDEuMzEwMDZlLTE0IDE4LjczIEwgMS4zMTAwNmUtMTQgMTkuNDUgTCAxLjMxMDA2ZS0xNCAyNC40OSBMIDEuMzEwMDZlLTE0IDMwLjI1IEwgMS4zMTAwNmUtMTQgMzcuNDUgTCAxLjMxMDA2ZS0xNCA0My45MyBMIDEuMzEwMDZlLTE0IDUxLjE0IEwgMS4zMTAwNmUtMTQgNTYuMTggTCAxLjMxMDA2ZS0xNCA2MC41IEwgMS4zMTAwNmUtMTQgNjEuOTQgTCAwLjcyIDYxLjk0IEwgNTAuNDEgNjEuOTQgTCA1MS44NSA2MS45NCBMIDUzLjI5IDYxLjk0IEwgNTMuMjkgMTEuNTMgTCA1My4yOSAxMC44IEwgNTIuNTcgMTEuNTMgTCA1Mi41OCAxMS41MyIvPjwvZz48L3N2Zz4=); background-size: 46% auto; }

.ax-tile--uos { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA5NTU4IDI5OTUiIGFyaWEtaGlkZGVuPSJ0cnVlIj48ZGVmcy8+PGRlZnMvPjxkZWZzLz48ZGVmcy8+PGRlZnMvPjxkZWZzLz48Zz48cGF0aCBmaWxsPSIjN2E3ZjkxIiBmaWxsLW9wYWNpdHk9IjEiIGQ9Ik0gNDUyNyA0OTEgQyA0NjU5IDQ3MCA0ODk5IDQ3NCA1MDQxIDQ3NCBDIDUyMTQgNDc0IDUzMjQgNDg3IDU0NTEgNTY0IEMgNTY5NyA3MTQgNTgzMiA4OTIgNTg2MiAxMTgxIEMgNTkyNCAxNzY3IDU4OTEgMjQ0OCA1MTU2IDI1MTEgQyA0NzM2IDI1NDYgNDM5NSAyNTY2IDQwODYgMjMyMSBDIDM4MzQgMjEyMiAzNDMzIDY2MCA0NTI3IDQ5MSBNIDM0NjEgMTgzMiBDIDM1OTIgMjgwNiA0MzM0IDI5ODUgNTE5OCAyODc3IEMgNTY1MCAyODIxIDU5MTUgMjY0NyA2MDgyIDIzNTUgQyA2MzE5IDE5NDQgNjI3NiAxNjg5IDYyNDQgMTE2NiBDIDYyMDggNTg1IDU3NTYgMTM5IDUxODcgOTggQyA0OTg4IDg0IDQ3MTQgNzkgNDUxNSAxMDYgQyAzODQzIDE5NiAzNTE3IDU2NCAzNDYwIDExNTggQyAzNDQyIDEzNDAgMzQzNyAxNjUyIDM0NjEgMTgzMiIvPjxwYXRoIGZpbGw9IiM3YTdmOTEiIGZpbGwtb3BhY2l0eT0iMSIgZD0iTSA5MDk1IDI3MzUgQyA5MTAyIDI3MjYgOTMxMCAyNjczIDk0MTYgMjU1NCBDIDk1MjIgMjQzNCA5NTI1IDIyNDkgOTU1MCAyMjIxIEMgOTU3OSAxODU3IDk1NDAgMTU4MyA5MjM4IDEzNjkgQyA4OTkxIDExOTMgODU3NyAxMjI2IDgyMjcgMTI0NCBDIDgwNDAgMTI1NCA3ODQwIDEyNjMgNzY1NyAxMjQ0IEMgNzIzMyAxMTk5IDcxNDIgODA2IDczMTcgNTg5IEMgNzQxNyA0NjYgNzUxNCA0MTYgNzczMCA0MDQgQyA4MTE0IDM4MiA4NTAwIDM5MyA4ODgzIDM5NSBDIDkwNTQgMzk1IDkyODQgMzk0IDkzNzAgMjgxIEMgOTUyMiA4MyA5MjgwIDEwIDkxMTkgMiBDIDg5NDAgLTcgODczNSAxNCA4NTUyIDE4IEMgODMwMCAyMyA3NjE3IDE4IDc0MTEgNzcgQyA2OTMzIDIxNCA2NzMzIDc1OSA2OTUzIDEyMTAgQyA3MDM2IDEzODAgNzExMSAxNDA2IDcyNDggMTQ5OSBDIDc3NTIgMTg0NCA4OTM4IDEyOTMgOTE2NCAxODM4IEMgOTIzMyAyMDA0IDkxODUgMjE5MSA5MDg4IDIyOTYgQyA4ODk3IDI1MDIgODM3NyAyNDUzIDgwNTQgMjQ1NyBDIDc4NTkgMjQ2MCA3NjY0IDI0NjEgNzQ2OSAyNDY1IEMgNzI1MiAyNDY4IDcwODAgMjQ0MCA3MDIwIDI2MjEgQyA2OTUyIDI4MjQgNzIxMiAyODQxIDczNzAgMjg0MCBDIDc1NjYgMjgzOSA3NzcyIDI4MjUgNzk3MCAyODIxIEMgODM1MyAyODEzIDg3NTAgMjg0OCA5MDk1IDI3MzUgWiIvPjxwYXRoIGZpbGw9IiM3YTdmOTEiIGZpbGwtb3BhY2l0eT0iMSIgZD0iTSAyNDQ1IDEwNDAgQyAyNDY0IDEzMjQgMjQ4MSAxNzExIDIzODkgMTk1NCBDIDIyNTQgMjMxMSAxODU2IDI1ODggMTUwNyAyNTkyIEMgMTQyMCAyNTk0IDExNDYgMjU1NSAxMDc3IDI1MjggQyA5NzkgMjQ5MCA4NzQgMjM5MSA3NzggMjMyMyBDIDY3MiAyMjQ5IDYwOSAyMTg5IDU0NSAyMDYzIEMgMzk4IDE3NjkgNDEzIDEwNTUgNDA1IDY1NSBDIDQwMiA0ODggNDI4IDMwNCAzMTIgMjMwIEMgMTc3IDE0MyAzMiAyMzggMTQgMzc2IEMgLTI2IDY3MSAyOCAxNTQxIDY4IDE4MjAgQyAxMTIgMjEyOSAyNDkgMjMzNiAzOTkgMjUxNSBDIDU4NSAyNzM1IDc2NiAyODExIDEwMTIgMjkxMSBDIDEyNzcgMzAxOCAxNTc2IDMwMjMgMTg2MCAyOTIyIEMgMjM0MCAyNzUwIDI3MTcgMjM1OCAyODA2IDE4NTYgQyAyODYyIDE1NDMgMjg1MCAxMjE3IDI4MzkgODkyIEMgMjgyNyA1MTggMjkwNCA3OSAyNTQzIDE2MCBDIDI0MzAgMTg1IDI0MjUgNDE3IDI0MjcgNTQ4IEMgMjQyOCA3MTIgMjQzNCA4NzUgMjQ0NSAxMDQwIFoiLz48L2c+PC9zdmc+); background-size: 74% auto; }

/* 平台条：品牌橙（原图橙条），文字左对齐。

高度抽成 --ax-barh —— 右栏的链路行按它对齐，橙线与 OEIDP 线才落在同一高度上 */

.ax-bar { position: relative; display: flex; align-items: center; height: var(--ax-barh);
  padding: 0 .8rem; border-radius: 8px;
  background: var(--brand); color: #fff;
  font-size: .82rem; font-weight: 700; letter-spacing: .02em; }

.ax-tiles + .ax-bar { margin-top: .6rem; }

/* 平台条 → 隔离墙的横线。端点全部由布局推导，不手调坐标：

平台条右缘 ＝ 左列的 50% 分界 ＝ 链路侧的左缘（列间距为 0），

而墙线在链路侧内的 x ＝ 边界色块宽 + 半个机构卡宽（＝网络切换器的中线），

所以线长就是这两个令牌之和 —— 终点正好落在「平分网络切换器」的那条竖虚线上，

也就是「上下两条线路与网络切换器连接」的汇流点。 */

.ax-bar::after { content: ""; position: absolute; top: 50%; left: 100%;
  width: calc(var(--ax-wallw) + var(--ax-switchw) / 2);
  border-top: 2px solid var(--brand); }

/* 虚线＝切换后才连通的那条链路 */

.ax-grp--alt .ax-bar::after { border-top-style: dashed; border-top-color: var(--ax-dash); }

/* 右栏的橙条**不补线**：它吃满 60% 后右缘正好 ＝ 链路侧左缘，

那条线由 .ax-link 从链路侧起点接上；这里再补 60px 就会画进链路侧里去。

（左栏必须补：那里橙条与竖虚线之间隔着「边界色块 + 半个机构卡」） */

.ax-body--r .ax-bar::after { display: none; }

/* 资源池：素材库 噢易云服务器.png 裁出的单台机柜 */

.ax-racks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .45rem; margin-top: .5rem; }

.ax-rack { height: 2.7rem; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJgAAABGCAIAAAC/lMopAAAKMWlDQ1BJQ0MgUHJvZmlsZQAAeJydlndUU9kWh8+9N71QkhCKlNBraFICSA29SJEuKjEJEErAkAAiNkRUcERRkaYIMijggKNDkbEiioUBUbHrBBlE1HFwFBuWSWStGd+8ee/Nm98f935rn73P3Wfvfda6AJD8gwXCTFgJgAyhWBTh58WIjYtnYAcBDPAAA2wA4HCzs0IW+EYCmQJ82IxsmRP4F726DiD5+yrTP4zBAP+flLlZIjEAUJiM5/L42VwZF8k4PVecJbdPyZi2NE3OMErOIlmCMlaTc/IsW3z2mWUPOfMyhDwZy3PO4mXw5Nwn4405Er6MkWAZF+cI+LkyviZjg3RJhkDGb+SxGXxONgAoktwu5nNTZGwtY5IoMoIt43kA4EjJX/DSL1jMzxPLD8XOzFouEiSniBkmXFOGjZMTi+HPz03ni8XMMA43jSPiMdiZGVkc4XIAZs/8WRR5bRmyIjvYODk4MG0tbb4o1H9d/JuS93aWXoR/7hlEH/jD9ld+mQ0AsKZltdn6h21pFQBd6wFQu/2HzWAvAIqyvnUOfXEeunxeUsTiLGcrq9zcXEsBn2spL+jv+p8Of0NffM9Svt3v5WF485M4knQxQ143bmZ6pkTEyM7icPkM5p+H+B8H/nUeFhH8JL6IL5RFRMumTCBMlrVbyBOIBZlChkD4n5r4D8P+pNm5lona+BHQllgCpSEaQH4eACgqESAJe2Qr0O99C8ZHA/nNi9GZmJ37z4L+fVe4TP7IFiR/jmNHRDK4ElHO7Jr8WgI0IABFQAPqQBvoAxPABLbAEbgAD+ADAkEoiARxYDHgghSQAUQgFxSAtaAYlIKtYCeoBnWgETSDNnAYdIFj4DQ4By6By2AE3AFSMA6egCnwCsxAEISFyBAVUod0IEPIHLKFWJAb5AMFQxFQHJQIJUNCSAIVQOugUqgcqobqoWboW+godBq6AA1Dt6BRaBL6FXoHIzAJpsFasBFsBbNgTzgIjoQXwcnwMjgfLoK3wJVwA3wQ7oRPw5fgEVgKP4GnEYAQETqiizARFsJGQpF4JAkRIauQEqQCaUDakB6kH7mKSJGnyFsUBkVFMVBMlAvKHxWF4qKWoVahNqOqUQdQnag+1FXUKGoK9RFNRmuizdHO6AB0LDoZnYsuRlegm9Ad6LPoEfQ4+hUGg6FjjDGOGH9MHCYVswKzGbMb0445hRnGjGGmsVisOtYc64oNxXKwYmwxtgp7EHsSewU7jn2DI+J0cLY4X1w8TogrxFXgWnAncFdwE7gZvBLeEO+MD8Xz8MvxZfhGfA9+CD+OnyEoE4wJroRIQiphLaGS0EY4S7hLeEEkEvWITsRwooC4hlhJPEQ8TxwlviVRSGYkNimBJCFtIe0nnSLdIr0gk8lGZA9yPFlM3kJuJp8h3ye/UaAqWCoEKPAUVivUKHQqXFF4pohXNFT0VFysmK9YoXhEcUjxqRJeyUiJrcRRWqVUo3RU6YbStDJV2UY5VDlDebNyi/IF5UcULMWI4kPhUYoo+yhnKGNUhKpPZVO51HXURupZ6jgNQzOmBdBSaaW0b2iDtCkVioqdSrRKnkqNynEVKR2hG9ED6On0Mvph+nX6O1UtVU9Vvuom1TbVK6qv1eaoeajx1UrU2tVG1N6pM9R91NPUt6l3qd/TQGmYaYRr5Grs0Tir8XQObY7LHO6ckjmH59zWhDXNNCM0V2ju0xzQnNbS1vLTytKq0jqj9VSbru2hnaq9Q/uE9qQOVcdNR6CzQ+ekzmOGCsOTkc6oZPQxpnQ1df11Jbr1uoO6M3rGelF6hXrtevf0Cfos/ST9Hfq9+lMGOgYhBgUGrQa3DfGGLMMUw12G/YavjYyNYow2GHUZPTJWMw4wzjduNb5rQjZxN1lm0mByzRRjyjJNM91tetkMNrM3SzGrMRsyh80dzAXmu82HLdAWThZCiwaLG0wS05OZw2xljlrSLYMtCy27LJ9ZGVjFW22z6rf6aG1vnW7daH3HhmITaFNo02Pzq62ZLde2xvbaXPJc37mr53bPfW5nbse322N3055qH2K/wb7X/oODo4PIoc1h0tHAMdGx1vEGi8YKY21mnXdCO3k5rXY65vTW2cFZ7HzY+RcXpkuaS4vLo3nG8/jzGueNueq5clzrXaVuDLdEt71uUnddd457g/sDD30PnkeTx4SnqWeq50HPZ17WXiKvDq/XbGf2SvYpb8Tbz7vEe9CH4hPlU+1z31fPN9m31XfKz95vhd8pf7R/kP82/xsBWgHcgOaAqUDHwJWBfUGkoAVB1UEPgs2CRcE9IXBIYMj2kLvzDecL53eFgtCA0O2h98KMw5aFfR+OCQ8Lrwl/GGETURDRv4C6YMmClgWvIr0iyyLvRJlESaJ6oxWjE6Kbo1/HeMeUx0hjrWJXxl6K04gTxHXHY+Oj45vipxf6LNy5cDzBPqE44foi40V5iy4s1licvvj4EsUlnCVHEtGJMYktie85oZwGzvTSgKW1S6e4bO4u7hOeB28Hb5Lvyi/nTyS5JpUnPUp2Td6ePJninlKR8lTAFlQLnqf6p9alvk4LTduf9ik9Jr09A5eRmHFUSBGmCfsytTPzMoezzLOKs6TLnJftXDYlChI1ZUPZi7K7xTTZz9SAxESyXjKa45ZTk/MmNzr3SJ5ynjBvYLnZ8k3LJ/J9879egVrBXdFboFuwtmB0pefK+lXQqqWrelfrry5aPb7Gb82BtYS1aWt/KLQuLC98uS5mXU+RVtGaorH1futbixWKRcU3NrhsqNuI2ijYOLhp7qaqTR9LeCUXS61LK0rfb+ZuvviVzVeVX33akrRlsMyhbM9WzFbh1uvb3LcdKFcuzy8f2x6yvXMHY0fJjpc7l+y8UGFXUbeLsEuyS1oZXNldZVC1tep9dUr1SI1XTXutZu2m2te7ebuv7PHY01anVVda926vYO/Ner/6zgajhop9mH05+x42Rjf2f836urlJo6m06cN+4X7pgYgDfc2Ozc0tmi1lrXCrpHXyYMLBy994f9Pdxmyrb6e3lx4ChySHHn+b+O31w0GHe4+wjrR9Z/hdbQe1o6QT6lzeOdWV0iXtjusePhp4tLfHpafje8vv9x/TPVZzXOV42QnCiaITn07mn5w+lXXq6enk02O9S3rvnIk9c60vvG/wbNDZ8+d8z53p9+w/ed71/LELzheOXmRd7LrkcKlzwH6g4wf7HzoGHQY7hxyHui87Xe4Znjd84or7ldNXva+euxZw7dLI/JHh61HXb95IuCG9ybv56Fb6ree3c27P3FlzF3235J7SvYr7mvcbfjT9sV3qID0+6j068GDBgztj3LEnP2X/9H686CH5YcWEzkTzI9tHxyZ9Jy8/Xvh4/EnWk5mnxT8r/1z7zOTZd794/DIwFTs1/lz0/NOvm1+ov9j/0u5l73TY9P1XGa9mXpe8UX9z4C3rbf+7mHcTM7nvse8rP5h+6PkY9PHup4xPn34D94Tz+6TMXDkAAAf6SURBVHja7V1fbFvlFT/3v32d2rFbp02X1WnSrQnESYvTToEWyoo2aGBIiME6KlUV3RgPaEzaNI09rJr2wh4oQ5rQVGlC04AWthZlPFRQAapK0qYJUJp0bVJI1rRJnb927Ot7r+8f78GpmzrXN76+11KQz+/J1v18dPT97vd955zvnGPipUN/AcQ3HyROARKJWEGgTZ4RBIETtJKRyWQMiIzH46qq5b6yLOsP+HGyVjJmZ2YVRckn8vjxE1NTU7mvoVDomX3P5P0yJUpjY+MmoimK2tQYKlkzRVG/HrmGDOXhO5s2kqTB7tjV1TU+Pr781roUc3PxDz46YzLAxXF2iBQlyVx+ZaKxYQNJ0qWfkYaoWeO/Pjqs6/rSR6u8Xp73ZT831Nf95MmHixf76l//mRIlAAj4fVPjo7kdo8Lhcrl8a9bbNXYMTlddHRkeNGQRAGZnpnPmEUmSLGNFOJE9vfXx/w0rShopvHXWpDVNW2TTOOV+ZDKFWMxCEkU7ehMAyOISuyRVjPdgjci6b9dF2iMmlk7no4/aUdrr9T74/QeRvMUuYGfnHpqmHd5aqzye3/7m17JsvGhIiiQIYmDwUslqsyz7/HM/f/bAgUwxu0kl8EgSLMN8OTBovhFaJlLXdVGSCj5VdU3TbHq4JvIrERqImlbMa01b3K/FK0PD5TzblbLKh8oM0S3FjYnoia4PTM1l7uD+p0rWZj6R/MdbJ5CVPPzi2b3LHpMW/cgMuFxc+z1h0siQSiZTg5ftrieaprZH2miaQv4AQJbTvf1fOr8iV3HEwYfbgtWeQsZQo99WnJ0j4bkfttQEfUhhDm2BZpJwmshmd/yJsdcgVtiPpDxHYGvJSgdZeb/wNxCQvjvwOnFYddaPnOXWxZmgyYCRqrAt55f2Rl31yNxiXPM0ayTj8IrU3KtPf++VeuEiYWQQSxT/NX8XTE4DwLWxG4f+dLh4ySTDA0CGdvVE/tgy+jalY3wHAEChPQP1e2FqDpbzQKwR6Xa7N2xu0cF42TEAjaoanZwGgP9eHj529Gjxkl/81Ys8zzMMs7GpVWhqRQpzaASYmO7JOEtkPB4/febT8iktSVJZ5aMfuYBYfP7zC2YROIahd3S02yBS7un9HFnJw/07tlMk6SSRgiAOXBoKrgkYpvNIkpxOK3aITCvKwKWhgL8a/cjchMRi8zvvbQdniQQCdt7bvqX1LsOHqqqd+sTuxrgl3Lzzvm1IYS74/OFHnzq/tRIZvb+3p7+3BwpeX3B29KYoWk4rpz7uRgrvyGUs4kLSGpGqqkSjUXOz1t7FciYeTyB5RtkT4HDODkXR5ll0NpW2LwGt1uURDof3vb/XdMmq3WfPlaxNIOB/5eU/ICt5ONPdY+FimSTJxbaooV0qiuLQ1atgevOc/VATDO7p3ANWcgOy95Hm8jGjPO/4zNFEFKrGIgiCommcxJUMTVVzHNMmb4GmqjhZ37zaj+JXNAKwrA6BRCKQSCQSgUQikEgEOByiwx4CK92TNCAynU4vdhwpinLZu8pAlBuiKOq3im1uE/nmm28t20NAltPTM7NmOzVJ1q6rKVkzTdNuRqeQoTysr11rGPo+dvRYiT0EpmfmjpvXfnDczw48XbLGQko0l1+ZeP7gT52u/QBYHaiOz0wYRu/cHg/JLKTShjbUPr7HQsnqkTf+LUoyAPi8VWJiVtMwzAsAwLAcxa1y/j4SMvr1kSuqatypITY3u652oXMBQzMBvxesVHRmw7uz0bFUCmsGbsPrE513PzRNKcRiFvHYnL1wvo4s5mE+Hivm9sJiD4G6uqbmJpM0od0P7bajtM/n27YdU+juwK5duxjG6dqPqqqq37/0u2QyCUavCEXTHMfaKTlmGOaXL7yQFJIZHW/QFtoyeHjP5aEhh3sIEARBU3S1r7rQANVeDwECgKIonxfrI6G8yVeCIFwcHIRyJlaXVT4SuYCbk9MnPzxtMoBjmb0/fqxkbZJC6l/vnURW8rDv6ceXraGwWB+parIkh1s2k4SBlZQQhNHR63Y01nVdEFKtLU0M5n0BAIAkyxcHrwA43Z6FY8inHrlv/dpAoQH9q1fZ0Zsi4cmHttWHvoUU5tAQ5Iu5vbBGZJsn9sTYq1A4qX8f7zkCfy5Z6VpW3q+8BpjZeqcF+Dp5WAXKST8yzgZTtFm8ZsLdaEdnkaqaY9cid4sRdYU00uledLI7eGrry83xHsJo1xapqoveDoglACA6OXXk729bsFfTCgBotPuT1kORkTewhwDc6iFwfuMBmJcd7iHA83wo3JKCjkIDNt+q/fjiwmAJPQRYlm1oi8y1dSCFOXwXYLLb6R4CiUTi3Pk+KFtOsyzL5vIrE8uGdUpoBpG4dOWqeQOyyJYWOz0Ezp7/ApnLw7Z7wqSzpefziWRv3wWedxv2oksrKkkQdoiU0+nevgtut2vZ3gcVAlXVJFmObLnbYSIBYGvb3Ts6IoU64JnHfYo6EjZt/MHuHfjfMbncl/dPfgyOh+jcLo4kiO6znxUaUFOzxpbiGT02PfHuO+8ihVbNDoshOl2fuDllWq/K2FT6q68wHFAKl3gUQSXefjTUh37Uafa3LIqq9vV/VrI2wWDwP13vISt5OHe+z+GL5bSSvjE+UYzHEwj473/gAbCSG5D9ubl83FoL4XYPAVmWF9NO0TTP8ziJKxkpQdCWZppzHLfU9sXJWsnItkIpoodAEZEhBGBZHcJB/B/PhRVzJZ1nygAAAABJRU5ErkJggg==) center / contain no-repeat; }

/* 隔离边界：竖排品牌橙色块。

左栏「物理隔离」＝网络切换器**左侧**的描述内容（普通 flex 子项，不再自己扛竖虚线）；

右栏「逻辑隔离」＝夹在汇流括号两条竖腿之间（由 .ax-merge 那两条腿当线） */

.ax-boundary { display: flex; align-items: center; justify-content: center; }

/* min-width:0：flex 子项默认 min-width:auto 会被内容顶开，宽度令牌就失效了 */

.ax-flow > .ax-boundary { flex: 0 0 var(--ax-wallw); min-width: 0; }

/* 汇流框里的「逻辑隔离」＝**坐在框底横线上、水平居中**的小色块。

bottom:0 时色块的底边贴在**边框内侧**（绝对定位的包含块是 padding box，

即再减 1.5px 下边框）→ 色块底边与「噢易云PC系统」橙条顶边只差 ~0.1px，

色块中心因此正好落在**面板全高的中线**上（实测 2116.7 vs 中线 2118，差 1.3px）。

—— 这是「让两处色块都对准面板垂直中线」的唯一解：色块再往上就偏上、

再往下就压住橙条，而它恰好在下限处对齐中线。 */

.ax-merge .ax-boundary { position: absolute; top: auto; bottom: 0;
  left: 50%; right: auto; width: auto;
  transform: translateX(-50%); }

/* display:block 必须显式写：span 默认 inline，inline 盒在 vertical-rl 下尺寸由内容反推。

white-space:nowrap 也必须写：垂直书写模式下「容器高度不足」会被当成需要换行 →

4 个字折成 3 列、整块横过来（实测右栏汇流括号里就这样，左栏通高容器里正常）；

nowrap 让它溢出上下——原图那个色块本来也比两条竖腿高。

⚠️ line-height:1 也必须写：竖排时「行高」就是色块的**宽度**，

继承来的 1.8 会把色块撑到 ~29px、比 --ax-wallw 宽 →

flex 子项的 min-width:auto 会顶住收缩，墙线随之右移（实测偏 6.8px，比例全乱） */

.ax-boundary > span { position: relative; display: block; white-space: nowrap;
  writing-mode: vertical-rl; line-height: 1;
  padding: .7rem .26rem; border-radius: 6px;
  background: var(--brand); color: #fff;
  font-size: .74rem; font-weight: 700; letter-spacing: .16em; }

/* 汇流框里那块改成**横排**（用户口径第 6 版）：与左栏那条竖排色块是两套口径 ——

竖排时 line-height 决定的是「宽度」，横排时才是「高度」，所以这里要重新给一遍，

否则继承来的 line-height:1 会让色块矮得像条细线 */

.ax-merge .ax-boundary > span { writing-mode: horizontal-tb; line-height: 1.25;
  padding: .3rem .68rem; letter-spacing: .14em; }

/* 竖虚线（隔离墙）：**画在网络切换器的中线上** —— 即「平分网络切换器」。

机构卡是不透明白底，线于是只在卡上下两端露出，读作「这条边界穿卡而过」。

位置 ＝ 边界色块宽 + 半个机构卡宽；右栏不用它（右栏的线是汇流括号那两条竖腿） */

.ax-wall { position: absolute; top: 0; bottom: 0; width: 0;
  left: calc(var(--ax-wallw) + var(--ax-switchw) / 2);
  border-left: 1.5px dashed var(--ax-wall); }

/* 链路侧＝横向接入链路（原图右侧那条横线）：左栏「边界色块 ═ 网络切换器 ═ OEIDP ═ 云终端」，

右栏「平台条 ═ OEIDP ═ 云终端」。链路垂直居中 → 两栏的云终端落在同一条水平带上。

显示器 / 桌面选单界面用绝对定位浮在链路上方、不占行高 */

.ax-rail { position: relative; display: flex; flex-direction: column;
  justify-content: center; }

.ax-flow { display: flex; align-items: center; gap: 0;
  min-height: var(--ax-barh); }

/* 左栏：把整条链路带（物理隔离色块 + 网络切换器 + OEIDP + 云终端）**上提 --ax-lift**，

让它的中线对准**面板全高**的中线。flex 居中时 margin-bottom 参与分配，

等于把 flow 往上推「上提量的两倍」——所以这里写的是 lift 本身，效果刚好是 lift。

⚠️ 只给左栏写：右栏的 .ax-flow 在 grid 行 3 且 align-self:start，

margin 只会把它的盒子向下撑高，不会改动链路位置。 */

.ax-panel--l .ax-flow { margin-bottom: var(--ax-lift); }

/* 右栏：链路行必须与「平台条」同行 —— 平台条那条橙线的右端才接得上 OEIDP 那条线，

两边也才同高。用 subgrid 把左右两列绑到同一套行上

（三行：桌面卡组 / 汇流框 / 平台条 + 链路）。

⚠️ 行 3 是 1fr（富余全落在平台条以下）是**刻意**的：平台条因此永远贴底、与左栏同高。

所以「把汇流框画大」绝不能靠加行高 —— 行 2 一高，平台条就被整体推下去

（实测框 +24px → 平台条下移 24px → 两栏链路带错开从 3.9px 恶化到 27.9px）。

正确做法见 .ax-merge：负外边距吃掉自己上下的间隙向外长，行高不动 */

.ax-body--r { grid-template-rows: auto auto 1fr; row-gap: .55rem; }

/* ⚠️ grid-template-columns 必须显式声明：.ax-main 一旦改成 grid（为了 subgrid 绑行高），

它就**不再是 flex 子项**了 —— 隐式列按 max-content 收缩（实测只有 216px ＝面板内宽的 36%），

再叠加从基础规则继承来的 justify-content: space-between，剩下 140px 全被甩到列右侧，

于是「内网办公 / 互联网资料查询」看着根本不到 60%。

minmax(0,1fr) 让列吃满容器宽；justify-content 也要显式改回 normal，否则同样是 start 语义 */

.ax-body--r .ax-main { grid-row: 1 / -1; grid-column: 1;
  display: grid; grid-template-rows: subgrid; grid-template-columns: minmax(0, 1fr);
  justify-content: normal; gap: .55rem 0; }

.ax-body--r .ax-rail { grid-row: 3; grid-column: 2; align-self: start; }

/* 机构卡：原图里「三个窗点 + 设备图标 + 名称」的小卡。

平台条那两条横线由 .ax-bar::after 一路画到卡的中线上（＝竖虚线所在处），

所以卡自己不再补那一小段连线 */

.ax-switch { position: relative; flex: 0 0 var(--ax-switchw);
  display: flex; flex-direction: column;
  align-items: center; gap: .3rem; padding: .6rem .35rem .5rem;
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 4px 14px rgba(29, 35, 48, .05); }

.ax-nodes { display: flex; gap: .24rem; }

.ax-nodes i { width: .3rem; height: .3rem; border-radius: 50%; background: var(--ink-3); }

.ax-switch-ico { width: 100%; background-repeat: no-repeat;
  background-position: center; background-size: contain; }

.ax-switch-ico--sw { height: 1.7rem; background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA4MjU1MDAgNDc5NDI1IiBhcmlhLWhpZGRlbj0idHJ1ZSI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCwwKSI+PGcgZmlsbD0ibm9uZSIgc3Ryb2tlPSJub25lIj48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iODI1NTAwIiBoZWlnaHQ9IjQ3OTQyNSIvPjwvZz48L2c+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTI3MCwyMDAwMjUpIj48ZyBmaWxsPSIjN0E3RjkxIiBzdHJva2U9Im5vbmUiPjxlbGxpcHNlIGN4PSI0MTExNjIuNSIgY3k9IjEzOTA2NSIgcng9IjQxMTE2Mi41IiByeT0iMTM5MDY1Ii8+PC9nPjwvZz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLDE0Mjg3NSkiPjxnIGZpbGw9IiM3QTdGOTEiIHN0cm9rZT0ibm9uZSI+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjgyMTA1NSIgaGVpZ2h0PSIyMTc4MDUiLz48L2c+PC9nPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyNzAsMTI3MCkiPjxnIGZpbGw9IiM3QTdGOTEiIHN0cm9rZT0iI0FEQUNBQyIgc3Ryb2tlLXdpZHRoPSI0NzYzIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbGluZWNhcD0icm91bmQiPjxlbGxpcHNlIGN4PSI0MTExNjIuNSIgY3k9IjEzOTA2NSIgcng9IjQxMTE2Mi41IiByeT0iMTM5MDY1Ii8+PC9nPjwvZz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0MjA1MzQuNDk5LDM5Njg3LjUpIj48ZyBmaWxsPSIjMzk0MDRmIiBzdHJva2U9Im5vbmUiPjxwYXRoIGQ9Ik0wIDY4MjYyLjVMNjAzNTguNjA3IDg4OTAwTDIwNDkwMS41ODggMzAxNjIuNUwyNzAwMjUuMzQ4IDQ5MjEyLjVMMjM1MDgwLjg5MSAwTDY1MTIzLjc2IDBMMTM1MDEyLjY3NCAxNDI4Ny41TDAgNjgyNjIuNVoiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L2c+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDIwNTM0LjQ5OSwzOTY4Ny41KSI+PGcgZmlsbD0iIzM5NDA0ZiIgc3Ryb2tlPSJub25lIj48cGF0aCBkPSJNMCA2ODI2Mi41TDYwMzU4LjYwNyA4ODkwMEwyMDQ5MDEuNTg4IDMwMTYyLjVMMjcwMDI1LjM0OCA0OTIxMi41TDIzNTA4MC44OTEgMEw2NTEyMy43NiAwTDEzNTAxMi42NzQgMTQyODcuNUwwIDY4MjYyLjVaIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L2c+PC9nPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyNTA5NSwxNDI4NzUpIj48ZyBmaWxsPSIjMzk0MDRmIiBzdHJva2U9Im5vbmUiPjxwYXRoIGQ9Ik0yNzAwMjUuMzQ4IDIwNjM3LjVMMjA5NjY2Ljc0MSAwTDY5ODg4LjkxNCA2MDMyNUwwIDM5Njg3LjVMMzQ5NDQuNDU3IDkzNjYyLjVMMjA5NjY2Ljc0MSA5MzY2Mi41TDEzNTAxMi42NzQgNzQ2MTIuNUwyNzAwMjUuMzQ4IDIwNjM3LjVaIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L2c+PC9nPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyNTA5NSwxNDI4NzUpIj48ZyBmaWxsPSIjMzk0MDRmIiBzdHJva2U9Im5vbmUiPjxwYXRoIGQ9Ik0yNzAwMjUuMzQ4IDIwNjM3LjVMMjA5NjY2Ljc0MSAwTDY5ODg4LjkxNCA2MDMyNUwwIDM5Njg3LjVMMzQ5NDQuNDU3IDkzNjYyLjVMMjA5NjY2Ljc0MSA5MzY2Mi41TDEzNTAxMi42NzQgNzQ2MTIuNUwyNzAwMjUuMzQ4IDIwNjM3LjVaIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L2c+PC9nPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEzOTM5MC40NiwzNDkyNSkiPjxnIGZpbGw9IiMzOTQwNGYiIHN0cm9rZT0ibm9uZSI+PHBhdGggZD0iTTAgMTkwNTBMNjAzNTguNjA3IDBMMjA0OTAxLjU4OCA1Mzk3NUwyNzAwMjUuMzQ4IDM5Njg3LjVMMjM1MDgwLjg5MSA4ODkwMEw2NTEyMy43NiA4ODkwMEwxMzUwMTIuNjc0IDczMDI1TDAgMTkwNTBaIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L2c+PC9nPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEzOTM5MC40NiwzNDkyNSkiPjxnIGZpbGw9IiMzOTQwNGYiIHN0cm9rZT0ibm9uZSI+PHBhdGggZD0iTTAgMTkwNTBMNjAzNTguNjA3IDBMMjA0OTAxLjU4OCA1Mzk3NUwyNzAwMjUuMzQ4IDM5Njg3LjVMMjM1MDgwLjg5MSA4ODkwMEw2NTEyMy43NiA4ODkwMEwxMzUwMTIuNjc0IDczMDI1TDAgMTkwNTBaIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L2c+PC9nPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQwOTQxNS44MDgsMTUzOTg3LjUpIj48ZyBmaWxsPSIjMzk0MDRmIiBzdHJva2U9Im5vbmUiPjxwYXRoIGQ9Ik0yNzE2MTMuNzMzIDY4MjYyLjVMMjExMjU1LjEyNSA4ODkwMEw3MTQ3Ny4yOTggMjg1NzVMMCA0OTIxMi41TDM0OTQ0LjQ1NyAwTDIxMTI1NS4xMjUgMEwxMzY2MDEuMDU4IDE0Mjg3LjVMMjcxNjEzLjczMyA2ODI2Mi41WiIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9nPjwvZz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0MDk0MTUuODA4LDE1Mzk4Ny41KSI+PGcgZmlsbD0iIzM5NDA0ZiIgc3Ryb2tlPSJub25lIj48cGF0aCBkPSJNMjcxNjEzLjczMyA2ODI2Mi41TDIxMTI1NS4xMjUgODg5MDBMNzE0NzcuMjk4IDI4NTc1TDAgNDkyMTIuNUwzNDk0NC40NTcgMEwyMTEyNTUuMTI1IDBMMTM2NjAxLjA1OCAxNDI4Ny41TDI3MTYxMy43MzMgNjgyNjIuNVoiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L2c+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDI1Mjk5LjY1Miw0NDQ1MCkiPjxnIGZpbGw9IiNGRkZGRkYiIHN0cm9rZT0ibm9uZSI+PHBhdGggZD0iTTAgNjk4NTBMNjAzNTguNjA3IDg4OTAwTDIwNDkwMS41ODggMzAxNjIuNUwyNzAwMjUuMzQ4IDQ5MjEyLjVMMjM1MDgwLjg5MSAwTDY1MTIzLjc2IDBMMTM1MDEyLjY3NCAxNDI4Ny41TDAgNjk4NTBaIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L2c+PC9nPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQyNTI5OS42NTIsNDQ0NTApIj48ZyBmaWxsPSIjRkZGRkZGIiBzdHJva2U9Im5vbmUiPjxwYXRoIGQ9Ik0wIDY5ODUwTDYwMzU4LjYwNyA4ODkwMEwyMDQ5MDEuNTg4IDMwMTYyLjVMMjcwMDI1LjM0OCA0OTIxMi41TDIzNTA4MC44OTEgMEw2NTEyMy43NiAwTDEzNTAxMi42NzQgMTQyODcuNUwwIDY5ODUwWiIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9nPjwvZz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMjk4NjAuMTUzLDE0NzYzNy41KSI+PGcgZmlsbD0iI0ZGRkZGRiIgc3Ryb2tlPSJub25lIj48cGF0aCBkPSJNMjcwMDI1LjM0OCAyMDYzNy41TDIwOTY2Ni43NDEgMEw2OTg4OC45MTQgNjAzMjVMMCAzOTY4Ny41TDM0OTQ0LjQ1NyA5NTI1MEwyMDk2NjYuNzQxIDk1MjUwTDEzNTAxMi42NzQgNzQ2MTIuNUwyNzAwMjUuMzQ4IDIwNjM3LjVaIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L2c+PC9nPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyOTg2MC4xNTMsMTQ3NjM3LjUpIj48ZyBmaWxsPSIjRkZGRkZGIiBzdHJva2U9Im5vbmUiPjxwYXRoIGQ9Ik0yNzAwMjUuMzQ4IDIwNjM3LjVMMjA5NjY2Ljc0MSAwTDY5ODg4LjkxNCA2MDMyNUwwIDM5Njg3LjVMMzQ5NDQuNDU3IDk1MjUwTDIwOTY2Ni43NDEgOTUyNTBMMTM1MDEyLjY3NCA3NDYxMi41TDI3MDAyNS4zNDggMjA2MzcuNVoiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L2c+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTQ0MTU1LjYxMywzOTY4Ny41KSI+PGcgZmlsbD0iI0ZGRkZGRiIgc3Ryb2tlPSJub25lIj48cGF0aCBkPSJNMCAxOTA1MEw2MDM1OC42MDcgMEwyMDY0ODkuOTcyIDUzOTc1TDI3MTYxMy43MzMgMzk2ODcuNUwyMzY2NjkuMjc2IDg4OTAwTDY1MTIzLjc2IDg4OTAwTDEzNTAxMi42NzQgNzQ2MTIuNUwwIDE5MDUwWiIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9nPjwvZz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNDQxNTUuNjEzLDM5Njg3LjUpIj48ZyBmaWxsPSIjRkZGRkZGIiBzdHJva2U9Im5vbmUiPjxwYXRoIGQ9Ik0wIDE5MDUwTDYwMzU4LjYwNyAwTDIwNjQ4OS45NzIgNTM5NzVMMjcxNjEzLjczMyAzOTY4Ny41TDIzNjY2OS4yNzYgODg5MDBMNjUxMjMuNzYgODg5MDBMMTM1MDEyLjY3NCA3NDYxMi41TDAgMTkwNTBaIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L2c+PC9nPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQxNTc2OS4zNDUsMTU4NzUwKSI+PGcgZmlsbD0iI0ZGRkZGRiIgc3Ryb2tlPSJub25lIj48cGF0aCBkPSJNMjcwMDI1LjM0OCA2ODI2Mi41TDIwOTY2Ni43NDEgODg5MDBMNjk4ODguOTE0IDI4NTc1TDAgNDkyMTIuNUwzNDk0NC40NTcgMEwyMDk2NjYuNzQxIDBMMTM1MDEyLjY3NCAxNDI4Ny41TDI3MDAyNS4zNDggNjgyNjIuNVoiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L2c+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDE1NzY5LjM0NSwxNTg3NTApIj48ZyBmaWxsPSIjRkZGRkZGIiBzdHJva2U9Im5vbmUiPjxwYXRoIGQ9Ik0yNzAwMjUuMzQ4IDY4MjYyLjVMMjA5NjY2Ljc0MSA4ODkwMEw2OTg4OC45MTQgMjg1NzVMMCA0OTIxMi41TDM0OTQ0LjQ1NyAwTDIwOTY2Ni43NDEgMEwxMzUwMTIuNjc0IDE0Mjg3LjVMMjcwMDI1LjM0OCA2ODI2Mi41WiIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9nPjwvZz48L3N2Zz4=); }

.ax-switch-t { margin: 0; font-size: .74rem; font-weight: 600; color: var(--ink); }

/* 链路本体：一个零高度的 flex 填充块，线画在它自己的中线上，

OEIDP 标签压在线上（标签底色抠出断口）。

**宽度＝所在面板的 20%**（20cqw，cqw 由 .ax-body 提供，左右两栏同一口径）。

线一律用实线橙 —— 右栏它与「噢易云PC系统」的橙条是同一条链路，要读成一整条 */

.ax-link { position: relative; flex: 0 0 20cqw; min-width: 2.4rem; align-self: center; }

.ax-link::after { content: ""; position: absolute; left: 0; right: 0; top: 0;
  border-top: 2px solid var(--brand); }

.ax-link .ax-proto { position: absolute; left: 50%; top: 0; z-index: 1;
  transform: translate(-50%, -50%); background: var(--bg-soft); padding: .12rem .4rem; }

/* 桌面选单界面（素材库「医疗双桌面」界面截图裁亮部） */

.ax-shot { border-radius: 4px; overflow: hidden; background: #fff; }

.ax-shot-bar { display: flex; align-items: center; gap: .2rem; padding: .2rem .35rem;
  background: var(--bg-soft); }

.ax-shot-bar i { width: .24rem; height: .24rem; border-radius: 50%; background: #d7dde7; }

.ax-shot img { display: block; width: 100%; height: auto; }

.ax-bolt { position: absolute; right: -.15rem; bottom: .35rem; width: .78rem;
  opacity: .95; }

.ax-bolt svg { display: block; width: 100%; height: auto; }

/* 终端簇：就是原图右侧那颗「云终端」盒。浮层（显示器 / 桌面选单界面）

绝对定位挂在它上方——盒高即链路落点，「云终端」三字也脱离行高。

左栏占 --ax-termw；右栏按用户口径占面板的 20%（20cqw） */

.ax-term { position: relative; flex: 0 0 var(--ax-termw);
  display: flex; flex-direction: column; align-items: center; }

.ax-body--r .ax-term { flex: 0 0 20cqw; }

/* 右栏那 20% 比图标宽：「OEIDP 桌面协议」那条线得再往里补一小段才接到「云终端」，

否则线在半途就断（图标在 20% 里居中，左右各空 (100% - 图标宽)/2）。

图标本身仍按 --ax-termw 定死 —— 两栏的「云终端」一般大 */

.ax-body--r .ax-term::before { content: ""; position: absolute; top: 50%; left: 0;
  width: calc((100% - var(--ax-termw)) / 2);
  border-top: 2px solid var(--brand); }

.ax-term-ic { width: var(--ax-termw); height: 1.25rem;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0OC41NCAxNy4zNiIgYXJpYS1oaWRkZW49InRydWUiPjxnPiA8cG9seWdvbiBjbGFzcz0iZmlsMCBzdHIwIiBwb2ludHM9IjE4Ljc0LDAuMjEgNDcuODksMi4zNiAzMC42NCw4LjE1IDEuMDUsNi4wNyAiLz4gPHBvbHlnb24gY2xhc3M9ImZpbDEgc3RyMSIgcG9pbnRzPSIwLjM1LDYuMzMgMzAuNjksOC41MiAzMC42NiwxNy4wMyAwLjIxLDE0LjIyICIvPiA8cG9seWdvbiBjbGFzcz0iZmlsMiBzdHIyIiBwb2ludHM9IjMwLjY5LDguNTIgNDguMjMsMi41NSA0OC4zMyw5LjQ0IDMwLjY2LDE3LjAzICIvPiA8cG9seWdvbiBmaWxsPSIjRkY2QTAwIiBwb2ludHM9IjE4Ljc0LDEuMjggNDMuNTksMy4xNiAzMC41NCw3LjQyIDUuODksNS42NCAiLz4gPHBvbHlnb24gY2xhc3M9ImZpbDQgc3RyMyIgcG9pbnRzPSI5LjgsOC44NCAxMC4xMSw4Ljg3IDEwLjExLDEwLjc2IDkuOCwxMC43NCAiLz4gPHBvbHlnb24gY2xhc3M9ImZpbDQgc3RyMyIgcG9pbnRzPSIxMC45OSw4LjkyIDExLjI5LDguOTUgMTEuMjksMTAuOSAxMC45OSwxMC44OCAiLz4gPHBvbHlnb24gY2xhc3M9ImZpbDQgc3RyMyIgcG9pbnRzPSIxMi4xOCw5LjAzIDEyLjQ4LDkuMDUgMTIuNDgsMTEuMDIgMTIuMTgsMTAuOTkgIi8+IDxwb2x5Z29uIGNsYXNzPSJmaWw0IHN0cjMiIHBvaW50cz0iMTMuMzcsOS4wOSAxMy42OCw5LjEyIDEzLjY4LDExLjEzIDEzLjM4LDExLjEgIi8+IDxwb2x5Z29uIGNsYXNzPSJmaWw0IHN0cjMiIHBvaW50cz0iMTQuNTEsOS4xOCAxNC44MSw5LjIgMTQuODEsMTEuMjMgMTQuNTEsMTEuMjEgIi8+IDxwb2x5Z29uIGNsYXNzPSJmaWw0IHN0cjMiIHBvaW50cz0iMTUuNzYsOS4yNiAxNi4wNiw5LjI5IDE2LjA2LDExLjM1IDE1Ljc2LDExLjMzICIvPiA8cG9seWdvbiBjbGFzcz0iZmlsNCBzdHIzIiBwb2ludHM9IjE2Ljk1LDkuMzUgMTcuMjUsOS4zOCAxNy4yNSwxMS40NyAxNi45NSwxMS40NSAiLz4gPHBvbHlnb24gY2xhc3M9ImZpbDQgc3RyMyIgcG9pbnRzPSIxOC4xNCw5LjQ0IDE4LjQ0LDkuNDYgMTguNDQsMTEuNTggMTguMTQsMTEuNTYgIi8+IDxwb2x5Z29uIGNsYXNzPSJmaWw0IHN0cjMiIHBvaW50cz0iMTkuMzUsOS41MyAxOS42NSw5LjU1IDE5LjY1LDExLjcgMTkuMzUsMTEuNjggIi8+IDxwb2x5Z29uIGNsYXNzPSJmaWw0IHN0cjMiIHBvaW50cz0iMjAuNTMsOS42MSAyMC44NCw5LjY0IDIwLjgzLDExLjgyIDIwLjUzLDExLjc5ICIvPiA8cG9seWdvbiBjbGFzcz0iZmlsNCBzdHIzIiBwb2ludHM9IjIxLjc1LDkuNyAyMi4wNiw5LjcyIDIyLjA2LDExLjkzIDIxLjc1LDExLjkxICIvPiA8cG9seWdvbiBjbGFzcz0iZmlsNCBzdHIzIiBwb2ludHM9IjIyLjksOS43OCAyMy4yLDkuODEgMjMuMiwxMi4wNCAyMi45LDEyLjAxICIvPiA8cGF0aCBjbGFzcz0iZmlsNSBzdHI0IiBkPSJNMTAuNSAxMi4xOWwwLjY1IDAuMDUgMC4zNiAtMC4xIDMuMDEgMC4yNCAwLjQxIDAuMTYgMC41NSAwLjA0YzAuMzYsMC4wMyAwLjY2LDAuNDEgMC42NiwwLjg1bDAgMGMwLDAuNDQgLTAuMywwLjc5IC0wLjY2LDAuNzRsLTAuNTMgLTAuMDcgLTAuNCAwLjE2IC0zLjE0IC0wLjI4IC0wLjM3IC0wLjIgLTAuNTQgMGMtMC4zNywwIC0wLjY2LC0wLjQxIC0wLjY2LC0wLjg1bDAgMGMwLC0wLjQ0IDAuMywtMC43NyAwLjY2LC0wLjc0eiIvPiA8cG9seWdvbiBmaWxsPSIjMzQzQTRBIiBwb2ludHM9IjExLjcxLDEyLjUxIDExLjQzLDEzLjUxIDExLjUyLDEzLjYzIDE0LjI0LDEzLjg4IDE0LjM2LDEzLjc4IDE0LjI3LDEyLjcyIDE0LjE1LDEyLjYzIDExLjg1LDEyLjQ1ICIvPiA8Y2lyY2xlIGZpbGw9IiNFRUVFRUYiIHRyYW5zZm9ybT0ibWF0cml4KDAuNTcxMzg0IDAuMDM1ODY3NCAxLjE0NTgyRS0xOCAwLjU3MTM4NCAxMi4yNDU0IDEyLjc5OTQpIiByPSIwLjE2Ii8+IDxjaXJjbGUgZmlsbD0iI0VFRUVFRiIgdHJhbnNmb3JtPSJtYXRyaXgoMC41NzEzODQgMC4wMzU4Njc0IDEuMTQ1ODJFLTE4IDAuNTcxMzg0IDEyLjYyMzUgMTIuODIzMSkiIHI9IjAuMTYiLz4gPGNpcmNsZSBmaWxsPSIjRUVFRUVGIiB0cmFuc2Zvcm09Im1hdHJpeCgwLjU3MTM4NCAwLjAzNTg2NzQgMS4xNDU4MkUtMTggMC41NzEzODQgMTMuMDAyNCAxMi44NDY5KSIgcj0iMC4xNiIvPiA8Y2lyY2xlIGZpbGw9IiNFRUVFRUYiIHRyYW5zZm9ybT0ibWF0cml4KDAuNTcxMzg0IDAuMDM1ODY3NCAxLjE0NTgyRS0xOCAwLjU3MTM4NCAxMy4zNTEyIDEyLjg2ODgpIiByPSIwLjE2Ii8+IDxjaXJjbGUgZmlsbD0iI0VFRUVFRiIgdHJhbnNmb3JtPSJtYXRyaXgoMC41NzEzODQgMC4wMzU4Njc0IDEuMTQ1ODJFLTE4IDAuNTcxMzg0IDEzLjgwNTYgMTIuODk3MykiIHI9IjAuMTYiLz4gPGNpcmNsZSBmaWxsPSIjRUVFRUVGIiB0cmFuc2Zvcm09Im1hdHJpeCgwLjU3MTM4NCAwLjAzNTg2NzQgMS4xNDU4MkUtMTggMC41NzEzODQgMTIuMDQ2NiAxMy4xMjIzKSIgcj0iMC4xNiIvPiA8Y2lyY2xlIGZpbGw9IiNFRUVFRUYiIHRyYW5zZm9ybT0ibWF0cml4KDAuNTcxMzg0IDAuMDM1ODY3NCAxLjE0NTgyRS0xOCAwLjU3MTM4NCAxMi40MjQ4IDEzLjE0NikiIHI9IjAuMTYiLz4gPGNpcmNsZSBmaWxsPSIjRUVFRUVGIiB0cmFuc2Zvcm09Im1hdHJpeCgwLjU3MTM4NCAwLjAzNTg2NzQgMS4xNDU4MkUtMTggMC41NzEzODQgMTIuODAzNiAxMy4xNjk4KSIgcj0iMC4xNiIvPiA8Y2lyY2xlIGZpbGw9IiNFRUVFRUYiIHRyYW5zZm9ybT0ibWF0cml4KDAuNTcxMzg0IDAuMDM1ODY3NCAxLjE0NTgyRS0xOCAwLjU3MTM4NCAxMy4xNTI1IDEzLjE5MTcpIiByPSIwLjE2Ii8+IDxjaXJjbGUgZmlsbD0iI0VFRUVFRiIgdHJhbnNmb3JtPSJtYXRyaXgoMC41NzEzODQgMC4wMzU4Njc0IDEuMTQ1ODJFLTE4IDAuNTcxMzg0IDEzLjYwNjggMTMuMjIwMikiIHI9IjAuMTYiLz4gPGNpcmNsZSBmaWxsPSIjRUVFRUVGIiB0cmFuc2Zvcm09Im1hdHJpeCgwLjU3MTM4NCAwLjAzNTg2NzQgMS4xNDU4MkUtMTggMC41NzEzODQgMTIuMzg4NiAxMy40NTUpIiByPSIwLjE2Ii8+IDxjaXJjbGUgZmlsbD0iI0VFRUVFRiIgdHJhbnNmb3JtPSJtYXRyaXgoMC41NzEzODQgMC4wMzU4Njc0IDEuMTQ1ODJFLTE4IDAuNTcxMzg0IDEyLjc2NjcgMTMuNDc4NykiIHI9IjAuMTYiLz4gPGNpcmNsZSBmaWxsPSIjRUVFRUVGIiB0cmFuc2Zvcm09Im1hdHJpeCgwLjU3MTM4NCAwLjAzNTg2NzQgMS4xNDU4MkUtMTggMC41NzEzODQgMTMuMTQ1NiAxMy41MDI1KSIgcj0iMC4xNiIvPiA8Y2lyY2xlIGZpbGw9IiNFRUVFRUYiIHRyYW5zZm9ybT0ibWF0cml4KDAuNTcxMzg0IDAuMDM1ODY3NCAxLjE0NTgyRS0xOCAwLjU3MTM4NCAxMy40OTQ0IDEzLjUyNDQpIiByPSIwLjE2Ii8+IDxjaXJjbGUgZmlsbD0iI0VFRUVFRiIgdHJhbnNmb3JtPSJtYXRyaXgoMC41NzEzODQgMC4wMzU4Njc0IDEuMTQ1ODJFLTE4IDAuNTcxMzg0IDEzLjk0ODggMTMuNTUyOSkiIHI9IjAuMTYiLz4gPHBvbHlnb24gZmlsbD0iIzM0M0E0QSIgcG9pbnRzPSIxMC43MiwxMi41IDEwLjk1LDEyLjYyIDExLjE3LDEyLjc1IDExLjE3LDEzIDExLjE3LDEzLjI2IDEwLjk1LDEzLjM4IDEwLjcyLDEzLjUxIDEwLjQ5LDEzLjM4IDEwLjI3LDEzLjI2IDEwLjI3LDEzIDEwLjI3LDEyLjc1IDEwLjQ5LDEyLjYyICIvPiA8Y2lyY2xlIGZpbGw9IiNFRUVFRUYiIGN4PSIxMC43IiBjeT0iMTMuMDEiIHI9IjAuMzYiLz4gPHBvbHlnb24gZmlsbD0iIzM0M0E0QSIgcG9pbnRzPSIxNS4yLDEyLjgxIDE1LjQyLDEyLjk0IDE1LjY1LDEzLjA2IDE1LjY1LDEzLjMyIDE1LjY1LDEzLjU3IDE1LjQyLDEzLjcgMTUuMiwxMy44MiAxNC45NywxMy43IDE0Ljc0LDEzLjU3IDE0Ljc0LDEzLjMyIDE0Ljc0LDEzLjA2IDE0Ljk3LDEyLjk0ICIvPiA8Y2lyY2xlIGZpbGw9IiNGRUZFRkUiIGN4PSIxNS4xOSIgY3k9IjEzLjMyIiByPSIwLjM2Ii8+IDxjaXJjbGUgY2xhc3M9ImZpbDQgc3RyNCIgY3g9IjE5LjI2IiBjeT0iMTMuNTIiIHI9IjAuODYiLz4gPGNpcmNsZSBmaWxsPSIjMzQzQTRBIiBjeD0iMTkuMjYiIGN5PSIxMy41MiIgcj0iMC43MSIvPiA8cG9seWdvbiBjbGFzcz0iZmlsMCBzdHI0IiBwb2ludHM9IjMyLjA3LDExLjMxIDM1LjA2LDEwLjI0IDM1LjA2LDExLjY4IDMyLjA3LDEyLjc1ICIvPiA8cG9seWdvbiBmaWxsPSIjMzQzQTRBIiBwb2ludHM9IjMyLjE5LDExLjM3IDM0LjQ4LDEwLjU1IDM0LjQ4LDExLjY2IDMyLjE5LDEyLjQ4ICIvPiA8ZWxsaXBzZSBmaWxsPSIjRkVGRUZFIiBjeD0iMzkuNDUiIGN5PSIzLjU0IiByeD0iMC45OCIgcnk9IjAuMzciLz4gPGVsbGlwc2UgZmlsbD0iI0RDRENERCIgY3g9IjM5LjQ1IiBjeT0iMy41NCIgcng9IjAuOTIiIHJ5PSIwLjM1Ii8+IDxlbGxpcHNlIGZpbGw9IiNGRUZFRkUiIGN4PSIzOS40NSIgY3k9IjMuNTQiIHJ4PSIwLjc3IiByeT0iMC4yOSIvPiA8cGF0aCBmaWxsPSIjRkY2QTAwIiBkPSJNNDAuNjcgOC43NmwwIDAuMjIgLTAuOTIgMC4zNyAwIC0wLjIyIDAuOTIgLTAuMzd6bTEuNjIgLTAuNmwwIDAuMjIgLTEuMSAwLjQ0Yy0wLDAuMTMgMC4wMywwLjIyIDAuMDksMC4yNiAwLjAzLDAuMDIgMC4wNywwLjAzIDAuMTIsMC4wMyAwLjA1LC0wLjAxIDAuMTIsLTAuMDMgMC4yMSwtMC4wNmwwLjY4IC0wLjI3IDAgMC4yMiAtMC43NSAwLjNjLTAuMTEsMC4wNSAtMC4yLDAuMDcgLTAuMjcsMC4wOCAtMC4wNiwwLjAxIC0wLjEyLC0wIC0wLjE3LC0wLjAzIC0wLjEzLC0wLjA3IC0wLjE5LC0wLjIzIC0wLjE5LC0wLjQ4IDAsLTAuMyAwLjEsLTAuNTYgMC4yOSwtMC43NiAwLjEsLTAuMTEgMC4yNCwtMC4xOSAwLjQxLC0wLjI2bDAuNjggLTAuMjcgMCAwLjIyIC0wLjY0IDAuMjZjLTAuMDksMC4wNCAtMC4xNywwLjA3IC0wLjIyLDAuMTEgLTAuMDUsMC4wNCAtMC4xLDAuMDggLTAuMTMsMC4xMyAtMC4wNiwwLjA4IC0wLjA5LDAuMTggLTAuMTEsMC4zbDEuMSAtMC40NHptMS41NSAtMC42NWMwLC0wLjE0IC0wLjAyLC0wLjIzIC0wLjA1LC0wLjI1IC0wLjAzLC0wLjAyIC0wLjEyLC0wLjAxIC0wLjI1LDAuMDRsLTAuOTIgMC4zNyAwIC0wLjIyIDAuOTggLTAuNGMwLjEyLC0wLjA1IDAuMjEsLTAuMDggMC4yNywtMC4wOCAwLjA2LC0wLjAxIDAuMTEsMC4wMSAwLjE1LDAuMDQgMC4wMywwLjAzIDAuMDUsMC4wNyAwLjA3LDAuMTIgMC4wMSwwLjA1IDAuMDIsMC4xMyAwLjAyLDAuMjRsMCAwLjkgLTAuOTcgMC4zOWMtMC4xMywwLjA1IC0wLjIxLDAuMDggLTAuMjYsMC4wOSAtMC4xLDAuMDIgLTAuMTgsMC4wMSAtMC4yNCwtMC4wNCAtMC4wNSwtMC4wNSAtMC4wOCwtMC4xMyAtMC4wOCwtMC4yNCAwLC0wLjA4IDAuMDEsLTAuMTYgMC4wNCwtMC4yNCAwLjAzLC0wLjA4IDAuMDcsLTAuMTUgMC4xMiwtMC4yIDAuMDYsLTAuMDcgMC4xOCwtMC4xNCAwLjM0LC0wLjJsMC43NyAtMC4zMXptMCAwLjIybC0wLjc0IDAuM2MtMC4wOCwwLjAzIC0wLjEzLDAuMDYgLTAuMTcsMC4wOSAtMC4wNiwwLjA1IC0wLjA5LDAuMTMgLTAuMDksMC4yMiAwLDAuMDggMC4wMiwwLjEyIDAuMDYsMC4xNCAwLjA0LDAuMDIgMC4xMSwwIDAuMiwtMC4wM2wwLjc0IC0wLjMgMCAtMC40MnptMi4wNiAtMS42MWwwIDAuMjIgLTAuOSAwLjM2Yy0wLjA5LDAuMDQgLTAuMTUsMC4wNiAtMC4xOCwwLjA4IC0wLjAzLDAuMDEgLTAuMDUsMC4wNCAtMC4wNywwLjA2IC0wLjAzLDAuMDUgLTAuMDUsMC4xMSAtMC4wNSwwLjE4IDAsMC4wNyAwLjAyLDAuMTEgMC4wNSwwLjEyIDAuMDMsMC4wMSAwLjExLC0wLjAxIDAuMjIsLTAuMDVsMC40NyAtMC4xOWMwLjE1LC0wLjA2IDAuMjQsLTAuMDkgMC4yNywtMC4xIDAuMDMsLTAuMDEgMC4wNywtMC4wMSAwLjEsLTAgMC4wOSwwLjAyIDAuMTMsMC4xMiAwLjEzLDAuMyAwLDAuMiAtMC4wNiwwLjM1IC0wLjE3LDAuNDUgLTAuMDMsMC4wMyAtMC4wNywwLjA2IC0wLjExLDAuMDggLTAuMDQsMC4wMiAtMC4xMiwwLjA1IC0wLjIyLDAuMWwtMSAwLjQgMCAtMC4yMiAwLjk0IC0wLjM4YzAuMTIsLTAuMDUgMC4yLC0wLjA5IDAuMjMsLTAuMTEgMC4wNCwtMC4wNCAwLjA3LC0wLjEgMC4wNywtMC4xOSAwLC0wLjA5IC0wLjAzLC0wLjEzIC0wLjA4LC0wLjEzIC0wLjAyLDAgLTAuMDksMC4wMiAtMC4xOSwwLjA3bC0wLjQgMC4xNmMtMC4xNCwwLjA2IC0wLjI0LDAuMDkgLTAuMjksMC4xIC0wLjA1LDAuMDEgLTAuMSwwLjAxIC0wLjEzLC0wLjAxIC0wLjA5LC0wLjA0IC0wLjE0LC0wLjE0IC0wLjE0LC0wLjMgMCwtMC4wOCAwLjAyLC0wLjE2IDAuMDUsLTAuMjQgMC4wMywtMC4wOCAwLjA3LC0wLjE0IDAuMTMsLTAuMTkgMC4wNywtMC4wNyAwLjE4LC0wLjEzIDAuMzIsLTAuMTlsMC45NyAtMC4zOXptMS41NiAwLjEybDAgLTAuNzUgMC4yNyAtMC4xMSAwIDAuNzRjMCwwLjE2IC0wLDAuMjcgLTAuMDEsMC4zNSAtMC4wMSwwLjA3IC0wLjAyLDAuMTMgLTAuMDQsMC4xOCAtMC4wNCwwLjA5IC0wLjA5LDAuMTYgLTAuMTYsMC4yMSAtMC4wNywwLjA1IC0wLjQ4LDAuMjMgLTAuNjUsMC4zbC0wLjU5IDAuMjQgMCAtMC4yMiAwLjU4IC0wLjIzYzAuMSwtMC4wNCAwLjQ1LC0wLjE4IDAuNDgsLTAuMiAwLjAzLC0wLjAxIDAuMDUsLTAuMDQgMC4wNywtMC4wNyAwLjA0LC0wLjA1IDAuMDUsLTAuMTIgMC4wNSwtMC4yMWwtMC42NiAwLjI3Yy0wLjA5LDAuMDMgLTAuMTUsMC4wNiAtMC4yLDAuMDYgLTAuMDQsMC4wMSAtMC4wOSwwLjAxIC0wLjE0LC0wIC0wLjA4LC0wLjAyIC0wLjEzLC0wLjA2IC0wLjE1LC0wLjEyIC0wLjAyLC0wLjA2IC0wLjA0LC0wLjE5IC0wLjA0LC0wLjM3bDAgLTAuMzMgMC4yNyAtMC4xMSAwIDAuNDFjMCwwLjA2IDAsMC4xMSAwLjAxLDAuMTQgMC4wMSwwLjAzIDAuMDIsMC4wNiAwLjAzLDAuMDggMC4wMiwwLjAzIDAuMDUsMC4wNCAwLjA5LDAuMDQgMC4wNCwwIDAuMDksLTAuMDEgMC4xNiwtMC4wNGwwLjYzIC0wLjI1eiIvPiA8cGF0aCBmaWxsPSIjRkY2QTAwIiBkPSJNMzcuMzEgOS41NGMwLjQsLTAuMTYgMC43MiwwLjA1IDAuNzIsMC40NyAwLDAuNDIgLTAuMzIsMC44OSAtMC43MiwxLjA1IC0wLjQsMC4xNiAtMC43MiwtMC4wNSAtMC43MiwtMC40NyAwLC0wLjQyIDAuMzIsLTAuODkgMC43MiwtMS4wNXptMC4zMyAwLjUyYzAuMDEsMC4wMyAwLjAyLDAuMDcgMC4wMiwwLjExIDAsMC4yIC0wLjE2LDAuNDMgLTAuMzUsMC41MSAtMC4xOSwwLjA4IC0wLjM1LC0wLjAzIC0wLjM1LC0wLjIzIDAsLTAuMzUgMC4zMywtMC42NSAwLjU4LC0wLjc0IDAuMTMsLTAuMDQgMC4yOSwtMC4wNiAwLjM5LC0wLjAzIC0wLjAzLC0wIC0wLjA2LDAgLTAuMDksMC4wMSAtMC4xMiwwLjA1IC0wLjIxLDAuMTggLTAuMjEsMC4zMSAwLDAuMDIgMCwwLjA0IDAuMDEsMC4wNmwwIDB6Ii8+IDxwYXRoIGZpbGw9IiNGRjZBMDAiIGQ9Ik0zOC4yOSAxMC42MmwwIC0wLjI1IDAuNjEgLTAuMjVjMC4xLC0wLjA0IDAuMTYsLTAuMDggMC4yLC0wLjExIDAuMDUsLTAuMDUgMC4wNywtMC4xIDAuMDcsLTAuMTYgMCwtMC4wNyAtMC4wMywtMC4xMSAtMC4wOCwtMC4xMiAtMC4wMywtMC4wMSAtMC4wOCwwLjAxIC0wLjE1LDAuMDNsLTAuMjUgMC4xYy0wLjE1LDAuMDYgLTAuMjYsMC4wOCAtMC4zMywwLjA0IC0wLjA0LC0wLjAyIC0wLjA3LC0wLjA1IC0wLjEsLTAuMSAtMC4wMiwtMC4wNSAtMC4wNCwtMC4xIC0wLjA0LC0wLjE2IDAsLTAuMSAwLjAzLC0wLjIgMC4wOCwtMC4zMSAwLjA1LC0wLjEgMC4xNCwtMC4xOCAwLjI2LC0wLjI0IDAuMDQsLTAuMDIgMC4xLC0wLjA1IDAuMTgsLTAuMDhsMC42NyAtMC4yNyAwIDAuMjUgLTAuNiAwLjI0Yy0wLjA5LDAuMDQgLTAuMTUsMC4wNiAtMC4xOCwwLjA4IC0wLjA2LDAuMDQgLTAuMDksMC4xIC0wLjA5LDAuMTggMCwwLjA3IDAuMDMsMC4xIDAuMDgsMC4xMSAwLjAzLDAgMC4wOSwtMC4wMSAwLjE3LC0wLjA0bDAuMjIgLTAuMDljMC4xMSwtMC4wNCAwLjE5LC0wLjA3IDAuMjUsLTAuMDcgMC4wOSwtMCAwLjE2LDAuMDMgMC4yLDAuMSAwLjAzLDAuMDYgMC4wNCwwLjEyIDAuMDQsMC4yIDAsMC4wOSAtMC4wMiwwLjE3IC0wLjA2LDAuMjYgLTAuMDUsMC4xMiAtMC4xMywwLjIxIC0wLjI0LDAuMjcgLTAuMDUsMC4wMyAtMC4xMywwLjA2IC0wLjIzLDAuMTFsLTAuNjggMC4yN3oiLz4gPC9nPjwvc3ZnPg==) center / contain no-repeat; }

.ax-term-t { position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
  margin: .18rem 0 0; white-space: nowrap;
  font-size: .7rem; font-weight: 600; color: var(--ink-2); }

.ax-above { position: absolute; bottom: calc(100% + .5rem); left: 50%;
  transform: translateX(-50%); display: flex; flex-direction: column;
  align-items: center; }

.ax-proto { display: inline-flex; align-items: center; gap: .22rem; white-space: nowrap;
  font-size: .68rem; line-height: 1.2; color: var(--ink-3); }

.ax-proto svg { flex: none; width: .82rem; height: .82rem; }

/* 桌面选单界面浮层：彩色截图 + 放大的占比（原图里它约占面板宽的 1/4） */

.ax-picker { position: relative; width: 9.6rem; padding: .35rem .35rem .45rem;
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 4px 14px rgba(29, 35, 48, .05); }

.ax-picker-t { margin: .35rem 0 0; text-align: center;
  font-size: .72rem; font-weight: 700; color: var(--ink); }

.ax-swap { margin-top: .3rem; color: var(--ink-3); font-size: 1.45rem; line-height: 1; }

.ax-swap i { display: block; }

.ax-mon { position: relative; display: block; width: 4.7rem; }

.ax-mon > svg { display: block; width: 100%; height: auto; }

/* 屏幕内两枚桌面图标（内网办公桌面 / 互联网资料），位置按显示器屏幕实测区域（7.5% ~ 68%） */

.ax-mon-scr { position: absolute; left: 7.5%; right: 7.5%; top: 9.5%; height: 68%;
  display: flex; align-items: center; justify-content: center; gap: .34rem; }

.ax-mon-scr svg { width: 1.05rem; height: auto; }

/* 图下说明：把架构区原有的 SEO 文案原样落在图旁（不改写，逐句保留） */

.ax-notes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem 1.8rem; margin-top: 1.5rem; }

.ax-note-h { margin: 0 0 .45rem; font-size: .88rem; font-weight: 700; color: var(--ink); }

.ax-note ul { margin: 0; padding: 0; list-style: none; }

.ax-note li { position: relative; padding-left: 1rem;
  font-size: .86rem; line-height: 1.85; color: var(--ink-2); }

.ax-note li::before { content: ""; position: absolute; left: 0; top: .68rem;
  width: .32rem; height: .32rem; border-radius: 50%; background: var(--ax-tile-line); }

/* 1200~1399：外层容器只有 1140，两块面板并排时每栏内宽仅 ~518px。

比例是按面板宽写死的（50% / 20%），所以这一档只收「定宽件」——

机构卡、边界色块、磁贴，让占 20% 的链路那一格仍装得下 OEIDP 标签 */

@media (min-width: 1200px) and (max-width: 1399.98px) {
  :root { --ax-wallw: 1.3rem; --ax-switchw: 4.6rem; --ax-tile: 2rem;
          --ax-termw: 3.2rem; }
  .ax-picker { width: 8.2rem; }
  .ax-mon { width: 4.2rem; }
  /* 标签收一档字号 —— 链路那一格只有面板的 20%（≈100px），
     不收字号的活儿它会顶到两端的网络切换器与云终端上 */
  .ax-link .ax-proto { font-size: .58rem; padding: .08rem .24rem; }
}

/* <1200：两块面板改为上下堆叠——并排时左列已不足以同时容纳三列内容。

面板变宽后主体不再顶满，否则 50% 的桌面列会被拉得很空 */

@media (max-width: 1199.98px) {
  .ax { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .ax-body { max-width: 44rem; margin-inline: auto; }
}

/* <768：主体也收成单列；边界转横向标签、跨列连线取消（避免指向空白）；

浮层回归普通流——否则绝对定位会盖住上面那块 */

@media (max-width: 767.98px) {
  .ax-panel { padding: 1.15rem 1.1rem 1.3rem; }
  .ax-notes { grid-template-columns: minmax(0, 1fr); gap: .9rem; }
  .ax-body, .ax-body--r { grid-template-columns: minmax(0, 1fr); gap: .9rem 0;
    max-width: none; }
  /* 单列后左右两列变上下两行 → subgrid 的三行绑定失效，退回普通流 */
  .ax-body--r { grid-template-rows: none; row-gap: 0; }
  .ax-body--r .ax-main { grid-row: auto; grid-column: auto;
    display: flex; gap: .55rem; }
  .ax-body--r .ax-rail { grid-row: auto; grid-column: auto; align-self: auto; }
  /* 隔离边界：竖虚线（画在机构卡中线上的那条）取消、竖排色块转横排 */
  .ax-wall { display: none; }
  .ax-boundary, .ax-flow > .ax-boundary, .ax-merge .ax-boundary {
    position: static; width: auto; transform: none; flex: 0 0 auto; }
  .ax-boundary > span { writing-mode: horizontal-tb; padding: .35rem 1.1rem;
    letter-spacing: .2em; }
  .ax-rail { gap: .5rem; }
  /* 汇流括号在单列下没有「两卡之下」的位置了 → 退成只承载边界标签 */
  .ax-merge { flex: none; width: auto; min-height: 0; margin: 0;
    border: 0; display: flex; justify-content: center; }
  .ax-flow { flex-wrap: wrap; justify-content: center; gap: .55rem; }
  /* 单列下 flow 会换行、链路带不再是一条横线 → 取消「对准面板全高中线」的上提 */
  .ax-panel--l .ax-flow { margin-bottom: 0; }
  .ax-link { flex: 1 1 100%; min-width: 0; align-self: auto; height: 1.7rem; }
  .ax-link::after, .ax-link .ax-proto { top: 50%; }
  .ax-bar::after { display: none; }
  .ax-term, .ax-body--r .ax-term { flex: 0 0 auto; }
  .ax-body--r .ax-term::before { display: none; }
  .ax-above { position: static; transform: none; margin: 0 0 .5rem; }
  .ax-term-t { position: static; transform: none; }
}

/* 方案价值 */

.value-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }

.value-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.7rem 1.6rem; box-shadow: var(--shadow); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }

.value-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: rgba(255,106,0,.35); }

.value-head { display: flex; align-items: center; gap: .65rem; margin-bottom: 1.05rem; }

.value-no { flex: none; width: 1.7rem; height: 1.7rem; border-radius: 8px; background: var(--brand-soft); border: 1px solid rgba(255,106,0,.18);
  color: var(--brand); font-weight: 700; font-size: .78rem; display: inline-flex; align-items: center; justify-content: center; }

.value-title { font-size: 1.06rem; margin: 0; line-height: 1.45; }

.value-desc { margin: 0; color: var(--ink-2); font-size: .93rem; line-height: 1.85; }

@media (max-width: 767.98px) { .value-grid { grid-template-columns: 1fr; } }

/* 典型案例：图文卡片 */

.case-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }

.case-grid .item { position: relative; display: flex; flex-direction: column; height: 100%; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }

.case-grid .item:hover { transform: translateY(-4px); box-shadow: var(--shadow); }

.case-grid .item .text { display: flex; flex-direction: column; flex: 1 1 auto; padding: 1.25rem 1.35rem; }

.case-grid .item h3 { font-size: 1.05rem; font-weight: 600; line-height: 1.5; margin-bottom: .6rem; color: var(--ink); transition: color .2s linear; }

.case-grid .item:hover h3 { color: var(--brand); }

.case-grid .item p { color: var(--ink-2); font-size: .92rem; line-height: 1.78; margin-bottom: 0; }

.case-grid .item span.case-more { display: inline-block; margin-top: auto; padding-top: 10px; color: var(--brand); font-size: .85rem; }

.case-grid .item > a { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 3; }

@media (max-width: 991.98px) { .case-grid { grid-template-columns: 1fr; } }

/* 常见问题：左侧推荐卡 + 右侧问答列表（版式对齐 1766） */

.faq-wrap { display: grid; grid-template-columns: 320px 1fr; gap: 2rem; align-items: end; }

.faq-side { display: flex; flex-direction: column; gap: 1rem; }

.related-card { position: relative; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.15rem 1.2rem; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }

.related-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: rgba(255,106,0,.4); }

.related-card .rc-tag { font-size: .72rem; color: var(--brand-dark); font-weight: 600; }

.related-card .rc-title { font-weight: 700; color: var(--ink); margin: .25rem 0 .35rem; font-size: 1.02rem; line-height: 1.5; }

.related-card .rc-desc { color: var(--ink-2); font-size: .9rem; line-height: 1.7; margin: 0; }

.related-card .rc-more { color: var(--brand); font-size: .84rem; font-weight: 600; margin-top: .55rem; display: inline-flex; align-items: center; gap: .25rem; }

.related-card > a { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 3; }

@media (max-width: 992px) { .faq-wrap { grid-template-columns: 1fr; } }

.accordion-item { border: 1px solid var(--line); border-radius: 12px !important; margin-bottom: .8rem; overflow: hidden; background: #fff; }

.accordion-header { margin: 0 !important; line-height: 1; }

.accordion-item .accordion-button { font-weight: 500; color: var(--ink); background: #fff; box-shadow: none; width: 100%; display: flex; justify-content: space-between; align-items: center; text-align: left; padding: 1rem 1.25rem !important; border: 0; line-height: 1.4; }

.accordion-item.show .accordion-button { background: var(--brand-soft); color: var(--brand-dark); box-shadow: none; }

.accordion-item .accordion-button:focus, .accordion-item .accordion-button:focus-visible, .accordion-item .accordion-button:active { outline: none; box-shadow: none; }

.accordion-item .accordion-button::after { content: ""; flex-shrink: 0; width: 1rem; height: 1rem; margin-left: auto; transform: none; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-size: 1rem; transition: transform .2s ease-in-out; }

.accordion-item.show .accordion-button::after { transform: rotate(-180deg); }

.accordion-item:last-child { margin-bottom: 0; }

.accordion-item .accordion-collapse { display: none; }

.accordion-item.show .accordion-collapse { display: block; }

.accordion-item .accordion-body { color: var(--ink-2); padding: .85rem 1.25rem !important; }

.cta h2 { color: #fff; }

.cta .btn-light { border-radius: 999px; padding: .7rem 1.8rem; font-weight: 600; font-size: .95rem; color: var(--brand-dark); background: #fff; border: none; box-shadow: 0 6px 18px rgba(0,0,0,.12); transition: transform .15s ease, box-shadow .15s ease, background .2s ease; }

.cta .btn-ghost { border-radius: 999px; padding: .7rem 1.8rem; font-weight: 600; font-size: .95rem; color: #fff; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.45); backdrop-filter: blur(4px); transition: transform .15s ease, background .2s ease, border-color .2s ease; }

.cta-list { list-style: none; margin: 0 auto 2rem; padding: 0; max-width: 760px; display: grid; gap: .8rem; text-align: left; }

.cta-list li { position: relative; padding-left: 1.4rem; font-size: .96rem; line-height: 1.8; color: rgba(255,255,255,.95); }

.cta-list li::before { content: ""; position: absolute; left: 0; top: .72rem; width: .42rem; height: .42rem; border-radius: 50%; background: rgba(255,255,255,.85); }
