/* ==========================================================================
   tokens.css — 设计令牌唯一真源
   郑州千翼研磨材料有限公司 官网
   改这一个文件，全站生效。
   ========================================================================== */

:root {
  /* ---------- 深色基调（石墨黑，取自黑刚玉本色） ---------- */
  --ink-950: #080A0C;
  --ink-900: #0A0D10;
  --ink-800: #12171C;
  --ink-700: #1B222A;
  --ink-600: #232B34;

  --line: #2A333D;
  --line-soft: #1E252D;

  --steel-500: #6E7C8A;
  --steel-400: #8A98A6;
  --steel-300: #AFBAC4;

  /* ---------- 浅色交替区 ---------- */
  --mist-050: #FAFBFC;
  --mist-100: #F4F6F8;
  --mist-200: #E8EBEE;
  --mist-300: #D6DBE0;
  --white: #FFFFFF;

  /* ---------- 品牌色：熔炉琥珀（电弧炉） ----------
     深底用 400/500，浅底用 600。见 base.css 注释中的对比度表。 */
  --ember-700: #8A4614;
  --ember-600: #A2521A;
  --ember-500: #C4701F;
  --ember-400: #E08C3A;
  --ember-300: #F0AE6B;

  /* ---------- 强调色（仅数据/资质，占比 <5%） ---------- */
  --jade-600: #0E6B59;
  --jade-500: #14907A;
  --jade-400: #2FB39B;

  /* ---------- 材质色卡（产品卡与图表专用，按真实材料色） ---------- */
  --m-bfa:    #8B4A22;  /* 棕刚玉   棕褐 */
  --m-wfa:    #E9E4DC;  /* 白刚玉   白 */
  --m-sca:    #C9A227;  /* 单晶刚玉 淡黄至灰黄 */
  --m-pfa:    #C97B87;  /* 铬刚玉   粉红 */
  --m-bfa2:   #2A2320;  /* 黑刚玉   黑 */
  --m-garnet: #7A2E2A;  /* 石榴石砂 红褐 */
  --m-glass:  #AFC4CC;  /* 玻璃珠   无色透明 */
  --m-corn:   #C9A16B;  /* 玉米芯   浅黄至棕黄 */
  --m-walnut: #6B4A32;  /* 核桃壳   棕褐 */
  --m-polish: #DCDCE4;  /* 抛光粉   白/浅 */

  /* ---------- 字体栈（零 webfont 下载） ---------- */
  --font-sans-zh: -apple-system, BlinkMacSystemFont, "PingFang SC", "HarmonyOS Sans SC",
    "Source Han Sans SC", "Noto Sans CJK SC", "Microsoft YaHei UI", "Microsoft YaHei",
    "Hiragino Sans GB", sans-serif;
  --font-sans-en: "Inter", "SF Pro Text", -apple-system, "Segoe UI Variable Text",
    "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", "Cascadia Mono", Consolas,
    "Liberation Mono", Menlo, monospace;

  /* ---------- 字号阶梯（流式） ---------- */
  --fs-display: clamp(2.75rem, 1.6rem + 4.2vw, 4.75rem);
  --fs-h1: clamp(2rem, 1.4rem + 2.2vw, 3rem);
  --fs-h2: clamp(1.625rem, 1.25rem + 1.4vw, 2.25rem);
  --fs-h3: clamp(1.25rem, 1.1rem + .6vw, 1.5rem);
  --fs-lead: clamp(1.0625rem, 1rem + .35vw, 1.25rem);
  --fs-body: 1rem;
  --fs-sm: .9375rem;
  --fs-xs: .8125rem;

  --lh-tight: 1.15;
  --lh-snug: 1.35;
  --lh-body: 1.75;   /* 中文正文行高高于英文 */

  /* ---------- 间距（4px 基准） ---------- */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 24px;  --sp-6: 32px;  --sp-7: 48px;  --sp-8: 64px;
  --sp-9: 96px;  --sp-10: 128px; --sp-11: 160px;

  --section-y: clamp(64px, 8vw, 128px);
  --container: 1240px;
  --container-narrow: 780px;
  --gutter: clamp(20px, 4vw, 48px);
  --header-h: 72px;

  /* ---------- 圆角（克制；方正 = 工业感） ---------- */
  --r-xs: 2px; --r-sm: 4px; --r-md: 8px;
  --r-lg: 14px; --r-xl: 22px; --r-full: 999px;

  /* ---------- 层次 ---------- */
  /* 深色区不用投影（深底上看不见），用 1px 边线 + 顶部内高光 */
  --elev-dark: inset 0 1px 0 rgba(255,255,255,.06), 0 0 0 1px var(--line);
  --elev-dark-hover: inset 0 1px 0 rgba(255,255,255,.10), 0 0 0 1px #3A4653,
                     0 18px 40px -20px rgba(0,0,0,.9);
  /* 浅色区双层柔和投影 */
  --elev-1: 0 1px 2px rgba(10,13,16,.06);
  --elev-2: 0 1px 2px rgba(10,13,16,.06), 0 8px 24px -8px rgba(10,13,16,.12);
  --elev-3: 0 2px 4px rgba(10,13,16,.06), 0 20px 48px -16px rgba(10,13,16,.16);

  /* ---------- 动效 ---------- */
  --dur-1: 120ms;  /* 微反馈 */
  --dur-2: 180ms;  /* hover、颜色 */
  --dur-3: 260ms;  /* 展开、tab 切换 */
  --dur-4: 420ms;  /* 进场 */
  --dur-5: 700ms;  /* 大块进场、描线 */
  --ease-out: cubic-bezier(.22, .61, .36, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --ease-expressive: cubic-bezier(.16, 1, .3, 1);
  --stagger: 60ms;

  /* ---------- 层级 ---------- */
  --z-header: 100;
  --z-drawer: 200;
  --z-toast: 300;
}
