:root{
  --bg: #f7f3ea; /* 米白 */
  --ink: #0b3d2e; /* 墨绿 */
  --muted: #596157;
  --accent: #163e32;
  --container-min: 1120px;
  --container-max: 1280px; /* 在1120-1440之间，选1280为中点 */
  --band-gap: 28px;
  --line: rgba(11,61,46,0.08);
  --type-stack: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;
}

/* 基础重置与布局 */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--type-stack);
  background:var(--bg);
  color:var(--ink);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
.container{
  margin:0 auto;
  min-width: var(--container-min);
  max-width: var(--container-max);
  padding:24px 28px;
}

/* 头部：栏目索引式导航 */
.site-header{border-bottom:1px solid var(--line);background:transparent}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 0}
.brand .home-link{color:var(--accent);text-decoration:none;font-weight:700;font-size:1.05rem}
.index-nav ul{display:flex;gap:18px;list-style:none;margin:0;padding:0}
.index-nav a{color:var(--ink);text-decoration:none;font-weight:600}
.index-nav span{color:var(--muted)}

/* 色带样式：无圆角、细分隔线、无阴影 */
.band{padding:var(--band-gap) 0;border-top:1px solid var(--line)}
.band-inner{display:flex;align-items:flex-start;gap:24px}
.band-title{background:linear-gradient(180deg, rgba(247,243,234,0.9), rgba(247,243,234,0.98))}
.band-article{background:transparent}
.band-faq{background:#ffffff}
.band-related{background:transparent}
.ad-band{background:transparent;padding:18px 0;border-top:1px dashed var(--line);color:var(--muted);font-size:0.95rem}

/* 标题与摘要左右分置（桌面），移动端堆叠 */
.title-block{flex:1 1 60%}
.summary-block{flex:0 0 380px;max-width:42%;border-left:1px solid var(--line);padding-left:22px}
.page-title{margin:0;color:var(--accent);font-size:2.2rem;line-height:1.12;font-weight:800}
.summary{margin:0 0 10px 0;color:var(--muted)}
.meta{margin:6px 0 0 0;color:var(--muted);font-size:0.9rem}

/* 文章主体：纸刊式文字节奏，宽度受容器限制 */
.article-wrap{background:transparent;display:block}
.article{max-width:900px;margin:10px auto 0 auto}
.article-meta{margin-bottom:10px;color:var(--muted);font-size:0.95rem}
.article-content p{margin:0 0 1.05em 0;color:var(--ink);font-size:1.02rem}
.article-content a{color:var(--accent);text-decoration:underline}

/* 视觉签名：正文首段使用轻量首字强调，但不改写内容 */
.article-content p:first-of-type::first-letter{
  color:var(--accent);
  font-size:1.28em;
  font-weight:700;
  float:left;
  line-height:1;
  padding-right:6px;
}

/* FAQ：尽量呈编号式问答样式，但不假设内部结构 */
.section-title{margin-top:0;margin-bottom:12px;color:var(--accent);font-weight:700}
.faq{color:var(--muted);font-size:0.98rem}
/* 对常见容器尝试编号样式（若使用列表或段落则生效） */
.faq ol{counter-reset:faq}
.faq ol > li{counter-increment:faq;margin-bottom:12px;padding-left:34px;position:relative}
.faq ol > li::before{content:counter(faq)".";position:absolute;left:0;top:0;color:var(--accent);font-weight:700}
.faq > p{margin:0 0 12px 0}
.faq > div{margin:0 0 12px 0;padding-left:34px;position:relative}
.faq > div::before{content:"?";position:absolute;left:0;top:0;color:var(--accent);font-weight:700}

/* 相关阅读：两列摘要列表桌面，移动单列 */
.related{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.related > *{background:transparent;padding:6px 0;border-bottom:1px solid var(--line)}
.related a{color:var(--ink);text-decoration:none;font-weight:600}
.related p{margin:6px 0 0 0;color:var(--muted);font-size:0.95rem}

/* 页脚 */
.site-footer{border-top:1px solid var(--line);padding:18px 0;margin-top:20px}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:10px}
.foot-note{color:var(--muted);font-size:0.9rem}

/* 桌面专属规则（>=1024px）——明显不同布局与更宽容的留白 */
@media (min-width:1024px){
  .container{padding:32px 40px}
  /* 确保容器在1120-1440之间 */
  .container{min-width:1120px;max-width:1280px}
  .band-inner{align-items:flex-start}
  /* 标题与摘要左右分置更强调对齐 */
  .title-block{padding-right:12px}
  .summary-block{padding-left:28px}
  /* 相关文章两列明确 */
  .related{grid-template-columns:repeat(2,1fr)}
  /* 文章主体在中央宽舒适阅读宽度 */
  .article{max-width:900px}
}

/* 手机端规则（<=767px）——色带单列、内边距收紧、导航垂直 */
@media (max-width:767px){
  :root{--container-min:320px}
  .container{min-width:320px;max-width:100%;padding:12px}
  .header-inner{flex-direction:column;align-items:flex-start;gap:8px}
  .index-nav ul{flex-wrap:nowrap;overflow:auto;gap:12px}
  .band-inner{flex-direction:column}
  .title-block,.summary-block{flex:unset;max-width:100%;border-left:none;padding-left:0}
  .page-title{font-size:1.35rem}
  .summary{font-size:0.98rem}
  .article{max-width:100%;margin:8px 0 0 0}
  .article-content p{font-size:1rem}
  /* 相关阅读单列 */
  .related{grid-template-columns:1fr}
  /* 广告带内边距收紧 */
  .ad-band{padding:12px 0}
}

/* 无三列等宽营销卡片样式，禁用明显卡片样式 */
/* 保持低密度、无大圆角、无阴影 */