/* ==========================================================================
   迅立达电梯有限公司 — 设计令牌
   深色 · 钢蓝科技
   改配色只需要动这个文件
   ========================================================================== */

:root {
  /* ---------- 底色层次 ---------- */
  --bg-base: #070b14;
  --bg-raise: #0e1420;
  --bg-raise-2: #151d2c;
  --bg-sink: #04070e;

  /* ---------- 线条 ---------- */
  --line: rgba(255, 255, 255, 0.07);
  --line-strong: rgba(255, 255, 255, 0.15);
  --line-accent: rgba(56, 189, 248, 0.36);
  --line-safety: rgba(245, 185, 66, 0.34);

  /* ---------- 文字 ---------- */
  --text-1: #e8edf5;
  --text-2: #97a5b8;
  --text-3: #5a6577;

  /* ---------- 强调色：钢蓝 ---------- */
  --accent: #38bdf8;
  --accent-deep: #0c6e9e;
  --accent-soft: rgba(56, 189, 248, 0.1);
  --accent-softer: rgba(56, 189, 248, 0.045);
  --on-accent: #04131c; /* 铺在钢蓝底上的文字色 */

  /* ---------- 安全琥珀：预警 · 资质 · 安全指标 ---------- */
  --safety: #f5b942;
  --safety-deep: #b47d10;
  --safety-soft: rgba(245, 185, 66, 0.1);
  --safety-softer: rgba(245, 185, 66, 0.045);

  /* ---------- 质感 ---------- */
  --metal: linear-gradient(
    120deg,
    #f4f7fb 0%,
    #93a2b8 45%,
    #e9eef6 60%,
    #76839a 100%
  );
  --metal-line: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.28),
    transparent
  );
  --glow: radial-gradient(
    ellipse at center,
    rgba(56, 189, 248, 0.18),
    transparent 70%
  );
  --glow-safety: radial-gradient(
    ellipse at center,
    rgba(245, 185, 66, 0.14),
    transparent 70%
  );

  /* 井道语言：导轨竖线 + 楼层横线 */
  --rail-line: rgba(255, 255, 255, 0.045);
  --floor-line: rgba(255, 255, 255, 0.022);
  --rail-gap: 120px;
  --floor-gap: 88px;

  /* ---------- 字体 ---------- */
  --font-sans: -apple-system, BlinkMacSystemFont, "PingFang SC",
    "HarmonyOS Sans SC", "Microsoft YaHei", "Hiragino Sans GB", "Segoe UI",
    Roboto, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
    "Liberation Mono", monospace;

  /* ---------- 排版尺度 ---------- */
  /* 下限压到 2.25rem：主标题「让每一次垂直移动」是 8 个汉字，
     44px 时在 390px 宽的手机上会断成「…垂直移 / 动」 */
  --fs-display: clamp(2.25rem, 6.5vw, 4.5rem);
  --fs-h1: clamp(2rem, 4vw, 2.75rem);
  --fs-h2: clamp(1.6rem, 3vw, 2.125rem);
  --fs-h3: 1.375rem;
  --fs-body: 1rem;
  --fs-sm: 0.875rem;
  --fs-caption: 0.8125rem;
  --fs-micro: 0.75rem;

  /* ---------- 间距 ---------- */
  --sp-section: clamp(5rem, 10vw, 8.5rem);
  --sp-gutter: clamp(1.25rem, 4vw, 3rem);
  --maxw: 1280px;
  --maxw-text: 760px;

  /* ---------- 动效 ---------- */
  --ease: cubic-bezier(0.22, 0.68, 0.32, 1);
  --dur: 0.5s;

  /* ---------- 导轨切角（左上 + 右下） ---------- */
  --bevel: 12px;

  /* ---------- 层级 ----------
     必须保留：.nav 与 .drawer 是 position:fixed，
     缺了这两个变量会退化成 z-index:auto，页面内容会盖在导航上面 */
  --z-nav: 100;
  --z-drawer: 200;
}
