/* 视界资讯视窗 — fullwidth-bands 模板样式
   设计种子：8605c311274862fc
   关键点：墨绿与米白配色、大面积留白、紧凑字阶、带状分割、桌面双栏非对称、手机单列重排
*/
:root{
  --bg-ivory:#f7f3ea; /* 米白 */
  --band-ivory:#fbf9f5;
  --ink-green:#0b3b2f; /* 墨绿 */
  --muted-green:#eaf3ef;
  --text:#222;
  --lead:#444;
  --accent:#114b3f;
  --max-desktop:1280px;
  --min-desktop:1120px;
  --gap:20px;
  --band-padding-vert:36px;
  --band-padding-horz:28px;
}

/* 全局重置与排版 */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg-ivory);
  color:var(--text);
  font-family: "Georgia", "Times New Roman", Times, serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.band{width:100%; padding:var(--band-padding-vert) 0;}
.band-inner{margin:0 auto; padding:0 var(--band-padding-horz);}
.container--header{max-width:var(--max-desktop)}
.container--title{max-width:var(--max-desktop)}
.container--content{max-width:var(--max-desktop)}
.container--faq{max-width:var(--max-desktop)}
.container--related{max-width:var(--max-desktop)}
.container--ad{max-width:var(--max-desktop)}
.container--footer{max-width:var(--max-desktop)}

/* 视觉基调：横带颜色区分，但保持纸张感 */
.band--header{background:linear-gradient(180deg,var(--band-ivory),var(--bg-ivory)); border-bottom:1px solid rgba(10,20,15,0.04)}
.band--title{background:transparent}
.band--content{background:var(--bg-ivory)}
.band--faq{background:rgba(17,75,63,0.03)}
.band--related{background:transparent}
.band--ad{background:transparent}
.band--footer{background:transparent; padding:18px 0}

/* 头部：居中刊头与横线导航（单行文字刊头） */
.masthead-top{display:flex; justify-content:center; align-items:baseline}
.site-title{color:var(--ink-green); font-weight:700; text-decoration:none; font-size:20px}
.masthead-nav{display:flex; justify-content:center; gap:10px; margin-top:8px; color:var(--lead); font-size:13px}
.masthead-nav .dot{opacity:.6}

/* 标题构成：紧凑标题加关键词眉题 */
.eyebrow{color:var(--accent); font-weight:600; letter-spacing:0.08em; font-size:12px; margin-bottom:6px}
.title{font-size:34px; line-height:1.15; margin:0 0 10px 0; color:var(--ink-green)}
.meta-row{color:var(--lead); font-size:13px; margin-bottom:14px}
.summary{margin:0; color:var(--lead); font-size:16px; max-width:70ch}

/* 文章主体：桌面非对称双栏，手机单列 */
.article-grid{display:grid; grid-template-columns:1fr; gap:28px; align-items:start}
.article-aside{order:0}
.article-body{order:1}

.content-body{color:var(--text); font-size:17px}
.content-body p{margin:0 0 1em 0}
.content-body h2{margin:1.2em 0 .6em 0; font-size:20px; color:var(--ink-green)}

/* 侧栏内容（仅为元信息、摘要类） */
.aside-block{margin-bottom:18px; color:var(--lead)}
.aside-label{font-size:12px; color:var(--accent); font-weight:600; margin-bottom:6px}
.aside-content{font-size:14px}

/* FAQ 列表遵循横线问答列表 */
.section-title{font-size:18px; margin:0 0 14px 0; color:var(--ink-green)}
.faq-list{border-top:1px solid rgba(10,20,15,0.06)}
.faq-list > * + *{border-top:1px solid rgba(10,20,15,0.06); padding-top:14px; margin-top:14px}
.faq-list dt{font-weight:600; margin:0 0 6px 0}
.faq-list dd{margin:0 0 8px 0; color:var(--lead)}

/* 相关阅读：四列紧凑标题网格（desktop） */
.related-grid{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(2,1fr); gap:10px}
.related-grid li{font-size:14px; color:var(--lead);}
.related-grid a{color:inherit; text-decoration:none}

/* 广告容器样式（独立容器，不悬浮） */
.band--ad .band-inner{padding:8px 0}
.band--ad [data-ad], .band--ad > *{display:block}

/* 页脚 */
.footer-line{color:var(--lead); font-size:13px; text-align:center}

/* 禁止大圆角与卡片式统一容器：不使用圆角阴影 */
*{border-radius:0}

/* --- 响应：桌面与手机必须为两套不同排版 --- */
@media (min-width:1024px){
  /* 容器强制在 1120 - 1440 之间体现宽屏利用 */
  .band-inner{max-width:var(--max-desktop); margin:0 auto}
  .container--title{max-width:1200px}
  .container--content{max-width:1280px}
  .container--faq{max-width:1100px}
  .container--related{max-width:1280px}

  /* 非对称双栏：侧注固定宽，正文保持舒适阅读宽度 */
  .article-grid{grid-template-columns:240px 1fr; gap:44px}
  .article-aside{position:relative}
  .article-body{min-width:0}

  /* 相关阅读四列紧凑网格 */
  .related-grid{grid-template-columns:repeat(4,1fr); gap:14px}
  .related-grid li{font-size:14px}

  /* 标题更为突出，紧凑字阶 */
  .title{font-size:40px}
  .summary{font-size:17px}
}

@media (max-width:767px){
  /* 手机端：所有色带取消过宽内边距并自然单列，颜色轻量区分 */
  :root{--band-padding-vert:18px; --band-padding-horz:14px}
  .band-inner{padding:0 14px}
  .site-title{font-size:18px}
  .masthead-nav{font-size:12px}

  /* 单列流式布局，侧栏下移到正文之上（自然区块） */
  .article-grid{grid-template-columns:1fr; gap:14px}
  .article-aside{order:0}
  .article-body{order:1}

  /* 相关阅读改为单列或两列更适配小屏 */
  .related-grid{grid-template-columns:repeat(2,1fr); gap:10px}

  /* 减小字号，避免横向滚动或截断 */
  .title{font-size:20px}
  .summary{font-size:15px}
  .content-body{font-size:16px}

  /* 广告与模块为单列堆叠，禁止固定侧栏 */
  .band--ad .band-inner{padding:6px 0}
}

/* 可访问性微调 */
a{outline-color:rgba(17,75,63,0.2)}
