/* ═══════════════════════════════════════════════════════
   Planck AI Labs · 官网落地页 · 「虚空粒子」风格
   参照：纯黑画布 / 单一强调色 / 极细大字 / 发丝线 / 胶囊几何
   无阴影 · 无渐变 · 深度来自留白与对比
   ═══════════════════════════════════════════════════════ */

:root {
  --void:   #000000;
  --surface: #0a0d13;   /* 交替区段的微抬升面 */
  --bone:   #ffffff;
  --ash:    #ffffff;
  --smoke:  #ffffff;
  --faint:  #ffffff;
  --volt:   #3D8BFD;   /* 唯一权威色：品牌蓝 */
  --cyan:   #4CC9F0;   /* 仅用于粒子/图示节点，不进入界面 chrome */
  --hair:   rgba(255, 255, 255, 0.10);
  --hair-2: rgba(255, 255, 255, 0.22);
  --nav-bg: rgba(0, 0, 0, 0.78);
  --nav-glass: rgba(4, 8, 16, 0.54);
  --nav-glass-strong: rgba(4, 8, 16, 0.72);
  --nav-glass-border: rgba(255, 255, 255, 0.13);
  --ghost-stroke: rgba(255, 255, 255, 0.22);
  --arrow-c: rgba(255, 255, 255, 0.3);
  --scroll-thumb: #1d2533;
  --scroll-thumb-h: #2c3a55;
  --card-shadow: 0 14px 36px rgba(0, 0, 0, 0.5), 0 0 24px rgba(61, 139, 253, 0.1);
  --scrim-rgb: 0, 0, 0;   /* CTA 文字背后的暗场底色（= 页面背景） */
  --system-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --sans: var(--system-font);
  --mono: var(--system-font);
  --r: 24px;
  --maxw: 1200px;
  --ease-fluid: cubic-bezier(0.19, 1, 0.22, 1);
  --ease-dala: cubic-bezier(0.215, 0.61, 0.355, 1);
  --ease-soft: cubic-bezier(0.22, 1, 0.36, 1);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html {
  max-width: 100%;
  min-height: 100%;
  overflow-x: hidden;
  background: var(--void);
  overscroll-behavior-y: none;
  scroll-behavior: smooth;
  scroll-padding-top: 88px;
}
html.js { scroll-behavior: auto; }
body {
  max-width: 100%;
  min-height: 100vh;
  overflow-x: hidden;
  background: var(--void);
  color: var(--bone);
  font-family: var(--sans);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.75;
  letter-spacing: 0.025em;
  -webkit-font-smoothing: antialiased;
  transition: background-color 0.5s var(--ease-soft), color 0.5s var(--ease-soft);
}

::selection { background: rgba(61, 139, 253, 0.4); }

a { color: inherit; text-decoration: none; }
.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 clamp(24px, 3.2vw, 44px); }

main { position: relative; z-index: 1; }

/* ═══════ NAV ═══════ */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  isolation: isolate;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
    var(--nav-glass);
  backdrop-filter: blur(24px) saturate(165%) contrast(1.04);
  -webkit-backdrop-filter: blur(24px) saturate(165%) contrast(1.04);
  border-bottom: none;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.34);
  transition: background 0.65s var(--ease-fluid), backdrop-filter 0.65s var(--ease-fluid), box-shadow 0.65s var(--ease-fluid);
}
.nav::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.07), transparent 24%, transparent 76%, rgba(76, 201, 240, 0.055)),
    linear-gradient(180deg, rgba(61, 139, 253, 0.08), transparent 62%);
  opacity: 0.78;
}
.nav.scrolled {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.018)),
    var(--nav-glass-strong);
  backdrop-filter: blur(28px) saturate(175%) contrast(1.05);
  -webkit-backdrop-filter: blur(28px) saturate(175%) contrast(1.05);
  box-shadow: 0 18px 56px rgba(0, 0, 0, 0.42);
}
.nav-inner {
  position: relative; z-index: 1;
  max-width: var(--maxw); margin: 0 auto; padding: 0 36px;
  height: 68px; display: flex; align-items: center; gap: 40px;
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .nav {
    background: rgba(4, 8, 16, 0.92);
  }
  .nav.scrolled {
    background: rgba(4, 8, 16, 0.96);
  }
}

@media (prefers-reduced-transparency: reduce) {
  .nav,
  .nav.scrolled {
    background: rgba(4, 8, 16, 0.94);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  .nav::after {
    opacity: 0.35;
  }
}
.nav-brand { display: flex; align-items: center; gap: 10px; margin-right: auto; }
.nav-brand img { height: 22px; display: block; }
.nav-brand .brand-cn { font-size: 16.5px; font-weight: 500; letter-spacing: 0.1em; }
.nav-brand .brand-en { font-family: var(--mono); font-size: 11px; color: var(--smoke); letter-spacing: 0.1em; padding-left: 10px; border-left: 1px solid var(--hair-2); white-space: nowrap; }
.nav-brand .brand-en:empty { display: none; }   /* 英文模式副标置空时隐藏，避免残留竖线 */
.nav-links { display: flex; gap: 30px; }
.nav-links a { font-size: 13.5px; font-weight: 600; color: var(--smoke); transition: color 0.52s var(--ease-fluid), opacity 0.52s var(--ease-fluid); letter-spacing: 0.05em; }
.nav-links a:hover,
.nav-links a.is-active { color: var(--bone); }
.nav-cta {
  font-size: 12.5px; font-weight: 500; padding: 9px 22px;
  background: var(--volt); color: #ffffff; border-radius: 999px;
  letter-spacing: 0.1em; transition: background 0.55s var(--ease-fluid), transform 0.55s var(--ease-fluid), box-shadow 0.68s var(--ease-fluid);
}
.nav-cta:hover,
.nav-cta.is-active { background: #5d9fff; }

@media (max-width: 1180px) and (min-width: 1025px) {
  .nav-inner { gap: 28px; padding: 0 28px; }
  .nav-links { gap: 22px; }
  .nav-cta { padding: 9px 18px; }
}

/* ═══════ HERO · 左文右粒子 ═══════ */
.hero {
  position: relative; min-height: 100vh;
  display: flex; align-items: center;
  overflow: hidden;
  padding: 120px 0 80px;
}
#globe-canvas {
  position: fixed; inset: 0; z-index: 0; display: block; width: 100%; height: 100%; pointer-events: none;
  transform: translateZ(0); will-change: transform, opacity;
}
.hero-inner { position: relative; z-index: 2; width: 100%; }
.hero-text { max-width: 600px; }
.hero-eyebrow {
  font-family: var(--mono); font-size: 12px; font-weight: 500; letter-spacing: 0.18em;
  color: var(--volt); margin-bottom: 36px;
  display: flex; align-items: center; gap: 14px;
}
.hero-eyebrow::after { content: ""; width: 48px; height: 1px; background: var(--hair-2); }
.hero h1 {
  font-weight: 500;
  font-size: clamp(34px, 4.2vw, 56px); line-height: 1.16;
  letter-spacing: 0.01em; margin-bottom: 28px;
  color: var(--bone);
  max-width: 540px;               /* 限定标题宽度，在内容列内换行，不横跨到视觉区 */
}
.hero-sub {
  max-width: 500px; margin-bottom: 52px;
  font-size: clamp(15px, 1.4vw, 17px); color: var(--ash); line-height: 2; font-weight: 400;
}
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 13.5px; font-weight: 500; letter-spacing: 0.12em; padding: 14px 34px;
  border-radius: 999px; transition: background 0.68s var(--ease-fluid), border-color 0.68s var(--ease-fluid), color 0.68s var(--ease-fluid), transform 0.68s var(--ease-fluid), box-shadow 0.82s var(--ease-fluid); cursor: pointer;
  will-change: transform;
}
.btn:hover { transform: translateY(-1.5px); }
.btn:active { transform: translateY(0) scale(0.985); }
.btn-primary { background: var(--volt); color: #ffffff; }
.btn-primary:hover { background: #5d9fff; }
.btn-ghost { border: 1px solid var(--hair-2); color: var(--bone); }
.btn-ghost:hover { border-color: var(--volt); color: var(--bone); }
.btn[aria-disabled="true"] { pointer-events: none; cursor: default; }
.btn .arr { font-family: var(--mono); }

/* ═══════ SECTION 通用 ═══════ */
.section { padding: 130px 0; position: relative; scroll-margin-top: 88px; }
.cta-sec { scroll-margin-top: 88px; }
.sec-head { margin-bottom: 72px; }
.sec-title {
  font-weight: 400; font-size: clamp(32px, 4vw, 54px);
  line-height: 1.3; letter-spacing: 0.01em; max-width: 820px;
}
.sec-title .accent { color: var(--volt); }
.sec-lead { max-width: 640px; margin-top: 22px; color: var(--smoke); font-size: 16px; font-weight: 400; }

/* ═══════ 痛点 / 七个上线门槛 ═══════ */
#problem { padding-top: 112px; }

.gates-label { font-family: var(--mono); font-size: 12px; letter-spacing: 0.26em; color: var(--faint); margin-bottom: 18px; text-transform: uppercase; }

/* 左：3/4 数据地球（由 fixed #globe-canvas 透出）· 右：标题 + 正文 */
.gate-board {
  display: grid; grid-template-columns: 1fr minmax(320px, 500px);
  gap: clamp(56px, 6vw, 88px); align-items: center; min-height: 70vh;
}
.gate-globe { min-height: 1px; }
.gate-copy { justify-self: end; max-width: 520px; }
.gate-title {
  font-weight: 500; font-size: clamp(28px, 3.4vw, 46px);
  line-height: 1.22; letter-spacing: 0.01em; color: var(--bone); margin-bottom: 28px;
}
.gate-body {
  max-width: 620px;
  font-size: clamp(15px, 1.4vw, 17px); line-height: 2; color: var(--ash); font-weight: 400;
}
.gate-body .accent { color: var(--volt); font-weight: 500; }

/* ═══════ 02 解决方案：复用 §01 数据地球（globe-canvas 透出），居中文本 ═══════ */
.sol {
  min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  position: relative; overflow: hidden;
  padding: 120px 0;
}
.sol-inner { position: relative; z-index: 1; }
.sol-copy { max-width: min(1040px, 100%); margin: 0 auto; text-align: center; }
.sol-title {
  font-weight: 500; font-size: clamp(30px, 3.2vw, 44px);
  line-height: 1.32; letter-spacing: 0.02em; color: var(--bone); margin-bottom: 30px;
}
.sol-title .accent { color: var(--volt); font-weight: 600; }
.sol-lead {
  max-width: min(1000px, 100%); margin: 0 auto;
  font-size: clamp(16px, 1.55vw, 19px); line-height: 2.1;
  color: var(--ash); font-weight: 400; letter-spacing: 0.01em;
}
.sol-lead strong { color: var(--bone); font-weight: 600; }

/* ═══════ 架构图 ═══════ */
.arch { display: grid; grid-template-columns: 1fr 150px; gap: 14px; }
.arch-main { display: flex; flex-direction: column; gap: 14px; }
.arch-layer { display: grid; grid-template-columns: 110px 1fr; gap: 14px; align-items: stretch; }
.arch-label {
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.2em; color: var(--faint);
  writing-mode: vertical-rl; border: 1px dashed var(--hair); border-radius: var(--r); padding: 12px 0;
}
.arch-cells { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.arch-cell { border: 1px solid var(--hair); border-radius: var(--r); padding: 22px 28px; }
.arch-cell .ac-tag { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.22em; color: var(--faint); margin-bottom: 6px; }
.arch-cell .ac-name { font-size: 16.5px; font-weight: 500; margin-bottom: 4px; }
.arch-cell .ac-sub { font-size: 12px; color: var(--smoke); line-height: 1.65; }
.arch-os {
  flex: 1; min-height: 160px;
  display: flex; flex-direction: column; justify-content: center;
  border: 1px solid rgba(61, 139, 253, 0.6); border-radius: var(--r);
  padding: 32px 40px; text-align: center;
}
.arch-os .ac-tag { font-family: var(--mono); font-size: 11px; letter-spacing: 0.28em; color: var(--volt); margin-bottom: 12px; }
.arch-os .ac-name { font-size: 28px; font-weight: 400; margin-bottom: 8px; letter-spacing: 0.04em; }
.arch-os .ac-sub { font-size: 13.5px; color: var(--smoke); letter-spacing: 0.06em; }
.arch-down { display: grid; grid-template-columns: 110px 1fr; gap: 14px; }
.arch-down .ad-cells { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.ad-arrow { display: flex; justify-content: center; }
.ad-arrow svg { display: block; }
.arch-down.single { display: flex; justify-content: center; }
.arch-gov {
  border: 1px dashed var(--hair-2); border-radius: var(--r);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px;
  padding: 24px 0;
}
.arch-gov .gov-title { writing-mode: vertical-rl; font-size: 15px; font-weight: 500; letter-spacing: 0.42em; color: var(--ash); }
.arch-gov .gov-items { writing-mode: vertical-rl; font-size: 10.5px; color: var(--faint); letter-spacing: 0.12em; line-height: 2; }

/* ═══════ 03 场景落地：左文案 + 右侧 0/1 数字大脑 ═══════ */
.sci { min-height: 100vh; display: flex; align-items: center; overflow: hidden; position: relative; }
.sci-inner {
  display: grid; grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr); gap: clamp(52px, 6vw, 88px);
  align-items: center; width: 100%; min-height: 86vh;
  position: relative; z-index: 1;
}
.sci-copy {
  max-width: 520px; display: flex; flex-direction: column; justify-content: center;
  justify-self: start;
}
.sci-title {
  font-weight: 500; font-size: clamp(28px, 3.4vw, 46px);
  line-height: 1.22; letter-spacing: 0.01em; color: var(--bone); margin-bottom: 28px;
}
.sci-title .accent { color: var(--volt); font-weight: 600; }
.sci-title .nowrap { white-space: nowrap; }
.sci-lead { font-size: clamp(15px, 1.4vw, 17px); line-height: 2; color: var(--ash); font-weight: 400; }
.sci-lead strong { color: var(--bone); font-weight: 600; }
.sci-lead .accent { color: var(--volt); font-weight: 600; }
.sci-brain { min-height: 78vh; }
/* 水晶体画布：固定铺满视口，随滚动从 §03 右侧旋转旅行到 §04 左侧 */
#crystal-canvas {
  position: fixed; inset: 0; z-index: 0; display: block; width: 100%; height: 100%; pointer-events: none;
  transform: translateZ(0); will-change: transform, opacity;
  /* 顶部羽化：坠落的 0/1 自视口上方淡入 */
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 12%);
          mask-image: linear-gradient(to bottom, transparent 0, #000 12%);
}
/* §04：水晶在左、文案在右（镜像 §03 的左字右晶） */
.sci-rev .sci-inner { grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr); }
.sci-rev .sci-copy { justify-self: end; }
/* §05：取消 section padding，让左右内容与 fixed canvas 的视口中线垂直对齐 */
#moat.section { padding: 0; }

/* ═══════ 路线图 ═══════ */
.roadmap { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 72px; }
.stage {
  border: 1px solid var(--hair); border-radius: var(--r); padding: 32px 30px 36px;
  position: relative;
}
.stage.focal { border-color: rgba(61, 139, 253, 0.65); }
.stage .st-phase { font-family: var(--mono); font-size: 11px; letter-spacing: 0.22em; color: var(--faint); margin-bottom: 20px; }
.stage.focal .st-phase { color: var(--volt); }
.stage h3 { font-size: 19px; font-weight: 500; margin-bottom: 10px; line-height: 1.5; }
.stage p { font-size: 13px; color: var(--smoke); line-height: 1.85; }
.stage .st-arrow {
  position: absolute; right: -13px; top: 50%; transform: translateY(-50%);
  font-family: var(--mono); color: var(--faint); z-index: 2; font-size: 13px;
}

.biz { display: grid; grid-template-columns: 220px repeat(4, 1fr); border: 1px solid var(--hair); border-radius: var(--r); overflow: hidden; }
.biz-head { padding: 24px 28px; display: flex; flex-direction: column; justify-content: center; border-right: 1px solid var(--hair); }
.biz-head .b-tag { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.24em; color: var(--volt); margin-bottom: 6px; }
.biz-head .b-name { font-size: 16px; font-weight: 500; }
.biz-item { padding: 24px 26px; }
.biz-item + .biz-item { border-left: 1px solid var(--hair); }
.biz-item .b-idx { font-family: var(--mono); font-size: 10.5px; color: var(--faint); letter-spacing: 0.15em; margin-bottom: 8px; }
.biz-item .b-name { font-size: 14.5px; font-weight: 500; margin-bottom: 4px; }
.biz-item .b-desc { font-size: 12px; color: var(--smoke); line-height: 1.7; }

/* ═══════ 关于我们：居中文案 + 下方语音频谱点云 ═══════ */
.about-sol { min-height: 100vh; padding: 112px 0 190px; align-items: flex-start; }
.about-sol .sol-inner { margin-top: clamp(48px, 10vh, 104px); }
.about-copy { max-width: min(1040px, 100%); }
.about-copy .sol-title {
  margin-bottom: 34px;
}
.about-lead {
  max-width: 1000px;
  line-height: 2.12;
}
.about-lead p { margin-bottom: 22px; }
.about-lead p:last-child { margin-bottom: 0; }
.about-lead strong { color: var(--bone); font-weight: 600; }

/* ═══════ CTA ═══════ */
.cta-sec {
  min-height: calc(100vh - 120px);
  min-height: clamp(640px, calc(100svh - 120px), 820px);
  display: flex; align-items: stretch;
  text-align: center; padding: 96px 0 0; position: relative; overflow: hidden;
}
.cta-sec .wrap { position: relative; display: flex; flex-direction: column; flex: 1; }
/* 中央焦点组：标题 + 副文 + 按钮，叠在点云视觉之上（参考稿：文字居中、视觉环绕） */
.cta-main {
  flex: 0 0 auto; min-height: 560px; min-height: clamp(500px, 58svh, 680px);
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
  position: relative; padding: clamp(96px, 10svh, 136px) 0 0;
}
.cta-main > * { position: relative; z-index: 1; }
/* 文字背后的柔和暗场：让白字稳压点云，呼应参考稿的「暗心」 */
.cta-main::before {
  content: ""; position: absolute; left: 50%; top: 50%; z-index: 0;
  width: min(840px, 94vw); height: 460px; transform: translate(-50%, -50%);
  background: radial-gradient(ellipse at center,
    rgba(var(--scrim-rgb), 0.82) 0%, rgba(var(--scrim-rgb), 0.52) 40%, rgba(var(--scrim-rgb), 0) 72%);
  pointer-events: none;
}
.cta-sec h2 {
  font-weight: 400;
  font-size: clamp(30px, 3.2vw, 44px);
  line-height: 1.28;
  margin-bottom: 20px;
  white-space: nowrap;
}
.cta-sec .cta-sub { color: var(--smoke); font-size: 16px; font-weight: 400; max-width: 540px; margin: 0 auto 40px; }
.cta-sec .hero-actions { justify-content: center; margin-bottom: 0; }
/* 底部联系信息条：安静、贴近页脚，与中央视觉解耦 */
.cta-channels {
  display: flex; justify-content: center; align-items: flex-start;
  gap: clamp(28px, 5vw, 60px);
  margin-top: 0; padding: 28px 0 48px; position: relative;
}
.cta-channels::before {
  content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: min(660px, 84vw); height: 1px; background: var(--hair);
}
.cta-ch { text-align: center; }
.cta-ch .ch-key { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.22em; color: var(--faint); margin-bottom: 7px; text-transform: uppercase; }
.cta-ch .ch-val { font-size: 13.5px; color: var(--smoke); }

@media (max-height: 760px) and (min-width: 721px) {
  .cta-sec {
    min-height: auto;
    padding-top: 72px;
  }
  .cta-main {
    min-height: clamp(330px, 46svh, 400px);
    padding: clamp(86px, 11svh, 112px) 0 0;
  }
  .cta-main::before {
    height: 300px;
  }
  .cta-sec h2 {
    font-size: clamp(28px, 2.8vw, 38px);
    margin-bottom: 12px;
  }
  .cta-sec .cta-sub {
    max-width: 520px;
    margin-bottom: 26px;
    font-size: 14px;
    line-height: 1.75;
  }
  .cta-sec .hero-actions .btn {
    padding: 12px 30px;
  }
  .cta-channels {
    padding: 16px 0 28px;
  }
}

@media (max-height: 640px) and (min-width: 721px) {
  .cta-sec {
    padding-top: 64px;
  }
  .cta-main {
    min-height: clamp(276px, 44svh, 330px);
    padding-top: clamp(72px, 12svh, 92px);
  }
  .cta-main::before {
    height: 250px;
  }
  .cta-sec h2 {
    font-size: clamp(26px, 2.4vw, 34px);
  }
  .cta-sec .cta-sub {
    margin-bottom: 22px;
  }
  .cta-channels {
    gap: clamp(22px, 4vw, 44px);
    padding: 14px 0 22px;
  }
}

/* ═══════ FOOTER ═══════ */
footer { border-top: 1px solid var(--hair); padding: 44px 0 52px; position: relative; z-index: 1; background: var(--void); }
.foot { display: flex; align-items: center; gap: 16px; justify-content: space-between; flex-wrap: wrap; }
.foot-brand { display: flex; align-items: center; gap: 12px; }
.foot-brand img { height: 18px; opacity: 0.8; }
.foot-brand span { font-size: 13px; color: var(--faint); }
.foot-note { font-size: 12px; color: var(--faint); font-family: var(--mono); letter-spacing: 0.06em; }
.foot-note a { color: inherit; text-decoration: none; }
.foot-note a:hover { text-decoration: underline; }

@media (max-height: 760px) and (min-width: 721px) {
  footer { padding: 34px 0 40px; }
}

@media (max-height: 640px) and (min-width: 721px) {
  footer { padding: 28px 0 34px; }
  .foot { row-gap: 8px; }
}

/* ═══════ 滚动渐入 ═══════ */
@media (prefers-reduced-motion: no-preference) {
  html.js .reveal { opacity: 0; transform: translateY(18px) scale(0.992); transition: opacity 0.92s var(--ease-fluid), transform 0.92s var(--ease-fluid); will-change: opacity, transform; }
  html.js .reveal.in { opacity: 1; transform: none; will-change: auto; }
  .reveal-d1 { transition-delay: 0.08s; }
  .reveal-d2 { transition-delay: 0.16s; }
  .reveal-d3 { transition-delay: 0.24s; }
  .section.section-focus > .wrap,
  .cta-sec.section-focus > .wrap {
    animation: section-focus 0.96s var(--ease-fluid) both;
  }
  @keyframes section-focus {
    from { opacity: 0.78; transform: translateY(14px); }
    to { opacity: 1; transform: none; }
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* ═══════ 响应式 ═══════ */
@media (max-width: 1024px) {
  .gate-board { grid-template-columns: 1fr; gap: 40px; min-height: 0; }
  .gate-copy { justify-self: stretch; max-width: 760px; }
  .sci-inner { grid-template-columns: 1fr; gap: 40px; min-height: 0; }
  .sci-rev .sci-inner { grid-template-columns: 1fr; }
  .sci-copy,
  .sci-rev .sci-copy { justify-self: stretch; max-width: 760px; }
  .sci-rev .sci-copy { order: 1; }
  .sci-rev .sci-brain { order: 2; }
  .sci-brain { min-height: 56vw; }
  .roadmap { grid-template-columns: repeat(2, 1fr); }
  .stage .st-arrow { display: none; }
  .biz { grid-template-columns: 1fr 1fr; }
  .biz-head { grid-column: 1 / -1; border-right: none; border-bottom: 1px solid var(--hair); }
  .biz-item + .biz-item { border-left: none; }
  .biz-item { border-top: 1px solid var(--hair); }
  .biz-item:nth-child(odd) { border-left: 1px solid var(--hair); }
  .nav-links { display: none; }
}
/* ═══════════════════════════════════════════════════════
   科技感强化：字重层级 / 入场动效 / 辉光与数据流
   ═══════════════════════════════════════════════════════ */

/* 背景弥散光晕已移除：整页保持纯黑 */

/* ── 字重层级：该粗的粗起来 ── */
.hero h1 { font-weight: 600; }
.hero h1 .grad {
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  color: var(--volt);
}
.hero-sub strong { color: var(--bone); font-weight: 600; }
.sec-title { font-weight: 400; }
.sec-title .accent, .cta-sec h2 .accent {
  font-weight: 600;
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  color: var(--volt);
}
.pain-quote em { font-weight: 500; }
.pain-quote strong { color: var(--bone); font-weight: 600; }
.sec-lead strong { color: var(--bone); font-weight: 600; }
.judgment p strong { color: var(--ash); font-weight: 600; }
.gate .g-name { font-weight: 600; }
.judgment h3 { font-weight: 500; }
.scene h3 { font-weight: 500; }
.stage h3 { font-weight: 500; }
.leap-step h4 { font-weight: 600; }
.biz-item .b-name { font-weight: 600; }
.cta-sec h2 { font-weight: 400; }
.hero-sub,
.sec-lead,
.gate .g-desc,
.judgment p,
.scene p,
.leap-step p,
.stage p,
.biz-item .b-desc,
.cta-sec .cta-sub,
.cta-ch .ch-val {
  font-weight: 400;
}

/* ── 章节幽灵编号 ── */
.sec-head { position: relative; }
.sec-head::before {
  content: attr(data-num);
  position: absolute; right: 0; top: -34px; z-index: -1;
  font-family: Arial, "Helvetica Neue", Helvetica, "Segoe UI", sans-serif; font-size: 180px; font-weight: 700; line-height: 1; /* 非 system-ui：规避 -webkit-text-stroke 在「2」等字形上的描边毛刺 */
  color: transparent; -webkit-text-stroke: 1.35px var(--ghost-stroke);
  letter-spacing: -0.02em; pointer-events: none; user-select: none;
}

/* ── NAV：链接划线 / CTA 辉光 ── */
.nav-links a { position: relative; }
.nav-links a::after {
  content: ""; position: absolute; left: 0; bottom: -6px; height: 1px; width: 100%;
  background: var(--volt); transform: scaleX(0); transform-origin: left;
  transition: transform 0.68s var(--ease-fluid);
}
.nav-links a:hover::after,
.nav-links a.is-active::after { transform: scaleX(1); }
.nav-cta { transition: background 0.55s var(--ease-fluid), box-shadow 0.72s var(--ease-fluid), transform 0.55s var(--ease-fluid); }
.nav-cta:hover,
.nav-cta.is-active { box-shadow: 0 0 20px rgba(61, 139, 253, 0.5); }

/* ── 按钮：辉光 + 扫光 + 箭头位移 ── */
.btn { position: relative; }
.btn .arr { transition: transform 0.56s var(--ease-fluid); }
.btn:hover .arr { transform: translateX(4px); }
.btn-primary {
  overflow: hidden;
  box-shadow: 0 0 22px rgba(61, 139, 253, 0.32);
  transition: background 0.68s var(--ease-fluid), box-shadow 0.82s var(--ease-fluid), transform 0.68s var(--ease-fluid);
}
.btn-primary:hover { box-shadow: 0 0 34px rgba(61, 139, 253, 0.52); transform: translateY(-1.5px); }
.btn-ghost { transition: border-color 0.68s var(--ease-fluid), background 0.68s var(--ease-fluid), transform 0.68s var(--ease-fluid); }
.btn-ghost:hover { background: rgba(61, 139, 253, 0.08); transform: translateY(-1.5px); }

/* ── 卡片悬浮：上浮 + 边框辉光 ── */
.scene, .judgment, .stage, .arch-cell, .biz-item, .cta-ch {
  transition: border-color 0.55s var(--ease-fluid), transform 0.62s var(--ease-fluid), box-shadow 0.72s var(--ease-fluid);
}
.scene:hover, .judgment:hover, .stage:hover, .arch-cell:hover {
  border-color: rgba(61, 139, 253, 0.55);
  transform: translateY(-3px);
  box-shadow: var(--card-shadow);
}
.scene:hover .s-glyph, .gate:hover .g-num { color: var(--volt); }
.gate .g-num, .scene .s-glyph { transition: color 0.55s var(--ease-fluid); }
.scene:hover .s-tag { border-color: rgba(61, 139, 253, 0.5); color: var(--ash); }
.scene .s-tag { transition: border-color 0.55s var(--ease-fluid), color 0.55s var(--ease-fluid); }

/* ── ARCH：OS 控制平面呼吸辉光 / 箭头脉冲 ── */
.arch-os { transition: border-color 0.55s var(--ease-fluid); }
.arch-gov { transition: border-color 0.55s var(--ease-fluid); }
.arch-gov:hover { border-color: rgba(61, 139, 253, 0.45); }

/* ── 滚动条 ── */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--void); }
::-webkit-scrollbar-thumb { background: var(--scroll-thumb); border-radius: 999px; border: 2px solid var(--void); }
::-webkit-scrollbar-thumb:hover { background: var(--scroll-thumb-h); }

/* ── 动效（尊重 prefers-reduced-motion） ── */
@media (prefers-reduced-motion: no-preference) {

  /* Hero 入场：逐级上浮 */
  @keyframes rise {
    from { opacity: 0; transform: translateY(22px); }
    to { opacity: 1; transform: none; }
  }
  .hero-eyebrow { animation: rise 0.96s 0.05s var(--ease-fluid) both; }
  .hero h1 { animation: rise 1.05s 0.16s var(--ease-fluid) both; }
  .hero-sub { animation: rise 1.05s 0.30s var(--ease-fluid) both; }
  .hero .hero-actions { animation: rise 1.05s 0.44s var(--ease-fluid) both; }

  /* Hero eyebrow 线条扫描 */
  @keyframes line-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
  .hero-eyebrow::after { transform-origin: left; animation: line-grow 1.2s 0.72s var(--ease-fluid) both; }

  /* 主按钮扫光：动画 transform 而非 left——left 每帧走主线程 layout+paint，
     transform 由合成器执行，页面静止时主线程真正空闲。
     位移用自身宽度计（自宽 = 按钮 34%）：530% ≈ 旧 left -45%→135% 的 180% 按钮宽行程 */
  @keyframes btn-sheen {
    0%, 55% { transform: translateX(0) skewX(-18deg); }
    100% { transform: translateX(530%) skewX(-18deg); }
  }
  .btn-primary::after {
    content: ""; position: absolute; top: 0; left: -45%; width: 34%; height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.32), transparent);
    transform: translateX(0) skewX(-18deg);
    animation: btn-sheen 3.6s ease-in-out infinite;
  }

  /* 网格内子项交错入场 */
  html.js .reveal :is(.gate, .scene, .judgment, .stage, .leap-step, .biz-item, .arch-cell) {
    opacity: 0; transform: translateY(16px);
    transition: opacity 0.86s var(--ease-fluid), transform 0.86s var(--ease-fluid);
  }
  html.js .reveal.in :is(.gate, .scene, .judgment, .stage, .leap-step, .biz-item, .arch-cell) {
    opacity: 1; transform: none;
  }
  html.js .reveal.in :is(.gate, .scene, .judgment, .stage, .leap-step, .biz-item, .arch-cell):nth-child(1) { transition-delay: 0.05s; }
  html.js .reveal.in :is(.gate, .scene, .judgment, .stage, .leap-step, .biz-item, .arch-cell):nth-child(2) { transition-delay: 0.13s; }
  html.js .reveal.in :is(.gate, .scene, .judgment, .stage, .leap-step, .biz-item, .arch-cell):nth-child(3) { transition-delay: 0.21s; }
  html.js .reveal.in :is(.gate, .scene, .judgment, .stage, .leap-step, .biz-item, .arch-cell):nth-child(4) { transition-delay: 0.29s; }
  html.js .reveal.in :is(.gate, .scene, .judgment, .stage, .leap-step, .biz-item, .arch-cell):nth-child(5) { transition-delay: 0.37s; }
  html.js .reveal.in :is(.gate, .scene, .judgment, .stage, .leap-step, .biz-item, .arch-cell):nth-child(6) { transition-delay: 0.45s; }
  html.js .reveal.in :is(.gate, .scene, .judgment, .stage, .leap-step, .biz-item, .arch-cell):nth-child(7) { transition-delay: 0.53s; }

  /* 价值阶梯：主线生长 + 终点光环 */
  html.js .reveal .leap::before { transform: scaleX(0); transform-origin: left; transition: transform 1.4s cubic-bezier(0.22, 1, 0.36, 1) 0.35s; }
  html.js .reveal.in .leap::before { transform: scaleX(1); }
  @keyframes dot-ping {
    0% { box-shadow: 0 0 0 0 rgba(61, 139, 253, 0.55); }
    70%, 100% { box-shadow: 0 0 0 12px rgba(61, 139, 253, 0); }
  }
  .leap-step:nth-child(4) .l-dot { animation: dot-ping 2.6s cubic-bezier(0, 0, 0.2, 1) infinite; }

  /* 架构层级箭头脉冲 */
  @keyframes arrow-pulse {
    0%, 100% { opacity: 0.45; transform: translateY(0); }
    50% { opacity: 1; transform: translateY(3px); }
  }
  .ad-arrow svg { animation: arrow-pulse 2.4s ease-in-out infinite; }

  /* Agent-OS 控制平面呼吸辉光 */
  @keyframes os-breathe {
    0%, 100% { box-shadow: 0 0 18px rgba(61, 139, 253, 0.1); border-color: rgba(61, 139, 253, 0.5); }
    50% { box-shadow: 0 0 42px rgba(61, 139, 253, 0.26); border-color: rgba(61, 139, 253, 0.85); }
  }
  .arch-os { animation: os-breathe 4.2s ease-in-out infinite; }

  /* 路线图阶段箭头脉冲 */
  @keyframes stage-arrow {
    0%, 100% { opacity: 0.4; transform: translate(0, -50%); }
    50% { opacity: 1; transform: translate(4px, -50%); }
  }
  .stage .st-arrow { animation: stage-arrow 2.2s ease-in-out infinite; }
  .stage:nth-child(2) .st-arrow { animation-delay: 0.3s; }
  .stage:nth-child(3) .st-arrow { animation-delay: 0.6s; }

  /* CTA 背景呼吸光晕 */
  @keyframes cta-breathe {
    0%, 100% { opacity: 0.55; transform: translate(-50%, -50%) scale(1); }
    50% { opacity: 1; transform: translate(-50%, -50%) scale(1.12); }
  }
  .cta-sec::before {
    content: ""; position: absolute; left: 50%; top: 42%;
    width: 920px; height: 620px; max-width: 120vw;
    transform: translate(-50%, -50%);
    background: none;
    pointer-events: none;
  }
}

@media (max-width: 1024px) {
  .sec-head::before { display: none; }
}

/* ═══════════════════════════════════════════════════════
   v3 · CareAgent OS 内容改版
   ═══════════════════════════════════════════════════════ */

/* ── 语言切换按钮 ── */
.nav-actions { display: flex; align-items: center; gap: 12px; }
.lang-toggle {
  width: 36px; height: 36px; border-radius: 999px;
  border: 1px solid var(--hair-2); background: transparent; color: var(--smoke);
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; padding: 0;
  transition: color 0.35s var(--ease-fluid), border-color 0.35s var(--ease-fluid), transform 0.5s var(--ease-soft);
}
.lang-toggle:hover { color: var(--bone); border-color: var(--volt); transform: translateY(-1px); }
.lang-toggle-text {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
}

/* ── SVG 图示固定暗色视觉（覆盖内联属性） ── */
.arch-down:not(.single) .ad-arrow line,
.arch-down:not(.single) .ad-arrow path { stroke: var(--arrow-c); }

/* ── 全站文字统一白色：品牌蓝保留给按钮、线条、粒子等非文字视觉 ── */
body,
body :where(a, p, span, small, strong, em, h1, h2, h3, h4, h5, h6, div, button, label, li) {
  color: #ffffff !important;
}

/* ═══════ 响应式（原有） ═══════ */
@media (max-width: 720px) {
  .nav-inner { gap: 14px; padding: 0 20px; }
  .nav-brand { gap: 8px; }
  .nav-brand .brand-cn { white-space: nowrap; }
  .nav-brand .brand-en { display: none; }
  .nav-cta { white-space: nowrap; padding: 8px 18px; }
  .hero h1 { font-size: clamp(28px, 7vw, 38px); }
  .sci-brain { min-height: 68vw; }
  .arch-layer { grid-template-columns: 1fr; }
  .arch-label { writing-mode: horizontal-tb; padding: 8px 0; }
  .arch-cells { grid-template-columns: 1fr; }
  .arch { grid-template-columns: 1fr; }
  .arch-down { display: none; }
  .arch-gov { flex-direction: row; padding: 14px 20px; }
  .arch-gov .gov-title, .arch-gov .gov-items { writing-mode: horizontal-tb; }
  .cta-sec { min-height: auto; padding: 112px 0 0; }
  .cta-main { min-height: auto; padding: 76px 0 86px; }
  .cta-sec h2 { font-size: clamp(24px, 7vw, 32px); white-space: normal; }
  .cta-channels { flex-direction: column; align-items: center; gap: 24px; padding: 24px 0 44px; }
}


/* ═══════════════════════════════════════════════════════
   v7 · 区段分区背景（A+：交替色带 + Hero / 02 蓝辉光）
   ═══════════════════════════════════════════════════════ */

/* 整页统一为纯黑：取消交替色带与区段蓝辉光，让背景全程为 void */