/* ============================================================
   衡钧精工 · 设计令牌
   方向：工业实用（Industrial / utilitarian）
   主色 = 墨黑绿表面；强调色 = 单一信号橙；无第二强调色
   ============================================================ */

/* ---------- 自托管字体（latin 子集，避免国内访问 Google Fonts 失败） ---------- */
@font-face {
  font-family: 'Archivo Black';
  src: url('../assets/fonts/archivo-black-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Mono';
  src: url('../assets/fonts/plex-mono-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Mono';
  src: url('../assets/fonts/plex-mono-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---- 颜色：暗色为唯一主题（工业方向，主动选择暗底） ---- */
  --bg: #0e110f;            /* 墨黑绿，非纯黑 */
  --surface: #161a17;
  --surface-2: #1d221e;
  --text: #ece8df;          /* 暖白，非纯白 */
  --muted: #9aa096;         /* 次级文字：对 bg 对比度 5.9:1 */
  --dim: #767d73;           /* 三级：仅用于装饰性标签 */
  --accent: #e8562a;        /* 唯一强调色：信号橙 */
  --accent-soft: rgba(232, 86, 42, 0.12);
  --on-accent: #170703;     /* 橙底上的文字 */
  --line: rgba(236, 232, 223, 0.14);
  --line-2: rgba(236, 232, 223, 0.28);
  --grain-opacity: 0.045;

  /* ---- 字体 ---- */
  --f-display: 'Archivo Black', 'Arial Black', 'Microsoft YaHei', sans-serif;
  --f-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC',
            'Hiragino Sans GB', 'Microsoft YaHei', 'Source Han Sans SC', sans-serif;
  --f-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Consolas, monospace;

  /* ---- 字阶（1.25 模块化） ---- */
  --fs-xs: 11px;
  --fs-sm: 13px;
  --fs-base: 15px;
  --fs-md: 17px;
  --fs-lg: 21px;
  --fs-xl: 26px;
  --fs-2xl: 33px;
  --fs-3xl: 42px;
  --fs-4xl: 56px;
  --fs-5xl: 72px;

  /* ---- 间距 ---- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 16px;
  --sp-4: 24px;
  --sp-5: 40px;
  --sp-6: 64px;
  --sp-7: 96px;
  --sp-8: 128px;

  /* ---- 尺寸 ---- */
  --page-max: 1360px;
  --gutter: clamp(20px, 4vw, 64px);
  --header-h: 76px;
  --radius: 2px;            /* 工业方向：几乎无圆角 */

  /* ---- 动效 ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 160ms;
  --dur-base: 320ms;
  --dur-slow: 640ms;

  /* ---- 阴影（工业方向几乎不用阴影，靠发丝线与层次） ---- */
  --shadow-1: 0 1px 0 rgba(0, 0, 0, 0.4);
  --shadow-2: 0 8px 28px rgba(0, 0, 0, 0.38);
}