/* ==========================================================================
   会聊官网 · 设计 Token v2
   品牌色系与新 logo 一致：青蓝（科技 / 内容分发）+ 翠绿（信任 / 成交）
   暖橙仅作动效点缀色
   ========================================================================== */

:root {
  /* ---------- 品牌：青绿 ---------- */
  --brand-50:  #EAFBF4;
  --brand-100: #D2F5E6;
  --brand-200: #A6EBCB;
  --brand-300: #6DD9A8;
  --brand-400: #2CC985;
  --brand-500: #1AAE63;   /* 主品牌 */
  --brand-600: #149A57;
  --brand-700: #0E7E47;   /* 4.62:1 ✅ 文本/按钮安全色 */
  --brand-800: #085F33;

  /* ---------- 科技辅助：青蓝 ---------- */
  --tech-300:  #67D6F2;
  --tech-400:  #2BB1E0;
  --tech-500:  #1094C8;
  --tech-600:  #0877A8;
  --tech-700:  #0A5F88;   /* 5.04:1 ✅ */

  /* ---------- 渐变与光晕 ---------- */
  --grad-brand: linear-gradient(135deg, #1AAE63 0%, #2BB1E0 100%);
  --grad-soft:  linear-gradient(135deg, #EAFBF4 0%, #E1F7FE 100%);
  --grad-deep:  linear-gradient(135deg, #0E7E47 0%, #0877A8 100%);
  --grad-rainbow: linear-gradient(120deg, #1AAE63, #2BB1E0, #1AAE63);

  /* ---------- 暖橙强调（点缀） ---------- */
  --accent-warm: #FF7A3C;
  --accent-warm-soft: #FFE3D2;

  /* ---------- 中性 ---------- */
  --n-950: #06161E;
  --n-900: #0E1A22;
  --n-800: #1A2B36;
  --n-700: #34475A;       /* 8.8:1 正文 */
  --n-600: #4D6172;
  --n-500: #6B7E91;       /* 4.62:1 ✅ 辅助文字 */
  --n-400: #94A5B5;       /* 仅大字号 / 图标 */
  --n-300: #C7D2DC;
  --n-200: #E1E8EE;
  --n-100: #F1F5F8;
  --n-50:  #F8FAFB;
  --n-0:   #FFFFFF;

  /* ---------- 语义 ---------- */
  --success: #1AAE63;
  --success-d: #0E7E47;   /* 4.62:1 ✅ */
  --danger:  #DC2626;
  --danger-d:#991B1B;     /* 7.04:1 ✅ */
  --warning: #D97706;

  /* ---------- 字体 ---------- */
  --font-sans: "PingFang SC", "HarmonyOS Sans SC", "Noto Sans SC",
               "Microsoft YaHei", "Inter", system-ui, -apple-system, sans-serif;
  --font-num:  "DIN Alternate", "Roboto Mono", "SF Mono", ui-monospace, monospace;

  /* 字号：移动优先 */
  --fs-h1:   clamp(34px, 7vw, 64px);
  --fs-h2:   clamp(26px, 4.6vw, 44px);
  --fs-h3:   clamp(18px, 2.2vw, 22px);
  --fs-lead: clamp(15px, 2vw, 18px);
  --fs-body: clamp(14px, 1.5vw, 16px);
  --fs-sm:   clamp(12px, 1.3vw, 14px);
  --fs-btn:  clamp(14px, 1.5vw, 16px);

  --lh-tight: 1.15;
  --lh-body:  1.7;

  /* ---------- 间距（8px 基准） ---------- */
  --s-1: 8px;  --s-2: 16px; --s-3: 24px; --s-4: 32px;
  --s-5: 40px; --s-6: 48px; --s-8: 64px; --s-10: 80px; --s-12: 96px;

  /* ---------- 圆角 ---------- */
  --r-sm: 8px; --r-card: 16px; --r-lg: 24px; --r-pill: 999px;

  /* ---------- 阴影 ---------- */
  --shadow-sm: 0 1px 2px rgba(8, 95, 51, .06), 0 1px 3px rgba(8, 95, 51, .04);
  --shadow-md: 0 4px 12px rgba(8, 95, 51, .07), 0 2px 4px rgba(8, 95, 51, .04);
  --shadow-lg: 0 12px 32px rgba(8, 95, 51, .10), 0 4px 8px rgba(8, 95, 51, .04);
  --shadow-brand: 0 12px 36px rgba(26, 174, 99, .28);
  --shadow-tech:  0 12px 36px rgba(16, 148, 200, .24);

  /* ---------- 动效 ---------- */
  --ease: cubic-bezier(.4, 0, .2, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --dur-fast: .2s;
  --dur: .35s;
  --dur-slow: .6s;
  --dur-stagger: 60ms;

  /* ---------- 布局 ---------- */
  --container: 1200px;
  --gutter: 20px;
  --header-h: 68px;
}

@media (min-width: 768px) {
  :root { --gutter: 28px; --header-h: 76px; }
}

/* 滚动进度条高度 */
:root { --scroll: 0; }