/* news-detail.css — 新闻详情页（正文 + 侧栏 + 相关阅读）
   2026-10-19：模板改版后 newsart__hero / newsrel / newsgrid3 缺样式，
   导致主图被纵向拉伸、相关报道粘连，此处补齐 */

/* ---------- 1. 两栏容器 ---------- */
.newswrap{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:clamp(24px,3.4vw,48px);
  align-items:start;
}
.newsart{min-width:0}

/* ---------- 2. 面包屑 / 标题区 ---------- */
.newsart__crumb{
  margin:0 0 14px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  font-size:13px;
  line-height:1.6;
  color:#7b8aa3;
}
.newsart__crumb a{color:#4a5b75;text-decoration:none}
.newsart__crumb a:hover{color:#0f2a52;text-decoration:underline}
.newsart__crumb span{color:#b3bdcb}

.newsart__kicker{
  margin:0 0 10px;
  font:600 12px/1.5 inherit;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#7b8aa3;
}
.newsart__title{
  margin:0 0 12px;
  font-size:clamp(26px,3.2vw,38px);
  line-height:1.25;
  letter-spacing:-.01em;
  color:#0f2a52;
}
.newsart__lede{
  margin:0 0 12px;
  font-size:16.5px;
  line-height:1.75;
  color:#4a5b75;
}

.newsart__byline{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin:0 0 22px;
  font-size:13.5px;
  color:#7b8aa3;
}
.newsart__by{font-weight:600;color:#4a5b75}
.newsdot{color:#b3bdcb}

/* ---------- 3. 主图：按原图像素显示，不裁剪、不放大 ---------- */
.newsart__hero{
  margin:0 0 26px;
  padding:clamp(16px,3vw,30px);
  background:#f7f9fc;
  border:1px solid rgba(16,42,82,.08);
  border-radius:14px;
  text-align:center;
}
.newsart__hero img{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  margin:0 auto;
  border-radius:8px;
  background:#fff;
}
.newsart__hero figcaption{
  margin:10px 0 0;
  font-size:13px;
  line-height:1.6;
  color:#8c99ad;
}
.newsart__hero figcaption b{font-weight:600;color:#5a6b85}

/* 正文里的插图同样不裁切 */
.newsart__body img{
  display:block;
  max-width:100%;
  height:auto;
  border-radius:10px;
}

/* ---------- 4. 正文 ---------- */
.newsart__body{
  font-size:15.5px;
  line-height:1.8;
  color:#2b3a52;
}
.newsart__body > p{margin:0 0 14px}
.newsart__body .pdblock{margin:0 0 18px}
.newsart__body .vgrid{margin:0 0 18px}

/* ---------- 5. 侧栏 ---------- */
.newscard-col{
  display:flex;
  flex-direction:column;
  gap:16px;
  position:sticky;
  top:88px;
}
.newscard-col .newscard{
  padding:16px 18px 18px;
  border:1px solid rgba(16,42,82,.10);
  border-radius:14px;
  background:#fff;
}
.newscard__lb{
  margin:0 0 12px;
  padding:0 0 10px;
  border-bottom:1px solid rgba(16,42,82,.08);
  font:600 12px/1.4 inherit;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#7b8aa3;
}
.newscard-col .pdkey{margin:0 0 14px}
.newscard-col .pdact{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:0 0 4px;
}
.newscard-col .pdact .btn{
  flex:1 1 0;
  min-width:0;
  padding-left:12px;
  padding-right:12px;
  justify-content:center;
  text-align:center;
  white-space:nowrap;
}
.newslangpair{margin:14px 0 0;font-size:13.5px}
.newslangpair a{color:#4a5b75;text-decoration:none}
.newslangpair a:hover{color:#0f2a52;text-decoration:underline}

/* 相关报道：关键词 / 标题 / 日期各占一行 */
.newsrel{
  margin:0;
  padding:0;
  list-style:none;
}
.newsrel li{
  padding:10px 0;
  border-bottom:1px solid rgba(16,42,82,.06);
}
.newsrel li:first-child{padding-top:0}
.newsrel li:last-child{border-bottom:0;padding-bottom:0}
.newsrel a{display:block;text-decoration:none;color:inherit}
.newsrel__k{
  display:block;
  margin:0 0 3px;
  font:600 11px/1.4 inherit;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#9aa7b8;
}
.newsrel__t{
  display:block;
  margin:0 0 3px;
  font-size:13.5px;
  line-height:1.55;
  color:#0f2a52;
}
.newsrel a:hover .newsrel__t{color:#123f7a;text-decoration:underline}
.newsrel__d{display:block;font-size:12px;color:#9aa7b8}

/* ---------- 6. 继续阅读（3 列卡片） ---------- */
.news-more{
  margin:clamp(36px,5vw,58px) 0 0;
  padding:clamp(28px,4vw,44px) 0 0;
  border-top:1px solid rgba(16,42,82,.10);
}
.news-more .sec__h2{margin:0 0 clamp(16px,2vw,24px)}
.newsgrid3{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(14px,1.8vw,22px);
}
.newsgrid3 .newscard{
  display:flex;
  flex-direction:column;
  border:1px solid rgba(16,42,82,.10);
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  transition:border-color .25s,box-shadow .25s;
}
.newsgrid3 .newscard:hover{
  border-color:rgba(16,42,82,.22);
  box-shadow:0 10px 26px rgba(16,42,82,.08);
}
.newsgrid3 .newscard__media{
  display:block;
  aspect-ratio:16/10;
  background:#fff;
  overflow:hidden;
}
.newsgrid3 .newscard__media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}
.newsgrid3 .newscard__body{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:14px 16px 16px;
}
.newsgrid3 .newscard__kicker{
  margin:0;
  font:600 11px/1.4 inherit;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#9aa7b8;
}
.newsgrid3 .newscard__title{
  margin:0;
  font-size:15px;
  line-height:1.45;
  color:#0f2a52;
}
.newsgrid3 .newscard__title a{color:inherit;text-decoration:none}
.newsgrid3 .newscard:hover .newscard__title a{text-decoration:underline}
.newsgrid3 .newscard__lede{
  margin:0;
  font-size:13.5px;
  line-height:1.6;
  color:#5a6b85;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.newsgrid3 .newscard__date{margin:2px 0 0;font-size:12px;color:#9aa7b8}

/* ---------- 7. 响应式 ---------- */
@media(max-width:1024px){
  .newswrap{grid-template-columns:1fr}
  .newscard-col{
    position:static;
    flex-direction:row;
    flex-wrap:wrap;
    margin:0 0 8px;
  }
  .newscard-col .newscard{flex:1 1 300px}
  .newsgrid3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .newsart__title{font-size:24px}
  .newsart__lede{font-size:15.5px}
  .newsart__hero{margin:0 0 20px}
  .newscard-col{flex-direction:column}
  .newscard-col .newscard{flex:1 1 auto}
  .newsgrid3{grid-template-columns:1fr}
}