/* ============================================================
   402 工作室网站 · 设计 Tokens
   依据《风格与交互设计规范.md》§1 视觉层 / §2 动效层
   ============================================================ */

:root {
  /* ---- 色彩 ---- */
  --c-red: #D2222A;            /* 品牌红·印章 */
  --c-red-deep: #A61B21;       /* 红·按压/深态 */
  --c-ink: #171717;            /* 主文字 */
  --c-ink-2: #656565;          /* 次级文字 */
  --c-bg-dark: #111111;        /* 深色背景 */
  --c-paper: #F4F3EF;          /* 暖白背景 */
  --c-paper-gray: #E9E9E5;     /* 图纸灰背景 */
  --c-line: #CBCBC6;           /* 分隔线（浅底） */
  --c-on-dark: #F3F3EF;        /* 深色背景文字 */
  --c-on-dark-2: rgba(243, 243, 239, .62);  /* 深色背景次级文字 */
  --line-dark: rgba(243, 243, 239, .16);    /* 分隔线（深底） */
  --c-red-tint: rgba(210, 34, 42, .08);     /* 红 8% 填充 */
  --c-red-tint2: rgba(210, 34, 42, .14);    /* 红 14% 填充 */
  --c-ink-tint: rgba(23, 23, 23, .55);      /* 图片压字渐变 */

  /* ---- 字体（原型用系统字体栈，上线替换自托管 webfont） ---- */
  --font-serif: "Source Han Serif SC", "Noto Serif SC", "Songti SC", STSong, SimSun, serif;
  --font-sans: "Source Han Sans SC", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", "JetBrains Mono", ui-monospace, Consolas, "Courier New", monospace;

  /* ---- 字阶（clamp 桌面→移动） ---- */
  --fs-display: clamp(40px, 5vw, 72px);
  --fs-h1: clamp(30px, 3.3vw, 48px);
  --fs-h2: clamp(22px, 2.2vw, 32px);
  --fs-h3: clamp(18px, 1.5vw, 22px);
  --fs-body: 16px;
  --fs-small: 13px;
  --fs-mono-label: 12px;

  /* ---- 间距（8pt 系统） ---- */
  --sp-1: 8px;  --sp-2: 16px; --sp-3: 24px; --sp-4: 32px;
  --sp-5: 48px; --sp-6: 64px; --sp-7: 96px; --sp-8: 128px;

  /* ---- 布局 ---- */
  --maxw: 1600px;
  --margin: 64px;      /* 页边距，≤768px 时 20px */
  --gutter: 24px;
  --nav-h: 72px;

  /* ---- 动效 ---- */
  --dur-fast: 150ms;
  --dur-base: 300ms;
  --dur-slow: 600ms;
  --dur-scene: 1200ms;
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --ease-inout: cubic-bezier(.65, 0, .35, 1);

  /* ---- 层级 ---- */
  --z-nav: 100;
  --z-admin: 90;
  --z-lightbox: 200;
  --z-toast: 300;
  --z-cursor: 999;

  /* ---- 组件 ---- */
  --border-w: 1px;
  --focus-ring: 2px solid var(--c-red);
}
