/* ============================================================
   tokens.css — 设计令牌（唯一来源）
   深色主题。颜色按「用途」拆分；对比度不达标的品牌色已做分离处理：
   --brand 用于装饰填充；--brand-strong 用于按钮底（白字达标）；
   --brand-ink 用于深底上的红色文字（达 AA）。
   ============================================================ */
:root {
  /* —— 背景层 —— */
  --bg:            #0A0A0B;   /* 页面底 */
  --bg-alt:        #0F0F13;   /* 交替区底 */
  --bg-footer:     #050506;   /* 页脚底 */
  --panel:         #111116;   /* 深色面板 */
  --card:          #15151A;   /* 卡片底 */
  --tile:          #17171D;   /* 卡内瓦片 */

  /* —— 品牌色（按用途拆分）—— */
  --brand:         #E8232A;   /* 装饰填充：圆点 / 光晕 / 强调条 / 选中态底 */
  --brand-strong:  #C81E25;   /* 按钮底（白字压得住，达 AA） */
  --brand-ink:     #FF6B70;   /* 深底上的红色文字（eyebrow / 链接强调） */
  --brand-mark:    #E8232A;   /* 图形描边 / 圆点，≥3.0 即可 */
  --cyan:          #29B6D8;   /* 点缀青 */

  /* —— 文字（深底三级，全部 ≥4.5:1）—— */
  --text:          #FFFFFF;   /* 正文白 */
  --text-2:        #C8C8D2;   /* 次级 */
  --text-3:        #9A9AA6;   /* 正文灰（段落） */
  --text-4:        #8A8A96;   /* 说明灰（说明 / 弱提示，14px 达标） */
  --text-5:        #6E6E7A;   /* 弱灰：仅用于装饰 / ≥18px 大字的次要标注 */

  /* —— 描边 / 分隔 —— */
  --line:          rgba(255,255,255,0.08);
  --line-soft:     rgba(255,255,255,0.06);

  /* —— 内容宽度（只许两档）—— */
  --w-container:   1280px;    /* 主内容区宽度（不含左右内边距） */
  --w-prose:      860px;      /* 长文 / lede 阅读宽度档 */

  /* —— 间距 —— */
  --sp-1: 6px;  --sp-2: 10px; --sp-3: 14px; --sp-4: 18px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;
  --sp-section: 110px;        /* 区块上下内边距 */
  --pad-x: 80px;              /* 视口内边距（桌面） */

  /* —— 圆角 —— */
  --r-card: 20px;
  --r-panel: 30px;
  --r-tile: 15px;
  --r-pill: 999px;

  /* —— 字体 —— */
  --font-cn:   "Noto Sans SC", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-en:   "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --font-display: "Archivo", "Inter", system-ui, sans-serif;

  /* —— 字号（桌面）—— */
  --fs-h1: 52px;  --lh-h1: 68px;
  --fs-h1-home: 62px; --lh-h1-home: 78px;
  --fs-h2: 42px;  --lh-h2: 58px;
  --fs-h3: 24px;  --lh-h3: 34px;
  --fs-body: 17px; --lh-body: 30px;
  --fs-card: 14px; --lh-card: 24px;
  --fs-list: 15px; --lh-list: 27px;
  --fs-eyebrow: 14px;
  --fs-small: 13px;
}

/* —— 移动端降档：改一处全站生效 —— */
@media (max-width: 768px) {
  :root {
    --fs-h1: 34px;  --lh-h1: 44px;
    --fs-h1-home: 40px; --lh-h1-home: 50px;
    --fs-h2: 28px;  --lh-h2: 38px;
    --fs-h3: 20px;  --lh-h3: 28px;
    --fs-body: 16px; --lh-body: 27px;
    --sp-section: 64px;
    --pad-x: 20px;
  }
}
@media (max-width: 480px) {
  :root {
    --fs-h1: 30px;  --lh-h1: 40px;
    --fs-h1-home: 34px; --lh-h1-home: 44px;
  }
}