/* ═══════════════════════════════════════════════════════════════
   SO WIZARD — Premium Refinement Layer
   对标 Kimi / DeepSeek / Linear 的高端商业软件质感
   在 styles.css 之后加载，逐组件提升精致度
   ═══════════════════════════════════════════════════════════════ */

/* ── 噪点纹理：降低强度，更克制 ── */
body::before { opacity: 0.018; }

/* ═══ 1. 顶部公告 — 更精致的胶囊式 ─═ */
.announcement {
  background: rgba(15,18,32,0.88);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(74,124,255,0.22);
  font-weight: 500;
}

/* ═══ 2. 顶部导航 — 玻璃拟态精修 ─═ */
.top-nav.scrolled {
  background: rgba(8,9,12,0.72);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 1px 0 rgba(255,255,255,0.03) inset, 0 8px 32px rgba(0,0,0,0.3);
}
.top-nav .logo {
  background: linear-gradient(135deg, #fff 0%, rgba(244,245,248,0.7) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.top-nav .nav-links a {
  transition: color 0.3s var(--ease), opacity 0.3s var(--ease);
}
.top-nav .nav-links a:hover { color: var(--white); opacity: 1; }
.top-nav .nav-cta {
  position: relative;
  padding: 9px 18px;
  border: 1px solid var(--line-hover);
  border-radius: 8px;
  background: rgba(255,255,255,0.03);
  transition: all 0.35s var(--ease);
}
.top-nav .nav-cta:hover {
  background: rgba(74,124,255,0.12);
  border-color: rgba(74,124,255,0.4);
  opacity: 1;
  box-shadow: 0 0 20px rgba(74,124,255,0.15);
}
.top-nav .nav-cta:hover .arrow { transform: translateX(4px); }

/* ═══ 3. Hero — 首屏质感跃升 ─═ */
.hero h1 {
  font-weight: 300;
  letter-spacing: -0.028em;
  font-feature-settings: 'ss01','ss02';
}
.hero h1 .accent {
  background: linear-gradient(135deg, var(--accent-bright) 0%, var(--accent-soft) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 400;
}
.hero-label {
  padding: 6px 14px;
  border: 1px solid var(--line);
  border-radius: 100px;
  background: rgba(255,255,255,0.02);
  backdrop-filter: blur(8px);
  display: inline-flex;
  align-items: center;
  margin-bottom: 40px;
}
/* Hero CTA — 精致渐变按钮 */
.hero-cta {
  background: linear-gradient(135deg, var(--accent) 0%, var(--accent-bright) 100%);
  border: 1px solid rgba(109,150,255,0.3);
  box-shadow: 0 4px 16px rgba(74,124,255,0.25), inset 0 1px 0 rgba(255,255,255,0.12);
  border-radius: 8px;
  padding: 13px 28px;
}
.hero-cta:hover {
  filter: none;
  background: linear-gradient(135deg, var(--accent-bright) 0%, var(--accent-soft) 100%);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(74,124,255,0.4), inset 0 1px 0 rgba(255,255,255,0.18);
  border-color: rgba(109,150,255,0.5);
}
.hero-cta-secondary {
  padding: 13px 22px;
  border: 1px solid transparent;
  border-radius: 8px;
  transition: all 0.3s var(--ease);
}
.hero-cta-secondary:hover {
  color: var(--white);
  background: rgba(255,255,255,0.04);
  border-color: var(--line);
}
/* Hero mockup 窗口更精致 */
.hero-mockup .mockup-frame {
  background: linear-gradient(180deg, var(--charcoal-2) 0%, var(--charcoal) 100%);
  border: 1px solid var(--line-hover);
  box-shadow: 0 60px 120px rgba(0,0,0,0.7), 0 0 80px rgba(74,124,255,0.06),
    inset 0 1px 0 rgba(255,255,255,0.04);
}
.heartbeat-panel {
  background: rgba(14,16,21,0.72);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border: 1px solid var(--line-hover);
  box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255,255,255,0.04);
}

/* ═══ 4. 通用标签 .tag — 胶囊式 ─═ */
.what-header .tag,
.eco-header .tag,
.dare-header .tag,
.numbers-header .tag,
.method-header .tag,
.apply-header .tag,
.tech-header .tag,
.voices-header .tag,
.collab-header .tag,
.product-header .tag {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  border: 1px solid var(--line);
  border-radius: 100px;
  background: rgba(74,124,255,0.06);
  color: var(--accent-bright);
  font-weight: 500;
  letter-spacing: 0.14em;
}

/* ═══ 5. 标题层级精修 ─═ */
.what-header h2,
.eco-header h2,
.dare-header h2,
.method-header h2,
.apply-header h2,
.tech-header h2,
.voices-header h2,
.collab-header h2,
.bizmodel-header h2,
.product-header h2 {
  letter-spacing: -0.025em;
  font-feature-settings: 'ss01';
}
.what-header h2 .accent,
.eco-header h2 .accent,
.dare-header .dare-intro .accent,
.method-header h2 .accent,
.apply-header h2 .accent,
.tech-header h2 .accent,
.collab-header h2 .accent,
.bizmodel-header h2 .accent,
.product-header h2 .accent {
  background: linear-gradient(135deg, var(--accent-bright) 0%, var(--accent-soft) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ═══ 6. 卡片体系 — 精致的分层与悬停 ─═ */
/* what-card / apply-card / empire-city-card 通用精修 */
.what-card,
.apply-card,
.empire-city-card {
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,255,255,0.012) 0%, transparent 100%);
  transition: all 0.45s var(--ease);
  position: relative;
}
.what-card::before,
.apply-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(74,124,255,0.4), transparent);
  opacity: 0;
  transition: opacity 0.45s var(--ease);
}
.what-card:hover,
.apply-card:hover {
  background: linear-gradient(180deg, rgba(74,124,255,0.05) 0%, rgba(255,255,255,0.01) 100%);
  border-color: rgba(74,124,255,0.25);
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
  z-index: 2;
}
.what-card:hover::before,
.apply-card:hover::before { opacity: 1; }
.what-card .what-icon { transition: transform 0.45s var(--ease); }
.what-card:hover .what-icon { transform: scale(1.08); }

/* empire-city-card 悬停顶条更精致 */
.empire-city-card:hover {
  background: linear-gradient(180deg, rgba(255,255,255,0.025) 0%, transparent 100%);
  border-color: var(--line-hover);
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
}

/* ═══ 7. 产品展示窗口 — 真实的软件质感 ─═ */
.mockup-window {
  border: 1px solid var(--line-hover);
  border-radius: 14px;
  overflow: hidden;
  background: var(--charcoal);
  box-shadow: var(--shadow-xl), 0 0 60px rgba(74,124,255,0.06),
    inset 0 1px 0 rgba(255,255,255,0.05);
}
.window-bar {
  background: linear-gradient(180deg, var(--charcoal-3) 0%, var(--charcoal-2) 100%) !important;
  border-bottom: 1px solid var(--line) !important;
}
.window-dot { box-shadow: 0 0 0 1px rgba(0,0,0,0.2) inset; }
.window-title {
  font-size: 11px;
  color: var(--white-40);
  letter-spacing: 0.08em;
  margin-left: auto;
  margin-right: auto;
  font-weight: 500;
  padding-right: 60px;
}
/* KPI 卡片 */
.dash-card {
  background: rgba(255,255,255,0.02);
  border: 1px solid var(--line);
  border-radius: 10px;
  transition: all 0.3s var(--ease);
}
.dash-card:hover {
  background: rgba(74,124,255,0.05);
  border-color: rgba(74,124,255,0.2);
}
.dash-value {
  font-feature-settings: 'tnum';
  letter-spacing: -0.02em;
}
.dash-trend.up { color: var(--green); }

/* 进销存表格 */
.inv-row { transition: background 0.2s; }
.inv-row:hover { background: rgba(255,255,255,0.02); }
.inv-tab {
  transition: all 0.25s var(--ease);
  border-radius: 6px;
}
.inv-tab.active {
  background: rgba(74,124,255,0.12);
  color: var(--accent-bright);
}
.ai-badge {
  background: linear-gradient(135deg, var(--accent), var(--accent-soft));
  box-shadow: 0 0 12px rgba(74,124,255,0.3);
  font-weight: 600;
  letter-spacing: 0.05em;
}

/* CRM */
.crm-avatar {
  background: linear-gradient(135deg, var(--accent), var(--accent-soft)) !important;
  font-weight: 600;
}
.crm-tag.vip {
  background: linear-gradient(135deg, #F59E0B, #F97316) !important;
}

/* 异业合作地图节点 */
.map-node.self {
  background: linear-gradient(135deg, var(--accent), var(--accent-bright)) !important;
  box-shadow: 0 0 20px rgba(74,124,255,0.5) !important;
}

/* ═══ 8. 数字矩阵 — 大数字更克制精致 ─═ */
.numbers-grid .num-value {
  font-feature-settings: 'tnum','ss01';
  letter-spacing: -0.04em;
  background: linear-gradient(180deg, var(--white) 0%, var(--white-60) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.numbers-grid .num-block.glow {
  box-shadow: 0 0 60px rgba(74,124,255,0.12);
}
/* 移除廉价 glitch 闪烁 */
@keyframes num-flash {
  0% { transform: translateX(0); text-shadow: none; }
  50% { transform: translateX(0); color: var(--accent-bright); }
  100% { transform: translateX(0); text-shadow: none; }
}
@keyframes data-glitch {
  0%, 100% { text-shadow: none; transform: translateX(0); }
}

/* ═══ 9. 帝国版图 — 统一为精致单色+靛蓝体系 ─═ */
/* 四城邦颜色柔化，避免马戏感 */
.empire-city-dot { box-shadow: 0 0 16px var(--c), 0 0 36px var(--c); }
.empire-block {
  background: rgba(20,23,31,0.92) !important;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(74,124,255,0.35) !important;
  box-shadow: 0 0 14px rgba(74,124,255,0.12), inset 0 1px 0 rgba(255,255,255,0.05) !important;
}
.empire-block:hover {
  border-color: var(--accent-bright) !important;
  background: rgba(74,124,255,0.18) !important;
  box-shadow: 0 0 28px rgba(74,124,255,0.4) !important;
}
.empire-core {
  background: radial-gradient(circle at 50% 40%, rgba(74,124,255,0.95), rgba(40,50,120,0.95));
  box-shadow: 0 0 60px rgba(74,124,255,0.4), 0 0 140px rgba(74,124,255,0.18),
    inset 0 1px 0 rgba(255,255,255,0.1);
}
/* 背景粒子降低饱和，统一色系 */
.eco-section::after {
  background-image:
    radial-gradient(1px 1px at 15% 25%, rgba(74,124,255,0.35), transparent),
    radial-gradient(1px 1px at 85% 35%, rgba(109,150,255,0.25), transparent),
    radial-gradient(1px 1px at 75% 75%, rgba(74,124,255,0.2), transparent),
    radial-gradient(1px 1px at 25% 85%, rgba(74,124,255,0.22), transparent),
    radial-gradient(1.5px 1.5px at 90% 20%, rgba(109,150,255,0.25), transparent),
    radial-gradient(1px 1px at 10% 60%, rgba(74,124,255,0.3), transparent),
    radial-gradient(1px 1px at 95% 55%, rgba(74,124,255,0.18), transparent),
    radial-gradient(1.5px 1.5px at 50% 15%, rgba(74,124,255,0.25), transparent),
    radial-gradient(1px 1px at 60% 90%, rgba(109,150,255,0.18), transparent),
    radial-gradient(1px 1px at 35% 50%, rgba(74,124,255,0.18), transparent),
    radial-gradient(1px 1px at 80% 65%, rgba(74,124,255,0.2), transparent),
    radial-gradient(1px 1px at 20% 40%, rgba(109,150,255,0.16), transparent),
    radial-gradient(1px 1px at 92% 80%, rgba(74,124,255,0.18), transparent),
    radial-gradient(1px 1px at 8% 15%, rgba(74,124,255,0.25), transparent),
    radial-gradient(1px 1px at 96% 10%, rgba(109,150,255,0.16), transparent),
    radial-gradient(1px 1px at 5% 75%, rgba(74,124,255,0.16), transparent),
    radial-gradient(1.5px 1.5px at 97% 45%, rgba(74,124,255,0.25), transparent),
    radial-gradient(1px 1px at 3% 35%, rgba(74,124,255,0.2), transparent),
    radial-gradient(1px 1px at 88% 92%, rgba(109,150,255,0.2), transparent),
    radial-gradient(1px 1px at 45% 80%, rgba(74,124,255,0.16), transparent),
    radial-gradient(1px 1px at 55% 20%, rgba(74,124,255,0.16), transparent),
    radial-gradient(1px 1px at 70% 50%, rgba(74,124,255,0.14), transparent),
    radial-gradient(1px 1px at 30% 65%, rgba(74,124,255,0.16), transparent),
    radial-gradient(1px 1px at 93% 70%, rgba(109,150,255,0.16), transparent);
}

/* ═══ 10. 方法论 / 应用场景 — 行悬停更精致 ─═ */
.method-list .method-item:hover {
  background: linear-gradient(90deg, rgba(74,124,255,0.04), transparent);
}
.method-item:hover .method-num {
  background: linear-gradient(135deg, var(--accent-bright), var(--accent-soft));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.method-num { font-feature-settings: 'tnum'; }

/* ═══ 11. 技术架构 — 层级卡片 ─═ */
.arch-layer {
  background: rgba(255,255,255,0.015);
  border: 1px solid var(--line);
  border-radius: 14px;
  backdrop-filter: blur(8px);
  transition: all 0.4s var(--ease);
}
.arch-layer:hover {
  border-color: rgba(74,124,255,0.25);
  background: rgba(74,124,255,0.03);
  box-shadow: var(--shadow-md);
}
.arch-mod {
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--line);
  border-radius: 8px;
  transition: all 0.3s var(--ease);
  font-weight: 500;
}
.arch-mod:hover {
  background: rgba(74,124,255,0.1);
  border-color: rgba(74,124,255,0.3);
  color: var(--accent-bright);
  transform: translateY(-1px);
}
.arch-mod.arch-ai {
  background: linear-gradient(135deg, rgba(74,124,255,0.12), rgba(74,124,255,0.08));
  border-color: rgba(74,124,255,0.25);
  color: var(--accent-bright);
}
.arch-connector {
  background: linear-gradient(180deg, rgba(74,124,255,0.3), rgba(74,124,255,0.05));
}

/* 技术能力卡片 */
.tech-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.015) 0%, transparent 100%);
  border: 1px solid var(--line);
  border-radius: 14px;
  transition: all 0.45s var(--ease);
  position: relative;
  overflow: hidden;
}
.tech-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(74,124,255,0.4), transparent);
  opacity: 0;
  transition: opacity 0.45s var(--ease);
}
.tech-card:hover {
  background: linear-gradient(180deg, rgba(74,124,255,0.05) 0%, rgba(255,255,255,0.005) 100%);
  border-color: rgba(74,124,255,0.25);
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}
.tech-card:hover::before { opacity: 1; }
.tech-card .tech-icon { transition: transform 0.5s var(--ease); }
.tech-card:hover .tech-icon { transform: scale(1.1) translateY(-2px); }
.spec-row {
  border-bottom: 1px solid rgba(255,255,255,0.04) !important;
}
.spec-val {
  font-feature-settings: 'tnum';
  color: var(--white-80) !important;
}
/* 技术栈标签 */
.stack-item {
  padding: 8px 16px;
  border: 1px solid var(--line);
  border-radius: 100px;
  background: rgba(255,255,255,0.02);
  font-size: 13px;
  color: var(--white-60);
  transition: all 0.3s var(--ease);
  font-weight: 500;
}
.stack-item:hover {
  background: rgba(74,124,255,0.1);
  border-color: rgba(74,124,255,0.3);
  color: var(--accent-bright);
  transform: translateY(-1px);
}

/* ═══ 12. 客户证言 — 卡片化 ─═ */
.voice-card {
  padding: 32px 40px;
  border-left: 1px solid var(--line);
  transition: all 0.4s var(--ease);
}
.voice-card:hover {
  transform: translateY(-4px);
}
.voice-card .vc-quote {
  letter-spacing: -0.015em;
  line-height: 1.45;
}
.voice-card .vc-metric {
  font-feature-settings: 'tnum';
}

/* ═══ 13. 加入表单 — 精致输入 ─═ */
.collab-form .field input,
.collab-form .field select {
  border-bottom: 1px solid var(--gray-dark);
  transition: border-color 0.35s var(--ease);
  padding: 10px 0;
}
.collab-form .field input:focus,
.collab-form .field select:focus {
  border-bottom-color: var(--accent-bright);
}
.collab-form .field input::placeholder { color: rgba(244,245,248,0.2); }
.collab-submit {
  padding: 14px 28px;
  border: 1px solid var(--line-hover);
  border-radius: 8px;
  background: linear-gradient(135deg, var(--accent), var(--accent-bright));
  box-shadow: 0 4px 16px rgba(74,124,255,0.25), inset 0 1px 0 rgba(255,255,255,0.12);
  transition: all 0.35s var(--ease);
}
.collab-submit:hover {
  opacity: 1;
  background: linear-gradient(135deg, var(--accent-bright), var(--accent-soft));
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(74,124,255,0.4), inset 0 1px 0 rgba(255,255,255,0.18);
}
.join-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.015) 0%, transparent 100%);
  border: 1px solid var(--line);
  border-radius: 14px;
  transition: all 0.45s var(--ease);
}
.join-card:hover {
  background: linear-gradient(180deg, rgba(74,124,255,0.05) 0%, rgba(255,255,255,0.005) 100%);
  border-color: rgba(74,124,255,0.25);
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}
.join-cta {
  color: var(--accent-bright);
  font-weight: 600;
  transition: gap 0.3s var(--ease);
}

/* ═══ 14. 产品展示 CTA / 通用按钮 ─═ */
.product-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 32px;
  background: linear-gradient(135deg, var(--accent), var(--accent-bright));
  border: 1px solid rgba(109,150,255,0.3);
  border-radius: 8px;
  color: var(--white);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.04em;
  box-shadow: 0 4px 16px rgba(74,124,255,0.25), inset 0 1px 0 rgba(255,255,255,0.12);
  transition: all 0.35s var(--ease);
}
.product-cta-btn:hover {
  background: linear-gradient(135deg, var(--accent-bright), var(--accent-soft));
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(74,124,255,0.4), inset 0 1px 0 rgba(255,255,255,0.18);
}
.sf-item {
  padding: 6px 12px;
  border: 1px solid var(--line);
  border-radius: 100px;
  background: rgba(255,255,255,0.02);
  font-size: 12px;
  transition: all 0.3s var(--ease);
}
.sf-item svg { color: var(--accent-bright) !important; stroke: var(--accent-bright) !important; }
.sf-item svg circle, .sf-item svg path { stroke: var(--accent-bright) !important; }

/* ═══ 15. 流程图 / 商业模式 ─═ */
.flow-icon-wrap {
  background: linear-gradient(180deg, var(--charcoal-2), var(--charcoal)) !important;
  border: 1px solid var(--line-hover) !important;
  box-shadow: var(--shadow-sm), inset 0 1px 0 rgba(255,255,255,0.04);
}
.flow-step:hover .flow-icon-wrap {
  border-color: rgba(74,124,255,0.35) !important;
  background: linear-gradient(180deg, rgba(74,124,255,0.08), var(--charcoal)) !important;
  box-shadow: var(--shadow-md), 0 0 20px rgba(74,124,255,0.12);
}
.pyramid-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.015) 0%, transparent 100%);
  border: 1px solid var(--line);
  border-radius: 14px;
  transition: all 0.45s var(--ease);
}
.pyramid-card:hover {
  border-color: rgba(74,124,255,0.25);
  background: linear-gradient(180deg, rgba(74,124,255,0.05) 0%, transparent 100%);
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
}

/* ═══ 16. Footer ─═ */
.footer-big {
  letter-spacing: -0.028em;
}
.footer-col a {
  transition: color 0.3s var(--ease), transform 0.3s var(--ease);
  display: inline-block;
}
.footer-col a:hover {
  color: var(--white);
  transform: translateX(3px);
}
.system-status .status-dot {
  box-shadow: 0 0 8px rgba(16,185,129,0.5);
}

/* ═══ 17. 滚动条精修 ─═ */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--black); }
::-webkit-scrollbar-thumb {
  background: rgba(74,124,255,0.25);
  border-radius: 100px;
  border: 2px solid var(--black);
}
::-webkit-scrollbar-thumb:hover { background: rgba(74,124,255,0.45); }
html { scrollbar-width: thin; scrollbar-color: rgba(74,124,255,0.25) var(--black); }

/* ═══ 18. 选中态 / 焦点 ─═ */
::selection {
  background: rgba(74,124,255,0.3);
  color: var(--white);
}
*:focus-visible {
  outline: 2px solid var(--accent-bright);
  outline-offset: 3px;
  border-radius: 4px;
}

/* ═══ 19. 加载屏精修 ─═ */
#loader .loader-text {
  letter-spacing: 0.2em;
}
#loader .loader-text span {
  background: linear-gradient(135deg, var(--accent-bright), var(--accent-soft));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ═══ 20. reveal 动画更顺滑 ─═ */
.reveal-up.visible {
  transition: opacity 1.1s var(--ease-power), transform 1.1s var(--ease-power);
}

/* ═══ 21. 骨架屏精修 ─═ */
.skeleton {
  background: linear-gradient(90deg, var(--gray-darker) 0%, var(--gray-dark) 50%, var(--gray-darker) 100%);
  background-size: 200% 100%;
  animation: skeleton-shimmer 1.5s infinite;
}
@keyframes skeleton-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ═══ 22. 大屏字号微调 ─═ */
@media (min-width: 1600px) {
  .hero h1 { letter-spacing: -0.032em; }
}

/* ═══ 23. 商业模式 — 佣金卡 / 联盟云 ─═ */
.commission-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.015) 0%, transparent 100%);
  border: 1px solid var(--line);
  border-radius: 14px;
  transition: all 0.45s var(--ease);
  position: relative;
  overflow: hidden;
}
.commission-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(74,124,255,0.4), transparent);
  opacity: 0;
  transition: opacity 0.45s var(--ease);
}
.commission-card:hover {
  border-color: rgba(74,124,255,0.25);
  background: linear-gradient(180deg, rgba(74,124,255,0.05) 0%, transparent 100%);
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}
.commission-card:hover::before { opacity: 1; }
.comm-rate {
  background: linear-gradient(135deg, var(--accent-bright), var(--accent-soft));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-feature-settings: 'tnum';
}

/* 联盟云标签 */
.cloud-tag {
  background: rgba(20,23,31,0.8);
  backdrop-filter: blur(10px);
  border: 1px solid var(--line);
  border-radius: 100px;
  font-weight: 500;
  transition: all 0.35s var(--ease);
}
.cloud-tag:hover {
  border-color: rgba(74,124,255,0.35);
  background: rgba(74,124,255,0.12);
  color: var(--accent-bright);
}
.cloud-center {
  background: linear-gradient(135deg, rgba(74,124,255,0.15), rgba(74,124,255,0.08));
  border: 1px solid rgba(74,124,255,0.3);
  box-shadow: 0 0 40px rgba(74,124,255,0.15), inset 0 1px 0 rgba(255,255,255,0.05);
}

/* 运营商申请区 */
.alliance-apply {
  background: linear-gradient(180deg, rgba(255,255,255,0.015) 0%, transparent 100%);
  border: 1px solid var(--line);
  border-radius: 16px;
  transition: all 0.45s var(--ease);
}
.alliance-apply:hover {
  border-color: rgba(74,124,255,0.2);
  box-shadow: var(--shadow-lg);
}
.alliance-form .field input,
.alliance-form .field select {
  background: var(--charcoal-2);
  border: 1px solid var(--line);
  transition: all 0.3s var(--ease);
}
.alliance-form .field input:focus,
.alliance-form .field select:focus {
  border-color: var(--accent-bright);
  background: var(--charcoal);
  box-shadow: 0 0 0 3px rgba(74,124,255,0.12);
}
.alliance-submit {
  background: linear-gradient(135deg, var(--accent), var(--accent-bright));
  border: 1px solid rgba(109,150,255,0.3);
  box-shadow: 0 4px 16px rgba(74,124,255,0.25), inset 0 1px 0 rgba(255,255,255,0.12);
  transition: all 0.35s var(--ease);
}
.alliance-submit:hover {
  background: linear-gradient(135deg, var(--accent-bright), var(--accent-soft));
  color: var(--white);
  border-color: rgba(109,150,255,0.5);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(74,124,255,0.4), inset 0 1px 0 rgba(255,255,255,0.18);
}

/* 核心环 */
.core-ring {
  background: linear-gradient(135deg, rgba(74,124,255,0.12), rgba(74,124,255,0.06));
  border: 1px solid rgba(74,124,255,0.25);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
}

/* ═══ 24. 产品展示展示区头部 ─═ */
.product-header h2 {
  letter-spacing: -0.025em;
}
.showcase-num {
  font-feature-settings: 'tnum';
  color: var(--accent-bright);
  letter-spacing: 0.06em;
}
.showcase-features .sf-item svg circle,
.showcase-features .sf-item svg path {
  stroke: var(--accent-bright) !important;
}
.dash-card.dash-alert .alert-dot {
  background: var(--red);
  box-shadow: 0 0 8px rgba(244,63,94,0.5);
}
.inv-status.low { background: rgba(244,63,94,0.12); color: var(--red); }
.inv-status.ok { background: rgba(16,185,129,0.12); color: var(--green); }

/* ═══ 25. 自定义光标更精致 ─═ */
.cursor-dot {
  transition: width 0.3s var(--ease), height 0.3s var(--ease),
    background 0.3s, border 0.3s, opacity 0.3s;
}
.cursor-dot.hover {
  border-color: rgba(109,150,255,0.6);
}

/* ═══ 26. 滚动进度条 ─═ */
.scroll-progress {
  position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 9997;
  background: transparent;
}
.scroll-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, var(--accent), var(--accent-bright), var(--accent-soft));
  box-shadow: 0 0 10px rgba(74,124,255,0.5);
  transition: width 0.1s linear;
}