/* ================================================================
   海联智达 AI数字员工 — 设计Token
   Design Tokens: Colors / Typography / Spacing / Shadows / Motion
   ================================================================ */

:root {
  /* ── 品牌色 ── */
  --primary:       oklch(0.48 0.15 250);   /* 品牌蓝 ≈ #0066CC */
  --primary-dark:  oklch(0.36 0.12 250);
  --primary-light: oklch(0.68 0.10 250);
  --primary-subtle:oklch(0.48 0.15 250 / 0.08);

  /* ── CTA色 ── */
  --cta:           oklch(0.68 0.20 50);    /* 行动橙 ≈ #FF6600 */
  --cta-dark:      oklch(0.56 0.18 50);
  --cta-light:     oklch(0.78 0.14 50);
  --cta-subtle:    oklch(0.68 0.20 50 / 0.08);

  /* ── 强调色 ── */
  --accent:        oklch(0.55 0.20 155);   /* 成功绿 */
  --accent-subtle: oklch(0.55 0.20 155 / 0.08);
  --warning:       oklch(0.78 0.16 80);
  --danger:        oklch(0.55 0.22 25);

  /* ── 表面 / 背景 ── */
  --bg:            oklch(0.99 0.001 250);
  --bg-elevated:   oklch(0.97 0.002 250);
  --surface:       oklch(0.99 0.001 250);
  --surface-alt:   oklch(0.96 0.003 250);
  --surface-hover: oklch(0.94 0.004 250);
  --border:        oklch(0.90 0.003 250);
  --border-light:  oklch(0.94 0.002 250);

  /* ── 深色变体（Hero/CTA区暗底） ── */
  --dark-bg:       oklch(0.14 0.02 250);
  --dark-surface:  oklch(0.20 0.02 250);
  --dark-border:   oklch(0.28 0.02 250);
  --dark-text:     oklch(0.95 0.01 250);
  --dark-muted:    oklch(0.65 0.01 250);

  /* ── 文字 ── */
  --text-primary:  oklch(0.18 0.02 250);
  --text-secondary:oklch(0.46 0.015 250);
  --text-tertiary: oklch(0.64 0.01 250);
  --text-inverse:  oklch(0.99 0.001 250);

  /* ── 字体 ── */
  --font-heading:  'Plus Jakarta Sans', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  --font-body:     'Plus Jakarta Sans', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  --font-mono:     'JetBrains Mono', 'Consolas', monospace;

  /* ── 字号（clamp流体） ── */
  --text-xs:    0.75rem;
  --text-sm:    0.8125rem;
  --text-base:  1rem;
  --text-lg:    1.125rem;
  --text-xl:    1.25rem;
  --text-2xl:   clamp(1.5rem, 3vw, 2rem);
  --text-3xl:   clamp(2rem, 4vw, 2.8rem);
  --text-4xl:   clamp(2.5rem, 5vw, 3.5rem);
  --text-hero:  clamp(2.8rem, 6vw, 4.2rem);

  /* ── 行高 ── */
  --leading-tight: 1.2;
  --leading-normal:1.6;
  --leading-loose: 1.8;

  /* ── 字重 ── */
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;
  --font-extrabold: 800;

  /* ── 间距 ── */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-30: 120px;

  /* ── 圆角 ── */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* ── 阴影 ── */
  --shadow-xs:  0 1px 2px oklch(0 0 0 / 0.04);
  --shadow-sm:  0 1px 3px oklch(0 0 0 / 0.06);
  --shadow-md:  0 4px 12px oklch(0 0 0 / 0.08);
  --shadow-lg:  0 12px 40px oklch(0 0 0 / 0.10);
  --shadow-xl:  0 20px 60px oklch(0 0 0 / 0.14);
  --shadow-glow-primary: 0 0 24px oklch(0.48 0.15 250 / 0.12);
  --shadow-glow-cta:     0 0 24px oklch(0.68 0.20 50 / 0.15);

  /* ── 动效 ── */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --fast:        150ms;
  --normal:      250ms;
  --slow:        400ms;
  --slower:      600ms;

  /* ── 容器 ── */
  --container-sm: 640px;
  --container-md: 768px;
  --container-lg: 1024px;
  --container-xl: 1200px;
  --container-2xl: 1440px;

  /* ── 断点（供JS使用） ── */
  --bp-sm:  640px;
  --bp-md:  768px;
  --bp-lg:  1024px;
  --bp-xl:  1280px;
}
