/* news-list.css — 新闻列表页（masthead / 头条区 / 单列列表）
   2026-10-17：正文由多列卡片网格改为单列列表
   仅在 news.html 与 news/zh.html 引入 */

/* ---------- 1. 页头 ---------- */
.news-masthead{
  background:linear-gradient(180deg,#eef2f7 0%,#f7f9fc 100%);
  border-bottom:1px solid rgba(16,42,82,.08);
  padding:clamp(28px,4vw,46px) 0 clamp(22px,3vw,34px);
}
.news-masthead__kicker{
  margin:0 0 10px;
  font:600 12px/1.4 inherit;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#7b8aa3;
}
.news-masthead__row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px 18px;
  flex-wrap:wrap;
}
.news-masthead__title{
  margin:0;
  font-size:clamp(30px,4vw,44px);
  line-height:1.12;
  letter-spacing:-.02em;
  color:#0f2a52;
}
.news-masthead__date{
  margin:0;
  font-size:14px;
  color:#7b8aa3;
  white-space:nowrap;
}
.news-masthead__lead{
  margin:14px 0 0;
  max-width:74ch;
  font-size:16px;
  line-height:1.75;
  color:#4a5b75;
}

/* ---------- 2. 头条区：左大卡 + 右“最新”列表 ---------- */
.news-top{
  display:grid;
  grid-template-columns:minmax(0,1.22fr) minmax(0,1fr);
  align-items:start;
  gap:clamp(16px,2vw,26px);
  margin:0 0 clamp(24px,3vw,34px);
  padding-bottom:clamp(22px,3vw,30px);
  border-bottom:1px solid rgba(16,42,82,.10);
}
.news-lead{
  display:grid;
  grid-template-rows:auto 1fr;
  border:1px solid rgba(16,42,82,.10);
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  text-decoration:none;
  color:inherit;
  transition:border-color .28s,box-shadow .28s;
}
.news-lead:hover{
  border-color:rgba(16,42,82,.24);
  box-shadow:0 10px 28px rgba(16,42,82,.10);
}
.news-lead__media{
  display:block;
  aspect-ratio:2/1;
  background:#fff;
  overflow:hidden;
}
.news-lead__media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  transition:transform .4s;
}
.news-lead:hover .news-lead__media img{transform:scale(1.03)}
.news-lead__body{
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:18px 22px 20px;
}
.news-lead__body > span{display:block}
.news-lead__kicker{
  font:600 11.5px/1.4 inherit;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#7b8aa3;
}
.news-lead__title{
  font-size:clamp(18px,1.6vw,22px);
  line-height:1.4;
  font-weight:700;
  color:#0f2a52;
}
.news-lead__lede{
  font-size:14.5px;
  line-height:1.7;
  color:#5a6b85;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.news-lead__date{margin-top:auto;font-size:13px;color:#8c99ad}

.news-headlines{
  align-self:start;
  margin:0;
  padding:0;
  list-style:none;
  display:flex;
  flex-direction:column;
  border:1px solid rgba(16,42,82,.10);
  border-radius:14px;
  background:#fff;
  overflow:hidden;
}
.news-headlines__lb{
  padding:12px 18px;
  font:600 11.5px/1.4 inherit;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#7b8aa3;
  background:#f6f8fb;
  border-bottom:1px solid rgba(16,42,82,.08);
}
.news-headlines li:not(.news-headlines__lb){
  border-bottom:1px solid rgba(16,42,82,.07);
}
.news-headlines li:last-child{border-bottom:0}
.news-headlines a{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:12px 18px;
  text-decoration:none;
  color:inherit;
  transition:background .2s;
}
.news-headlines a:hover{background:#f6f8fb}
.news-headlines__t{
  font-size:14px;
  line-height:1.5;
  color:#0f2a52;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.news-headlines__d{font-size:12.5px;color:#8c99ad}

/* ---------- 3. 正文列表：单列，一条一行 ---------- */
.newslist{
  display:flex;
  flex-direction:column;
  gap:0;
  margin:0 0 10px;
  border-top:1px solid rgba(16,42,82,.10);
}
.newslist .newscard{
  display:grid;
  grid-template-columns:200px minmax(0,1fr);
  gap:clamp(16px,2vw,26px);
  align-items:start;
  padding:22px 12px;
  margin:0 -12px;
  border-bottom:1px solid rgba(16,42,82,.10);
  border-radius:12px;
  transition:background .22s;
}
.newslist .newscard:hover{background:#f7f9fc}
.newslist .newscard__media{
  display:block;
  aspect-ratio:16/10;
  border-radius:10px;
  overflow:hidden;
  background:#fff;
}
.newslist .newscard__media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  transition:transform .4s;
}
.newslist .newscard:hover .newslist .newscard__media img{transform:scale(1.04)}
.newslist .newscard__body{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.newslist .newscard__kicker{
  margin:0;
  font:600 11.5px/1.4 inherit;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#7b8aa3;
}
.newslist .newscard__title{margin:0;font-size:17px;line-height:1.45;font-weight:700}
.newslist .newscard__title a{
  color:#0f2a52;
  text-decoration:none;
  transition:color .2s;
}
.newslist .newscard__title a:hover{
  color:#123f7a;
  text-decoration:underline;
  text-underline-offset:3px;
}
.newslist .newscard__lede{
  margin:0;
  font-size:14.5px;
  line-height:1.68;
  color:#5a6b85;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.newslist .newscard__date{margin:2px 0 0;font-size:13px;color:#8c99ad}

/* ---------- 4. 响应式 ---------- */
@media(max-width:900px){
  .news-top{grid-template-columns:1fr}
  .news-lead__media{aspect-ratio:2/1}
}
@media(max-width:640px){
  .newslist .newscard{
    grid-template-columns:112px minmax(0,1fr);
    gap:13px;
    padding:16px 8px;
    margin:0 -8px;
  }
  .newslist .newscard__title{font-size:15.5px;line-height:1.42}
  .newslist .newscard__lede{-webkit-line-clamp:2;font-size:13.5px}
  .news-masthead__row{flex-direction:column;gap:6px}
  .news-masthead__title{font-size:28px}
  .news-masthead__lead{font-size:15px}
  .news-lead__body{padding:16px 16px 18px}
  .news-headlines a{padding:11px 14px}
  .news-headlines__lb{padding:10px 14px}
}