/* 全局变量与重置 */
:root{
  --bg-paper:#f7f5ef; /* 纸白 */
  --ink:#0b2540;     /* 藏蓝 */
  --muted:#55657a;
  --accent:#0b2540;
  --max-width:1280px; /* 在 1120—1440 之间 */
  --gap:20px;
  --radius:6px; /* 小圆角，避免大圆角卡片 */
  --font-stack: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;
}
html,body{height:100%;}
body{
  margin:0;
  background:var(--bg-paper);
  color:var(--ink);
  font-family:var(--font-stack);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
.site-header{padding:18px 16px 6px;border-bottom:1px solid rgba(11,37,64,0.06);text-align:center}
.toolbar{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}
.site-name{font-weight:700;color:var(--ink);font-size:18px}
.breadcrumb{font-size:13px;color:var(--muted)}
.hr-nav{margin-top:10px}
.hr-nav .line{display:block;height:1px;background:linear-gradient(90deg,transparent,rgba(11,37,64,0.08),transparent);}

.page{max-width:var(--max-width);margin:26px auto;padding:0 18px;box-sizing:border-box}
.split-head{display:grid;grid-template-columns:1fr;gap:18px;align-items:start;margin-bottom:18px}
.title-block{min-width:0}
.eyebrow{font-size:13px;color:var(--accent);font-weight:600;margin-bottom:6px}
h1{font-size:28px;line-height:1.12;margin:0 0 8px;font-weight:700}
.meta{font-size:13px;color:var(--muted);display:flex;gap:12px;flex-wrap:wrap}
.summary{font-size:15px;color:var(--muted);padding-top:6px}

/* 内容网格基础样式 */
.content-grid{display:block}
.content{background:transparent;padding:0;margin:0}
.content :where(p,div,ul,ol){font-size:16px;color:var(--ink);margin:0 0 14px}
.ad{margin:18px 0}
.ad-top,.ad-middle,.ad-bottom{background:transparent}

/* 侧栏样式（FAQ 与 相关阅读） */
.side{margin-top:18px}
.faq{border-top:3px solid var(--accent);padding-top:12px;margin-bottom:18px}
.faq h2{font-size:16px;margin:0 0 8px;color:var(--ink)}
.faq-body{font-size:15px;color:var(--muted)}

.related{margin-top:8px}
.related-title{background:var(--ink);color:var(--bg-paper);padding:8px 12px;font-weight:700;border-radius:2px 2px 0 0}
.related-list{display:grid;grid-template-columns:1fr;gap:10px;padding:12px 0 0}
.related-list > *{padding:8px 6px;border-left:3px solid transparent;border-bottom:1px solid rgba(11,37,64,0.04);font-size:14px;color:var(--muted)}

.site-footer{padding:24px 18px 40px;text-align:center;color:var(--muted);font-size:13px}

/* 禁用大圆角和阴影的卡片化风格（视觉禁止） */
*{box-sizing:border-box}

/* 桌面端规则：1024px 及以上 */
@media (min-width:1024px){
  :root{--max-width:1280px}
  .split-head{grid-template-columns:1fr 1fr;gap:28px;align-items:start}
  .title-block{padding-right:12px}
  .summary{padding-left:12px;border-left:1px solid rgba(11,37,64,0.04);color:var(--muted)}
  h1{font-size:34px}

  .content-grid{display:grid;grid-template-columns:7fr 5fr;gap:36px;align-items:start}
  .content{padding-right:6px}
  .content :where(p,div,ul,ol){font-size:17px}

  .side{position:relative}
  .related-list{grid-template-columns:1fr 1fr 1fr;gap:12px;padding-top:12px}
  .related-list > *{border-bottom:0;padding:8px;border-left:4px solid rgba(11,37,64,0.03);background:transparent}

  /* 桌面专属差异：右栏固定信息流与视觉密度增加（仅在 >1024成立） */
  .side{padding-left:8px}
}

/* 手机端规则：最大宽度 767 */
@media (max-width:767px){
  :root{--max-width:720px}
  .site-header{padding:12px 12px}
  .page{margin:14px auto;padding:0 12px}
  .split-head{grid-template-columns:1fr;gap:10px}
  h1{font-size:20px}
  .eyebrow{font-size:12px}
  .summary{order:2;padding:0}
  .meta{font-size:12px;gap:8px}

  .content-grid{display:block}
  .content{padding:0}
  .content :where(p,div,ul,ol){font-size:15px}

  /* 侧栏按合同下移为自然区块（FAQ 与 推荐顺序显示） */
  .side{padding-top:12px}
  .related-list{grid-template-columns:1fr 1fr 1fr}
  .related-list > *{font-size:13px}

  /* 保证 320px 时无横向滚动 */
  body,html{min-width:0}
}

/* 可读性与密度微调（技术资讯紧凑型） */
h1,h2{letter-spacing:-0.01em}
p{orphans:2;widows:2}