/* ==========================================================================
   广州京辉科技 · 设计令牌（Design Tokens）
   换主题色 / 字号 / 间距，只改这一个文件
   ========================================================================== */

:root {
  /* —— 色彩：深墨蓝 + 品牌蓝 + 电光青 —— */
  --ink:        #0B1B2B;   /* 主文字 / 深色区块背景 */
  --ink-soft:   #122A44;   /* 深色区块次级背景（卡片底） */
  --ink-2:      #0E2440;   /* 深色渐变端 */
  --brand:      #1668FF;   /* 品牌蓝：主按钮 / 链接 / 强调 */
  --brand-deep: #0B4FD6;   /* 品牌蓝按下态 */
  --accent:     #22D3EE;   /* 电光青：渐变端 / 高亮 / 光晕 */
  --mist:       #F4F7FB;   /* 雾白：交替区块背景 */
  --cloud:      #E2E8F0;   /* 云灰：边框 / 分割线 */
  --slate:      #5B6B7F;   /* 石板灰：次要文字 */
  --slate-2:    #8A99AC;   /* 更浅次要文字 */
  --white:      #FFFFFF;

  /* —— 语义色 —— */
  --success: #16A34A;
  --warn:    #F59E0B;
  --danger:  #DC2626;

  /* —— 渐变 —— */
  --grad-brand: linear-gradient(135deg, var(--brand) 0%, var(--accent) 100%);
  --grad-ink:   linear-gradient(180deg, var(--ink) 0%, var(--ink-2) 100%);
  --grad-text:  linear-gradient(120deg, var(--brand) 0%, var(--accent) 100%);

  /* —— 文字在深色底上的色阶 —— */
  --on-ink:        rgba(255, 255, 255, .96);
  --on-ink-slate:  rgba(255, 255, 255, .66);
  --on-ink-faint:  rgba(255, 255, 255, .40);
  --on-ink-line:   rgba(255, 255, 255, .10);

  /* —— 字体族 —— */
  --font-sans: "PingFang SC", "Microsoft YaHei", "Noto Sans SC",
               system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --font-mono: "JetBrains Mono", "SFMono-Regular", "Roboto Mono",
               Consolas, "Courier New", monospace;

  /* —— 字号阶（响应式 clamp）—— */
  --fs-hero:    clamp(2.25rem, 5vw, 3.75rem);   /* Hero H1 */
  --fs-h1:      clamp(1.875rem, 3.5vw, 2.75rem);
  --fs-h2:      clamp(1.5rem, 2.6vw, 2.125rem); /* 区块标题 */
  --fs-h3:      1.25rem;                         /* 卡片标题 */
  --fs-h4:      1.0625rem;
  --fs-body:    1rem;                            /* 正文 16px */
  --fs-small:   0.875rem;
  --fs-eyebrow: 0.8125rem;                       /* mono 小标题 */
  --fs-mono-xs: 0.75rem;

  /* —— 行高 / 字距 —— */
  --lh-tight: 1.2;
  --lh-snug:  1.45;
  --lh-body:  1.75;          /* 中文正文略松 */
  --tracking-tight: -0.02em;
  --tracking-mono:  0.12em;  /* mono eyebrow 字距加大 */

  /* —— 间距阶（8px 基准）—— */
  --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;
  --section-y: clamp(56px, 8vw, 104px); /* 区块上下内距 */
  --section-y-sm: clamp(40px, 5vw, 64px);

  /* —— 圆角 —— */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* —— 阴影 —— */
  --shadow-sm:   0 1px 2px rgba(11, 27, 46, .06);
  --shadow-md:   0 8px 24px rgba(11, 27, 46, .08);
  --shadow-lg:   0 20px 48px rgba(11, 27, 46, .12);
  --shadow-glow: 0 12px 40px rgba(22, 104, 255, .28);  /* 品牌光晕 */

  /* —— 栅格 / 容器 —— */
  --container:     1200px;
  --container-pad: clamp(16px, 5vw, 40px);

  /* —— 过渡 —— */
  --ease: cubic-bezier(.4, 0, .2, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --dur:  .25s;
  --dur-lg: .45s;

  /* —— 头部高度（供锚点偏移与占位）—— */
  --header-h: 72px;
  --header-h-mobile: 60px;

  /* —— z-index 层级 —— */
  --z-header: 100;
  --z-overlay: 200;
  --z-modal: 300;
}

/* —— 尊重「减少动态效果」偏好 —— */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}