@charset "UTF-8";
/* ============================================================================
   base.css — 全局重置与基础排版
   ========================================================================== */

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

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

body {
  font-family: var(--font-sans);
  font-size: var(--fs-base);
  line-height: 1.6;
  color: var(--text);
  background: var(--bg);
  min-height: 100vh;
  /* 横向裁剪防溢出。注意不能用 overflow-x: hidden——它会把 body 变成滚动容器，
     导致 .mainnav 的 position: sticky 吸顶（导航悬浮）整站失效。
     clip 同样裁掉横向溢出，但不建立滚动上下文（Chrome/Edge 90+、FF 81+、Safari 16+），
     旧浏览器回退到 hidden，仅损失吸顶能力。 */
  overflow-x: hidden;
  overflow-x: clip;
}

/* ---------------- 链接与文本 ---------------- */
a {
  color: inherit;
  text-decoration: none;
  transition: color var(--ease);
}

ul,
ol {
  list-style: none;
}

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

/* 装饰性图标不参与排版 */
img[data-decor] {
  display: inline-block;
}

strong,
b {
  font-weight: 700;
}

/* ---------------- 表单控件 ---------------- */
button,
input,
select,
textarea {
  font-family: inherit;
  font-size: var(--fs-base);
  color: inherit;
}

button {
  cursor: pointer;
  background: none;
  border: none;
}

input,
textarea,
select {
  -webkit-appearance: none;
  appearance: none;
}

/* ---------------- 标题 ---------------- */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700;
  line-height: 1.4;
}

/* ---------------- 容器与栅格 ---------------- */
.container {
  width: var(--container);
  max-width: 100%;
  margin: 0 auto;
  padding: 0 var(--container-pad);
}

/* 首页使用更宽的容器（与设计稿一致） */
.page-home .container {
  width: var(--container-home);
}

.grid {
  display: grid;
  gap: var(--grid-gap);
}

.g2 {
  grid-template-columns: repeat(2, 1fr);
}

.g3 {
  grid-template-columns: repeat(3, 1fr);
}

.g4 {
  grid-template-columns: repeat(4, 1fr);
}

/* ---------------- 无障碍 ---------------- */
:focus-visible {
  outline: 2px solid var(--deep-bright);
  outline-offset: 2px;
}

/* 跳转到主内容（键盘可达性） */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: var(--z-toast);
  background: var(--deep);
  color: #fff;
  padding: 10px 18px;
  border-radius: 0 0 var(--radius) 0;
}

.skip-link:focus {
  left: 0;
}

/* 视觉隐藏但可被读屏识别 */
.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;
}

.hidden {
  display: none !important;
}

/* ---------------- 打印 ---------------- */
@media print {
  .mainnav,
  .header-top,
  .footer,
  .back-top,
  .toast-wrap {
    display: none !important;
  }
}