/* ===== L3 横向卡片流 · 绿 ===== */
:root{
  --c-bg:#f4fdf8; --c-bg-2:#e3f8ee; --c-card:#fff; --c-line:#cfeee0; --c-line-soft:#e9f9f1;
  --c-text:#08261c; --c-text-2:#2b5849; --c-sub:#6f9486;
  --c-primary:#059669; --c-primary-2:#14b8a6;
  --c-brand-grad:linear-gradient(135deg,#059669,#14b8a6);
  --c-radius:16px; --c-radius-sm:12px;
}
.l3-hero{text-align:center;padding:34px 0 8px}
.l3-hero h1{font-size:30px;margin:0 0 18px;color:var(--c-text)}
.l3-search{display:flex;max-width:600px;margin:0 auto;background:#fff;border:2px solid var(--c-primary);border-radius:14px;padding:4px;box-shadow:0 8px 24px rgba(5,150,105,.12)}
.l3-search input{flex:1;border:0;outline:0;padding:11px 16px;font-size:15px;background:transparent}
.l3-search button{border:0;background:var(--c-brand-grad);color:#fff;border-radius:10px;padding:0 24px;font-weight:600;cursor:pointer}
.l3-pills{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:16px 0 6px}
.l3-pills a{font-size:13px;padding:5px 13px;background:#fff;border:1px solid var(--c-line);border-radius:999px;color:var(--c-text-2)}
.l3-pills a:hover{background:var(--c-primary);color:#fff;border-color:var(--c-primary)}
.l3-scroll-sec{margin:26px 0}
.l3-scroll-sec h2,.l3-list-sec h2,.l3-art-sec h2{font-size:16px;margin:0 0 13px;display:flex;justify-content:space-between;align-items:center}
.l3-scroll-sec h2 a{font-size:12.5px;color:var(--c-sub);font-weight:400}
.l3-scroll{display:flex;gap:13px;overflow-x:auto;padding:4px 2px 12px;scroll-snap-type:x mandatory}
.l3-scroll::-webkit-scrollbar{height:6px}
.l3-scroll::-webkit-scrollbar-thumb{background:var(--c-line);border-radius:3px}
.l3-scard{flex:0 0 184px;scroll-snap-align:start;background:#fff;border:1px solid var(--c-line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:8px;transition:.18s}
.l3-scard:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(5,150,105,.14)}
.l3-scard b{font-size:14px;color:var(--c-text)}
.l3-scard span{font-size:12px;color:var(--c-sub);line-height:1.55;height:3.1em;overflow:hidden}
.l3-list{list-style:none;margin:0;padding:0;background:#fff;border:1px solid var(--c-line);border-radius:var(--c-radius);overflow:hidden}
.l3-list li{display:flex;align-items:baseline;gap:12px;padding:13px 18px;border-bottom:1px solid var(--c-line-soft)}
.l3-list li:last-child{border-bottom:0}
.l3-list a{font-size:14.5px;font-weight:600;color:var(--c-text);flex:0 0 auto}
.l3-list span{flex:1;font-size:12.5px;color:var(--c-sub);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.l3-list em{font-style:normal;font-size:11.5px;color:#9db8ac}
.l3-arts{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.l3-arts a{background:#fff;border:1px solid var(--c-line);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.l3-arts b{font-size:14px;color:var(--c-text)}
.l3-arts span{font-size:11.5px;color:var(--c-sub)}
@media(max-width:760px){.l3-list span{display:none}.l3-arts{grid-template-columns:1fr}.l3-hero h1{font-size:23px}}

/* ==== L3 header/hero v2 ==== */

/* ===== L3 header：品牌+统计 / 竖线导航 ===== */
.h3-head{position:sticky;top:0;z-index:60;background:#fff;border-bottom:2px solid var(--c-primary);padding-top:env(safe-area-inset-top)}
.h3-in{display:flex;align-items:center;gap:14px;height:60px}
.h3-brand{display:flex;align-items:baseline;gap:8px;flex:0 0 auto}
.h3-brand b{font-size:18px;font-weight:800;letter-spacing:.5px}
.h3-brand i{font-style:normal;font-size:11px;color:var(--c-sub);letter-spacing:1.5px}
.h3-stat{font-size:12px;color:var(--c-sub);padding-left:13px;border-left:1px solid var(--c-line);white-space:nowrap}
.h3-nav{margin-left:auto;display:flex;align-items:center;overflow-x:auto;scrollbar-width:none}
.h3-nav::-webkit-scrollbar{display:none}
.h3-nav a{padding:0 12px;font-size:13px;color:var(--c-text-2);white-space:nowrap;border-left:1px solid var(--c-line-soft)}
.h3-nav a:first-child{border-left:0}
.h3-nav a.on{color:var(--c-primary);font-weight:700}
.h3-nav a:hover{color:var(--c-primary)}
@media(max-width:960px){.h3-stat,.h3-brand i{display:none}}
/* ===== L3 hero：标题与搜索同行 ===== */
.l3-hero{padding:36px 0 0;border-bottom:1px dashed var(--c-line)}
.l3-hero-row{display:flex;align-items:center;gap:30px;justify-content:space-between}
.l3-hero-row h1{font-size:30px;margin:0;flex:1 1 auto;line-height:1.3;letter-spacing:-.5px}
.l3-search{display:flex;flex:0 0 370px}
.l3-search input{flex:1;height:44px;border:2px solid var(--c-line);border-right:0;border-radius:10px 0 0 10px;padding:0 14px;outline:none;font-size:14px;color:var(--c-text)}
.l3-search input:focus{border-color:var(--c-primary)}
.l3-search button{height:44px;padding:0 20px;border:0;border-radius:0 10px 10px 0;background:var(--c-primary);color:#fff;font-weight:600;cursor:pointer}
.l3-pills{padding:16px 0 24px}
@media(max-width:860px){.l3-hero-row{flex-direction:column;align-items:stretch;gap:16px}.l3-hero-row h1{font-size:23px}.l3-search{flex:1 1 auto}}
