/* =============================================================
   徐州缘启网络技术有限公司 · 设计令牌层 (Design Tokens)
   方向：精密科技 / Precision Tech —— 深空蓝底 + 电光蓝青强调
   所有颜色、字阶、间距、圆角、阴影、动效统一在此，组件层禁止硬编码。
   ============================================================= */
:root {
  color-scheme: dark;

  /* ---- 表面与背景（深空蓝，营造高端科技氛围）---- */
  --color-bg:        #060A14;   /* 主背景：近黑深蓝 */
  --color-bg-2:      #0A1124;   /* 次级背景 */
  --color-surface:   #0D1426;   /* 卡片表面 */
  --color-surface-2: #121B33;   /* 抬升表面 */
  --color-surface-3: #18243f;   /* 更高抬升 / hover */

  /* ---- 文本 ---- */
  --color-text:   #E9EFFB;   /* 主文本：冷白 */
  --color-muted:  #8A96B8;   /* 次要文本 */
  --color-faint:  #5C688A;   /* 极弱文本 / 注脚 */

  /* ---- 强调色（品牌蓝 = logo 同色 #1E7FE8；AI 紫作为智能专区点缀）---- */
  --color-accent:        #1E7FE8;  /* 品牌蓝（logo 同色），主强调 */
  --color-accent-strong: #0B53D6;  /* 深蓝，渐变收尾 */
  --color-accent-2:      #7C6CFF;  /* AI 紫，AI 专区 / 智能节点点缀 */
  --color-cyan:          #5BE0FF;  /* 青色高光，用于能量点 */
  --color-accent-soft:   rgba(30,127,232,.14);
  --color-accent-line:   rgba(30,127,232,.30);
  /* AI 智能渐变（蓝→紫→青），仅用于 AI 专区与智能节点 */
  --grad-ai: linear-gradient(120deg, #1E7FE8 0%, #7C6CFF 52%, #5BE0FF 100%);

  /* ---- 强调色上的前景（暗底深字 / 亮底白字）---- */
  --color-on-accent: #04101F;
  --color-selection: #FFFFFF;   /* 选中文本前景 */

  /* ---- 氛围与辉光（随主题切换，暗色强、亮色淡）---- */
  --glow-1:    rgba(30,127,232,.20);   /* 主辉光 */
  --glow-2:    rgba(91,224,255,.14);   /* 青色高光 */
  --glow-3:    rgba(30,127,232,.14);   /* 底部辉光 */
  --glow-accent: rgba(124,108,255,.16);/* AI 紫辉光 */
  --grid-line: rgba(233,239,251,.035); /* 蓝图网格线 */
  --scan-line: rgba(91,224,255,.05);   /* 扫描线 */
  --surface-glass: rgba(6,10,20,.72);  /* 吸顶导航 / 抽屉 */
  --veil:          rgba(6,10,20,.55);  /* 封面遮罩 */
  --grad-end:      #FFFFFF;            /* 标题渐变收尾 */
  --net-line:      rgba(124,108,255,.28); /* AI 神经网络连线 */

  /* ---- Hero 渐变光斑（替代原粒子连线）---- */
  --blob-1: rgba(30,127,232,.30);
  --blob-2: rgba(124,108,255,.22);
  --blob-3: rgba(91,224,255,.13);

  /* ---- 玻璃拟态（卡片层）---- */
  --glass-bg:             rgba(13,20,38,.55);
  --glass-bg-hover:       rgba(18,27,51,.72);
  --glass-border:         rgba(233,239,251,.12);
  --glass-border-hover:   rgba(30,127,232,.42);
  --glass-blur: 16px;
  --glass-inner: rgba(233,239,251,.09);   /* 玻璃顶沿内高光 */
  --sheen: linear-gradient(100deg, transparent 22%, rgba(233,239,251,.06) 44%, rgba(91,224,255,.10) 52%, transparent 74%);

  /* ---- 描边 / 分隔 ---- */
  --color-line:        rgba(233,239,251,.10);
  --color-line-strong: rgba(233,239,251,.20);

  /* ---- 圆角 ---- */
  --radius-sm: 6px;
  --radius-md: 14px;
  --radius-lg: 24px;
  --radius-xl: 34px;
  --radius-pill: 999px;

  /* ---- 间距梯度（4 / 8 / 16 / 24 / 40 / 64 / 96 / 128）---- */
  --space-1: 4px;  --space-2: 8px;  --space-3: 16px; --space-4: 24px;
  --space-5: 40px; --space-6: 64px; --space-7: 96px; --space-8: 128px;

  /* ---- 阴影层级（带环境蓝调，非纯黑）---- */
  --shadow-1: 0 2px 10px rgba(2,8,20,.45);
  --shadow-2: 0 12px 36px rgba(2,8,20,.55);
  --shadow-3: 0 28px 72px rgba(2,8,20,.65);
  --glow:    0 0 0 1px rgba(30,127,232,.22), 0 0 44px rgba(30,127,232,.16);

  /* ---- 动效 ---- */
  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-spring: cubic-bezier(.34,1.4,.64,1);
  --dur-fast: 160ms;
  --dur-base: 340ms;
  --dur-slow: 680ms;

  /* ---- 字体（展示字 Sora + 正文 Manrope，中文回落思源/苹方/雅黑）---- */
  --font-display: "Sora", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-body:    "Manrope", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;

  /* ---- 布局 ---- */
  --maxw: 1280px;
  --nav-h: 72px;
}

/* 浅色主题（站点默认）。
   - data-theme="light"  ：正常路径，由内联脚本写入
   - :root:not([data-theme])：兜底，脚本未执行时也按亮色渲染，不会闪回深色
   切到暗色时 data-theme="dark"，本块不再命中，变量回落 :root 的深色值。 */
[data-theme="light"],
:root:not([data-theme]) {
  --color-bg: #F4F7FE;
  --color-bg-2: #FFFFFF;
  --color-surface: #FFFFFF;
  --color-surface-2: #EEF3FC;
  --color-surface-3: #E4ECFA;
  --color-text: #0C1428;
  --color-muted: #4A577A;
  --color-faint: #74809F;
  --color-accent-soft:   rgba(30,127,232,.10);
  --color-accent-line:   rgba(30,127,232,.26);
  --color-line: rgba(12,20,40,.10);
  --color-line-strong: rgba(12,20,40,.20);
  --shadow-1: 0 2px 10px rgba(20,40,90,.08);
  --shadow-2: 0 12px 36px rgba(20,40,90,.12);
  --shadow-3: 0 28px 72px rgba(20,40,90,.16);
  --glow:    0 0 0 1px rgba(30,127,232,.18), 0 0 24px rgba(30,127,232,.10);

  /* 强调色上的前景改为白字 */
  --color-on-accent: #FFFFFF;
  --color-selection: #0C1428;

  /* 氛围与辉光：亮底需要更淡，网格/扫描线改为深色 */
  --glow-1:    rgba(30,127,232,.10);
  --glow-2:    rgba(91,224,255,.08);
  --glow-3:    rgba(30,127,232,.07);
  --glow-accent: rgba(124,108,255,.10);
  --grid-line: rgba(12,20,40,.05);
  --scan-line: rgba(30,127,232,.06);
  --surface-glass: rgba(255,255,255,.78);
  --veil:          rgba(255,255,255,.55);
  --grad-end:      #0B53D6;
  --net-line:      rgba(124,108,255,.22);

  /* Hero 光斑：亮底收淡，避免泛蓝 */
  --blob-1: rgba(30,127,232,.20);
  --blob-2: rgba(124,108,255,.13);
  --blob-3: rgba(91,224,255,.10);

  /* 玻璃拟态：亮底用半透明白 + 深色细边 */
  --glass-bg:             rgba(255,255,255,.72);
  --glass-bg-hover:       rgba(255,255,255,.88);
  --glass-border:         rgba(12,20,40,.09);
  --glass-border-hover:   rgba(30,127,232,.32);
  --glass-inner: rgba(255,255,255,.95);
  --sheen: linear-gradient(100deg, transparent 22%, rgba(30,127,232,.07) 44%, rgba(124,108,255,.09) 52%, transparent 74%);

  color-scheme: light;
}
