﻿/* ============================================================
   home31.css — 首页专属样式（default31.aspx）  v5.0
   设计语言：深色科技「神经矩阵控制台」
     · Hero：左文案叙事 + 右「神经核心」环形可视化 + 数据 HUD
     · 核心优势：Bento 非对称网格（数据卡 / 文字卡 两种类型）
     · DEEP AI：D→E→E 数据流连接器
     · 全站统一玻璃卡 + 青色四角角标 + HUD 章节锚（/03 进度）
   依赖：base.css（变量与 keyframes）、layout.css（section 通用）
   目标：消除「PPT 感」—— 板块串联为整体，卡片语言统一且分层级。
   ============================================================ */

/* ============================================================
   0. 全局背景与氛围（整页共享深色，板块浮于其上，消除硬切）
   ============================================================ */
body { background: var(--deep); }

/* 神经矩阵背景层：fixed 全屏铺满，整页常驻 */
#particleCanvas {
  position: fixed; inset: 0; z-index: 0;
  pointer-events: none;
}
.overlay {
  position: fixed; inset: 0; z-index: 2; pointer-events: none;
  background:
    radial-gradient(ellipse 60% 60% at 18% 82%, rgba(12,161,184,0.16) 0%, transparent 55%),
    radial-gradient(ellipse 50% 50% at 82% 18%, rgba(93,194,210,0.11) 0%, transparent 50%),
    radial-gradient(ellipse 70% 70% at 50% 100%, rgba(8,116,138,0.09) 0%, transparent 60%);
}
.scanlines {
  position: fixed; inset: 0; z-index: 3; pointer-events: none; opacity: 0.03;
  background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(255,255,255,0.05) 2px, rgba(255,255,255,0.05) 4px);
}
/* DNA 双螺旋(左右) + ECG 心电波 —— hero 装饰，fixed 常驻 */
.dna-left, .dna-right {
  position: fixed; top: 0; bottom: 0; width: 120px; z-index: 1; pointer-events: none;
  opacity: 0.13;
}
.dna-left { left: 0; }
.dna-right { right: 0; }
.ecg-wave {
  position: fixed; bottom: 60px; left: 0; right: 0; z-index: 1; pointer-events: none;
  height: 60px; opacity: 0.14;
}

/* ============================================================
   1. HERO 第一屏（神经矩阵）：左叙事 + 右神经核心 + 数据 HUD
   ============================================================ */
.hero-section {
  position: relative;
  z-index: 10;
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding: var(--nav-h) clamp(16px, 3vw, 48px) 90px;
  background: transparent;
  overflow: hidden;
}
.hero {
  position: relative;
  display: grid;
  align-items: center;
  max-width: var(--max-w);
  margin: 0 auto;
  width: 100%;
}
/* —— 左主文案+陈述 / 右神经核心+数据 —— */
.hero-section--center .hero {
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 46px;
}

/* —— 左栏：左对齐叙事（控制台手册感，非居中标题幻灯） —— */
.hero-left {
  display: flex; flex-direction: column;
  align-items: flex-start; text-align: left;
}
.hero-title {
  font-size: clamp(30px, 4.3vw, 58px); font-weight: 900;
  line-height: 1.18; letter-spacing: 3px;
  margin-bottom: 18px; color: var(--white);
  animation: fadeInUp 1s 0.2s ease both;
}
.hero-title .glow {
  background: linear-gradient(120deg, var(--lake-light) 0%, var(--lake) 45%, #8FDCE8 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
  filter: drop-shadow(0 0 18px rgba(12, 161, 184, 0.45));
}
.hero-sub {
  font-size: clamp(12px, 1.35vw, 15px); color: rgba(255,255,255,0.6);
  line-height: 1.95;
  animation: fadeInUp 1s 0.4s ease both;
}
.hero-deep {
  margin-top: 22px;
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--font-en); font-size: clamp(13px, 1.4vw, 18px);
  font-weight: 700; letter-spacing: 5px; color: var(--lake-light);
  padding: 9px 20px;
  border: 1px solid rgba(12, 161, 184, 0.35);
  border-radius: 2px;
  background: linear-gradient(90deg, rgba(12, 161, 184, 0.12), rgba(93, 194, 210, 0.04));
  box-shadow: inset 0 0 18px rgba(12, 161, 184, 0.12), 0 0 24px rgba(12, 161, 184, 0.15);
  text-shadow: 0 0 12px rgba(93, 194, 210, 0.5);
  animation: fadeInUp 1s 0.55s ease both;
  position: relative;
}
.hero-deep::before,
.hero-deep::after {
  content: ''; width: 6px; height: 6px; border-radius: 50%;
  background: var(--lake); box-shadow: 0 0 8px var(--lake);
  animation: blink 2.4s ease-in-out infinite;
}

/* hero DEEP AI logo 图（替代原 .hero-deep 文字徽章；去徽章框，高度与原块相当，宽按比例自适应） */
.hero-deep-logo {
  display: block;
  margin-top: 26px;
  height: 50px;            /* 与原徽章块高度（~40px）相近，可按需调 */
  width: auto;
  animation: fadeInUp 1s 0.55s ease both;
}

/* —— 关于我们三句陈述（融入左栏叙事） —— */
.hero-statement {
  margin-top: 26px;
  animation: fadeInUp 1s 0.7s ease both;
}
.hero-statement p {
  position: relative;
  padding-left: 18px;
  font-size: clamp(12px, 1.35vw, 14.5px);
  line-height: 1.9;
  letter-spacing: 0.3px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.86);
  text-shadow: 0 0 14px rgba(93, 194, 210, 0.22);
  margin-bottom: 12px;
}
.hero-statement p:last-child { margin-bottom: 0; }
/* 条目前缀：发光节点徽标（呼应神经核心主题） */
.hero-statement p::before {
  position: absolute;
  left: 0; top: 0.62em;
  width: 6px; height: 6px;
  border-radius: 50%;
  content: '';
  background: linear-gradient(135deg, var(--lake-light), var(--lake));
  box-shadow: 0 0 8px rgba(93, 194, 210, 0.7);
}
.hero-statement .hl {
  color: var(--lake-light);
  font-weight: 600;
  white-space: nowrap;
  padding: 1px 7px;
  margin: 0 1px;
  border-radius: 4px;
  border: 1px solid rgba(93, 194, 210, 0.3);
  background: linear-gradient(135deg, rgba(12, 161, 184, 0.14), rgba(93, 194, 210, 0.05));
  box-shadow: 0 0 10px rgba(93, 194, 210, 0.18), inset 0 0 8px rgba(93, 194, 210, 0.08);
  text-shadow: 0 0 10px rgba(93, 194, 210, 0.5);
}

/* —— 右栏：神经核心可视化 + 数据 HUD —— */
.hero-right {
  display: flex; flex-direction: column;
  align-items: flex-end; gap: 18px;   /* 靠右：与左栏 flex-start 对称，内容顶到 hero 容器右边 */
  animation: fadeIn 1.2s 0.4s ease both;
}

/* ============================================================
   2. 神经核心（Neural Core）—— hero 视觉焦点
   ============================================================ */
.neural-core {
  position: relative;
  width: min(440px, 100%);
  aspect-ratio: 1 / 1;
  display: flex; align-items: center; justify-content: center;
}
.neural-core::before {
  /* 外圈柔光底盘 */
  content: '';
  position: absolute; inset: 6%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(12,161,184,0.16) 0%, transparent 62%);
  filter: blur(6px);
}
.neural-core svg {
  position: relative;
  width: 100%; height: 100%;
  filter: drop-shadow(0 0 26px rgba(12,161,184,0.32));
}
/* hero 区脑血管 glb 三维模型（Three.js canvas） */
.neural-core--model::before { display: none; } /* 模型模式：移除柔光底盘，纯黑背景突出血管 */
.neural-core--model #brainCanvas {
  position: relative;
  width: 100%; height: 100%;
  display: block;
  cursor: grab;
}
.neural-core--model #brainCanvas:active { cursor: grabbing; }
.nc-readout {
  position: absolute;
  bottom: 4%; left: 50%;
  transform: translateX(-50%);
  font-family: var(--font-en);
  font-size: 10px; font-weight: 600;
  letter-spacing: 5px;
  color: var(--lake-light);
  opacity: 0.7;
  text-shadow: 0 0 10px rgba(93,194,210,0.5);
  white-space: nowrap;
}

/* ============================================================
   3. 核心数据面板 panel-frame（玻璃卡 + 角标，全站卡片语言之母）
   ============================================================ */
.panel-frame {
  position: relative;
  max-width: 440px; width: 100%;
  margin-top: 4px;
  padding: 20px 22px 18px;
  border: 1px solid rgba(12,161,184,0.2);
  border-radius: 8px;
  background: linear-gradient(155deg, rgba(12,161,184,0.07) 0%, rgba(10,22,40,0.55) 60%, rgba(5,13,26,0.6) 100%);
  backdrop-filter: blur(12px) saturate(1.2);
  box-shadow: 0 12px 40px rgba(0,0,0,0.3), inset 0 1px 0 rgba(93,194,210,0.1);
}
/* 四角青色角标（科技 HUD 语言，全站推广） */
.panel-frame::before, .panel-frame::after {
  content: ''; position: absolute; width: 12px; height: 12px;
  border-color: var(--lake-light); border-style: solid;
  filter: drop-shadow(0 0 4px rgba(12,161,184,0.6));
}
.panel-frame::before { top: -1px; left: -1px; border-width: 1px 0 0 1px; }
.panel-frame::after { bottom: -1px; right: -1px; border-width: 0 1px 1px 0; }
.panel-label {
  font-family: var(--font-en); font-size: 10px; font-weight: 600;
  color: var(--lake-light); letter-spacing: 4px; text-transform: uppercase;
  margin-bottom: 14px; display: flex; align-items: center; gap: 8px;
}
.panel-label .dot {
  width: 5px; height: 5px; border-radius: 50%; background: var(--lake);
  box-shadow: 0 0 8px var(--lake);
  animation: blink 2s ease-in-out infinite;
}
.panel-label::after {
  content: ''; flex: 1; height: 1px;
  background: linear-gradient(90deg, rgba(12,161,184,0.4), transparent);
}
.stat-row { display: flex; gap: 12px; }
.stat-item {
  flex: 1; text-align: center; padding: 14px 6px;
  border: 1px solid rgba(12,161,184,0.14); border-radius: 6px;
  background: linear-gradient(180deg, rgba(12,161,184,0.06), rgba(12,161,184,0.02));
  transition: transform 0.35s var(--ease), border-color 0.35s var(--ease), box-shadow 0.35s var(--ease);
}
.stat-item:hover {
  transform: translateY(-4px);
  border-color: rgba(93, 194, 210, 0.5);
  box-shadow: 0 8px 24px rgba(12, 161, 184, 0.18);
}
.stat-num {
  font-family: var(--font-en); font-size: clamp(22px, 2.3vw, 30px); font-weight: 700;
  color: var(--lake-light); line-height: 1;
  text-shadow: 0 0 16px rgba(93, 194, 210, 0.45);
}
.stat-unit { font-family: var(--font-en); font-size: 13px; color: var(--lake); }
.stat-label { font-size: 10px; color: rgba(255,255,255,0.5); margin-top: 8px; letter-spacing: 1px; }

/* ============================================================
   4. 内容板块通用（advantages / deep-ai-band / platforms）
   —— 统一透明背景浮于粒子层之上；HUD 章节锚串联叙事
   ============================================================ */
.advantages, .deep-ai-band, .platforms {
  position: relative;
  z-index: 5;
  padding: 0 clamp(16px, 3vw, 48px);
  background: transparent;
}
.advantages      { padding-top: 50px; padding-bottom: 80px; }
.deep-ai-band    { padding-top: 30px; padding-bottom: 80px; }
.platforms       { padding-top: 30px; padding-bottom: 90px; }

/* 板块间渐变过渡光带：上方承接、不硬切 */
.advantages::before,
.deep-ai-band::before,
.platforms::before {
  content: '';
  position: absolute; top: 0; left: 50%;
  transform: translateX(-50%);
  width: min(720px, 80%);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(93,194,210,0.45), transparent);
  pointer-events: none;
}
/* 板块内局部氛围光晕（让深色不死板） */
.advantages::after,
.platforms::after {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 45% 60% at 15% 30%, rgba(12,161,184,0.05), transparent 60%),
    radial-gradient(ellipse 45% 60% at 85% 70%, rgba(93,194,210,0.04), transparent 60%);
  pointer-events: none;
}
.advantages .section-inner,
.deep-ai-band .section-inner,
.platforms .section-inner {
  position: relative;
  width: 100%;
  max-width: var(--max-w);  /* 与顶部导航同基准（--max-w=1200），全站内容区宽度统一 */
  margin-inline: auto;
}

/* —— HUD 章节锚：纯装饰编号 + 渐变线 + 刻度点 + /03 进度（串联三板块为整体） —— */
.section-hud {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 44px;
}
/* 序号已移除：.section-hud-line 为 flex:1，会自动延伸填满原序号位置 */
.section-hud-num { display: none; }
.section-hud-line {
  position: relative;
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, rgba(93,194,210,0.5), rgba(12,161,184,0.1));
}
.section-hud-line::before,
.section-hud-line::after {
  content: '';
  position: absolute; top: 50%;
  width: 6px; height: 6px;
  margin-top: -3px; border-radius: 50%;
  background: var(--lake);
  box-shadow: 0 0 8px var(--lake);
}
.section-hud-line::before { left: 0; }
.section-hud-line::after { right: 0; opacity: 0.5; }
.section-hud-tick {
  width: 8px; height: 8px; flex-shrink: 0;
  border: 1px solid var(--lake-light); border-radius: 2px;
  transform: rotate(45deg);
  opacity: 0.7;
}

/* ============================================================
   5. 核心优势 · 统一 3×3 九宫格
   —— 9 条优势按源 DOM 顺序铺成等大九宫格；数据卡(量化) 仅做轻度强调，
      不再分大/小区块，一屏可览全貌。文案/图标/数据均取自源 DOM，零篡改。
      风格沿用深色青色磨玻璃 + 四角角标 + 青色描边。
   ============================================================ */

/* 数据源：9 条原始内容，仅供 JS 读取，不直接渲染 */
.adv-source { display: none; }

/* 3×3 等大网格：grid-auto-rows:1fr 使三行等高 → 规整九宫格矩形 */
.adv-board {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 1fr;
  gap: 16px;
}

/* —— 统一卡片：深色青色磨玻璃 + 四角角标 + hover 上浮 —— */
.adv-cell-card {
  position: relative;
  display: flex; flex-direction: column;
  align-items: flex-start; text-align: left;
  min-width: 0;
  min-height: 180px;
  padding: 22px 22px 20px;
  border-radius: 14px;
  border: 1px solid rgba(12,161,184,0.18);
  background: linear-gradient(155deg, rgba(12,161,184,0.07) 0%, rgba(10,22,40,0.5) 60%, rgba(5,13,26,0.55) 100%);
  backdrop-filter: blur(10px) saturate(1.15);
  box-shadow: 0 10px 30px rgba(0,0,0,0.28), inset 0 1px 0 rgba(93,194,210,0.08);
  overflow: hidden;
  transition: transform 0.4s var(--ease), border-color 0.4s var(--ease), box-shadow 0.4s var(--ease);
}
/* 四角角标 */
.adv-cell-card::before,
.adv-cell-card::after {
  content: ''; position: absolute; width: 12px; height: 12px;
  border-color: rgba(93,194,210,0.45); border-style: solid;
  transition: border-color 0.4s var(--ease);
  z-index: 1;
}
.adv-cell-card::before { top: 8px; left: 8px; border-width: 1px 0 0 1px; }
.adv-cell-card::after  { bottom: 8px; right: 8px; border-width: 0 1px 1px 0; }
.adv-cell-card:hover {
  transform: translateY(-5px);
  border-color: rgba(93,194,210,0.45);
  box-shadow: 0 18px 44px rgba(12,161,184,0.2), inset 0 2px 0 rgba(93,194,210,0.32);
}
.adv-cell-card:hover::before,
.adv-cell-card:hover::after { border-color: var(--lake-light); }

/* —— 头部：图标 + 标题 —— */
.adv-cell-card-head {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 14px;
}
.adv-cell-card-icon {
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  color: var(--lake-light); border-radius: 10px;
  background: rgba(12,161,184,0.12);
  border: 1px solid rgba(12,161,184,0.22);
  box-shadow: inset 0 0 14px rgba(12,161,184,0.14);
  flex-shrink: 0;
  transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease);
}
.adv-cell-card-icon svg { width: 24px; height: 24px; }
.adv-cell-card:hover .adv-cell-card-icon {
  transform: translateY(-2px) scale(1.05);
  box-shadow: 0 0 22px rgba(12,161,184,0.35), inset 0 0 14px rgba(12,161,184,0.18);
}
.adv-cell-card-title {
  font-size: 17px; font-weight: 700;
  color: var(--lake-light); letter-spacing: 0.5px;
  text-shadow: 0 0 10px rgba(93,194,210,0.25);
}

/* —— 文字卡描述：最多三行保持齐整，全文见 title 提示 —— */
.adv-cell-card-text {
  font-size: 13px; line-height: 1.65;
  color: rgba(255,255,255,0.68);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: pre-line;   /* 尊重源里 <br> 产生的 \n，支持手动换行 */
}

/* —— 数据卡（量化强调）：更深的青色底，正文/数字尺寸与文字卡一致 —— */
.adv-cell-card--data {
  border-color: rgba(12,161,184,0.34);
  background: linear-gradient(155deg, rgba(12,161,184,0.17) 0%, rgba(10,22,40,0.55) 55%, rgba(5,13,26,0.6) 100%);
  box-shadow: 0 12px 34px rgba(0,0,0,0.32), inset 0 1px 0 rgba(93,194,210,0.16), inset 0 0 40px rgba(12,161,184,0.06);
}
.adv-cell-card--data::before,
.adv-cell-card--data::after { border-color: rgba(93,194,210,0.6); }
.adv-cell-card-nums { display: flex; flex-direction: column; gap: 12px; }
/* 数据卡正文与文字卡描述同款：13px / 1.65 / 同色，关键数字仅加粗、不再放大 */
.adv-cell-num {
  font-size: 13px; line-height: 1.65;
  color: rgba(255,255,255,0.68);
}
.adv-cell-num strong {
  font-size: inherit; font-weight: 700;
  color: inherit;
  text-shadow: none;
}

/* —— 响应式 —— */
@media (max-width: 1080px) {
  /* 平板两列：行高跟随内容，避免单卡被拉得过高留白 */
  .adv-board { grid-template-columns: repeat(2, 1fr); grid-auto-rows: auto; }
}
@media (max-width: 600px) {
  .adv-board { grid-template-columns: 1fr; }
}
/* 九宫格滚动入场（home62.js IntersectionObserver 触发，按位置交错） */
@keyframes advCellIn {
  from { opacity: 0; transform: translateY(28px) scale(0.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* ============================================================
   6. DEEP AI 品牌带 + D→E→E 数据流
   ============================================================ */
.deep-ai {
  margin-top: 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  /* 桌面端：说明文（左）+ 五瓣饼图（右）左右并排，与全站「左文案+右视觉」语言统一 */
  display: flex;
  align-items: center;
  justify-content: space-between;   /* 左文字贴左、右饼图贴右，撑满 section-inner */
  gap: clamp(32px, 5vw, 64px);
}
.deep-ai-sub {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  max-width: 560px;
  text-align: left; font-size: 15px;
  letter-spacing: 0.3px;
  font-weight: 500;
  line-height: 1.9;
  margin: 0;
  color: rgba(255,255,255,0.9);
  text-shadow: 0 0 14px rgba(93, 194, 210, 0.28);
}
/* 承上启下：上下渐变光束 */
.deep-ai-sub::before,
.deep-ai-sub::after {
  content: '';
  display: block;
  width: 120px; height: 1px;
  margin: 0 auto;
  background: linear-gradient(90deg, transparent, var(--lake-light), transparent);
  opacity: 0.55;
  animation: beamPulse 3.6s ease-in-out infinite;
  animation-delay: 0.8s;
}
.deep-ai-sub::before { margin-bottom: 22px; }
.deep-ai-sub::after  { margin-top: 22px; }
/* 左右排版下，上下光束贴左对齐（覆盖默认 margin:0 auto 居中） */
.deep-ai-sub::before { margin-left: 0; }
.deep-ai-sub::after  { margin-left: 0; }
.deep-ai-sub .term {
  font-family: var(--font-en);
  color: var(--lake-light);
  font-weight: 600;
  text-shadow: 0 0 8px rgba(93, 194, 210, 0.5);
}

/* —— DEEP AI 说明文 · 结构化重排：eyebrow + 主标题 + 引言 + D/E/E/P/AI 字母表 + 收尾
      （左侧文字版的「五瓣」，与右侧 .deepai-pie 图形版一一呼应；沿用全站青色辉光 / 玻璃 / 光束语言）—— */
.deep-ai-sub--rich {
  /* 容器不再整体泛光：辉光下沉到标题 / 字母等焦点元素；行高收到结构化排版所需 */
  text-shadow: none;
  line-height: 1.6;
}
/* HUD 小标签：圆点 + 中文 + 英文（呼应 section-hud 的字间距语言） */
.deep-ai-eyebrow {
  display: inline-flex; align-items: center; gap: 9px;
  margin-bottom: 16px;
  font-family: var(--font-en);
}
.deep-ai-eyebrow .dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--lake-light);
  box-shadow: 0 0 8px var(--lake-light);
}
.deep-ai-eyebrow .cn {
  color: var(--lake-light);
  font-size: 12px; font-weight: 600; letter-spacing: 3px;
}
.deep-ai-eyebrow .en {
  color: rgba(93, 194, 210, 0.5);
  font-size: 10px; font-weight: 600; letter-spacing: 3px;
  text-transform: uppercase;
}
/* 主标题：白→青渐变 + drop-shadow 辉光（与 .pie-core-main 同语言，兄弟 span 避免 clip 继承） */
.deep-ai-title { margin: 0 0 18px; line-height: 1; }
/* logo 图版本：替换原文字标题（DEEP AI for NEURO） */
.deep-ai-title--logo {
  display: block;
  height: 56px;
  width: auto;
}
.deep-ai-title .t-main {
  display: block;
  font-family: var(--font-en);
  font-size: clamp(32px, 3.6vw, 46px);
  font-weight: 800; letter-spacing: 1.5px;
  background: linear-gradient(135deg, #FFFFFF 0%, #8FDCE8 45%, var(--lake-light) 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  filter: drop-shadow(0 0 14px rgba(93, 194, 210, 0.35));
}
.deep-ai-title .t-sub {
  display: block;
  margin-top: 7px;
  font-family: var(--font-en);
  font-size: clamp(13px, 1.5vw, 18px);
  font-weight: 600; letter-spacing: 7px;
  padding-left: 7px;                 /* 抵消末字 letter-spacing，保证视觉对齐 */
  color: var(--lake-light);
  opacity: 0.92;
}
/* 引言：降一档透明度、去辉光，保证段落清爽可读 */
.deep-ai-lead {
  font-size: 14.5px;
  line-height: 1.85;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.78);
  text-shadow: none;
  margin: 0 0 24px;
}
/* D/E/E/P/AI 字母表：每行 字母徽标 + 英文 + 中文，hover 左条高亮 + 横移（同 .adv-cell 交互语言） */
.deep-ai-list {
  list-style: none;
  display: flex; flex-direction: column;
  gap: 3px;
  max-width: 360px;
  margin: 0 0 24px;
}
.deep-ai-list li {
  display: grid;
  grid-template-columns: 26px 1fr auto;
  align-items: baseline;
  column-gap: 14px;
  padding: 8px 12px;
  border-left: 1px solid rgba(93, 194, 210, 0.22);
  border-radius: 0 4px 4px 0;
  background: linear-gradient(90deg, rgba(93, 194, 210, 0.07), rgba(93, 194, 210, 0) 80%);
  transition: border-color .35s var(--ease), background .35s var(--ease), transform .35s var(--ease);
}
.deep-ai-list li:hover {
  border-left-color: var(--lake-light);
  background: linear-gradient(90deg, rgba(93, 194, 210, 0.16), rgba(93, 194, 210, 0) 80%);
  transform: translateX(3px);
}
.deep-ai-list b {
  font-family: var(--font-en);
  font-weight: 700;
  font-size: 15px;
  text-align: center;
  color: var(--lake-light);
  text-shadow: 0 0 8px rgba(93, 194, 210, 0.55);
}
.deep-ai-list .en {
  font-family: var(--font-en);
  font-size: 13.5px; font-weight: 600;
  letter-spacing: 0.3px;
  color: rgba(255, 255, 255, 0.92);
}
.deep-ai-list .cn {
  font-size: 12.5px;
  letter-spacing: 2px;
  color: rgba(255, 255, 255, 0.5);
}
/* AI 项：文字版「外环」——跨满整行居中、上下描边收束，呼应右侧把四瓣整体包住的外环 */
.deep-ai-list .all {
  display: flex; justify-content: center; align-items: center;
  column-gap: 12px;
  margin-top: 5px;
  padding: 9px 12px;
  border-left: none;
  border-top: 1px solid rgba(93,194,210,0.22);
  border-radius: 0;
  background: linear-gradient(90deg, transparent, rgba(93,194,210,0.12) 50%, transparent);
}
.deep-ai-list .all::before,
.deep-ai-list .all::after {
  content: ''; width: 6px; height: 6px; flex: 0 0 auto;
  border-radius: 50%;
  background: var(--lake-light);
  box-shadow: 0 0 8px rgba(93,194,210,0.6);
}
.deep-ai-list .all .cn { color: rgba(93,194,210,0.85); letter-spacing: 2.5px; }
/* 收尾：短横 + 标语，"五维一体" 提色收束 */
.deep-ai-foot {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 12px; letter-spacing: 2px;
  color: rgba(255, 255, 255, 0.55);
}
.deep-ai-foot::before {
  content: ''; width: 26px; height: 1px;
  background: linear-gradient(90deg, var(--lake-light), transparent);
}
.deep-ai-foot span:first-child {
  color: var(--lake-light);
  font-weight: 600;
}
.deep-ai-foot i { font-style: normal; opacity: 0.5; }

/* 窄屏（≤980px）：与饼图上下堆叠时，列表随容器居中（eyebrow / foot 为 inline-flex，由父级 text-align:center 居中） */
@media (max-width: 980px) {
  .deep-ai-list { margin-left: auto; margin-right: auto; }
}
/* 极窄屏：列表放宽、字号略收，防 Endovascular Surgery 等长英文撑出 */
@media (max-width: 480px) {
  .deep-ai-list { max-width: 100%; gap: 2px; }
  .deep-ai-list li { column-gap: 10px; padding: 7px 10px; }
  .deep-ai-list .en { font-size: 12.5px; }
  .deep-ai-list .cn { font-size: 11.5px; letter-spacing: 1.5px; }
  .deep-ai-title .t-sub { letter-spacing: 5px; padding-left: 5px; }
}

/* —— DEEP AI 同心圆：外环 患者管理（缓慢旋转）+ 中圈磨玻璃 D·E·E 三瓣 + 中心核 全栈解决
      （磨玻璃 + 线描 SVG 图标，统一处理使各瓣等大平衡）—— */
.deepai-pie {
  position: relative;
  width: min(440px, 82vw);
  /* 竖向：圆盘（上）+ 底座（下），不再 1:1 正方形 */
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 0 0 auto;
  margin: 0;
  /* 纯 transform 缩放入场（不动 opacity），任何情况下都保持可见 */
  animation: pieIn 1.1s 0.15s var(--ease-out) both;
}
@keyframes pieIn {
  from { transform: scale(0.9); }
  to   { transform: scale(1); }
}
/* 圆盘：磨玻璃底盘 + 四瓣 + 中心核 的定位上下文（竖向布局上半部，正方形） */
.deepai-pie-disk {
  position: relative;          /* 作 flex item + 内部绝对定位的上下文 */
  width: 100%;
  aspect-ratio: 1 / 1;
  z-index: 2;                  /* 居底座之上，"坐"在底座上 */
  /* 裁掉外环旋转时 filter:drop-shadow 辉光越过圆盘边界的渲染溢出：移动端 Safari 会把 CSS filter 输出计入可滚动宽度，旋转到右侧时把页面撑开一点；方形裁剪不影响内部圆形视觉，底座 .deepai-base 在 disk 之外不受影响 */
  overflow: hidden;
}
/* —— 底座：All-Inclusive 全栈解决（HUD 平台基座，承托圆盘，呼应「全栈」语义）—— */
.deepai-base {
  position: relative;
  z-index: 1;                  /* 居圆盘之下，托住圆盘 */
  width: 86%;                  /* 比圆盘略窄，呈托盘 / 底座 */
  margin-top: -8px;            /* 与圆盘底部微叠，营造"坐落 / 承托"感 */
}
/* 地平线辉光：平台下方一道青色光带，强化"放置在基座上"的稳重感（放外层，避开 clip-path 裁剪） */
.deepai-base::after {
  content: '';
  position: absolute;
  left: 6%; right: 6%;
  bottom: -10px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(93,194,210,0.75) 50%, transparent);
  box-shadow: 0 0 18px 2px rgba(93,194,210,0.45);
}
/* 平台主体：两端斜切角（clip-path）+ 磨玻璃背景 + 顶部 HUD 亮线；drop-shadow 跟随切角形状投射 */
.deepai-base-plat {
  position: relative;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  padding: 8px 20px;
  clip-path: polygon(9% 0, 91% 0, 100% 100%, 0 100%);
  background: linear-gradient(135deg, rgba(12,28,48,0.92), rgba(6,16,30,0.96));
  box-shadow: inset 0 1px 0 rgba(93,194,210,0.55);                 /* 顶部 HUD 高光线（沿 clip 顶边） */
  filter: drop-shadow(0 10px 18px rgba(0,0,0,0.5)) drop-shadow(0 0 12px rgba(12,161,184,0.3));
}
/* 两端竖向光刻度（HUD 仪表感，界定平台边界） */
.base-tick {
  width: 2px; height: 15px; flex: 0 0 auto;
  background: linear-gradient(180deg, transparent, rgba(93,194,210,0.7), transparent);
}
.base-icon {
  width: clamp(28px, 4.2vw, 34px); height: clamp(28px, 4.2vw, 34px);
  flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  color: var(--lake-light);
  background: rgba(12,161,184,0.18);
  border: 1px solid rgba(93,194,210,0.45);
  border-radius: 50%;
  box-shadow: inset 0 0 12px rgba(12,161,184,0.16), 0 0 14px rgba(12,161,184,0.14);
}
.base-icon svg { width: clamp(18px, 2.6vw, 20px); height: clamp(18px, 2.6vw, 20px); }
.base-text { display: flex; flex-direction: row; align-items: baseline; gap: 8px; white-space: nowrap; }
.base-head {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--font-en);
  font-size: clamp(10px, 1.3vw, 12.5px); font-weight: 700;
  letter-spacing: 0.3px;
  color: var(--white);
  text-shadow: 0 1px 6px rgba(0,0,0,0.75);
  line-height: 1.2;
}
.base-head i {
  font-style: normal; font-family: var(--font-en);
  font-size: clamp(8px, 1vw, 10px); font-weight: 800;
  color: var(--white);
  background: linear-gradient(135deg, var(--lake), var(--lake-light));
  padding: 2px 6px; border-radius: 7px; letter-spacing: 0.5px;
  box-shadow: 0 0 10px rgba(12,161,184,0.4);
}
.base-cn {
  font-size: clamp(9px, 1.2vw, 11px);
  color: rgba(255,255,255,0.88);
  text-shadow: 0 1px 5px rgba(0,0,0,0.75);
  line-height: 1.2;
}
/* 磨玻璃底盘：backdrop-filter 把背后粒子层模糊，呈现毛玻璃（与全站玻璃卡同语言） */
.deepai-pie-glass {
  display: none; /* 临时隐藏磨玻璃底盘，看效果；恢复时删本行 */
  position: absolute; inset: 0;
  border-radius: 50%;
  /* 居中径向渐变（左右对称）+ 适中不透明度：既保留磨玻璃通透，又压制背后粒子不均，
     使 P / AI 等各瓣亮度一致、视觉等大 */
  background: radial-gradient(circle at 50% 50%, rgba(93,194,210,0.20) 0%, rgba(12,161,184,0.12) 64%, rgba(8,18,34,0.24) 100%);
  /* 去掉 border 与 box-shadow：底盘只留磨玻璃通透，不再画边/阴影干扰外环与三瓣边缘判断 */
  border: none;
  backdrop-filter: blur(16px) saturate(1.4);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  box-shadow: none;
  z-index: 1;
}
.deepai-pie-svg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  pointer-events: none;
  z-index: 2;
}
/* —— 外环装饰层：刻度纹理 + 环上光点（缓慢公转；弧形文字另在 .deepai-pie-outer-ring 静态层，保证正立可读）—— */
.deepai-pie-bezel {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  pointer-events: none;
  z-index: 2;
  animation: pieRingSpin 60s linear infinite;   /* 缓慢公转：环带刻度 + 光点绕环流动 */
  transform-origin: 50% 50%;
}
@keyframes pieRingSpin { to { transform: rotate(360deg); } }
/* 弧形文字：居环带中部、随外环一起旋转；青色辉光与全站文字光感一致
   （font-size 用 SVG 属性，单位随 viewBox 缩放，移动端同步变小） */
.deepai-arc-text {
  font-family: var(--font-en), "Microsoft YaHei", "PingFang SC", sans-serif;
  font-weight: 700;
  letter-spacing: 0.3px;
  fill: var(--white);
  filter: drop-shadow(0 1px 6px rgba(0,0,0,0.75));
}
/* 外环 P 徽标辉光：与三瓣 .pie-head i 的 box-shadow 同源青光 */
.deepai-badge { filter: drop-shadow(0 0 5px rgba(12,161,184,0.45)); }
/* 外环 P 徽标文字：与三瓣 .pie-head i 同款白字 */
.deepai-badge text {
  font-family: var(--font-en), "Microsoft YaHei", sans-serif;
  font-weight: 800;
  fill: #FFFFFF;
}
.deepai-arc-deco {
  filter: drop-shadow(0 0 1.4px rgba(93,194,210,0.75));   /* 与文字同源青色辉光，让菱形/点迹发亮 */
}
/* 中心核外虚线环：逆时针自转，与外环 60s 顺时针公转形成「外顺内逆」呼应
   （速度略快于外环，半径更小、虚线更细，差异速比让两层流光错落而非锁死） */
.deepai-inner-dash {
  transform-box: fill-box;            /* 围绕圆心(50,50)自转，而非 SVG 原点(0,0) */
  transform-origin: center;
  animation: pieInnerSpin 44s linear infinite;
}
@keyframes pieInnerSpin { to { transform: rotate(-360deg); } }
/* 三瓣标签：图标 + 字母·英文 + 中文，按各瓣重心定位 */
.pie-seg {
  position: absolute;
  transform: translate(-50%, -50%);
  display: flex; flex-direction: column; align-items: center;
  gap: 5px;
  width: 32%;
  text-align: center;
  z-index: 3;
  transition: transform 0.4s var(--ease);
}
/* hover：整朵只轻微上浮+提层（不 scale 文字，避免撑大糊到相邻花瓣） */
.pie-seg:hover { transform: translate(-50%, -52%); z-index: 6; }
.pie-seg:hover .pie-head, .pie-seg:hover .pie-cn { filter: brightness(1.15); }
.pie-icon {
  width: clamp(34px, 6vw, 40px); height: clamp(34px, 6vw, 40px);
  display: flex; align-items: center; justify-content: center;
  color: var(--lake-light);
  border-radius: 50%;
  background: rgba(12,161,184,0.14);
  border: 1px solid rgba(93,194,210,0.4);
  box-shadow: inset 0 0 14px rgba(12,161,184,0.14), 0 0 16px rgba(12,161,184,0.12);
  transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease);
}
/* hover 时图标圆圈明显放大(+24%)+强光晕，作为花瓣"变大"的主体；文字尺寸不变，不遮挡邻居 */
.pie-seg:hover .pie-icon { transform: scale(1.24); background: rgba(12,161,184,0.24); border-color: rgba(168,238,245,0.85); box-shadow: inset 0 0 16px rgba(12,161,184,0.3), 0 6px 24px rgba(12,161,184,0.5), 0 0 56px rgba(12,161,184,0.3); }
/* 有图片的瓣：鼠标变手型，提示可悬停查看 */
.pie-seg[data-ad] { cursor: pointer; }
.pie-core[data-ad] { cursor: pointer; }

/* 五瓣标签 hover 图片弹窗（fixed，跟随鼠标）
   白底适配黑字产品图，移植全站「青色 HUD」语言：青色细描边 + 四角角标 + 分层青光投影 */
.pie-pop {
  position: fixed; z-index: 9999; pointer-events: none;
  opacity: 0; transform: scale(0.92) translateY(14px);
  /* 消失态：稍快淡出 + 下沉收尾（ease-in 加速） */
  transition: opacity 0.22s cubic-bezier(0.4,0,1,1), transform 0.22s cubic-bezier(0.4,0,1,1);
  padding: 16px; border-radius: 16px;
  background: #ffffff;
  border: 1px solid rgba(12,161,184,0.4);
  box-shadow:
    inset 0 1px 0 rgba(93,194,210,0.5),            /* 顶部 HUD 高光线 */
    inset 0 0 0 1px rgba(255,255,255,0.5),          /* 内描边：精致白边 */
    0 18px 50px rgba(2,18,28,0.55),                 /* 深投影：浮起感 */
    0 0 0 1px rgba(12,161,184,0.14),                /* 外青晕 */
    0 0 34px rgba(12,161,184,0.32);                 /* 青色辉光 */
  width: fit-content;          /* 容器宽度贴合图片：三图同高、宽度各异、无白边 */
  max-height: calc(100vh - 32px);
}
/* 青色四角角标（与全站玻璃卡同一语言；落在 padding 白边内、不遮图片） */
.pie-pop::before,
.pie-pop::after {
  content: ''; position: absolute; width: 11px; height: 11px;
  border-color: rgba(93,194,210,0.75); border-style: solid; z-index: 2;
}
.pie-pop::before { top: 5px; left: 5px; border-width: 1px 0 0 1px; }      /* 左上 */
.pie-pop::after  { bottom: 5px; right: 5px; border-width: 0 1px 1px 0; }  /* 右下 */
/* 出现态：缓慢优雅浮入（ease-out-quint），比消失更慢、更柔 */
.pie-pop.show {
  opacity: 1; transform: scale(1) translateY(0);
  transition: opacity 0.42s cubic-bezier(0.22,1,0.36,1), transform 0.42s cubic-bezier(0.22,1,0.36,1);
}
.pie-pop img {
  display: block;
  /* 高度统一为视口的 2/5（约 40vh）：比半屏略小，平衡可读与占地 */
  height: 40vh;
  width: auto;
  max-width: 90vw;            /* 兜底：防止超宽横向图溢出视口 */
  border-radius: 10px;
}
/* 弹窗标题区：英文名(品牌青) + 中文名(深色)，呼应全站 HUD 双语标签 */
.pie-pop-head {
  display: flex; align-items: baseline; gap: 8px;
  padding: 0 4px 10px; margin-bottom: 6px;
  border-bottom: 1px solid rgba(12,161,184,0.2);
  white-space: nowrap;
}
.pie-pop-en {
  font-family: var(--font-en); font-size: 13px; font-weight: 700;
  color: var(--lake); letter-spacing: 1.2px;
}
.pie-pop-cn {
  font-size: 12px; font-weight: 500;
  color: var(--deep); letter-spacing: 0.5px; opacity: 0.78;
}
.pie-icon svg { width: clamp(20px, 3.4vw, 23px); height: clamp(20px, 3.4vw, 23px); }
.pie-head {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
  gap: 5px;
  font-family: var(--font-en);
  font-size: clamp(10px, 1.3vw, 12.5px); font-weight: 700;
  letter-spacing: 0.3px;
  color: var(--white);
  text-shadow: 0 1px 6px rgba(0,0,0,0.75);
  line-height: 1.2;
}
.pie-head i {
  font-style: normal;
  font-family: var(--font-en);
  font-size: clamp(8px, 1vw, 10px); font-weight: 800;
  color: var(--white);
  background: linear-gradient(135deg, var(--lake), var(--lake-light));
  padding: 2px 6px;
  border-radius: 7px;
  letter-spacing: 0.5px;
  box-shadow: 0 0 10px rgba(12,161,184,0.4);
  flex-shrink: 0;
}
.pie-cn {
  font-size: clamp(9px, 1.2vw, 11px);
  color: rgba(255,255,255,0.88);
  text-shadow: 0 1px 5px rgba(0,0,0,0.75);
  line-height: 1.2;
}
/* 中心核：磨玻璃暗盘 + DEEP AI for NEURO */
.pie-core {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: 30%; aspect-ratio: 1 / 1;
  border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px;
  background: linear-gradient(135deg, rgba(10,22,40,0.72), rgba(5,13,26,0.86));
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(93,194,210,0.55);
  box-shadow: 0 0 26px rgba(12,161,184,0.45), inset 0 0 18px rgba(12,161,184,0.18);
  z-index: 5;
  animation: pieCorePulse 4.5s ease-in-out infinite;
}
@keyframes pieCorePulse {
  0%, 100% { box-shadow: 0 0 22px rgba(12,161,184,0.4), inset 0 0 18px rgba(12,161,184,0.16); transform: translate(-50%, -50%) scale(1); }
  50%      { box-shadow: 0 0 34px rgba(12,161,184,0.62), inset 0 0 22px rgba(12,161,184,0.26); transform: translate(-50%, -50%) scale(1.06); }
}
.pie-core-main {
  font-family: var(--font-en);
  font-size: clamp(10px, 1.3vw, 12.5px); font-weight: 700;
  letter-spacing: 0.3px;
  color: var(--white);
  text-shadow: 0 1px 6px rgba(0,0,0,0.75);
  line-height: 1.2;
  display: inline-flex; align-items: center; gap: 5px;
}
.pie-core-main i {
  font-style: normal;
  font-family: var(--font-en);
  font-size: clamp(8px, 1vw, 10px); font-weight: 800;
  color: var(--white);
  background: linear-gradient(135deg, var(--lake), var(--lake-light));
  padding: 2px 6px;
  border-radius: 7px;
  letter-spacing: 0.5px;
  box-shadow: 0 0 10px rgba(12,161,184,0.4);
  flex-shrink: 0;
}
.pie-core-sub {
  font-size: clamp(9px, 1.2vw, 11px);
  color: rgba(255,255,255,0.88);
  text-shadow: 0 1px 5px rgba(0,0,0,0.75);
  line-height: 1.2;
}
@media (prefers-reduced-motion: reduce) {
  .pie-core, .deepai-pie-bezel, .deepai-inner-dash { animation: none; }
}
@media (max-width: 560px) {
  .pie-seg { width: 38%; gap: 4px; }
  .pie-head { font-size: 10px; }
  .pie-cn { font-size: 9.5px; }
  .deepai-base { width: 92%; margin-top: -8px; }
  .deepai-base-plat { padding: 7px 14px; gap: 8px; }
}
/* 窄屏：说明文与五瓣饼图回到上下居中堆叠（饼图 90vw 放大后无法与文字并排） */
@media (max-width: 980px) {
  .deep-ai { flex-direction: column; gap: 0; }
  .deep-ai-sub {
    max-width: 820px;
    text-align: center;
    margin: 0 auto 32px;
  }
  .deep-ai-sub::before, .deep-ai-sub::after { margin-left: auto; }
  .deepai-pie { margin: 4px auto 0; }
}

/* 光束呼吸 */
@keyframes beamPulse {
  0%, 100% { opacity: 0.35; }
  50%      { opacity: 0.9; }
}
@media (prefers-reduced-motion: reduce) {
  .deep-ai-sub::before, .deep-ai-sub::after,
  .arch-pillar-card::after { animation: none; opacity: 0.55; }
}

/* ============================================================
   7. PLATFORMS 平台架构（左三层 + 右贯穿理念柱）
   ============================================================ */
/* platforms：产品架构（左）+ 说明文（右）左右并排；HUD 章节锚跨整行置顶 */
.platforms .section-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  grid-template-areas:
    "hud    hud"
    "arch   header";
  column-gap: clamp(28px, 4vw, 52px);
  row-gap: 32px;
  align-items: start;
}
.platforms .section-hud { grid-area: hud; margin-bottom: 0; }
.platforms-arch { grid-area: arch; }
.platforms-header { grid-area: header; text-align: left; margin-bottom: 0; }
.platforms .section-title { color: var(--white); }
.platforms-header .section-desc {
  margin: 0;
  max-width: 100%;
  font-size: 15px;
  letter-spacing: 0.3px;
  line-height: 1.95;
  text-align: left;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.9);
  text-shadow: 0 0 14px rgba(93, 194, 210, 0.28);
}
.platforms-header .section-desc::before,
.platforms-header .section-desc::after {
  content: '';
  display: block;
  width: 120px; height: 1px;
  margin: 0 auto;
  background: linear-gradient(90deg, transparent, var(--lake-light), transparent);
  opacity: 0.55;
  animation: beamPulse 3.6s ease-in-out infinite;
  animation-delay: 1.6s;
}
.platforms-header .section-desc::before { margin-bottom: 18px; }
.platforms-header .section-desc::after  { margin-top: 18px; }
/* 左右排版下，上下光束贴左对齐（覆盖默认 margin:0 auto 居中） */
.platforms-header .section-desc::before { margin-left: 0; }
.platforms-header .section-desc::after  { margin-left: 0; }
.platforms-header .section-desc .term {
  color: var(--lake-light);
  font-weight: 600;
  text-shadow: 0 0 8px rgba(93, 194, 210, 0.5);
}

/* —— PLATFORMS 说明文 · 结构化重排：eyebrow + 引言 + 三大临床场景列表 + 收尾
      （列表 01/02/03 对应左侧应用层 U-Family 三产品，与 .deep-ai-sub--rich 同语言；
       针对 300px 右栏紧凑化：英文降为副行、序号用数字呼应 section-hud-num）—— */
.platforms-header .section-desc--rich {
  text-shadow: none;
  line-height: 1.6;
}
.pf-eyebrow {
  display: inline-flex; align-items: center; gap: 9px;
  margin-bottom: 16px;
  font-family: var(--font-en);
}
.pf-eyebrow .dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--lake-light);
  box-shadow: 0 0 8px var(--lake-light);
}
.pf-eyebrow .cn {
  color: var(--lake-light);
  font-size: clamp(18px, 2vw, 22px);
  font-weight: 700; letter-spacing: 1.5px;
}
.pf-eyebrow .en {
  color: rgba(93, 194, 210, 0.5);
  font-size: 10px; font-weight: 600; letter-spacing: 3px;
  text-transform: uppercase;
}
/* 引言段落：外框卡片化 + 左条高亮 + hover 交互（同 .deep-ai-list / .pf-list 交互语言） */
.pf-lead {
  font-size: 14px;
  line-height: 1.8;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.78);
  text-shadow: none;
  margin: 0 0 22px;
  padding: 13px 16px;
  border: 1px solid rgba(93, 194, 210, 0.2);
  border-left: 1px solid rgba(93, 194, 210, 0.45);
  border-radius: 6px;
  background: linear-gradient(90deg, rgba(93, 194, 210, 0.07), rgba(93, 194, 210, 0) 80%);
  transition: border-color .35s var(--ease), background .35s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease);
}
.pf-lead:hover {
  border-color: rgba(93, 194, 210, 0.5);
  border-left-color: var(--lake-light);
  background: linear-gradient(90deg, rgba(93, 194, 210, 0.16), rgba(93, 194, 210, 0) 80%);
  transform: translateX(3px);
  box-shadow: 0 0 16px rgba(93, 194, 210, 0.16);
}
.pf-list {
  list-style: none;
  display: flex; flex-direction: column;
  gap: 3px;
  margin: 0 0 22px;
}
.pf-list li {
  display: grid;
  grid-template-columns: 30px 1fr;
  align-items: center;
  column-gap: 12px;
  padding: 9px 12px;
  border-left: 1px solid rgba(93, 194, 210, 0.22);
  border-radius: 0 4px 4px 0;
  background: linear-gradient(90deg, rgba(93, 194, 210, 0.07), rgba(93, 194, 210, 0) 80%);
  transition: border-color .35s var(--ease), background .35s var(--ease), transform .35s var(--ease);
}
.pf-list li:hover {
  border-left-color: var(--lake-light);
  background: linear-gradient(90deg, rgba(93, 194, 210, 0.16), rgba(93, 194, 210, 0) 80%);
  transform: translateX(3px);
}
.pf-list b {
  font-family: var(--font-en);
  font-weight: 700;
  font-size: 13px;
  text-align: center;
  letter-spacing: 1px;
  color: var(--lake-light);
  text-shadow: 0 0 8px rgba(93, 194, 210, 0.55);
}
.pf-item-text {
  display: flex; flex-direction: column; gap: 2px;
  min-width: 0;
}
.pf-item-text .cn {
  font-size: 13.5px; font-weight: 600;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, 0.92);
}
.pf-item-text .en {
  font-family: var(--font-en);
  font-size: 10.5px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(93, 194, 210, 0.55);
}
.pf-foot {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 12px;
  line-height: 1.6;
  letter-spacing: 1.5px;
  color: rgba(255, 255, 255, 0.6);
}
.pf-foot::before {
  content: ''; width: 26px; height: 1px; flex-shrink: 0;
  background: linear-gradient(90deg, var(--lake-light), transparent);
}

/* 窄屏（≤980px）：header 居中堆叠，列表限宽居中（eyebrow / foot 由父级 text-align:center 居中） */
@media (max-width: 980px) {
  .pf-list { margin-left: auto; margin-right: auto; max-width: 360px; }
}
@media (max-width: 480px) {
  .pf-list li { column-gap: 10px; padding: 8px 10px; }
  .pf-item-text .cn { font-size: 13px; }
}
/* 窄屏：回到「HUD → 文字 → 产品」纵向堆叠（产品架构 90vw 级宽度无法与文字并排） */
@media (max-width: 980px) {
  .platforms .section-inner {
    grid-template-columns: 1fr;
    grid-template-areas:
      "hud"
      "header"
      "arch";
    row-gap: 0;
  }
  .platforms .section-hud { margin-bottom: 44px; }
  .platforms-header { text-align: center; margin-bottom: 40px; }
  .platforms-header .section-desc { margin: 0 auto; max-width: 760px; text-align: center; }
  .platforms-header .section-desc::before,
  .platforms-header .section-desc::after { margin-left: auto; }
}

/* —— 架构图栅格：左层 + 中箭头 + 右理念柱 —— */
.platforms-arch.is-layered {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 60px minmax(0, 250px);
  row-gap: 18px;
  align-items: stretch;
}
.arch-layer[data-row="1"], .arch-arrow[data-row="1"] { grid-row: 1; }
.arch-layer[data-row="2"], .arch-arrow[data-row="2"] { grid-row: 2; }
.arch-layer[data-row="3"], .arch-arrow[data-row="3"] { grid-row: 3; }
.arch-pillar { grid-column: 3; grid-row: 1 / span 3; }

/* —— 层：玻璃卡 + 青色描边 + 顶部渐变光条 —— */
.arch-layer {
  grid-column: 1;
  position: relative;
  display: grid;
  grid-template-columns: 92px 1fr;
  background: linear-gradient(155deg, rgba(12,161,184,0.07) 0%, rgba(10,22,40,0.5) 60%, rgba(5,13,26,0.55) 100%);
  border: 1px solid rgba(12, 161, 184, 0.22);
  border-radius: 14px;
  overflow: hidden;
  backdrop-filter: blur(10px) saturate(1.15);
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(93,194,210,0.08);
  transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease), border-color 0.4s var(--ease);
}
.arch-layer::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--lake), var(--lake-light));
  z-index: 1;
}
.arch-layer:hover {
  transform: translateY(-3px);
  border-color: rgba(12, 161, 184, 0.42);
  box-shadow: 0 18px 44px rgba(12, 161, 184, 0.18), inset 0 1px 0 rgba(93,194,210,0.16);
}
.arch-layer-tag {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, rgba(12,161,184,0.14), rgba(12,161,184,0.06));
  border-right: 1px solid rgba(12, 161, 184, 0.18);
  color: var(--lake-light);
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: 1px;
  text-align: center;
  padding: 0 6px;
  line-height: 1.4;
  text-shadow: 0 0 10px rgba(93,194,210,0.3);
}
.arch-layer-cells {
  display: grid;
  gap: 12px;
  padding: 18px 20px;
}
.arch-layer-cells--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.arch-layer-cells--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.arch-layer-title {
  grid-column: 1 / -1;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.5px;
  color: var(--lake-light);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: -2px;
  text-shadow: 0 0 10px rgba(93,194,210,0.25);
}
.arch-layer-title::before {
  content: '';
  width: 4px; height: 15px;
  background: linear-gradient(180deg, var(--lake), var(--lake-light));
  border-radius: 2px;
  flex-shrink: 0;
}

/* 子项 cell */
.arch-cell {
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(12, 161, 184, 0.2);
  border-radius: 10px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  justify-content: center;
  align-items: center;
  color: var(--white);
  transition: background 0.3s var(--ease), border-color 0.3s var(--ease), transform 0.3s var(--ease);
}
.arch-cell:hover {
  background: rgba(12, 161, 184, 0.1);
  border-color: rgba(93, 194, 210, 0.4);
  transform: translateY(-2px);
}
.arch-cell--algo { padding: 18px 22px; }
.arch-cell-title {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.3px;
  text-align: center;
}
.arch-layer[data-row="1"] .arch-cell-title { color: var(--lake-light); }
/* 架构图标题内的高亮术语（如 UData™ 数据管理系统的 UData）提亮为品牌青 */
.arch-cell-title .term { color: var(--lake-light); }
.arch-cell-sub {
  font-size: 12.5px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.6);
}
.arch-cell-en {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.3px;
  color: rgba(255,255,255,0.85);
}
.arch-cell sup { font-size: 9px; color: var(--lake-light); vertical-align: super; }

/* 数据流箭头：右理念柱 → 左层 */
.arch-arrow {
  grid-column: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--lake);
  opacity: 0.9;
  transition: opacity 0.3s var(--ease), transform 0.4s var(--ease);
}
.arch-arrow svg {
  filter: drop-shadow(0 2px 6px rgba(12, 161, 184, 0.4));
  transition: transform 0.4s var(--ease);
}
.arch-arrow:hover { opacity: 1; transform: translateX(-2px); }

/* 右侧贯穿理念柱：双轨并行 */
.arch-pillar {
  grid-column: 3;
  grid-row: 1 / span 3;
  display: grid;
  grid-template-rows: subgrid;
  row-gap: 18px;
  min-width: 0;
}
.arch-pillar-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.arch-pillar-stack--top { grid-row: 1 / span 2; }
.arch-pillar-stack--bottom { grid-row: 3; }
.arch-pillar-card {
  position: relative;
  /* 与 .arch-layer 同语言：深色磨玻璃底 + 青色描边（柱与层同属一张架构图，取代原满青实色卡） */
  background: linear-gradient(155deg, rgba(12,161,184,0.07) 0%, rgba(10,22,40,0.5) 60%, rgba(5,13,26,0.55) 100%);
  border: 1px solid rgba(12, 161, 184, 0.22);
  border-radius: 14px;
  padding: 16px 18px;
  color: var(--white);
  backdrop-filter: blur(10px) saturate(1.15);
  -webkit-backdrop-filter: blur(10px) saturate(1.15);
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(93,194,210,0.08);
  transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease), border-color 0.4s var(--ease);
  overflow: hidden;
}
/* 顶部渐变光条（同 .arch-layer::before，柱与层视觉同体系） */
.arch-pillar-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--lake), var(--lake-light));
  z-index: 1;
}
.arch-pillar-card:hover {
  transform: translateY(-3px);
  border-color: rgba(12, 161, 184, 0.42);
  box-shadow: 0 18px 44px rgba(12, 161, 184, 0.18), inset 0 1px 0 rgba(93,194,210,0.16);
}
.arch-pillar-card .arch-cell-title { color: var(--white); font-size: 15px; text-align: left; }
.arch-pillar-card .arch-cell-en { color: rgba(255, 255, 255, 0.78); margin-top: 4px; font-size: 11px; }
.arch-pillar-card sup { font-size: 9px; color: var(--lake-light); vertical-align: super; }
.arch-side-head {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
/* 图标槽：青色玻璃方块（深底上的呼应，取代原满青卡上被迫使用的白色槽） */
.arch-side-icon {
  width: 38px; height: 38px;
  border-radius: 11px;
  background: linear-gradient(135deg, rgba(12,161,184,0.18), rgba(12,161,184,0.08));
  border: 1px solid rgba(93, 194, 210, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--lake-light);
  flex-shrink: 0;
  box-shadow: inset 0 1px 0 rgba(93,194,210,0.15);
}
.arch-side-icon svg { width: 22px; height: 22px; }

.arch-pillar-stack--top .arch-pillar-card--fmvp {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
}
.arch-pillar-stack--top .arch-pillar-card--fmvp .arch-cell-title { font-size: 15px; }
.arch-pillar-stack--top .arch-pillar-card--fmvp .arch-cell-en { margin-top: 0; font-size: 15px; }
.arch-pillar-stack--top .arch-pillar-card--fmvp .arch-pillar-detail {
  margin-top: 30px;
  padding-top: 34px;
  border-top: 1px dashed rgba(93, 194, 210, 0.28);
}
.arch-pillar-stack--bottom > .arch-pillar-card--udata:only-child {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.arch-pillar-detail {
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.arch-pillar-detail-item {
  font-size: 13.5px;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.88);
  padding: 8px 10px 8px 26px;
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(12, 161, 184, 0.2);
  border-radius: 8px;
  position: relative;
}
.arch-pillar-detail-item::before {
  content: '';
  position: absolute;
  left: 10px; top: 50%;
  width: 6px; height: 6px;
  margin-top: -3px;
  border-radius: 50%;
  background: var(--lake-light);
  box-shadow: 0 0 6px rgba(93, 194, 210, 0.7);
}

/* ============================================================
   8. 响应式
   ============================================================ */
@media (max-width: 1080px) {
  /* 核心优势 tab 的窄屏适配见 .adv-tabs 专属响应式（@media 860） */
}
@media (max-width: 980px) {
  .hero-section--center .hero {
    grid-template-columns: 1fr;
    gap: 40px;
    max-width: 720px;
  }
  .hero-section--center .hero-left { align-items: flex-start; text-align: left; }
  .hero-section--center .hero-right { align-items: center; }  /* 单列布局回到居中 */
  .neural-core { width: min(360px, 80%); }
}
@media (max-width: 1024px) {
  .platforms-arch.is-layered {
    grid-template-columns: 1fr;
    row-gap: 14px;
  }
  .arch-layer,
  .arch-arrow,
  .arch-pillar {
    grid-column: 1;
    grid-row: auto !important;
  }
  .arch-arrow { transform: rotate(90deg); height: 56px; padding: 0; }
  .arch-layer-cells--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .arch-pillar {
    display: flex;
    flex-direction: column;
    grid-template-rows: none;
    padding: 0;
    gap: 12px;
  }
  .arch-pillar-stack { grid-row: auto !important; padding: 0; }
}
@media (max-width: 768px) {
  .section-hud { margin-bottom: 36px; }
}
@media (max-width: 720px) {
  .neural-core { width: min(300px, 88%); margin: 0 auto; }
  .arch-layer { grid-template-columns: 1fr; }
  .arch-layer-tag {
    padding: 12px;
    border-right: none;
    border-bottom: 1px solid rgba(12, 161, 184, 0.18);
  }
  .arch-layer-cells--3,
  .arch-layer-cells--2 { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .adv-panel-title { font-size: 22px; }
  .adv-panel-icon { width: 54px; height: 54px; }
  .adv-panel-icon svg { width: 30px; height: 30px; }
  .adv-panel { padding: 28px 22px; }
}
@media (max-width: 480px) {
}
