/* 全局变量与基础 */
:root{
  --bg: #f7f3ec; /* 象牙白 */
  --ink: #2f2330; /* 深紫灰 (偏墨) */
  --muted: #6e656d;
  --accent: #3b2b40;
  --line: rgba(60,48,60,0.08);
  --max-desktop: 1440px;
  --min-desktop: 1120px;
  --container-max: 1280px;
  --gutter: 28px;
  --tight: 1.05; /* 标题行高紧凑 */
  --readable: 1.7; /* 正文行高舒展 */
  font-synthesis: none;
}

/* 系统字体栈，报刊与正文区分 */
:root{--serif-stack: Georgia, 'Times New Roman', Times, serif;}
*{box-sizing:border-box}
html,body{height:100%;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;}
body{font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', Arial, sans-serif; margin:0;}

/* Header：左对齐紧凑品牌栏；双层报头但第二层极窄 */
.site-header{padding:20px 0 8px 0;}
.header-top{display:flex;align-items:center;gap:20px;padding:0 var(--gutter);}
.brand{color:var(--accent);font-weight:700;text-decoration:none;font-size:18px}
.top-mini{margin-left:auto;color:var(--muted);font-size:13px}
.header-slim{height:6px;background:linear-gradient(90deg,transparent,transparent);}

/* 容器：桌面端尽量处于 1120-1440 范围，居中 */
.wrap{margin:20px auto;padding:28px; width:94vw; max-width:var(--container-max);}

/* 文章头部：标题居中，摘要左对齐 */
.article-header{margin-bottom:18px;border-bottom:1px solid var(--line);padding-bottom:18px}
.title{font-family:var(--serif-stack);font-size:26px;line-height:var(--tight);text-align:center;margin:6px 0 12px 0;letter-spacing:-0.02em;color:var(--ink)}
.meta{display:flex;gap:18px;justify-content:center;color:var(--muted);font-size:13px;margin-bottom:6px}
.summary{max-width:78%;margin:0 auto;color:var(--muted);text-align:left;font-size:15px}

/* 主体网格：content + side-note 10/2 网格 (desktop) */
.content-grid{display:block}
.content{background:transparent}
.side-note{display:none}

/* 正文 */
.article-body .body-content{color:var(--ink);line-height:var(--readable);font-size:16px;word-wrap:break-word}
.article-body h2.sr{position:absolute;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);} /* 无障碍 */

/* FAQ 与相关阅读 样式 */
.faq h3,.related h3{font-size:16px;margin-top:18px;margin-bottom:6px;color:var(--accent)}
.faq-list, .related-list{padding-left:28px;margin:6px 0 20px 0;color:var(--muted)}
.faq-list li, .related-list li{margin-bottom:10px}
.related-list{counter-reset:related}
.related-list > li{list-style:decimal; margin-left:0}

/* 边注卡片无边框，仅章节横线语言 */
.side-note .note-surface{padding:12px 10px;border-top:1px solid var(--line)}
.note-title{font-weight:700;color:var(--accent);margin-bottom:8px}
.note-list{font-size:13px;color:var(--muted)}
.note-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px dashed var(--line)}
.note-row dt{color:var(--muted);font-weight:600}
.note-row dd{margin:0}

/* 广告槽样式：独立容器，不覆盖正文 */
.ad-slot{background:transparent;padding:12px 0;text-align:center;color:var(--muted);font-size:13px}
.ad-top{margin-bottom:8px}
.ad-middle{margin:18px 0}
.ad-bottom{margin-top:24px}

/* 页脚 */
.site-footer{padding:24px 0;color:var(--muted);font-size:13px;text-align:center;border-top:1px solid var(--line);margin-top:40px}

/* 小屏（移动端）规则：最大宽度 767px，边注并入标题下方，取消固定宽度 */
@media (max-width:767px){
  .wrap{width:100%;padding:16px}
  .title{font-size:20px;text-align:center;margin-bottom:8px}
  .summary{max-width:100%;padding:0 4px;text-align:left;font-size:14px}
  .meta{justify-content:flex-start;flex-wrap:wrap;padding-left:4px}
  /* 将侧注置于标题下方以并入信息流 */
  .side-note{display:block;margin:14px 0}
  .content-grid{display:block}
  .content{order:2}
  .side-note{order:1}
  .article-body .body-content{font-size:15px;line-height:1.65}
  .ad-slot{padding:10px 0}
}

/* 桌面（1024px 及以上）规则：采用无卡片简报风，10/2 非对称网格，充分利用宽屏 */
@media (min-width:1024px){
  .wrap{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:start;margin-top:28px;padding:36px;max-width:var(--container-max);}
  /* 按合同：正文 10 栏，边注 2 栏（10/2 网格） */
  .article{grid-column:1 / -1;display:contents}
  .content{grid-column:1 / span 10}
  .side-note{grid-column:11 / span 2;display:block}
  .side-note .note-surface{position:sticky;top:84px}
  /* 更强的标题层次 */
  .title{font-size:36px;letter-spacing:-0.03em}
  .summary{max-width:70%;margin-left:0}
  .article-body .body-content{font-size:17px}
  .faq h3,.related h3{font-size:15px}
}

/* 更大宽度时强制容器在 1120-1440 之间（满足合同要求） */
@media (min-width:1200px){
  .wrap{max-width:clamp(1120px, 80vw, 1440px)}
}

/* 无重度圆角、阴影、动画，保持刊物感 */