/* ============================================================
   v2-dark.css — 官网 v2 暗色主题覆盖层
   用于产品详情 v2(.hand-page)与解决方案 v2(.solution-page):
   在原页面 light 样式之后加载,覆盖为"暖黑 + 品牌橙"的 v2 视觉,
   并提供 #fxSky 固定流光背景层的样式。
   不改任何 JS / DOM 结构。
   ============================================================ */

/* ---------- 天空层(固定流光背景) ---------- */
#fxSky { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
#fxSky .fx-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
#fxSky::after { content: ''; position: absolute; inset: 0; background: rgba(10, 9, 8, 0.45); }
body:has(#fxSky) { background: #0a0908; }
main { position: relative; z-index: 1; }

/* ---------- 主站导航(style.css navbar)暗色化 ---------- */
.navbar { background: rgba(10, 9, 8, 0.55); border-bottom: 1px solid rgba(247, 244, 239, 0.08); backdrop-filter: blur(20px) saturate(160%); -webkit-backdrop-filter: blur(20px) saturate(160%); }
.navbar.is-scrolled { background: rgba(10, 9, 8, 0.85); }
.navbar .brand-text { color: #f7f4ef; }
.navbar .nav-links a { color: rgba(247, 244, 239, 0.72); }
.navbar .nav-links a:hover,
.navbar .nav-links a.is-active { color: #ff9c5b; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after { background: #f7f4ef; }
@media (max-width: 1040px) {
  .navbar .nav-links, .nav-links { background: rgba(10, 9, 8, 0.97); }
}

/* ============================================================
   产品详情页 v2(.hand-page)
   ============================================================ */
.hand-page {
  --hp-ink-primary: #f7f4ef;
  --hp-ink-secondary: rgba(247, 244, 239, 0.66);
  --hp-ink-muted: rgba(247, 244, 239, 0.45);
  --hp-ink-faint: rgba(247, 244, 239, 0.30);
  --hp-surface-page: transparent;
  --hp-surface-card: rgba(247, 244, 239, 0.055);
  --hp-surface-viewer: #14100c;
  --hp-divider: rgba(247, 244, 239, 0.14);
  --hp-border: rgba(247, 244, 239, 0.14);
  background: transparent;
  color: #f7f4ef;
}

/* hero:产品图压暗作氛围,文字暖白 */
.hand-page .hand-hero { background-color: #0d0b09; color: #f7f4ef; }
.hand-page .hand-hero::before {
  background: linear-gradient(180deg, rgba(10, 9, 8, 0.52) 0%, rgba(10, 9, 8, 0.86) 100%);
}
.hand-page .hand-hero h1 { color: #f7f4ef; text-shadow: 0 2px 30px rgba(0, 0, 0, 0.6); }
.hand-page .hand-hero .hero-sub { color: rgba(247, 244, 239, 0.78); }
.hand-page .hand-hero .hero-stat { color: #f7f4ef; }
.hand-page .hand-hero .hero-stat .stat-label { color: rgba(247, 244, 239, 0.5); }

/* 布局背景透明,让流光透出 */
.hand-page .hand-layout { background: transparent; }

/* 内容卡 → 毛玻璃 */
.hand-page .content-col {
  background: linear-gradient(165deg, rgba(247, 244, 239, 0.07), rgba(247, 244, 239, 0.025));
  border: 1px solid rgba(247, 244, 239, 0.12);
  border-radius: 20px;
  box-shadow: none;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
.hand-page .content-col h2 { color: #f7f4ef; }
.hand-page .spec-table th { color: #f7f4ef; }
.hand-page .spec-table td { color: rgba(247, 244, 239, 0.72); }
.hand-page .spec-table th,
.hand-page .spec-table td { border-bottom-color: rgba(247, 244, 239, 0.12); }
.hand-page .spec-table .spec-note { color: rgba(247, 244, 239, 0.4); }
.hand-page .feature-card h3 { color: #f7f4ef; border-bottom-color: rgba(247, 244, 239, 0.14); }
.hand-page .feature-card li { color: rgba(247, 244, 239, 0.66); }
.hand-page .section-divider { border-top-color: rgba(247, 244, 239, 0.12); }

/* viewer 列 → 暗色舞台 */
.hand-page .viewer-col {
  background: rgba(247, 244, 239, 0.04);
  border: 1px solid rgba(247, 244, 239, 0.12);
  border-radius: 20px;
  box-shadow: none;
}
.hand-page .viewer-canvas {
  background: radial-gradient(120% 90% at 50% 100%, #241a10 0%, #100c08 58%, #0a0908 100%);
}
.hand-page .viewer-loading { background: rgba(10, 9, 8, 0.45); color: rgba(247, 244, 239, 0.55); }
.hand-page .viewer-fullscreen { background: rgba(10, 9, 8, 0.55); color: #f7f4ef; border-color: rgba(247, 244, 239, 0.18); }

/* 关节控制面板 → 暗色玻璃 */
.hand-page .controls-panel {
  background: rgba(16, 12, 8, 0.72);
  border-top: 1px solid rgba(247, 244, 239, 0.1);
  color: #f7f4ef;
}
.hand-page .controls-panel h3 { color: #f7f4ef; }
.hand-page .controls-panel h3 .joint-count { color: rgba(247, 244, 239, 0.45); }
.hand-page .joint-row { border-bottom-color: rgba(247, 244, 239, 0.08); }
.hand-page .joint-row .label .zh { color: rgba(247, 244, 239, 0.82); }
.hand-page .joint-row .label .en { color: rgba(247, 244, 239, 0.4); }
.hand-page .joint-row .val { color: #ff9c5b; }
.hand-page .joint-row input[type=range] { background: rgba(247, 244, 239, 0.16); }
.hand-page .finger-group-header { color: rgba(247, 244, 239, 0.55); border-color: rgba(247, 244, 239, 0.12); }

/* 姿态按钮 → 暗色胶囊 */
.hand-page .preset-btn, .hand-page .mini-btn {
  background: rgba(247, 244, 239, 0.06);
  border: 1px solid rgba(247, 244, 239, 0.14);
  color: rgba(247, 244, 239, 0.78);
}
.hand-page .preset-btn:hover, .hand-page .mini-btn:hover {
  border-color: rgba(255, 105, 0, 0.5);
  color: #ff9c5b;
  background: rgba(255, 105, 0, 0.1);
}
.hand-page .preset-btn.active { background: rgba(255, 105, 0, 0.18); border-color: #ff6900; color: #ffc48a; }

/* hero CTA 次按钮 ghost 化 */
.hand-page .btn-secondary {
  background: rgba(247, 244, 239, 0.06);
  border: 1px solid rgba(247, 244, 239, 0.28);
  color: #f7f4ef;
}
.hand-page .btn-secondary:hover { border-color: rgba(247, 244, 239, 0.55); background: rgba(247, 244, 239, 0.12); color: #f7f4ef; }

/* toast 暗色 */
.hand-page .hand-toast { background: rgba(20, 15, 10, 0.92); color: #ffc48a; border: 1px solid rgba(255, 105, 0, 0.35); }

/* ============================================================
   解决方案页 v2(.solution-page)
   ============================================================ */
.solution-page {
  --label: #f7f4ef;
  --secondary: rgba(247, 244, 239, 0.62);
  --tertiary: rgba(247, 244, 239, 0.42);
  --surface: rgba(247, 244, 239, 0.05);
  --surface-strong: rgba(247, 244, 239, 0.09);
  --line: rgba(247, 244, 239, 0.14);
  background: transparent;
}
/* 所有区块透明,让流光全页贯穿(dark 段自带深色也去掉,统一交给天空层) */
.solution-page .solution-section,
.solution-page .solution-section.soft { background: transparent; }
.solution-page .solution-section.dark { background: rgba(10, 9, 8, 0.45); }

/* 顶部导航暗色化 */
.solution-page .solution-nav {
  background: rgba(10, 9, 8, 0.55);
  border-bottom: 1px solid rgba(247, 244, 239, 0.08);
}
.solution-page .solution-nav.is-scrolled { background: rgba(10, 9, 8, 0.85); box-shadow: 0 10px 34px rgba(0, 0, 0, 0.5); }
.solution-page .solution-brand { color: #f7f4ef; }
.solution-page .solution-links a { color: rgba(247, 244, 239, 0.72); }
.solution-page .solution-links a:hover,
.solution-page .solution-links a.is-active { color: #ff9c5b; }
.solution-page .nav-return {
  background: rgba(247, 244, 239, 0.06);
  border-color: rgba(247, 244, 239, 0.18);
  color: rgba(247, 244, 239, 0.8);
}
.solution-page .nav-return:hover { color: #ff9c5b; border-color: rgba(255, 105, 0, 0.4); background: rgba(255, 105, 0, 0.1); }
.solution-page .nav-toggle { background: rgba(247, 244, 239, 0.08); }
.solution-page .nav-toggle span, .solution-page .nav-toggle span::before, .solution-page .nav-toggle span::after { background: #f7f4ef; }
@media (max-width: 1040px) {
  .solution-page .solution-links { background: rgba(10, 9, 8, 0.97); }
}

/* nav logo 换白(原 logo.png 是深色底用图,v2 文件里已把 src 换为 logo-white,此处仅兜底) */
.solution-page .solution-brand img { filter: none; }

/* 区块标题/正文颜色(vars 已换,个别硬编码补刀) */
.solution-page .section-header h2,
.solution-page .copy-block h2,
.solution-page .copy-block h3 { color: #f7f4ef; }
.solution-page .copy-block > p { color: rgba(247, 244, 239, 0.62); }
.solution-page .feature-column { border-top-color: rgba(247, 244, 239, 0.16); }
.solution-page .feature-column h3 { color: #f7f4ef; }
.solution-page .feature-column p,
.solution-page .feature-column li { color: rgba(247, 244, 239, 0.6); }
.solution-page .comparison-item { border-top-color: rgba(247, 244, 239, 0.14); }
.solution-page .comparison-item strong { color: #f7f4ef; }
.solution-page .copy-list li { color: rgba(247, 244, 239, 0.66); }

/* 媒体卡/产品面板 → 暗色玻璃 */
.solution-page .solution-media { background: rgba(247, 244, 239, 0.06); border: 1px solid rgba(247, 244, 239, 0.1); }
.solution-page .solution-media.contain img { background: transparent; }
.solution-page .product-panel { background: linear-gradient(165deg, rgba(247, 244, 239, 0.06), rgba(247, 244, 239, 0.02)); border-color: rgba(247, 244, 239, 0.12); }
.solution-page .product-panel-media { background: radial-gradient(120% 90% at 50% 100%, #241a10 0%, #100c08 60%, #0a0908 100%); }
.solution-page .product-panel-copy { border-top-color: rgba(247, 244, 239, 0.12); }
.solution-page .product-panel-copy h3 { color: #f7f4ef; }
.solution-page .product-panel-copy p { color: rgba(247, 244, 239, 0.62); }
.solution-page .product-specs { border-top-color: rgba(247, 244, 239, 0.12); }
.solution-page .product-spec strong { color: #f7f4ef; }

/* 规格表/支持卡 */
.solution-page .spec-table th { color: #f7f4ef; }
.solution-page .spec-table td { color: rgba(247, 244, 239, 0.66); }
.solution-page .spec-table tr { border-bottom-color: rgba(247, 244, 239, 0.12); }
.solution-page .spec-table tr.highlight th,
.solution-page .spec-table tr.highlight td { color: #ff9c5b; }
.solution-page .support-list { background: rgba(247, 244, 239, 0.05); border: 1px solid rgba(247, 244, 239, 0.1); }
.solution-page .support-list h3 { color: #f7f4ef; }
.solution-page .support-list li { color: rgba(247, 244, 239, 0.66); }
.solution-page .section-action .solution-button.secondary {
  color: #f7f4ef; border-color: rgba(247, 244, 239, 0.2); background: rgba(247, 244, 239, 0.06);
}
.solution-page .section-action .solution-button.secondary:hover { color: #ff9c5b; border-color: rgba(255, 105, 0, 0.4); background: rgba(255, 105, 0, 0.1); }

/* 时间线/工作室(dark 段)微调 */
.solution-page .timeline::before { background: rgba(247, 244, 239, 0.16); }
.solution-page .timeline-step::before { border-color: #14100c; }
.solution-page .timeline-step h3 { color: #f7f4ef; }
.solution-page .timeline-step p { color: rgba(247, 244, 239, 0.6); }

/* 返回顶部按钮暗色 */
.solution-page .back-to-top { background: rgba(20, 15, 10, 0.85); color: #f7f4ef; border-color: rgba(247, 244, 239, 0.16); }
.solution-page .back-to-top:hover { color: #ff9c5b; }

/* ============================================================
   v2 统一顶部导航(首页/产品页/方案页共用,与 index.html 首页一致)
   ============================================================ */
.v2-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1100;
  height: 72px;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 clamp(20px, 6vw, 96px); /* 与首页各章节(.ch)左缘对齐 */
  background: linear-gradient(180deg, rgba(10, 9, 8, 0.72), rgba(10, 9, 8, 0));
  transition: background 300ms ease;
}
.v2-nav.is-scrolled { background: rgba(10, 9, 8, 0.86); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); border-bottom: 1px solid rgba(247, 244, 239, 0.14); }
.v2-brand { display: flex; align-items: center; gap: 16px; font-size: 20px; font-weight: 700; letter-spacing: -0.02em; color: #f7f4ef; }
.v2-brand img { height: 38px; width: auto; }
.v2-links { display: flex; gap: clamp(18px, 2.6vw, 36px); font-size: 14px; margin-inline: auto; } /* auto 边距吸掉两侧空余:品牌靠左、链接居中、按钮组靠右 */
.v2-links a { color: rgba(247, 244, 239, 0.62); transition: color 200ms; padding: 6px 0; }
.v2-links a:hover, .v2-links a.active { color: #ff9c5b; }
.v2-classic {
  font-size: 12.5px; font-weight: 600; white-space: nowrap;
  padding: 8px 16px; border: 1px solid rgba(247, 244, 239, 0.14); border-radius: 999px;
  color: rgba(247, 244, 239, 0.62); transition: all 200ms;
}
.v2-classic:hover { color: #ff9c5b; border-color: rgba(255, 105, 0, 0.4); }
/* 中英文切换(预留):英文版上线前点击 EN 弹提示,逻辑见 fx/lang-toggle.js */
.v2-lang {
  display: inline-flex; align-items: center; gap: 6px;
  margin-left: 10px;
  font-size: 12.5px; font-weight: 650; letter-spacing: 0.04em;
  padding: 8px 14px; border: 1px solid rgba(247, 244, 239, 0.14); border-radius: 999px;
  color: rgba(247, 244, 239, 0.5); background: transparent; cursor: pointer;
  transition: all 200ms;
}
.v2-lang:hover { border-color: rgba(255, 105, 0, 0.4); background: rgba(255, 105, 0, 0.08); }
.v2-lang-opt.is-on { color: #ff9c5b; }
.v2-lang-div { opacity: 0.35; }
.v2-lang-toast {
  position: fixed; top: 84px; left: 50%; z-index: 1200;
  transform: translate(-50%, -8px); opacity: 0; pointer-events: none;
  padding: 10px 22px; border-radius: 999px;
  background: rgba(20, 18, 16, 0.92); border: 1px solid rgba(255, 105, 0, 0.35);
  color: #f7f4ef; font-size: 13px; letter-spacing: 0.02em;
  transition: opacity 250ms ease, transform 250ms ease;
}
.v2-lang-toast.show { opacity: 1; transform: translate(-50%, 0); }
@media (max-width: 820px) { .v2-links { display: none; } }
/* 手机端导航收窄:品牌/按钮/语言切换按比例缩小,防止 HeymanDex 长文本挤折 CTA */
@media (max-width: 560px) {
  .v2-nav { height: 60px; padding: 0 16px; }
  .v2-brand { gap: 10px; }
  .v2-brand img { height: 30px; }
  .v2-brand .brand-swap-line { font-size: 13px; }
  .v2-classic { padding: 6px 12px; font-size: 12px; }
  .v2-lang { padding: 6px 10px; margin-left: 6px; font-size: 12px; }
}
/* 产品页/方案页内容让出导航高度 */
.hand-page main, .solution-page main { position: relative; z-index: 1; }
/* footer 在 main 之外,需同样压过固定流光层 #fxSky(z-index:0),否则内容被画布盖住 */
.hand-page .footer, .solution-page .footer { position: relative; z-index: 1; }

/* ============================================================
   统一修复:剩余实心卡片玻璃化 + 占位图暗色适配
   ============================================================ */
/* 灰占位图在暗色页太亮(亮色大板),压暗融入;只匹配占位 svg,不动真实照片 */
img[src*="image-placeholder"] { filter: brightness(0.42) contrast(1.02) sepia(0.14); }

/* 工作室/集成功格(studio-grid):#111 实心 → 毛玻璃 + hover */
.solution-page .studio-item {
  background: linear-gradient(165deg, rgba(247, 244, 239, 0.07), rgba(247, 244, 239, 0.02));
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1), background 300ms ease;
}
.solution-page .studio-item:hover {
  transform: translateY(-5px);
  background: linear-gradient(165deg, rgba(255, 105, 0, 0.1), rgba(247, 244, 239, 0.03));
}

/* 视频壳/序列图补一道暗色描边,融入暗色页 */
.solution-page .video-shell { border: 1px solid rgba(247, 244, 239, 0.12); }
.solution-page .sequence-image { background: rgba(247, 244, 239, 0.05); border: 1px solid rgba(247, 244, 239, 0.1); }

/* ============================================================
   遮罩行循环切换(hero 多语言 / 导航品牌名共用)
   ============================================================ */
.swap-wrap { display: inline-block; overflow: hidden; vertical-align: bottom; }
.swap-line { display: inline-block; will-change: transform, opacity, filter; }
.swap-line.long { font-size: 0.62em; letter-spacing: -0.02em; }
.swap-line.swap-out { transform: translateY(-112%); opacity: 0; filter: blur(6px); transition: transform 560ms cubic-bezier(0.16, 1, 0.3, 1), opacity 480ms ease, filter 560ms ease; }
.swap-line.swap-pre { transition: none; transform: translateY(112%); opacity: 0; filter: blur(6px); }
.swap-line.swap-in { transform: none; opacity: 1; filter: none; transition: transform 680ms cubic-bezier(0.16, 1, 0.3, 1), opacity 500ms ease 60ms, filter 680ms ease; }
@media (prefers-reduced-motion: reduce) { .swap-line { transition: none !important; transform: none !important; opacity: 1 !important; filter: none !important; } }

/* 导航品牌区:图形标 + 文字名循环 */
.v2-brand .swap-wrap { display: flex; align-items: center; } /* flex 居中,消除 inline 基线偏移 */
.v2-brand .brand-swap-line { font-size: 15px; font-weight: 700; letter-spacing: 0.01em; color: #f7f4ef; }

/* 导航品牌美术字帧(图片版循环) */
.v2-brand .brand-swap-img { height: 22px; width: auto; }