/* ============================================================
   安兴宇联 · 设计令牌 v2（Apple 风浅色科技感）
   off-white + off-black + 电光蓝强调
   文件名称：design-tokens.css
   所属项目：安兴宇联官网
   最后更新：2026-08-24
   ============================================================ */

:root {
  /* 品牌（一键替换处） */
  --brand-cn: "安兴宇联";
  --brand-en: "ANXING YULIAN";
  --brand-slogan: "上天 · 入地 · 带电，让高危作业更安全";

  /* 色彩系统 · 浅色 */
  --bg-0: #f5f5f7;          /* 最浅分区背景（Apple 灰） */
  --bg-1: #ffffff;          /* 主背景 */
  --bg-2: #fafbfd;          /* 卡片微调背景 */
  --bg-3: #f0f3f8;          /* 悬浮/高亮卡 */
  --bg-glow: #eaf2ff;       /* 光晕底（淡蓝） */

  --line-1: #e4e8ef;        /* 主描边（浅灰蓝） */
  --line-2: #0066ff;        /* 强调描边（电光蓝） */
  --line-3: #eef1f6;        /* 弱描边 */

  --text-1: #1d1d1f;        /* 主文字（近黑） */
  --text-2: #6e6e73;        /* 次级文字（Apple 灰） */
  --text-3: #86868b;        /* 弱文字 */

  --blue: #0066ff;          /* 电光蓝 · 唯一强调色 */
  --blue-deep: #0047b3;     /* 深蓝（hover/渐变端） */
  --blue-dim: rgba(0, 102, 255, 0.12);
  --blue-glow: rgba(0, 102, 255, 0.28);
  --orange: #ff3a17;        /* 警示橙 · 仅危险作业标签用（小面积功能色） */
  --green: #0a9e54;         /* 状态绿 */

  /* 渐变 */
  --grad-primary: linear-gradient(120deg, #0066ff 0%, #3d8bff 55%, #66a8ff 100%);
  --grad-cyan: linear-gradient(180deg, rgba(0, 102, 255, 0.10) 0%, rgba(0, 102, 255, 0) 100%);
  --grad-card: linear-gradient(165deg, #ffffff 0%, #f7f9fc 100%);

  /* 字体 */
  --font-cn: "PingFang SC", "HarmonyOS Sans SC", "Source Han Sans SC",
             "Noto Sans SC", "Microsoft YaHei", system-ui, sans-serif;
  --font-num: "Barlow Condensed", "DIN Alternate", "Rajdhani", "Oswald",
              "Arial Narrow", sans-serif;

  /* 字号阶梯 */
  --fs-display: clamp(2.6rem, 6vw, 4.8rem);
  --fs-h1: clamp(2rem, 4vw, 3.2rem);
  --fs-h2: clamp(1.5rem, 2.6vw, 2.1rem);
  --fs-h3: 1.25rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-tiny: 0.75rem;

  /* 间距 */
  --sp-1: 0.5rem;
  --sp-2: 1rem;
  --sp-3: 1.5rem;
  --sp-4: 2.5rem;
  --sp-5: 4rem;
  --sp-6: 6rem;

  /* 布局 */
  --container: 1200px;
  --nav-h: 72px;
  --nav-gutter: clamp(24px, 5vw, 72px);  /* 顶部菜单栏与屏幕左右边缘间距 */
  --radius: 14px;
  --radius-sm: 8px;

  /* 动效 */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 0.45s;

  /* 阴影（浅色背景：蓝色调阴影，禁纯黑） */
  --shadow-card: 0 10px 30px rgba(20, 40, 80, 0.08);
  --shadow-card-hover: 0 18px 44px rgba(20, 60, 120, 0.14);
  --shadow-cyan: 0 6px 22px rgba(0, 102, 255, 0.25);
  --glow-text: 0 1px 0 rgba(0, 102, 255, 0.10);
}

/* 网格线背景纹理（浅色 HUD，极淡） */
.tech-grid {
  background-image:
    linear-gradient(var(--line-3) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-3) 1px, transparent 1px);
  background-size: 44px 44px;
}
