/* ============================================================
 * tokens.css — XHL Marketing 设计系统
 * Hallmark · tech 路线：冷白纸面 + 电光蓝强调 + 深海军蓝墨色
 * 修改主题色/字体只需改这一处，全站生效
 * ============================================================ */

:root {
  /* —— 色彩（tech 风）—— */
  --accent:      #2b5cff;                 /* 主强调 · 电光蓝 oklch(55% 0.23 262) */
  --accent-soft: #4d79ff;                 /* 渐变亮端 */
  --accent-tint: #e4eaff;                 /* 蓝色浅底 */
  --accent-rgb:  43, 92, 255;             /* 供 rgba() 发光使用 */
  --cyan:        #00c2d9;                 /* 辅助 · 数据青 */

  /* 兼容别名（历史样式引用，指向新色） */
  --orange:      var(--accent);
  --orange-soft: var(--accent-soft);
  --orange-tint: var(--accent-tint);

  --ink:         #0b1220;                 /* 墨色 · 深海军蓝 oklch(17% 0.03 262) */
  --ink-2:       #141d31;                 /* 深色卡片 */
  --paper:       #f4f6fa;                 /* 纸面底色 · 冷白 */
  --paper-2:     #fafbfe;                 /* 更亮一层 */
  --muted:       #5c6575;                 /* 次级文字 */
  --muted-2:     #3f4756;
  --line:        rgba(11, 18, 32, .12);   /* 分隔线 */
  --line-dark:   rgba(255, 255, 255, .14);
  --purple:      #7a3ad0;                 /* 辅助紫（服务色系用） */
  --teal:        #0e7a6a;                 /* 成功/正反馈 */

  /* 服务索引行专属色系 */
  --pastel-1: #fff3ec;
  --pastel-2: #eef2fc;
  --pastel-3: #f5effb;
  --pastel-4: #e9f5f1;

  /* —— 字体 —— */
  --font-body: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "SFMono-Regular", "JetBrains Mono", Consolas, monospace;

  --text-display: clamp(38px, 5.4vw, 76px);   /* H1 */
  --text-h2:      clamp(32px, 4.2vw, 60px);
  --text-h3:      clamp(22px, 2.4vw, 30px);
  --text-lead:    17px;
  --text-body:    15.5px;
  --text-small:   13px;
  --text-micro:   11.5px;

  /* —— 间距（4pt 网格）—— */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 120px;
  --gutter: 6vw;

  /* —— 形状与阴影 —— */
  --radius-lg: 24px;
  --radius-md: 16px;
  --radius-pill: 999px;
  --shadow-lg: 0 24px 70px rgba(11, 18, 32, .14);
  --shadow-md: 0 12px 34px rgba(11, 18, 32, .14);
  --shadow-btn: 0 14px 35px rgba(var(--accent-rgb), .28);

  /* —— 动效 —— */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 160ms;
  --dur-med: 280ms;

  /* —— 站点元信息 —— */
  --header-h: 76px;
  --container: 1440px;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 1ms; --dur-med: 1ms; }
}