/* ============================================================
   基础层：重置、排版、焦点、可访问性、降级动效
   ============================================================ */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--f-sans);
  font-size: var(--fs-base);
  line-height: 1.75;               /* 中文正文 ≥1.7 */
  letter-spacing: 0.01em;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

/* 页面入场：一次编排，不做零散微交互 */
body {
  animation: page-in var(--dur-slow) var(--ease-out) both;
}
@keyframes page-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

h1, h2, h3, h4, p, figure, blockquote, dl, dd {
  margin: 0;
}

/* 中文段落避免孤字行（最后一行只剩 1–2 字）：Chrome 117+ 支持 text-wrap: pretty */
p {
  text-wrap: pretty;
}

h1, h2, h3, h4 {
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: -0.01em;
  text-wrap: balance;
}

h1 { font-size: clamp(38px, 5.4vw, var(--fs-5xl)); line-height: 1.04; }
h2 { font-size: clamp(28px, 3.4vw, var(--fs-3xl)); line-height: 1.12; }
h3 { font-size: var(--fs-lg); }

a {
  color: inherit;
  text-decoration: none;
}

img, svg {
  display: block;
  max-width: 100%;
}

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  cursor: pointer;
}

/* 数字统一等宽，工业方向的核心细节 */
.num,
time,
.mono {
  font-family: var(--f-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}

/* ---- 焦点可见：2px 描边 + 2px 偏移 ---- */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* ---- 跳转链接（键盘可达性） ---- */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 999;
  padding: var(--sp-3) var(--sp-4);
  background: var(--accent);
  color: var(--on-accent);
  font-weight: 700;
}
.skip-link:focus {
  left: var(--sp-3);
  top: var(--sp-3);
}

/* ---- 屏幕阅读器专用 ---- */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ---- 滚动揭示：默认位移，进入视口后归位 ---- */
.reveal {
  opacity: 0;
  transform: translateY(22px);
}
.reveal.in {
  opacity: 1;
  transform: none;
  transition: opacity var(--dur-base) var(--ease-out),
              transform var(--dur-base) var(--ease-out);
  transition-delay: var(--d, 0ms);
}

/* ---- 降级：尊重系统减弱动效设置 ---- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body { animation: none; }
  .reveal { opacity: 1; transform: none; }
  .reveal.in { transition: none; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}

/* ---- 选中态：强调色 ---- */
::selection {
  background: var(--accent);
  color: var(--on-accent);
}

/* ---- 滚动条（桌面端 Chrome / Edge） ---- */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb {
  background: #2a302b;
  border: 3px solid var(--bg);
}
::-webkit-scrollbar-thumb:hover { background: #3a423c; }
