/* ============================================================
   CN NEWSWIRE 首页 —— 第二十九轮新增（2026-10-10）
   1) Case Studies：纯文本还原的百度搜索结果版式（替代模糊截图）
   2) 首页 Insights 板块：3 列网格（替代原 Newsroom 的 5 列）

   单独成文件，是为了**完全不动 homepage.css** ——
   否则要把全站 200+ 处 ?v= 版本号一起 bump，那才是真正的风险源。

   ⚠️ 关于缩放：卡宽是 clamp(280px, 24vw, 380px)，随视口在 280–380px 之间变。
   如果尺寸写死 px，窄卡必然底部溢出、宽卡底部大片空白。
   这里改用**容器查询单位 cqw**（1cqw = 查询容器宽的 1%），
   所有尺寸按 380px 参考宽换算 → 版式在任意卡宽下**等比缩放、完全一致**；
   而文字仍是真实文本，所以放多大都清晰（等于「同一张图的高清版」）。
   查询容器 = .case-slide__media（container-type: inline-size）。
   浏览器不支持 cqw 时，同一条规则里前面的 px 值兜底。
   ============================================================ */

/* ---------- 1. Case Studies —— 搜索结果卡 ---------- */
.case-slide__media{
  background:#ffffff;
  container-type: inline-size;
}

.serp{
  position:absolute; inset:0;
  display:flex; flex-direction:column;
  gap:9px; gap:2.37cqw;
  padding:12px 13px 14px;
  padding:3.16cqw 3.42cqw 3.68cqw;
  background:#ffffff;
  color:#333;
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",system-ui,-apple-system,sans-serif;
  font-size:13px; font-size:3.42cqw;
  line-height:1.5;
  text-align:left;
  overflow:hidden;
}
.serp::after{        /* 与原图一致的浅水印，压到几乎看不见，不影响清晰度 */
  content:"CN NEWSWIRE";
  position:absolute; left:50%; top:54%;
  transform:translate(-50%,-50%) rotate(-30deg);
  font-size:24px; font-size:6.32cqw;
  font-weight:800; letter-spacing:.12em; white-space:nowrap;
  color:oklch(0.53 0.19 27 / .05);
  pointer-events:none;
}

/* 顶部：Logo + 搜索框 + 百度一下 */
.serp__top{ display:flex; align-items:center; gap:5px; gap:1.32cqw; flex:0 0 auto; }
.serp__logo{ display:inline-flex; align-items:baseline; flex:0 0 auto;
  font-size:15px; font-size:3.95cqw; font-weight:800; letter-spacing:-.02em; }
.serp__logo b{ color:#2932e1; font-weight:800; }
.serp__logo i{ color:#e10602; font-style:normal; font-weight:800; }
.serp__logo em{ color:#e10602; font-style:normal;
  font-size:11px; font-size:2.89cqw; font-weight:700;
  margin-left:2px; margin-left:.53cqw; }
.serp__field{
  flex:1 1 auto; min-width:0;
  height:26px; height:6.84cqw;
  display:flex; align-items:center;
  padding:0 7px; padding:0 1.84cqw;
  border:2px solid #4e6ef2; border-width:.53cqw; border-right:none;
  border-radius:9px 0 0 9px; border-radius:2.37cqw 0 0 2.37cqw;
  background:#fff;
}
.serp__q{ font-size:11px; font-size:2.89cqw; color:#222; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.serp__go{
  flex:0 0 auto; height:26px; height:6.84cqw;
  display:flex; align-items:center;
  padding:0 9px; padding:0 2.37cqw;
  border-radius:0 9px 9px 0; border-radius:0 2.37cqw 2.37cqw 0;
  background:#4e6ef2; color:#fff;
  font-size:11px; font-size:2.89cqw; font-weight:600; white-space:nowrap;
}

/* 标签行 */
.serp__tabs{
  display:flex; flex:0 0 auto;
  gap:9px; gap:2.37cqw;
  font-size:11.5px; font-size:3.03cqw; color:#666;
  padding-bottom:6px; padding-bottom:1.58cqw;
  border-bottom:1px solid #ededed; border-bottom-width:.26cqw;
}
.serp__tabs .is-on{ color:#4e6ef2; font-weight:700; }

.serp__hint{ margin:0; flex:0 0 auto; font-size:11.5px; font-size:3.03cqw; color:#999; }

/* 结果列表：flex:1 吃掉剩余高度；余量在行与行之间均分（更接近原图的疏朗） */
.serp__rows{
  flex:1 1 auto; min-height:0;
  display:flex; flex-direction:column; justify-content:space-between;
  gap:10px; gap:2.63cqw;
  overflow:hidden;
}
.serp__row{ flex:0 0 auto; }
/* 4 条结果铺满 2:3 卡片：标题最多 2 行、摘要最多 2 行，总高正好落在卡内 */
.serp__t{
  margin:0 0 3px; margin:0 0 .79cqw;
  font-size:14px; font-size:3.68cqw;
  line-height:1.36; font-weight:400; color:#2440b3;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.serp__t em{ color:#c00; font-style:normal; }
.serp__s{
  margin:0;
  font-size:12.5px; font-size:3.29cqw;
  line-height:1.55; color:#333;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.serp__s em{ color:#c00; font-style:normal; }
.serp__time{ color:#767676; margin-right:5px; margin-right:1.32cqw; }
.serp__src{ margin:3px 0 0; margin:.79cqw 0 0; font-size:11.5px; font-size:3.03cqw; color:#999; }

/* ---------- 2. 首页 Insights 板块：3 列 ----------
   纯文字卡（不放封面图）：insights 的封面本身是一张「标题卡」，
   图里已经印着标题，卡片下面再排一次 h4 就等于标题出现两遍。 */
.newsroom-mm__list--insights{
  grid-template-columns:repeat(3,minmax(0,1fr));
  max-width:1120px;
  gap:1.6rem;
}
.newsroom-mm__list--insights .news-card{ padding:1.6rem 1.5rem; gap:.7rem; }
.newsroom-mm__list--insights .news-card h4{ font-size:1.08rem; min-height:2.7em; }
.newsroom-mm__list--insights .news-card__sum{ -webkit-line-clamp:3; min-height:4.5em; }

@media (max-width:1000px){
  .newsroom-mm__list--insights{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:640px){
  .newsroom-mm__list--insights{ grid-template-columns:1fr; }
  .newsroom-mm__list--insights .news-card{ padding:1.35rem 1.25rem; }
}