/* =========================================================
   考冲终端 · 设计令牌
   Kaochong Terminal · Design Tokens
   ========================================================= */

:root {
  /* —— 色彩系统：深空底色 + 电信号高亮 —— */
  --void:        #03060E;
  --bg:          #070B16;
  --bg-elev-1:   #0B1122;
  --bg-elev-2:   #11192E;
  --bg-elev-3:   #19223C;
  --hairline:    rgba(0, 229, 255, 0.08);
  --hairline-2:  rgba(255, 255, 255, 0.06);
  --line:        #1F2A48;

  --ink:         #E8EEFB;
  --ink-dim:     #A6B0CC;
  --ink-mute:    #6A7595;
  --ink-faint:   #404B6C;

  --signal:      #00E5FF;          /* 主信号 · 电青 */
  --signal-soft: rgba(0, 229, 255, 0.16);
  --signal-glow: rgba(0, 229, 255, 0.45);

  --violet:      #8B6CF5;
  --amber:       #FFB627;
  --green:       #2EE6A6;
  --pink:        #FF4D8D;

  /* —— 5个App的频道色 —— */
  --ch-fujing:        #00E5FF;     /* 辅警 · 电青 */
  --ch-danzhao:       #FFB627;     /* 单招 · 琥珀 */
  --ch-chengkao:      #8B6CF5;     /* 成人高考 · 紫罗兰 */
  --ch-baoan:         #2EE6A6;     /* 保安 · 荧光绿 */
  --ch-xueweiyingyu:  #FF4D8D;     /* 学位英语 · 粉 */

  /* —— 排版 —— */
  --font-display: "JetBrains Mono", "SF Mono", ui-monospace, Menlo, monospace;
  --font-han:     "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  --font-body:    "Manrope", -apple-system, system-ui, "Noto Sans SC", "PingFang SC", sans-serif;
  --font-mono:    "JetBrains Mono", "SF Mono", ui-monospace, Menlo, monospace;
  --font-serif-han: "Noto Serif SC", "Source Han Serif SC", "Songti SC", serif;

  /* —— 节奏 —— */
  --r-1: 4px;
  --r-2: 8px;
  --r-3: 12px;
  --r-4: 16px;
  --r-full: 999px;

  --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;

  /* —— 阴影 / 发光 —— */
  --glow-signal: 0 0 40px rgba(0, 229, 255, 0.25), 0 0 80px rgba(0, 229, 255, 0.12);
  --glow-violet: 0 0 40px rgba(139, 108, 245, 0.25);

  /* —— 容器 —— */
  --container: 1280px;
  --container-narrow: 960px;

  /* —— 过渡 —— */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
}

/* —— Reset —— */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink);
  background: var(--void);
  background-image:
    radial-gradient(900px 600px at 12% -10%, rgba(0, 229, 255, 0.10), transparent 60%),
    radial-gradient(800px 500px at 88% 0%, rgba(139, 108, 245, 0.10), transparent 60%),
    linear-gradient(180deg, #050811 0%, #03060E 100%);
  min-height: 100vh;
  overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; background: none; border: 0; color: inherit; }
ul, ol { list-style: none; }
input, textarea, select { font: inherit; color: inherit; }

/* —— 全局网格背景(贯穿全站) —— */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image:
    linear-gradient(rgba(0, 229, 255, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 229, 255, 0.025) 1px, transparent 1px);
  background-size: 48px 48px;
  pointer-events: none;
  z-index: 0;
  mask-image: radial-gradient(ellipse 70% 80% at 50% 30%, black 30%, transparent 80%);
}

/* —— 扫描线效果 —— */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  background:
    repeating-linear-gradient(
      to bottom,
      transparent 0,
      transparent 3px,
      rgba(255, 255, 255, 0.012) 3px,
      rgba(255, 255, 255, 0.012) 4px
    );
  pointer-events: none;
  z-index: 1;
  mix-blend-mode: overlay;
}

/* —— 通用类型尺度 —— */
.eyebrow {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--signal);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.eyebrow::before {
  content: "";
  width: 6px; height: 6px;
  background: var(--signal);
  border-radius: 50%;
  box-shadow: 0 0 10px var(--signal);
  animation: pulse 2s ease-in-out infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.7); }
}

.mono { font-family: var(--font-mono); }
.han  { font-family: var(--font-han); }

.text-dim   { color: var(--ink-dim); }
.text-mute  { color: var(--ink-mute); }
.text-signal { color: var(--signal); }

.section-title {
  font-family: var(--font-han);
  font-weight: 800;
  font-size: clamp(28px, 4vw, 48px);
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.section-title em {
  font-style: normal;
  color: var(--signal);
}

.section-sub {
  font-family: var(--font-han);
  color: var(--ink-dim);
  font-size: 16px;
  max-width: 640px;
  line-height: 1.7;
}

/* —— 容器 —— */
.container {
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 32px;
  position: relative;
  z-index: 2;
}
.container-narrow {
  width: 100%;
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 0 32px;
  position: relative;
  z-index: 2;
}

@media (max-width: 768px) {
  .container, .container-narrow { padding: 0 20px; }
}