/* news 页面样式。
 * 只在本路由加载（RouteStyles 切换 <link data-css="page"> 的 href）。
 * 不要把它合并进全局样式，也不要给选择器加作用域前缀：
 * 本文件里的 .footer-grid (0,1,0) 现在是被 motion.css 的
 * .site-footer .footer-grid (0,2,0) 压住的。一旦加前缀变成 (0,2,0)
 * 且文档顺序更靠后，本文件反而会赢，footer 会切成 4 栏网格（DOM 里只有 2 个子元素）。
 *
 * 相对设计稿的唯一改动：原来写的是 `.latest-item button` 和 `.latest-item button>span`，
 * 带元素限定符。新闻卡片为了能被搜索引擎收录，已经从 <button> 改成了 <a href="/news/:id">
 * （弹窗内容不构成独立 URL，文章收不进去），这两条规则就匹配不上、卡片会从
 * 「标题在左、缩略图在右」塌成纵向堆叠。已改成不带元素限定的 `.latest-item .news-open`
 * —— 这个类本来就在元素上，改成类选择器比补一条 .latest-item a 更不容易和设计稿写法脱节。
 */
:root{--navy:#072b50;--deep:#071d38;--blue:#357fc4;--blue-light:#edf6ff;--orange:#f39a2f;--text:#163d63;--muted:#788da2;--line:#e3ebf3;--shadow:0 18px 48px rgba(24,61,98,.11)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;color:var(--text);background:#fff;font:16px/1.65 "PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;-webkit-font-smoothing:antialiased}button,a{font:inherit}button{border:0}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.wrap{width:min(1200px,calc(100% - 48px));margin-inline:auto}
.news-hero{position:relative;height:320px;overflow:hidden;background:linear-gradient(120deg,#f7fbff,#edf6ff 62%,#fff5e9)}.hero-grid{position:absolute;inset:0;opacity:.45;background-image:linear-gradient(rgba(53,127,196,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(53,127,196,.08) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to right,#000,transparent 82%)}.hero-orb{position:absolute;border-radius:50%;filter:blur(4px)}.orb-blue{width:330px;height:330px;right:9%;top:-190px;background:rgba(77,166,235,.16)}.orb-orange{width:190px;height:190px;left:7%;bottom:-135px;background:rgba(243,154,47,.18)}.hero-content{position:relative;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.hero-content>span,.section-heading>div>span,.archive-head>div>span{color:var(--blue);font-size:12px;font-weight:800;letter-spacing:2.8px}.hero-content h1{margin:10px 0 8px;color:var(--deep);font-size:48px;line-height:1.25;letter-spacing:-2px}.hero-content p{margin:0;color:#748a9e;font-size:16px}
.news-section{padding:72px 0 88px;background:linear-gradient(180deg,#fff,#f8fbfe)}.section-heading{margin-bottom:28px;display:flex;align-items:flex-end;justify-content:space-between;gap:36px}.section-heading h2,.archive-head h2{margin:5px 0 0;color:var(--deep);font-size:38px;line-height:1.3}.news-tabs{display:flex;gap:8px;padding:6px;border:1px solid #dfebf4;border-radius:11px;background:#f5f9fc}.news-tabs button{min-height:38px;padding:0 17px;border-radius:7px;cursor:pointer;color:#71879a;background:transparent;font-size:14px;transition:.25s}.news-tabs button:hover,.news-tabs button:focus-visible{color:var(--navy);background:#fff}.news-tabs button.active{color:#fff;background:linear-gradient(135deg,#4c9fe1,#347fc4);box-shadow:0 7px 18px rgba(53,127,196,.22)}
.news-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(340px,.92fr);align-items:stretch;gap:24px}.featured-news{height:100%;display:grid;grid-template-columns:1fr 1fr;gap:20px}.featured-card{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--shadow);transition:transform .3s ease,box-shadow .3s ease}.featured-card:hover{transform:translateY(-7px);box-shadow:0 25px 62px rgba(22,61,99,.17)}.news-open{width:100%;height:100%;padding:0;display:block;cursor:pointer;color:inherit;background:transparent;text-align:left}.featured-card .news-open{display:flex;flex-direction:column}.image-wrap{position:relative;height:auto;min-height:410px;flex:1;display:block;overflow:hidden;background:#dfeaf3}.image-wrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .45s ease}.featured-card:hover .image-wrap img{transform:scale(1.035)}.image-wrap>i{position:absolute;left:18px;top:18px;padding:7px 11px;border-radius:6px;color:#fff;background:rgba(7,43,80,.76);backdrop-filter:blur(8px);font-size:12px;font-style:normal}.featured-copy{min-height:170px;padding:22px 24px 20px;display:grid;grid-template-columns:1fr auto;align-content:start;gap:12px 18px}.featured-copy strong{grid-column:1/-1;color:#213d58;font-size:20px;line-height:1.55}.featured-copy small{color:#91a1b1;font-size:13px}.featured-copy em{color:var(--blue);font-size:13px;font-style:normal;font-weight:700}
.latest-news{padding:24px 24px 10px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--shadow)}.latest-title{height:52px;display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid var(--line)}.latest-title span{color:var(--deep);font-size:20px;font-weight:800}.latest-title small{color:#9db0c1;font-size:12px;letter-spacing:1.5px}.latest-item{border-bottom:1px solid #e7edf3}.latest-item:last-child{border-bottom:0}.latest-item .news-open{min-height:112px;padding:16px 0;display:flex;align-items:center;gap:18px}.latest-item .news-open>span{min-width:0;flex:1}.latest-item b{display:-webkit-box;overflow:hidden;color:#435a70;font-size:15px;font-weight:600;line-height:1.55;-webkit-line-clamp:2;-webkit-box-orient:vertical}.latest-item small{display:block;margin-top:8px;color:#a0adba;font-size:12px}.latest-item img{width:62px;height:62px;flex:0 0 auto;border-radius:9px;object-fit:cover}.latest-item:hover b{color:var(--blue)}
.archive-head{margin:82px 0 28px;display:flex;align-items:flex-end;justify-content:space-between}.archive-head p{margin:0;color:#8a9bac;font-size:14px}.archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.archive-card{overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 12px 34px rgba(24,61,98,.08);transition:.3s}.archive-card:hover{transform:translateY(-6px);box-shadow:0 20px 46px rgba(24,61,98,.14)}.archive-card img{width:100%;height:205px;object-fit:cover;transition:transform .4s ease}.archive-card:hover img{transform:scale(1.035)}.archive-card .news-open>span{min-height:148px;padding:20px;display:flex;flex-direction:column}.archive-card i{width:max-content;padding:4px 8px;border-radius:5px;color:#2877b7;background:#eaf5ff;font-size:12px;font-style:normal}.archive-card strong{margin-top:11px;color:#28445e;font-size:17px;line-height:1.5}.archive-card small{margin-top:auto;padding-top:11px;color:#99a9b8;font-size:12px}.archive-card.extra{display:none}.archive-grid.expanded .archive-card.extra{display:block}.more-button{min-width:210px;height:58px;margin:42px auto 0;padding:0 24px;display:flex;align-items:center;justify-content:center;gap:26px;border-radius:9px;cursor:pointer;color:#fff;background:linear-gradient(135deg,#418fd4,#236fbd);box-shadow:0 12px 26px rgba(43,118,191,.25);font-size:16px;font-weight:700}.more-button i{font-size:22px;font-style:normal;font-weight:400;transition:transform .25s}.more-button[aria-expanded="true"] i{transform:rotate(45deg)}
.news-item[hidden]{display:none!important}.article-dialog{width:min(660px,calc(100% - 32px));padding:42px;border:0;border-radius:18px;color:var(--text);box-shadow:0 35px 110px rgba(4,29,54,.28)}.article-dialog::backdrop{background:rgba(5,29,52,.64);backdrop-filter:blur(5px)}.dialog-close{position:absolute;right:18px;top:14px;width:38px;height:38px;border-radius:50%;cursor:pointer;color:#577086;background:#eef4f8;font-size:24px}.dialog-label{padding:6px 10px;border-radius:6px;color:#2b79b9;background:#eaf5ff;font-size:12px;font-weight:700}.article-dialog h2{margin:18px 0 10px;color:var(--deep);font-size:29px;line-height:1.45}.dialog-meta{color:#98a8b7;font-size:13px}.dialog-summary{margin:24px 0 0;color:#587187;font-size:16px;line-height:1.9}.dialog-note{margin-top:25px;padding:14px 16px;border-left:3px solid var(--orange);color:#8a765f;background:#fff6e9;font-size:13px}
footer{padding-top:60px;color:rgba(255,255,255,.53);background:#052642}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr .7fr;gap:50px;padding-bottom:40px}.footer-brand>img{display:block;width:221px;height:56px;object-fit:contain}.footer-brand p{margin:18px 0 0;font-size:12px;line-height:1.8}.footer-grid h4{margin:0 0 17px;color:#fff;font-size:12px}.footer-grid>div>span{display:block;margin-top:11px;font-size:12px}.footer-qr{display:flex;flex-direction:column;align-items:center}.footer-qr img{display:block;width:94px;height:94px;border:6px solid #fff;object-fit:cover;background:#fff}.copyright{height:58px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.08);font-size:12px}
@media(max-width:1000px){.news-layout{grid-template-columns:1fr}.latest-news{margin-top:4px}.image-wrap{min-height:370px}.archive-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.wrap{width:min(100% - 30px,1200px)}.news-hero{height:260px}.hero-content h1{font-size:38px}.hero-content p{max-width:330px;font-size:14px}.news-section{padding:54px 0 70px}.section-heading{margin-bottom:22px;align-items:flex-start;flex-direction:column}.section-heading h2,.archive-head h2{font-size:31px}.news-tabs{width:100%;overflow-x:auto}.news-tabs button{flex:0 0 auto}.featured-news{grid-template-columns:1fr}.image-wrap{min-height:300px}.featured-copy{min-height:150px}.featured-copy strong{font-size:18px}.latest-news{padding:20px 18px 8px}.latest-item .news-open{min-height:104px}.archive-head{margin-top:62px;align-items:flex-start;flex-direction:column;gap:8px}.archive-grid{grid-template-columns:1fr}.archive-card img{height:240px}.article-dialog{padding:34px 24px}.article-dialog h2{font-size:24px}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.copyright{height:auto;padding:18px 0;gap:10px;flex-direction:column;align-items:flex-start}}
@media(max-width:430px){.image-wrap{min-height:240px}.archive-card img{height:210px}.latest-item img{width:54px;height:54px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important}}

/* ============ 文章详情页（新增，设计稿中没有这一页） ============
 * 原设计稿的新闻详情是弹窗（.article-dialog），并没有独立的文章页设计。
 * GEO 改造后每篇文章有了独立 URL（/news/<id>），需要一个文档式版式，
 * 因此这里新增一组 .article-page 样式。
 *
 * 取值全部沿用本文件已有的设计语言：颜色用上面的 :root 变量，
 * 标签 / 日期 / 来源说明三处直接复用 .dialog-label / .dialog-meta / .dialog-note
 * 的值，保证文章页与站点其余部分一致。
 */
.article-page{padding:44px 0 88px;background:#fff}
.article-page__inner{width:min(860px,calc(100% - 48px));margin-inline:auto}
.article-page__back{display:inline-block;color:var(--blue);font-size:14px;font-weight:600;transition:color .2s ease}
.article-page__back:hover,.article-page__back:focus-visible{color:var(--navy)}
.article-page__label{display:block;width:max-content;margin-top:26px;padding:6px 10px;border-radius:6px;color:#2b79b9;background:#eaf5ff;font-size:12px;font-weight:700}
.article-page__title{margin:14px 0 12px;color:var(--deep);font-size:34px;line-height:1.42;letter-spacing:-.4px}
.article-page__meta{color:#98a8b7;font-size:13px}
.article-page__cover{margin:28px 0 0;border-radius:16px;overflow:hidden;background:var(--blue-light)}
.article-page__cover img{display:block;width:100%;height:auto;max-height:420px;object-fit:cover}
.article-page__body{margin-top:28px;color:#587187;font-size:16px;line-height:1.95}
.article-page__body p{margin:0 0 1.1em}
.article-page__body img{display:block;max-width:100%;height:auto;margin:1.5em auto;border-radius:12px}
.article-page__body h2,.article-page__body h3{margin:1.6em 0 .6em;color:var(--deep);line-height:1.5}
.article-page__body h2{font-size:22px}
.article-page__body h3{font-size:18px}
.article-page__body ul,.article-page__body ol{margin:0 0 1.1em;padding-left:1.4em}
.article-page__body li{margin:.35em 0}
.article-page__body a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.article-page__body blockquote{margin:1.3em 0;padding:4px 0 4px 16px;border-left:3px solid var(--line);color:var(--muted)}
.article-page__body table{width:100%;margin:1.3em 0;border-collapse:collapse;font-size:15px}
.article-page__body th,.article-page__body td{padding:10px 12px;border:1px solid var(--line);text-align:left}
.article-page__body th{color:var(--deep);background:var(--blue-light)}
.article-page__note{margin-top:32px;padding:14px 16px;border-left:3px solid var(--orange);border-radius:0 8px 8px 0;color:#8a765f;background:#fff6e9;font-size:13px}
@media(max-width:700px){
  .article-page{padding:30px 0 60px}
  .article-page__title{font-size:25px}
  .article-page__cover{margin-top:22px;border-radius:12px}
  .article-page__body{margin-top:22px;font-size:15px}
}
/* 「更多新闻」按钮的居中容器（新增）。
 * .more-button 本身是设计稿里就有的样式，但它是 display:flex 的块级元素 ——
 * 单独放在 .wrap 里会撑满整行，它自带的 min-width 与 margin:auto 都只在
 * 元素按内容宽度收缩时才生效。这里用弹性居中让它收缩到内容宽度。 */
.news-more{display:flex;justify-content:center}