/* =====================================================================
   list.css —— 栏目列表页（list.html）专属样式
   共用样式见 assets/common.css；本文件仅含列表页独有：栏目标题覆盖（margin/字号/全宽 rule）/
        SVG 色带背景 / 列表面板 / 文章列表卡片 / 分页组件 / 列表页响应式
   ===================================================================== */

/* 栏目标题覆盖：缩短 margin、缩小标题、全宽 rule（覆盖 common.css 默认） */
.section-head{margin-bottom:18px;}
.section-head .titles h2{font-size:clamp(24px,3vw,32px);}
.section-head .rule{flex:0 0 100%; height:3px; width:100%; border-radius:2px; background:linear-gradient(90deg,var(--gold) 0%,var(--gold) 55%,rgba(181,134,46,.18) 100%);}

/* ============ SVG 色带几何构图（板块背景） ============ */
.list-bands{position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden;}
.list-bands .band{position:absolute;}
.band-tr{top:-50px; right:-30px; width:380px; height:380px;}
.band-bl{left:-50px; bottom:-40px; width:320px; height:320px;}

/* ============ 列表面板 ============ */
.list-panel{background:var(--paper-2); border:1px solid var(--line); border-radius:14px; padding:34px 36px;}

.list-intro{font-size:15px; color:var(--muted); line-height:1.8; margin:0 0 26px; padding:14px 18px; background:rgba(21,53,107,.04); border-left:3px solid var(--gold); border-radius:0 10px 10px 0;}

/* ============ 文章列表卡片（横向：封面 + 内容） ============ */
.article-list{display:block;}
.list-card{
  display:grid; grid-template-columns:200px 1fr; gap:0;
  background:var(--paper-2); border:1px solid var(--line); border-radius:14px;
  overflow:hidden; margin-bottom:20px; text-decoration:none; color:inherit;
  transition:.28s ease; cursor:pointer;
}
.list-card:hover{transform:translateY(-4px); box-shadow:0 22px 44px -26px rgba(16,42,87,.5); border-color:var(--gold);}
/* 封面图：宽高均不超过 200px；短边等比缩放至 200，长边溢出裁切 */
.list-card .thumb{position:relative; overflow:hidden; background:var(--jnu-700); width:200px; height:200px; max-width:200px; max-height:200px;}
.list-card .thumb img{width:200px; height:200px; max-width:200px; max-height:200px; object-fit:cover; object-position:center; display:block; transition:transform .6s ease;}
.list-card:hover .thumb img{transform:scale(1.06);}
.list-card .body{padding:20px 24px; display:flex; flex-direction:column; gap:10px;}
.list-card .meta{font-size:13px; color:var(--muted); display:flex; gap:16px; align-items:center; flex-wrap:wrap;}
.list-card .meta .date{color:var(--jnu); font-weight:700; font-family:"STZhongsong","华文中宋",serif; font-size:15px;}
.list-card .title{font-size:19px; font-weight:700; line-height:1.45; color:var(--ink); transition:color .2s; margin:0;}
.list-card:hover .title{color:var(--jnu);}
.list-card .summary{font-size:14px; color:var(--muted); line-height:1.7; margin:0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.list-card .more{margin-top:auto; color:var(--jnu); font-weight:700; font-size:14px; display:inline-flex; align-items:center; gap:6px; transition:gap .2s, color .2s;}
.list-card:hover .more{gap:12px; color:var(--gold);}
.list-card .more svg{width:15px; height:15px;}

/* ============ 分页组件 ============ */
.pager{display:flex; align-items:center; justify-content:center; gap:8px; margin-top:34px; flex-wrap:wrap;}
.pg{
  min-width:42px; height:42px; padding:0 14px; border:1px solid var(--line);
  background:var(--paper-2); color:var(--ink); border-radius:9px; font-size:14px;
  cursor:pointer; transition:.2s; font-family:inherit;
}
.pg:hover:not(:disabled){border-color:var(--gold); color:var(--jnu);}
.pg.active{background:var(--jnu); border-color:var(--jnu); color:#fff; font-weight:700; box-shadow:0 10px 20px -12px rgba(16,42,87,.6);}
.pg:disabled{opacity:.4; cursor:not-allowed;}
/* 折叠省略号：不可点击，仅作分隔 */
.pg-dots{min-width:24px; height:42px; padding:0 4px; display:inline-flex; align-items:center; justify-content:center;
  color:var(--muted); font-size:14px; letter-spacing:2px; user-select:none;}

.list-foot-note{text-align:center; font-size:13px; color:var(--muted); margin-top:18px;}

/* ============ 响应式（列表页专属） ============ */
@media (max-width:991.98px){
  .detail-grid{grid-template-columns:1fr; gap:28px;}
  .detail-aside{position:static; top:auto;}
  .detail-hero-cap h1{font-size:30px;}
  .list-panel{padding:24px 18px;}
}
@media (max-width:640px){
  .nav-inner{padding:10px 0; gap:10px;}
  .wrap{padding-left:12px; padding-right:12px;}
  .detail-main{padding:44px 0;}
  .list-card{grid-template-columns:1fr;}
  .list-card .thumb{width:200px; height:200px; max-width:200px; max-height:200px;}
  .list-card .body{padding:16px 18px;}
  .pager{gap:6px; margin-top:26px;}
  .pg{min-width:36px; height:36px; padding:0 10px; font-size:13px;}
  .pg-dots{min-width:18px; height:36px;}
  .section-head{margin-bottom:14px;}
  .list-intro{margin-bottom:20px;}
  .footer-grid{grid-template-columns:1fr; gap:26px; padding:34px 0 20px;}
  .qr-box{justify-content:center;}
  .qr-item{flex:0 0 auto;}
  .cert-icons{grid-template-columns:repeat(2, minmax(0, 130px)); justify-content:center;}
}