/* tpl-list_article.css —— 由模版 list_article.htm 内联样式抽取（20261004） */
/* ========== 列表页专属样式 ========== */
.ph-search{margin-top:30px;max-width:720px;display:flex;background:#fff;border-radius:999px;padding:6px;box-shadow:0 12px 32px rgba(3,60,90,.28)}
.ph-search input{flex:1;border:none;outline:none;background:none;padding:10px 22px;font-size:15px;color:var(--ink);font-family:inherit;min-width:0}
.ph-search button{border:none;background:var(--grad);color:#fff;border-radius:999px;padding:11px 30px;font-size:15px;font-weight:600;cursor:pointer;transition:.3s;font-family:inherit;flex-shrink:0}
.ph-search button:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(2,132,199,.35)}
.ph-hot{margin-top:14px;display:flex;gap:8px 16px;flex-wrap:wrap;font-size:12.5px;color:rgba(255,255,255,.85)}
.ph-hot a{color:rgba(255,255,255,.92)}
.ph-hot a:hover{color:#fff;text-decoration:underline}
.cat-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:-34px;position:relative;z-index:3}
.cat-chips a{background:#fff;border:1px solid var(--sky-100);border-radius:999px;padding:8px 20px;font-size:14px;font-weight:600;color:var(--ink-2);transition:.25s;box-shadow:var(--shadow)}
.cat-chips a:hover{color:var(--sky-700);border-color:var(--sky-400);transform:translateY(-2px)}
.cat-chips a.is-active{background:var(--grad);color:#fff;border-color:transparent}

.rpt-layout{display:grid;grid-template-columns:1fr 320px;gap:30px;align-items:start;margin-top:40px}
.rpt-head{display:flex;align-items:baseline;gap:14px;margin-bottom:20px}
.rpt-head h2{font-size:23px;font-weight:800;position:relative;padding-left:16px}
.rpt-head h2::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:5px;border-radius:3px;background:var(--grad)}
.rpt-head span{font-size:13px;color:var(--ink-3)}

.rpt-list{display:grid;gap:18px}
.rpt-card{display:grid;grid-template-columns:158px 1fr;gap:20px;background:#fff;border:1px solid var(--sky-100);border-radius:var(--radius);padding:18px;transition:.3s;position:relative;overflow:hidden}
.rpt-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:var(--sky-300)}
.rpt-cover{border-radius:12px;overflow:hidden;background:var(--grad-soft);display:flex;align-items:center;justify-content:center;min-height:190px;position:relative}
.rpt-cover img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.rpt-cover .cov-fb{font-size:38px}
.rpt-card h3{font-size:17px;line-height:1.5;margin-bottom:8px;font-weight:700}
.rpt-card h3 a:hover{color:var(--sky-600)}
.rpt-card .rpt-desc{font-size:13.5px;color:var(--ink-3);line-height:1.8;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rpt-meta{margin-top:12px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:12.5px;color:var(--ink-3)}
.rpt-meta .tag{background:var(--sky-100);color:var(--sky-700);padding:2px 12px;border-radius:999px;font-weight:600}
.rpt-meta .date::before{content:"🗓 "}

.pagelist{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:34px;font-size:14px}
.pagelist li{display:inline-block}
.pagelist li a,.pagelist li span{display:inline-block;padding:8px 16px;border-radius:10px;background:#fff;border:1px solid var(--sky-100);color:var(--ink-2);transition:.25s}
.pagelist li a:hover{color:var(--sky-700);border-color:var(--sky-400);transform:translateY(-2px)}
.pagelist li .thisclass,.pagelist li span.thisclass{background:var(--grad);color:#fff;border-color:transparent;font-weight:700}

/* ========== 侧栏 ========== */
.side-col{display:grid;gap:22px;position:sticky;top:130px}
.s-consult{background:linear-gradient(150deg,#38bdf8,#0369a1);border-radius:var(--radius);padding:28px 24px;color:#fff;box-shadow:var(--shadow-lg);position:relative;overflow:hidden}
.s-consult::after{content:"";position:absolute;width:160px;height:160px;border-radius:50%;background:rgba(255,255,255,.12);top:-60px;right:-40px}
.s-consult h4{font-size:17px;margin-bottom:6px;position:relative}
.s-consult p{font-size:13px;opacity:.92;position:relative}
.s-consult b{display:block;font-size:24px;margin:14px 0 4px;position:relative}
.s-consult .btn{width:100%;margin-top:14px;background:#fff;color:var(--sky-700);position:relative}
.s-consult .btn:hover{transform:translateY(-2px)}
.side-card{background:#fff;border:1px solid var(--sky-100);border-radius:var(--radius);padding:22px 22px 16px;box-shadow:var(--shadow)}
.side-card h4{font-size:16px;font-weight:800;margin-bottom:14px;position:relative;padding-left:14px;padding-bottom:10px;border-bottom:1px solid var(--sky-100)}
.side-card h4::before{content:"";position:absolute;left:0;top:4px;bottom:14px;width:5px;border-radius:3px;background:var(--grad)}
.rank-list li{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px dashed var(--sky-100)}
.rank-list li:last-child{border-bottom:none}
.rank-list .no{width:22px;height:22px;border-radius:6px;background:var(--sky-100);color:var(--sky-700);font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:3px}
.rank-list li:nth-child(-n+3) .no{background:var(--grad);color:#fff}
.rank-list a{font-size:13.5px;color:var(--ink-2);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rank-list a:hover{color:var(--sky-600)}
.s-more{display:inline-block;margin-top:10px;font-size:13px;color:var(--sky-600);font-weight:600}

@media(max-width:1024px){
  .rpt-layout{grid-template-columns:1fr}
  .side-col{position:static;grid-template-columns:1fr 1fr;align-items:start}
  .side-col>*{align-self:start}
}
@media(max-width:768px){
  .cat-chips{margin-top:16px}
}
@media(max-width:640px){
  .side-col{grid-template-columns:1fr}
  .rpt-card{grid-template-columns:118px 1fr;gap:14px;padding:14px}
  .rpt-cover{min-height:150px}
}