/* Palette & variables */
:root{
  --bg:#f6f4ef; /* 轻纸张底色（暖灰） */
  --ink:#11110f; /* 炭黑 */
  --muted:#6e6a60;
  --accent:#8a867d; /* subtle warm */
  --gutter:24px;
  --content-width:780px; /* 合同要求正文居中约780px */
}

/* Reset & base */
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,system-ui;line-height:1.6;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
.sr{position:absolute!important;border:0!important;padding:0!important;width:1px!important;height:1px!important;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}

/* Header: 左对齐紧凑品牌栏 + 居中站名加左右文本链接 */
.site-header{padding:12px calc(var(--gutter));border-bottom:1px solid rgba(0,0,0,0.04);background:transparent}
.site-nav{display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:0 auto}
.site-nav .nav-left,.site-nav .nav-right{display:flex;gap:12px;align-items:center;color:var(--muted);font-size:13px}
.site-nav a.home{color:var(--ink);text-decoration:none;font-weight:600}
.brand{font-family:Georgia, 'Times New Roman', serif;font-size:18px;letter-spacing:0.6px;flex:0 0 auto}
.nav-text{opacity:0.9}

/* Page container between 1120 - 1440, centered */
.page{max-width: clamp(1120px, 86vw, 1440px);margin:24px auto;padding:0 20px}

/* 三轨网格（桌面）与移动重排 */
.layout-grid{display:grid;grid-template-columns:220px var(--content-width) 240px;gap:32px;align-items:start}
.col-left{color:var(--muted);font-size:14px}
.col-right{font-size:14px}
.col-main{min-width:0}

/* article header and title composition：紧凑标题加关键词眉题 */
.eyebrow{font-size:13px;color:var(--accent);font-weight:600;letter-spacing:0.06em;margin-bottom:8px}
h1{font-family:Georgia, 'Times New Roman', serif;font-size:28px;margin:0 0 10px;color:var(--ink);line-height:1.18}
.article-meta{font-size:13px;color:var(--muted);display:flex;gap:12px;align-items:center;margin-bottom:12px}
.summary{color:var(--muted);margin:0 0 18px}

/* 内容区双层基线网格感 */
.baseline-grid{background-image:
  repeating-linear-gradient( to bottom, rgba(0,0,0,0.02) 0px, rgba(0,0,0,0.02) 1px, transparent 1px, transparent 12px ),
  repeating-linear-gradient( to bottom, rgba(0,0,0,0.01) 0px, rgba(0,0,0,0.01) 1px, transparent 1px, transparent 24px );
  padding:6px 0 24px;}
.baseline-grid > *{padding:6px 0}

/* Body typography (无衬线) */
.article-body p{margin:0 0 14px;color:var(--ink);font-size:16px}
.article-body h2{font-family:Georgia, 'Times New Roman', serif;font-size:20px;margin:20px 0 8px}
.article-body ul, .article-body ol{margin:0 0 14px 1.15em}

/* FAQ pattern: 无卡片的details折叠列表 */
.faq-section h2{font-size:18px;margin-top:20px;color:var(--ink)}
.faq-list details{border-top:1px solid rgba(0,0,0,0.04);padding:10px 0}
.faq-list summary{cursor:pointer;font-weight:600;color:var(--accent);list-style:none;outline:none}
.faq-list details[open] summary{color:var(--ink)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list details p{margin:8px 0 0;color:var(--muted)}

/* Related: 四列紧凑标题网格（desktop） */
.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.related-grid a{display:block;color:var(--ink);text-decoration:none;font-size:14px;line-height:1.35}

/* Meta block in left aside */
.meta-block dt{font-weight:700;font-size:12px;color:var(--muted)}
.meta-block dd{margin:6px 0 14px}
.kw{font-size:13px;color:var(--ink)}

/* Ads: independent non-floating containers */
.ad{max-width:1200px;margin:18px auto;padding:6px 12px;color:var(--muted);font-size:13px;border:1px dashed rgba(0,0,0,0.04);background:transparent}
.ad-top,.ad-middle,.ad-bottom{background:transparent}

/* Footer */
.site-footer{padding:20px 16px;margin-top:28px;border-top:1px solid rgba(0,0,0,0.04);color:var(--muted)}
.footer-inner{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center}

/* Density: 舒展 */
.layout-grid, .article-body, .faq-list, .related-grid{gap:var(--gutter)}

/* Visual signature: avoid common forbidden patterns (no gradients/glow buttons). Use restrained borders and baseline.) */

/* Desktop-specific rules (>=1024px) */
@media (min-width: 1024px){
  /* Ensure main column centered and approx 780px */
  .page{padding:0}
  .layout-grid{grid-template-columns:200px var(--content-width) 240px;gap:40px}
  .brand{font-size:20px}
  h1{font-size:32px}
  .related-grid{grid-template-columns:repeat(4,1fr)}
}

/* Mobile-specific rules (<=767px): 独立重排 */
@media (max-width: 767px){
  .site-nav{padding:0 8px}
  .page{margin:12px auto;padding:0 12px}
  .layout-grid{display:block}
  /* DOM order: article first, then asides (两侧信息全部移动到正文之后) */
  .col-left,.col-right{order:2;margin-top:18px}
  .col-main{order:1}
  .col-left .meta-block{border-top:1px solid rgba(0,0,0,0.04);padding-top:12px}
  .col-right{border-top:1px solid rgba(0,0,0,0.04);padding-top:12px}
  .col-left,.col-right{font-size:14px}
  .related-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  h1{font-size:22px}
  .eyebrow{font-size:12px}
  .baseline-grid{background-image:none;padding:0}
}

/* Prevent horizontal overflow at very small widths */
@media (max-width: 320px){
  body{font-size:14px}
  .page{padding:0 8px}
}

/* Accessibility helpers */
a:focus{outline:2px dashed var(--accent);outline-offset:3px}