:root{
  --navy:#0d1b2a; --navy-2:#152a3f; --navy-3:#1e3a54;
  --teal:#2ec4b6; --teal-2:#7fe3d8; --teal-dim:#1a8e83;
  --cream:#fbfaf7; --cream-2:#f1efe9; --line:#e0ddd4; --line-d:#26405a;
  --tx:#16202b; --tx-2:#5a6873; --tx-inv:#e9eef3;
  --r:10px; --maxw:1160px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);color:var(--tx);
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",-apple-system,sans-serif;
  font-size:15.5px;line-height:1.85;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* 顶栏：浅色（dz112 是深色，此处刻意相反） */
.topbar{position:sticky;top:0;z-index:60;background:rgba(251,250,247,.94);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:60px}
.brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:800;color:var(--navy);letter-spacing:.3px}
.brand i{width:26px;height:26px;border-radius:7px;background:var(--navy);color:var(--teal-2);
  display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:14px}
.topnav{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.topnav a{color:var(--tx-2);font-size:14.5px;position:relative;padding:4px 0}
.topnav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;background:var(--teal);transition:right .22s}
.topnav a:hover::after,.topnav a.on::after{right:0}
.topnav a.on{color:var(--navy);font-weight:600}
@media(max-width:880px){.topnav{display:none}}

/* 首屏：居中（dz112 是左右分栏） */
.hero{background:var(--navy);color:var(--tx-inv);padding:64px 0 0;text-align:center;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;
  background:radial-gradient(1100px 380px at 50% -80px,rgba(46,196,182,.18),transparent 70%)}
.hero .wrap{position:relative;z-index:2}
.eyebrow{font-size:11px;letter-spacing:3.4px;color:var(--teal-2);text-transform:uppercase;font-weight:600;margin-bottom:15px}
.hero h1{font-size:clamp(30px,4.6vw,48px);line-height:1.22;margin:0 0 16px;font-weight:800;letter-spacing:-.6px}
.hero h1 em{font-style:normal;color:var(--teal-2)}
.hero>.wrap>p{color:#a8b6c4;font-size:16px;line-height:1.9;margin:0 auto 26px;max-width:40em}
.btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:36px}
.btn{display:inline-block;padding:12px 28px;border-radius:8px;font-size:14.5px;font-weight:600;transition:.18s}
.btn-a{background:var(--teal);color:#04211e}
.btn-a:hover{background:var(--teal-2)}
.btn-b{border:1px solid #37536e;color:var(--tx-inv)}
.btn-b:hover{border-color:var(--teal);color:var(--teal-2)}
.hero-fig{margin:0;padding-bottom:0}
.hero-fig img{width:100%;max-width:920px;height:auto;display:block;margin:0 auto;
  border-radius:12px 12px 0 0;border:1px solid var(--line-d);border-bottom:0;
  box-shadow:0 -8px 60px rgba(46,196,182,.14)}

/* 数据条 */
.stats{background:var(--navy-2);border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d)}
.stats .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
@media(max-width:760px){.stats .wrap{grid-template-columns:1fr 1fr}}
.stat{padding:20px 22px;text-align:center;border-right:1px solid var(--line-d)}
.stat:last-child{border-right:0}
.stat b{display:block;font-size:24px;color:var(--teal-2);font-weight:800;font-variant-numeric:tabular-nums}
.stat span{font-size:12.8px;color:#8ea0b1}

/* 分区 */
.sec{padding:62px 0}
.sec.alt{background:var(--cream-2)}
.sec.dark{background:var(--navy);color:var(--tx-inv)}
.sec-head{text-align:center;margin-bottom:36px}
.sec-head .eyebrow{color:var(--teal-dim)}
.sec.dark .sec-head .eyebrow{color:var(--teal-2)}
.sec-head h2{font-size:clamp(21px,2.8vw,28px);margin:0 0 9px;font-weight:800;letter-spacing:-.3px}
.sec-head p{color:var(--tx-2);margin:0;font-size:14.6px}
.sec.dark .sec-head p{color:#a8b6c4}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media(max-width:980px){.g4{grid-template-columns:1fr 1fr}}
@media(max-width:820px){.g2,.g3{grid-template-columns:1fr}.g4{grid-template-columns:1fr 1fr}}

.feat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 22px;position:relative;transition:.2s}
.feat:hover{border-color:var(--teal);transform:translateY(-3px);box-shadow:0 10px 26px rgba(13,27,42,.07)}
.feat .n{position:absolute;top:16px;right:18px;font-size:32px;font-weight:800;color:var(--cream-2);line-height:1}
.feat h3{margin:0 0 9px;font-size:16.5px;font-weight:700;position:relative}
.feat p{margin:0;color:var(--tx-2);font-size:14.2px;line-height:1.85;position:relative}

.panel{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
h2.panel-h,.panel-h{background:var(--navy);color:var(--teal-2);padding:13px 22px;
  font-size:15px;font-weight:700;margin:0;line-height:1.6}
.panel-b{padding:22px 24px 26px}
.panel-b p{margin:0 0 12px}.panel-b p:last-child{margin:0}
.olist{list-style:none;counter-reset:o;margin:0;padding:0}
.olist li{counter-increment:o;display:flex;gap:13px;padding:9px 0;border-bottom:1px dashed var(--line);font-size:14.6px}
.olist li:last-child{border:0}
.olist li::before{content:counter(o);flex:none;width:21px;height:21px;border-radius:50%;
  background:var(--navy);color:var(--teal-2);font-size:11.5px;font-weight:700;
  display:flex;align-items:center;justify-content:center;margin-top:4px}
.olist b{margin-right:.5em}
.olist span{color:var(--tx-2);font-size:14.2px}

/* 左右交替图文 */
.alt-row{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;margin-bottom:44px}
.alt-row:last-child{margin-bottom:0}
.alt-row:nth-child(even) .alt-txt{order:2}
@media(max-width:820px){.alt-row{grid-template-columns:1fr;gap:22px}.alt-row:nth-child(even) .alt-txt{order:0}}
.alt-txt h3{font-size:19px;font-weight:800;margin:0 0 12px;padding-left:12px;border-left:4px solid var(--teal)}
.alt-txt p{margin:0 0 13px;color:var(--tx-2)}
.alt-txt ul{margin:0;padding-left:1.3em;color:var(--tx-2);font-size:14.4px}
.alt-txt li{margin-bottom:6px}
.alt-vis{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;min-height:190px;
  display:flex;flex-direction:column;justify-content:center;gap:10px}
.chip-row{display:flex;gap:8px;flex-wrap:wrap}
.chip{background:var(--cream-2);border:1px solid var(--line);border-radius:16px;padding:5px 13px;font-size:13px;color:var(--tx-2)}
.chip.on{background:var(--navy);color:var(--teal-2);border-color:var(--navy)}
.bar{display:flex;align-items:center;gap:11px;font-size:13.5px}
.bar i{font-style:normal;color:var(--tx-2);min-width:62px}
.bar u{text-decoration:none;height:8px;border-radius:4px;background:var(--teal);display:block}

details.qa{background:#fff;border:1px solid var(--line);border-radius:9px;margin-bottom:10px;overflow:hidden}
details.qa summary{padding:15px 20px;cursor:pointer;font-weight:600;font-size:15px;list-style:none;
  display:flex;justify-content:space-between;gap:14px;align-items:center}
details.qa summary::-webkit-details-marker{display:none}
details.qa summary::after{content:"▾";color:var(--teal-dim);flex:none;transition:.2s}
details.qa[open] summary::after{transform:rotate(180deg)}
details.qa[open] summary{background:var(--cream-2)}
details.qa .a{padding:15px 20px 19px;color:var(--tx-2);font-size:14.4px;line-height:1.9;border-top:1px solid var(--line)}

.foot{background:var(--navy);color:#93a3b3;padding:44px 0 0;font-size:14px}
.foot .cols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px;padding-bottom:30px}
@media(max-width:880px){.foot .cols{grid-template-columns:1fr 1fr}}
.foot h4{color:var(--tx-inv);font-size:14.5px;margin:0 0 13px;font-weight:700}
.foot ul{list-style:none;margin:0;padding:0}
.foot li{margin-bottom:9px}
.foot a:hover{color:var(--teal-2)}
.foot .bot{border-top:1px solid var(--line-d);padding:17px 0;text-align:center;font-size:13px;color:#6f8090}
.foot .bot a{color:#6f8090}
.foot .bot a:hover{color:var(--teal-2)}

/* 内页 */
.page-hd{background:var(--navy);color:var(--tx-inv);padding:40px 0 42px}
.page-hd .crumb{font-size:13px;color:#8ea0b1;margin-bottom:13px}
.page-hd .crumb a:hover{color:var(--teal-2)}
.page-hd .crumb i{font-style:normal;margin:0 7px;color:#4a637b}
.page-hd h1{font-size:clamp(22px,3.1vw,32px);line-height:1.38;margin:0;font-weight:800}
.page-hd .meta{margin-top:13px;color:#8ea0b1;font-size:13.5px;display:flex;gap:18px;flex-wrap:wrap}
.page-hd .tag{display:inline-block;background:rgba(46,196,182,.14);color:var(--teal-2);
  border:1px solid rgba(46,196,182,.32);border-radius:5px;padding:2px 10px;font-size:12.5px;margin-bottom:10px}
.shell{display:grid;grid-template-columns:minmax(0,1fr) 262px;gap:42px;max-width:var(--maxw);
  margin:0 auto;padding:36px 24px 58px;align-items:start}
@media(max-width:960px){.shell{grid-template-columns:1fr;gap:32px}}
.post{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:32px 38px 38px;min-width:0}
@media(max-width:640px){.post{padding:22px 18px 28px}}
.post .cover{margin:-4px 0 24px;border-radius:9px;overflow:hidden;background:var(--cream-2)}
.post .cover img{width:100%;height:auto;display:block}
.post-body{font-size:15.8px;line-height:1.95;color:#1d2833}
.post-body>*:first-child{margin-top:0}
.post-body p{margin:0 0 17px}
.post-body h2{font-size:20px;font-weight:800;margin:32px 0 13px;padding-left:12px;border-left:4px solid var(--teal);line-height:1.45}
.post-body h3{font-size:17px;font-weight:700;margin:25px 0 10px}
.post-body ul,.post-body ol{margin:0 0 17px;padding-left:1.5em}
.post-body li{margin-bottom:7px}
.post-body img{max-width:100%;height:auto;border-radius:8px;display:block;margin:22px auto}
.post-body figcaption{text-align:center;font-size:13px;color:var(--tx-2);margin-top:8px}
.post-body blockquote{margin:22px 0;padding:15px 20px;background:var(--cream-2);border-left:3px solid var(--teal);
  border-radius:0 8px 8px 0;color:var(--tx-2)}
.post-body a{color:var(--teal-dim);border-bottom:1px solid rgba(26,142,131,.35)}
.post-body table{width:100%;border-collapse:collapse;margin:22px 0;font-size:14.5px}
.post-body th,.post-body td{border:1px solid var(--line);padding:9px 13px;text-align:left}
.post-body th{background:var(--cream-2);font-weight:700}
.side{position:sticky;top:78px;display:flex;flex-direction:column;gap:17px}
@media(max-width:960px){.side{position:static}}
.side .list{list-style:none;margin:0;padding:0}
.side .list li{padding:9px 0;border-bottom:1px dashed var(--line);font-size:14px;line-height:1.6}
.side .list li:last-child{border:0}
.side .list a:hover{color:var(--teal-dim)}
.side .cats{display:flex;flex-wrap:wrap;gap:8px}
.side .cats a{background:var(--cream-2);border:1px solid var(--line);border-radius:18px;padding:5px 13px;font-size:13px;color:var(--tx-2)}
.side .cats a:hover{background:var(--navy);color:var(--teal-2);border-color:var(--navy)}
.side-cta{background:var(--navy);color:var(--tx-inv);border-radius:var(--r);padding:22px}
.side-cta b{display:block;color:var(--teal-2);font-size:15.5px;margin-bottom:8px}
.side-cta p{margin:0 0 14px;font-size:13.6px;color:#a8b6c4;line-height:1.8}
.side-cta .btn{padding:9px 18px;font-size:13.5px}
.post-nav{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:24px}
@media(max-width:640px){.post-nav{grid-template-columns:1fr}}
.post-nav a{background:#fff;border:1px solid var(--line);border-radius:9px;padding:15px 18px}
.post-nav a:hover{border-color:var(--teal)}
.post-nav small{color:var(--tx-2);font-size:12.5px;display:block;margin-bottom:5px}
.post-nav b{font-size:14.5px;font-weight:600;line-height:1.6;display:block}
.arch-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:960px){.arch-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.arch-grid{grid-template-columns:1fr}}
.arch-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:.2s}
.arch-card:hover{border-color:var(--teal);transform:translateY(-3px);box-shadow:0 10px 26px rgba(13,27,42,.08)}
.arch-card .thumb{aspect-ratio:16/9;background:var(--cream-2);overflow:hidden}
.arch-card .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.arch-card .in{padding:17px 19px 20px;display:flex;flex-direction:column;flex:1}
.arch-card .cat{font-size:11.5px;color:var(--teal-dim);letter-spacing:1px;margin-bottom:8px;font-weight:600}
.arch-card h3{font-size:15.6px;font-weight:700;line-height:1.6;margin:0 0 9px}
.arch-card p{font-size:13.8px;color:var(--tx-2);line-height:1.8;margin:0 0 13px;flex:1}
.arch-card time{font-size:12.5px;color:#9aa5ae}
.pager{display:flex;justify-content:center;gap:9px;margin-top:32px;flex-wrap:wrap}
.pager a,.pager span{min-width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line);border-radius:8px;background:#fff;font-size:14px;padding:0 12px}
.pager .current{background:var(--navy);color:var(--teal-2);border-color:var(--navy)}
.pager a:hover{border-color:var(--teal);color:var(--teal-dim)}
.empty{text-align:center;padding:66px 20px;color:var(--tx-2)}

/* ── 2026-08-13 中图带 figband：整幅横图 + 图下「说明 + 数据」双栏 ──
   本站独有版式（dz112 用的是左图右文的 midfig，此处刻意不同） */
.figband{background:var(--cream-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:40px 0}
.figband.on-navy{background:var(--navy);border-top-color:var(--line-d);border-bottom-color:var(--line-d)}
.figband figure{margin:0 auto;max-width:840px}
.figband img{width:100%;height:auto;display:block;border-radius:var(--r);border:1px solid var(--line)}
.figband.on-navy img{border-color:#2c4a66}
.figband .cap{max-width:840px;margin:17px auto 0;display:grid;grid-template-columns:minmax(0,1fr) 218px;gap:26px;align-items:start}
.figband .cap > *{min-width:0}
.figband .cap p{margin:0;font-size:14.6px;line-height:1.95;color:var(--tx-2)}
.figband .cap b{color:var(--navy);font-weight:700}
.figband.on-navy .cap p{color:#a8b6c4}
.figband.on-navy .cap b{color:var(--teal-2)}
.figband .num{border-left:2px solid var(--teal);padding-left:15px}
.figband .num strong{display:block;font-size:21px;font-weight:800;color:var(--navy);letter-spacing:-.5px;line-height:1.3}
.figband.on-navy .num strong{color:var(--teal-2)}
.figband .num span{display:block;margin-top:4px;font-size:12.6px;line-height:1.65;color:var(--tx-2)}
.figband.on-navy .num span{color:#8fa2b4}
@media(max-width:820px){.figband{padding:30px 0}.figband .cap{grid-template-columns:1fr;gap:15px}}

.cta-top{display:inline-flex;align-items:center;gap:.38em;
 padding:.5em 1.15em;border:1.5px solid currentColor;border-radius:999px;
 font-size:.85rem;font-weight:700;line-height:1.15;white-space:nowrap;
 text-decoration:none;color:var(--teal-dim);opacity:.92;transition:opacity .2s,transform .2s}
.cta-top:hover{opacity:1;transform:translateY(-1px)}
.cta-top .dot{width:.42em;height:.42em;border-radius:50%;background:currentColor;
 display:inline-block;flex:none}
@media(max-width:820px){.cta-top{padding:.44em .9em;font-size:.8rem}}
@media(max-width:560px){.cta-top{padding:.4em .78em;font-size:.75rem;gap:.3em}
 .cta-top .dot{width:.36em;height:.36em}}
@media(max-width:380px){.cta-top{padding:.36em .66em;font-size:.72rem}}
