/* Reset */
*, *::before, *::after { box-sizing: border-box; }
html, body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, figure, blockquote { margin: 0; padding: 0; }
ul, ol { list-style: none; }
/* 全局 img 兜底：
   - color:transparent + font-size:0 → 隐藏 alt 备用文字（无 src 时不显示 alt 字符串）
   - img[src=""] / :not([src]) → visibility:hidden 隐藏破碎图标（保留占位不影响布局）
   注：CSS 无法直接隐藏"src 存在但加载失败"时的破碎图标；建议 TRS 补 onerror（详见备注） */
img {
  max-width: 100%;
  display: block;
  border: 0;
  color: transparent;
  font-size: 0;
}
img[src=""], img:not([src]) { visibility: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; background: none; border: 0; cursor: pointer; padding: 0; color: inherit; }
input, textarea { font: inherit; outline: 0; }

html { font-size: 16px; }
body {
  font-family: var(--font-sans);
  color: var(--color-text-primary);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  min-width: var(--page-min-w);
}
/* 底部装饰：长城日落水墨底纹仅在首页和大事记生效（内容配色与暖色调纹理适配）；
   其他页面（人物志/视听/典藏/新闻/关于/详情等）保持纯米黄底，避免与冷色/白底内容冲突 */
body.home-page,
body.jishi-page {
  background: var(--color-bg) url(../img/home/pc-foot-bg.png) center bottom / 100% auto no-repeat;
}

/* 全站 h2 统一使用宋体 */
h2 { font-family: "Songti SC", "STSong", "Noto Serif SC", serif; }

/* 容器：max-width 1600 居中 + 左右 40 padding（全站唯一间距来源）*/
.container-w {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--container-pad);
}

/* ===== 全站统一顶部导航（120 高，2 行，半透明叠加在 hero 上）===== */
.site-topbar {
  position: absolute;
  top: 0; left: 0; right: 0;
  z-index: 100;
  color: #fff;
  font-family: var(--font-sans);
  user-select: none;
}

/* 上层跑马灯条（40 高，半透明黑 0.55；外层全宽贴底色，内层 container-w 居中对齐内容）*/
.site-topbar__top {
  height: 40px;
  background: rgba(0, 0, 0, .55);
}
.site-topbar__top > .container-w {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.site-topbar__top a {
  font-size: 14px;
  color: rgba(255, 255, 255, 1);
  font-weight: 300;
  margin-left: 60px;
}
.site-topbar__top a:hover { color: var(--color-brand); }

/* 下层主导航（80 高，半透明黑 0.4；同样外全宽内 container-w）*/
.site-topbar__main {
  height: 80px;
  background: rgba(0, 0, 0, .4);
}
.site-topbar__main > .container-w {
  height: 100%;
  display: flex;
  align-items: center;
}
.site-topbar__logo { flex: 0 0 auto; }
.site-topbar__logo img { height: 60px; width: 164px; object-fit: contain; }
/* 导航 + 搜索成组靠右：margin-left:auto 吸收 logo→导航 之间的弹性空间；
   导航项间距设计值 71，窄屏用 clamp 平滑收窄到 24，避免把搜索按钮挤出视口 */
.site-topbar__nav {
  display: flex;
  align-items: center;
  margin-left: auto;
  gap: clamp(24px, calc(6.25vw - 34px), 71px);
}
.site-topbar__nav a {
  font-size: 16px;
  color: rgba(255, 255, 255, .8);
  position: relative;
  white-space: nowrap;
  transition: color .2s;
}
.site-topbar__nav a:hover { color: var(--color-brand); }
/* 兜底：TRS 静态化后当前栏目导航项 href="./"（指向自身）时，即便忘加 .is-active
   也让它高亮。选择器只匹配裸 "./"，不影响其他相对路径 */
.site-topbar__nav a[href="./"],
.site-topbar__nav a.is-active {
  color: #F2F8CA;
  z-index: 1;                                          /* 建立层叠上下文：::before 光晕落在顶栏背景之上、文字之下 */
  text-shadow: 0 0 16px rgba(242, 248, 202, 0.44);     /* 设计稿文字阴影 blur16 / #f2f8ca 43% */
}
/* 高亮项光晕：复刻设计稿「椭圆 实色 #f2f8ca + 高斯模糊 18」，纯 CSS 无需切图 */
.site-topbar__nav a[href="./"]::before,
.site-topbar__nav a.is-active::before {
  content: '';
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 92%;
  height: 15px;
  border-radius: 50%;
  background: #F2F8CA;
  filter: blur(18px);
  pointer-events: none;
}

/* 搜索按钮：101×44 圆角 22px，描边白 0.8；flex:0 0 auto 保证永不被压缩，
   margin-left 57 = 设计稿「关于我们」到搜索框的固定间距 */
.site-topbar__search {
  flex: 0 0 auto;
  display: flex; align-items: center; gap: 8px;
  width: 101px; height: 44px; padding: 0 13px;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, .8);
  border-radius: 22px;
  font-size: 16px;
  color: rgba(255, 255, 255, .8);
  margin-left: 57px;
}
.site-topbar__search img { width: 24px; height: 24px; filter: brightness(0) invert(1); }

/* 公共章节大标题（首页用），字体与 .stg-title 保持一致（宋体） */
.section-title {
  font-family: "Songti SC", "STSong", "Noto Serif SC", serif;
  font-size: 34px;
  font-weight: 500;
  color: var(--color-brand-deep);
  line-height: 48px;
  margin-bottom: 20px;
}
.more-link {
  display: block;
  width: 100%;
  text-align: center;
  font-family: var(--font-serif);
  font-size: 16px;
  font-weight: 700;
  color: var(--color-text-primary);
  padding: 16px 0;
  margin-top: 50px;
  border: 1px solid var(--color-divider);
  border-radius: 999px;
}
.more-link:hover { background: var(--color-bg-soft); color: var(--color-brand-deep); }

/* === Footer：半透明黑 0.7（226 高 + 52 底条 0.3）=== */
/* 底导（2026 新版）：浅灰主区 + 中灰版权栏，文字 #333。
   参考首页 Sketch 画板底部实际排布：3 列（友情链接 18px 标题 / 联系我们 18px 标题 / 二维码组无标题）
   底部背景装饰：长城日落水墨纹理图，1920 全宽按 cover 铺满，浅灰 #c6c6c6 兜底 */
.bnjj-footer {
  /* 半透明黑蒙层：长城水墨底纹从 body 延伸穿过 footer 显示 */
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  padding-top: 38px;
  font-family: var(--font-sans);
}
.bnjj-footer__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) auto;
  gap: 56px;
  padding-bottom: 40px;   /* 左右间距由 .container-w 统一提供，勿用 padding 简写覆盖 */
}
.bnjj-footer__col h4 {
  font-size: 18px;
  font-weight: 600;          /* PingFangSC-Semibold */
  color: #fff;
  line-height: 25px;
  margin: 0 0 12px;          /* 设计稿：标题到首行内容 ~10px */
}
.bnjj-footer__col p {        /* 联系我们各行：地址/电话/邮箱 */
  font-size: 14px;
  line-height: 20px;
  color: #fff;
  margin: 0 0 15px;
}
.bnjj-footer__col p:last-child { margin-bottom: 0; }
.bnjj-footer__links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px 40px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.bnjj-footer__links li { margin: 0; }
.bnjj-footer__links a { font-size: 14px; line-height: 20px; color: #fff; text-decoration: none; }
.bnjj-footer__links a:hover { color: var(--color-brand); }
/* 二维码组：3 张 100×100 卡片 + 下方名称，横排 gap 20（参考控件页老母版 3 个二维码间距 20px）*/
.bnjj-footer__qr { display: flex; gap: 20px; }
/* 每卡固定 100px 宽度（与图同宽），文字长度不再影响卡片宽度、gap 视觉等距 */
.bnjj-footer__qr div { flex: 0 0 100px; text-align: center; }
.bnjj-footer__qr img {
  display: block;
  width: 100px; height: 100px;
  background: #d8d8d8;
  border-radius: 0;
  margin: 0 auto 10px;              /* 图片水平居中：left/right auto */
}
.bnjj-footer__qr span {
  display: block;
  font-size: 14px;
  line-height: 20px;
  color: #fff;
}
.bnjj-footer__copyright {
  /* 版权栏：单独一层更深的半透明黑，与主区区分 */
  background: rgba(0, 0, 0, 0.65);
  min-height: 40px;
  font-size: 14px;
  line-height: 20px;
  color: #fff;
}
/* 内部容器：flex + wrap 布局，宽屏一行 4 段并排、窄屏自动换行；
   横向 padding 由 .container-w 提供，只补上下 padding 让多行不贴顶 */
.bnjj-footer__copyright .container-w {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 32px;
  padding-top: 10px;
  padding-bottom: 10px;
  min-height: 40px;
  box-sizing: border-box;
}
.bnjj-footer__copyright .container-w span { white-space: nowrap; }
.bnjj-footer__copyright .container-w {
  display: flex;
  align-items: center;
}