/* ==============================
   全站基础样式（变量、reset、通用元素）
   作用：为全站提供统一的颜色/尺寸变量、基础重置、通用标签默认样式
   ============================== */

/* 全局 CSS 变量：在其它 CSS（layout/home 等）里会通过 var(--xxx) 引用 */
:root {
  /* 内容最大宽度：用于首页内容、slogan 等容器居中 */
  --container-max: 1200px;

  /* 导航栏的最小高度（layout.css 里 header-nav 会用到） */
  --nav-height: 56px;

  /* 全站默认文字颜色 */
  --text: #111;

  /* 次级文字颜色（目前预留） */
  --muted: #666;

  /* 通用边框颜色（卡片、容器边框等） */
  --border: rgba(0, 0, 0, 0.08);

  /* 全站背景色 */
  --bg: #fff;

  /* 主强调色（按钮/当前导航高亮等） */
  --cta: #0c69eb;
}

/* 统一盒模型：让 width/height 包含 padding 与 border，布局更好控 */
* {
  box-sizing: border-box;
}

/* 页面基础重置：清除默认外边距，并设置全站字体/背景/文字色 */
html,
body {
  padding: 0;
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
    Arial, "Noto Sans", "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* 图片默认：块级显示 + 自适应容器宽度，避免图片超出布局 */
img {
  display: block;
  max-width: 100%;
}

/* 链接默认：继承文字颜色 + 去下划线（具体 hover 样式通常在各页/布局里定义） */
a {
  color: inherit;
  text-decoration: none;
}

/* 页面主容器：全站 main.page 的基础宽度设置 */
.page {
  width: 100%;
}
