@charset "utf-8";
/* ==========================================================================
   法衡网 law19 · 版式语言「报头 + 印刷套印」
   零 CDN：系统字体栈 + 内联 SVG 图标 + 本地 SVG 图片
   签名结构：报纸刊头 / CMYK 三色套印 / 套印错位标题 / 报纸多栏文本流 / 竖排栏题
   ========================================================================== */

/* ---------- 1. 令牌 ---------- */
:root {
  --paper: #eef0ec;          /* 冷调新闻纸 */
  --paper-2: #e6e9e4;        /* 稍深纸（区块底） */
  --card: #ffffff;
  --ink: #15171a;            /* 墨 */
  --ink-2: #3c4148;
  --ink-3: #5f666e;          /* 三级文字：对 paper 5.07:1 */
  --line: #ccd2cb;
  --line-2: #b6bdb5;
  --deco: #71859a;       /* 装饰性序号 / 水印数字：paper 3.31:1、paper-2 3.10:1 */

  --cyan: #0d7f8c;           /* 印刷青（装饰用） */
  --cyan-deep: #0a6670;      /* 青 · 浅底文字 5.81:1 */
  --cyan-soft: #d6e9ea;
  --magenta: #c92a6a;        /* 印刷品红（装饰用） */
  --magenta-deep: #a81c55;   /* 品红 · 浅底文字 6.18:1 */
  --magenta-soft: #f5dae4;
  --yellow: #e0a800;         /* 印刷黄（仅装饰 / 深底文字） */
  --yellow-deep: #8a6100;    /* 黄 · 浅底文字 4.83:1 */
  --yellow-soft: #f7ebc8;

  --dark: #14161a;           /* 深色区 */
  --dark-2: #1d2026;
  --on-dark: #eef0ec;
  --on-dark-2: #a9b0b8;      /* 深底三级文字 8.46:1 */
  --on-dark-cyan: #3fbccd;   /* 深底青 7.38:1 */
  --on-dark-magenta: #f07ba8;/* 深底品红 7.15:1 */

  --font-sans: "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Source Han Sans SC", "Noto Sans CJK SC", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-serif: Georgia, "Songti SC", "SimSun", "Source Han Serif SC", "Noto Serif CJK SC", "Times New Roman", serif;
  --font-mono: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;

  --shadow: 0 1px 0 rgba(21, 23, 26, .06), 0 12px 28px -18px rgba(21, 23, 26, .28);
}

/* ---------- 2. 复位 ---------- */
*, *::before, *::after { box-sizing: border-box; }
html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  overflow-x: clip;              /* 不破坏 sticky */
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.72;
  overflow-x: clip;
  overflow-wrap: break-word;
}
/* 图标复位：严禁把 svg 与 img 写进同一条复位规则 */
img, video { max-width: 100%; height: auto; display: block; border: 0; }
svg { display: inline-block; vertical-align: -.125em; }
a { color: #06535c; text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4, p, ul, ol, figure, blockquote, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
button { font: inherit; color: inherit; }
input, select, textarea { font: inherit; color: inherit; }
table { border-collapse: collapse; }
[hidden] { display: none !important; }

/* ---------- 3. 骨架与工具类 ---------- */
.wrap {
  width: min(1220px, 100% - 48px);
  margin-inline: auto;
}
@media (max-width: 640px) { .wrap { width: calc(100% - 32px); } }

.skip {
  position: absolute;
  width: 1px; height: 1px;
  clip: rect(0 0 0 0); clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
  background: var(--ink); color: #fff;
}
.skip:focus {
  clip: auto; clip-path: none;
  width: auto; height: auto;
  left: 12px; top: 12px;
  padding: 10px 16px;
  z-index: 200;
}
.sr-only {
  position: absolute; width: 1px; height: 1px;
  clip: rect(0 0 0 0); clip-path: inset(50%);
  overflow: hidden; white-space: nowrap;
}
/* 图标精灵必须彻底不占位 */
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

.i {
  width: 1.05em; height: 1.05em; max-width: none;
  fill: none; stroke: currentColor;
  stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;
  display: inline-block; vertical-align: -.14em;
  flex: 0 0 auto;
}
#main { display: block; }

/* 入场动画：默认可见，只有 JS 接管时才隐藏（渐进增强） */
.reveal { opacity: 1; transform: none; }
html.js-reveal .reveal { opacity: 0; transform: translateY(20px); transition: opacity .6s ease, transform .6s ease; }
html.js-reveal .reveal.is-in { opacity: 1; transform: none; }

/* 套印三色小方块 */
.ink { display: inline-flex; gap: 2px; }
.ink i {
  display: block; width: 7px; height: 7px;
  border-radius: 50%; opacity: .92;
}
.ink i:nth-child(1) { background: var(--cyan); }
.ink i:nth-child(2) { background: var(--magenta); }
.ink i:nth-child(3) { background: var(--yellow); }

/* 竖排栏题 */
.vlabel {
  writing-mode: vertical-rl;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--ink-3);
}

/* ---------- 4. 按钮 ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 13px 24px;
  font-size: 15px; font-weight: 600; line-height: 1;
  border: 1px solid var(--ink);
  background: var(--ink); color: #fff;
  cursor: pointer; text-decoration: none;
  transition: background .2s ease, color .2s ease, outline-color .2s ease;
  outline: 2px solid transparent; outline-offset: 2px;
}
.btn:hover { text-decoration: none; background: #000; }
.btn .i { width: 16px; height: 16px; }
/* 按钮内标签：显式继承按钮自身的字色/字号。(0,2,0) 压过任何「容器类 + 空格 span」规则，
   避免 .form__foot span 这类后代选择器把按钮文字改成浅灰小字（1.22:1 几乎不可见）。 */
.btn > .btn__t,
.nav-toggle > .btn__t { color: inherit; font-size: inherit; line-height: inherit; }
.btn--primary { background: var(--magenta-deep); border-color: var(--magenta-deep); }
.btn--primary:hover { background: #8d1648; outline-color: var(--cyan); }
.btn--ghost { background: transparent; color: var(--ink); }
.btn--ghost:hover { background: rgba(21, 23, 26, .06); color: var(--ink); outline-color: var(--magenta); }
.btn--sm { padding: 10px 16px; font-size: 14px; }
.btn--sm .i { width: 15px; height: 15px; }
.btn--block { width: 100%; }
.btn[disabled] { opacity: .55; cursor: not-allowed; }
.btn[disabled]:hover { outline-color: transparent; }

/* ---------- 5. 刊头 ---------- */
.site-header { background: var(--paper); }
.masthead {
  border-top: 4px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}
.masthead__inner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px 20px;
  padding-block: 16px 14px;
}
.masthead__meta {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--font-mono);
  font-size: 12px; letter-spacing: .02em;
  color: var(--ink-3);
}
.masthead__meta--r { justify-content: flex-end; }
.masthead__sep { color: var(--deco); }

.brand { display: flex; align-items: center; gap: 12px; color: var(--ink); }
.brand:hover { text-decoration: none; }
.brand__mark {
  display: grid; place-items: center;
  width: 46px; height: 46px;
  background: var(--ink); color: var(--paper);
  flex: 0 0 auto;
}
.brand__mark .i { width: 26px; height: 26px; stroke-width: 1.5; }
.brand__name {
  display: block;
  font-family: var(--font-serif);
  font-size: clamp(26px, 3.4vw, 40px);
  font-weight: 700; line-height: 1.05;
  letter-spacing: .08em;
}
.brand__sub {
  display: block;
  font-family: var(--font-mono);
  font-size: 11px; letter-spacing: .16em;
  color: var(--ink-3); text-transform: uppercase;
  margin-top: 3px;
}
.brand__ink { display: flex; gap: 3px; margin-top: 6px; }
.brand__ink i { display: block; width: 16px; height: 4px; }
.brand__ink i:nth-child(1) { background: var(--cyan); }
.brand__ink i:nth-child(2) { background: var(--magenta); }
.brand__ink i:nth-child(3) { background: var(--yellow); }

.reg { width: 22px; height: 22px; color: var(--line-2); stroke-width: 1.3; }

/* ---------- 6. 导航条（单层 sticky） ---------- */
.nav-strip {
  position: sticky; top: 0; z-index: 70;
  background: #fff;
  border-bottom: 1px solid var(--line);
  transition: box-shadow .2s ease;
}
.nav-strip.is-stuck { box-shadow: 0 8px 18px -14px rgba(21, 23, 26, .55); }
.nav-strip__inner {
  display: flex; align-items: center; gap: 14px;
  flex-wrap: wrap;
  padding-block: 0;
}
.nav-toggle {
  display: none;                 /* 默认不渲染：脚本接管后才出现 */
  align-items: center; gap: 7px;
  padding: 11px 14px;
  border: 1px solid var(--line-2);
  background: var(--paper);
  border-radius: 0;
  font-size: 14px; font-weight: 600;
  cursor: pointer;
}
.nav-toggle .i { width: 17px; height: 17px; }
.nav { overflow: hidden; }
.nav__list { display: flex; align-items: stretch; flex-wrap: wrap; }
.nav__item { display: flex; flex: 0 0 auto; }
.nav__link {
  display: flex; align-items: center;
  padding: 15px 17px;
  font-size: 15px; font-weight: 600;
  color: var(--ink-2);
  border-bottom: 3px solid transparent;
  white-space: nowrap;
}
.nav__link:hover { color: var(--ink); background: var(--paper-2); text-decoration: none; }
.nav__link.is-on { color: var(--ink); border-bottom-color: var(--magenta-deep); }
.nav-strip__side { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.nav-strip__tel {
  display: inline-flex; align-items: center; gap: 7px;
  font-family: var(--font-mono); font-size: 13px; font-weight: 700;
  color: var(--ink);
}
.nav-strip__tel .i { width: 15px; height: 15px; color: var(--magenta-deep); }

/* ---------- 7. 头版 Hero ---------- */
.hero { position: relative; overflow: hidden; border-bottom: 1px solid var(--ink); background: var(--paper); }
.hero__tex { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: .55; }
.hero__inner {
  position: relative;
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 26px;
  padding-block: 40px 34px;
}
.hero__kicker {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .18em;
  text-transform: uppercase; color: var(--magenta-deep);
}
.hero__kicker::before { content: ""; width: 26px; height: 3px; background: var(--magenta); }
.hero__title {
  font-family: var(--font-serif);
  font-size: clamp(30px, 4.2vw, 50px);
  line-height: 1.16; font-weight: 700; letter-spacing: .01em;
  margin-block: 14px 0;
  text-shadow: 2px 0 0 rgba(13, 127, 140, .30), -2px 0 0 rgba(201, 42, 106, .26);
}
.hero__title em {
  display: inline-block;
  font-style: normal;
  box-shadow: inset 0 -.34em 0 var(--yellow-soft);
}
.hero__lead {
  max-width: 34em;
  margin-top: 18px;
  font-size: 16.5px; color: var(--ink-2);
}
.hero__lead::first-letter {
  float: left;
  font-family: var(--font-serif);
  font-size: 3.1em; line-height: .84; font-weight: 700;
  color: var(--magenta-deep);
  margin: 4px 9px 0 0;
}
.hero__acts { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.hero__meta {
  display: flex; flex-wrap: wrap; gap: 6px 16px;
  margin-top: 18px;
  font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-3);
}
.hero__meta span { display: inline-flex; align-items: center; gap: 6px; }
.hero__meta .i { width: 14px; height: 14px; }

.hero__side { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-content: start; }
.hero__vwrap {
  display: flex; gap: 14px; align-items: stretch;
  border: 1px solid var(--line-2);
  background: rgba(255, 255, 255, .68);
  padding: 14px 16px;
}
.hero__vwrap .vlabel { flex: 0 0 auto; }
.hero__vlist { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.hero__vitem { display: flex; gap: 9px; align-items: baseline; font-size: 14px; color: var(--ink-2); }
.hero__vitem b { font-family: var(--font-mono); font-size: 12px; color: var(--cyan-deep); flex: 0 0 auto; }

.hero__stats {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid var(--ink);
  background: #fff;
}
.stat { padding: 14px 16px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.stat:nth-child(2n) { border-right: 0; }
.stat:nth-child(n + 3) { border-bottom: 0; }
.stat__n {
  display: block; font-family: var(--font-mono);
  font-size: 24px; font-weight: 700; line-height: 1.1; color: var(--ink);
}
.stat__t { display: block; font-size: 12.5px; color: var(--ink-3); margin-top: 4px; }

/* 通栏本期要目 */
.hero__strip { position: relative; border-top: 1px solid var(--ink); background: var(--ink); }
.hero__strip__in {
  display: grid; grid-template-columns: minmax(0, 1fr);
  gap: 8px; padding-block: 12px;
}
.hero__strip__lead {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .2em;
  text-transform: uppercase; color: var(--yellow);
}
.hero__strip__list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px 26px; }
.hero__strip__list li { display: flex; gap: 9px; align-items: baseline; font-size: 13.5px; }
.hero__strip__list a { color: var(--on-dark); }
.hero__strip__list a:hover { color: var(--yellow); }
.hero__strip__list b { font-family: var(--font-mono); font-size: 11px; color: var(--on-dark-2); flex: 0 0 auto; }

/* ---------- 8. 区块标题 ---------- */
.sec { padding-block: 46px; }
.sec--tint { background: var(--paper-2); }
.sec--line { border-top: 1px solid var(--line); }
.sec--dark { background: var(--dark); color: var(--on-dark); }

.sec-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: end;
  gap: 4px 18px;
  border-top: 3px solid var(--ink);
  padding-block: 13px 0;
  margin-bottom: 26px;
}
.sec--dark .sec-head { border-top-color: var(--on-dark); }
.sec-head__no {
  grid-row: 1 / 3; grid-column: 1;
  align-self: stretch; display: flex; align-items: flex-end;
  font-family: var(--font-mono); font-size: 30px; font-weight: 700; line-height: 1;
  color: var(--deco);
  padding-right: 14px; border-right: 1px solid var(--line);
}
.sec--dark .sec-head__no { color: var(--on-dark-2); border-right-color: #3a3f47; }
.sec-head__main { grid-column: 2; grid-row: 1; }
.sec-head__kicker {
  display: block;
  font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .22em;
  text-transform: uppercase; color: var(--cyan-deep);
}
.sec--dark .sec-head__kicker { color: var(--on-dark-cyan); }
.sec-head__title {
  display: block;
  font-size: clamp(21px, 2.2vw, 27px); font-weight: 800; line-height: 1.25;
  margin-top: 3px;
}
.sec-head__desc { grid-column: 2; grid-row: 2; font-size: 14px; color: var(--ink-3); }
.sec--dark .sec-head__desc { color: var(--on-dark-2); }
.sec-head__more {
  grid-column: 3; grid-row: 1 / 3; align-self: end;
  display: inline-flex; align-items: center; gap: 7px;
  font-family: var(--font-mono); font-size: 13px; font-weight: 700;
  color: var(--magenta-deep);
  padding-bottom: 4px; border-bottom: 2px solid var(--magenta);
}
.sec-head__more:hover { text-decoration: none; border-bottom-color: var(--ink); }
.sec--dark .sec-head__more { color: var(--on-dark-magenta); border-bottom-color: var(--on-dark-magenta); }
.sec-head__more .i { width: 15px; height: 15px; }

/* ---------- 9. 栏目分类（套印方格） ---------- */
.cats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.cat {
  display: flex; flex-direction: column;
  position: relative;
  background: var(--card);
  border: 1px solid var(--line);
  border-top: 3px solid var(--line-2);
  padding: 18px 18px 16px;
  min-width: 0; height: 100%;
  transition: border-top-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.cat:hover { border-top-color: var(--magenta); transform: translateY(-3px); box-shadow: var(--shadow); text-decoration: none; }
.cat__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cat__mark {
  display: grid; place-items: center;
  width: 40px; height: 40px;
  background: var(--paper-2); color: var(--ink);
  flex: 0 0 auto;
}
.cat:hover .cat__mark { background: var(--cyan-soft); color: var(--cyan-deep); }
.cat__mark .i { width: 21px; height: 21px; }
.cat__no {
  display: block; font-family: var(--font-mono); font-size: 12px;
  color: var(--ink-3); letter-spacing: .06em;
}
.cat__name {
  display: block; font-size: 17px; font-weight: 700;
  color: var(--ink); margin-top: 13px;
}
.cat__desc { display: block; font-size: 13px; color: var(--ink-3); margin-top: 6px; }
.cat__foot {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin-top: auto; padding-top: 13px;
  border-top: 1px dashed var(--line-2);
}
.cat__cnt { display: block; font-family: var(--font-mono); font-size: 12.5px; color: var(--cyan-deep); }

/* ---------- 10. 头版图说（带缩略图） ---------- */
.figs { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
.fig { min-width: 0; }
.fig--lead { border: 1px solid var(--line); background: var(--card); }
.fig__pic { display: block; position: relative; overflow: hidden; background: var(--paper-2); }
.fig__pic img { width: 100%; height: 100%; object-fit: cover; }
.fig--lead .fig__pic { aspect-ratio: 16 / 9; border-bottom: 1px solid var(--line); }
.fig__tag {
  position: absolute; left: 0; top: 0;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 12px;
  background: var(--magenta-deep); color: #fff;
  font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .1em;
}
.fig__body { padding: 18px 20px 20px; }
.fig__kicker {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .16em;
  text-transform: uppercase; color: var(--cyan-deep);
}
.fig__title { font-size: clamp(20px, 2vw, 26px); font-weight: 800; line-height: 1.32; margin-top: 9px; }
.fig__title a { color: var(--ink); }
.fig__title a:hover { color: var(--magenta-deep); text-decoration: none; }
.fig__desc { margin-top: 10px; font-size: 14.5px; color: var(--ink-2); }
.fig__meta {
  display: flex; flex-wrap: wrap; gap: 6px 14px;
  margin-top: 13px;
  font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-3);
}
.fig__meta span { display: inline-flex; align-items: center; gap: 5px; }
.fig__meta .i { width: 13px; height: 13px; }

.figs__side { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 18px; }
.fig--sm {
  display: grid; grid-template-columns: 108px minmax(0, 1fr); gap: 14px;
  align-items: center;
  padding: 13px 0;
  border-top: 1px solid var(--line);
}
.fig--sm:first-child { border-top: 0; }
.fig--sm .fig__pic { aspect-ratio: 16 / 9; border: 1px solid var(--line); }
.fig--sm .fig__title { font-size: 15.5px; font-weight: 700; line-height: 1.45; margin-top: 0; }
.fig--sm .fig__meta { margin-top: 7px; }
.fig--sm .fig__cat {
  display: inline-block; font-family: var(--font-mono); font-size: 11px;
  color: var(--cyan-deep); letter-spacing: .08em;
}

/* ---------- 11. 报纸多栏文本流（三栏无缩略图） ---------- */
.flow {
  column-count: 3;
  column-gap: 34px;
  column-rule: 1px solid var(--line);
}
.flow__item { break-inside: avoid; padding-block: 0 15px; }
.flow__cat {
  display: inline-block;
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em;
  color: var(--cyan-deep);
}
.flow__t { display: block; font-size: 15px; font-weight: 700; line-height: 1.45; margin-top: 4px; }
.flow__t a { color: var(--ink); }
.flow__t a:hover { color: var(--magenta-deep); text-decoration: none; }
.flow__d {
  display: block; font-family: var(--font-mono); font-size: 12px;
  color: var(--ink-3); margin-top: 5px;
}
.flow__end {
  column-span: all;
  margin-top: 6px; padding-top: 12px;
  border-top: 1px dashed var(--line-2);
  font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .18em;
  color: var(--ink-3);
}

/* ---------- 12. 分类短讯（双列无缩略图） ---------- */
.briefs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
.brief { min-width: 0; border-left: 3px solid var(--line-2); padding: 2px 0 2px 18px; margin-bottom: 22px; }
.brief:nth-child(3n + 1) { border-left-color: var(--cyan); }
.brief:nth-child(3n + 2) { border-left-color: var(--magenta); }
.brief:nth-child(3n + 3) { border-left-color: var(--yellow); }
.brief__cat {
  display: inline-block;
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em;
  color: var(--cyan-deep);
}
.brief__title { display: block; font-size: 16.5px; font-weight: 700; line-height: 1.42; margin-top: 5px; }
.brief__title a { color: var(--ink); }
.brief__title a:hover { color: var(--magenta-deep); text-decoration: none; }
.brief__desc { display: block; font-size: 14px; color: var(--ink-2); margin-top: 7px; }
.brief__meta {
  display: flex; flex-wrap: wrap; gap: 6px 13px; margin-top: 9px;
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-3);
}
.brief__meta span { display: inline-flex; align-items: center; gap: 5px; }
.brief__meta .i { width: 13px; height: 13px; }

/* ---------- 13. 表单 ---------- */
.form-grid {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 30px;
  align-items: start;
}
.form-intro__kicker {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .2em;
  text-transform: uppercase; color: var(--yellow);
}
.form-intro__title {
  font-family: var(--font-serif);
  font-size: clamp(23px, 2.4vw, 31px); font-weight: 700; line-height: 1.3;
  color: var(--on-dark); margin-top: 12px;
}
.form-intro__desc { margin-top: 14px; color: var(--on-dark-2); font-size: 15px; }
.form-intro__list { margin-top: 18px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.form-intro__list li { display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; color: var(--on-dark); }
.form-intro__list .i { width: 16px; height: 16px; color: var(--on-dark-cyan); margin-top: 4px; }
.form-intro__tel {
  display: inline-flex; align-items: center; gap: 9px; margin-top: 22px;
  font-family: var(--font-mono); font-size: 19px; font-weight: 700; color: var(--yellow);
}

/* 深色区里的白色卡片：容器 + 卡内标题都要显式声明颜色 */
.form-card {
  background: #fff; color: var(--ink);
  border: 1px solid var(--ink);
  padding: 24px 24px 26px;
  min-width: 0;
}
.sec--dark .form-card,
.sec--dark .form-card h1,
.sec--dark .form-card h2,
.sec--dark .form-card h3,
.sec--dark .form-card h4 { color: var(--ink); }
.form-card__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.form-card__title { display: block; font-size: 19px; font-weight: 800; }
.form-card__note {
  display: block; margin-top: 5px;
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-3);
}
.form-alert {
  display: flex; align-items: flex-start; gap: 9px;
  margin-top: 15px; padding: 11px 13px;
  border: 1px solid var(--magenta-deep);
  background: var(--magenta-soft); color: var(--magenta-deep);
  font-size: 13.5px; font-weight: 600;
}
.form-alert[hidden] { display: none; }
.form-alert.is-ok { border-color: var(--cyan-deep); background: var(--cyan-soft); color: var(--cyan-deep); }
.form-alert .i { width: 16px; height: 16px; margin-top: 3px; }

.form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; margin-top: 16px; }
.field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.field--full { grid-column: 1 / -1; }
.field__label { display: block; font-size: 13.5px; font-weight: 600; color: var(--ink-2); }
.field__label .req { color: var(--magenta-deep); }
.field__ctl { position: relative; display: block; }
.field__in,
.field__ta,
.field__sel {
  width: 100%; min-width: 0;
  padding: 11px 13px;
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: 0;
  font-size: 15px; line-height: 1.5;
  transition: border-color .15s ease, background .15s ease;
}
.field__ta { min-height: 104px; resize: vertical; }
.field__sel { appearance: none; -webkit-appearance: none; padding-right: 36px; }
.field__ctl--sel::after {
  content: ""; position: absolute; right: 15px; top: 50%;
  width: 7px; height: 7px; margin-top: -5px;
  border-right: 1.6px solid var(--ink-3); border-bottom: 1.6px solid var(--ink-3);
  transform: rotate(45deg); pointer-events: none;
}
.field__in:focus, .field__ta:focus, .field__sel:focus {
  outline: none; border-color: var(--cyan-deep); background: #fff;
}
.field__err { display: block; font-size: 12.5px; color: var(--magenta-deep); font-weight: 600; }
.field.is-invalid .field__in,
.field.is-invalid .field__ta,
.field.is-invalid .field__sel { border-color: var(--magenta-deep); background: #fff5f8; }
.field__hint { display: block; font-size: 12px; color: var(--ink-3); }

.check { grid-column: 1 / -1; display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: var(--ink-2); }
.check input { width: 17px; height: 17px; margin-top: 3px; flex: 0 0 auto; accent-color: var(--magenta-deep); }
.check label { display: block; }
.form__foot { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 4px; }
.form__foot .btn { flex: 0 0 auto; }
.form__foot > span { font-size: 12.5px; color: var(--ink-3); }

/* ---------- 14. FAQ ---------- */
.faq { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; align-items: start; }
.faq__q {
  display: flex; gap: 12px;
  padding: 15px 0;
  border-top: 1px solid var(--line);
  cursor: pointer;
  list-style: none;
  font-size: 16px; font-weight: 700; color: var(--ink);
}
.sec--dark .faq__q { border-top-color: #343941; color: var(--on-dark); }
.faq__q::-webkit-details-marker { display: none; }
.faq__q::marker { content: ""; }
.faq__q .i { width: 17px; height: 17px; color: var(--magenta-deep); margin-top: 5px; flex: 0 0 auto; transition: transform .2s ease; }
.sec--dark .faq__q .i { color: var(--on-dark-magenta); }
.faq__it[open] .faq__q .i { transform: rotate(45deg); }
.faq__a {
  padding: 0 0 17px 29px;
  font-size: 14.5px; color: var(--ink-2);
}
.sec--dark .faq__a { color: var(--on-dark-2); }

/* ---------- 15. 友情链接 ---------- */
.links {  }
.links__title {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .14em;
  color: var(--ink-3); padding-bottom: 9px; border-bottom: 1px solid var(--line);
}
.links__title::before { content: ""; width: 6px; height: 6px; background: var(--magenta); }
.links__list { display: flex; flex-wrap: wrap; gap: 8px 0; margin-top: 10px; }
.links__list li { display: flex; align-items: center; }
.links__list li + li::before { content: "·"; color: var(--deco); margin: 0 10px; }
.links__list a { font-size: 13.5px; color: var(--ink-2); }
.links__list a:hover { color: var(--magenta-deep); }

/* ---------- 16. 页脚 ---------- */
.site-footer { background: var(--dark); color: var(--on-dark-2); padding-top: 44px; }
.foot-main {
  display: grid;
  grid-template-columns: 1.5fr minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: 28px 34px;
  padding-bottom: 32px;
}
.foot-brand { display: flex; align-items: center; gap: 12px; color: var(--on-dark); }
.foot-brand .brand__mark { background: var(--on-dark); color: var(--dark); }
.foot-brand .brand__name { font-size: 26px; }
.foot-brand .brand__sub { color: var(--on-dark-2); }
.foot-desc { margin-top: 16px; font-size: 13.5px; line-height: 1.8; }
.foot-contact { display: grid; grid-template-columns: minmax(0, 1fr); gap: 9px; margin-top: 16px; }
.foot-contact li { display: flex; gap: 9px; align-items: flex-start; font-size: 13.5px; }
.foot-contact .i { width: 15px; height: 15px; color: var(--on-dark-cyan); margin-top: 4px; flex: 0 0 auto; }
.foot-col__title {
  display: block;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .16em;
  color: var(--on-dark); padding-bottom: 10px; border-bottom: 1px solid #343941;
}
.foot-col__list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 9px; margin-top: 12px; }
.foot-col__list a { font-size: 13.5px; color: var(--on-dark-2); }
.foot-col__list a:hover { color: var(--on-dark-cyan); }
.foot-bottom {
  border-top: 1px solid #2b3037;
  padding-block: 16px 20px;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 20px;
  align-items: center;
  font-size: 12.5px;
}
.foot-bottom__l { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.foot-bottom__r { display: flex; flex-wrap: wrap; gap: 6px 16px; justify-content: flex-end; }
.foot-bottom a { color: var(--on-dark-2); }

/* ---------- 17. 移动端底栏 ---------- */
.mobile-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  background: #fff;
  border-top: 1px solid var(--ink);
}
.mobile-bar__it {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  padding: 9px 4px 10px;
  font-size: 11.5px; font-weight: 600; color: var(--ink-2);
  border-left: 1px solid var(--line);
  min-width: 0;
}
.mobile-bar__it:first-child { border-left: 0; }
.mobile-bar__it .i { width: 19px; height: 19px; }
.mobile-bar__it.is-cta { background: var(--magenta-deep); color: #fff; }
.mobile-bar__it:hover { text-decoration: none; }

/* ---------- 18. 内页 banner 与面包屑 ---------- */
.page-banner { position: relative; overflow: hidden; background: var(--paper-2); border-bottom: 1px solid var(--line); }
.page-banner__bg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: .5; }
.page-banner__inner {
  position: relative;
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px;
  padding-block: 30px 28px;
}
.page-banner__kicker {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .2em;
  text-transform: uppercase; color: var(--cyan-deep);
}
.page-banner__title {
  font-family: var(--font-serif);
  font-size: clamp(26px, 3.4vw, 42px); font-weight: 700; line-height: 1.2;
  margin-top: 10px;
  text-shadow: 2px 0 0 rgba(13, 127, 140, .26), -2px 0 0 rgba(201, 42, 106, .22);
}
.page-banner__desc { margin-top: 12px; font-size: 15px; color: var(--ink-2); max-width: 40em; }
.page-banner__stats {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid var(--ink); background: #fff;
}
.page-banner__stats .stat { padding: 12px 14px; }
.page-banner__stats .stat:nth-child(3) { border-right: 0; }
.page-banner__stats .stat__n { font-size: 20px; }

.crumb { background: #fff; border-bottom: 1px solid var(--line); }
.crumb__inner {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 9px;
  padding-block: 11px;
  font-size: 13px; color: var(--ink-3);
}
.crumb__inner a { color: var(--ink-2); }
.crumb__inner .i { width: 13px; height: 13px; color: var(--line-2); }
.crumb__cur { color: var(--ink); font-weight: 600; }

/* ---------- 19. 列表页 ---------- */
.filters { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; }
.chip {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 8px 14px;
  border: 1px solid var(--line-2);
  background: #fff;
  font-size: 13.5px; font-weight: 600; color: var(--ink-2);
}
.chip:hover { border-color: var(--ink); color: var(--ink); text-decoration: none; }
.chip.is-on { background: var(--ink); border-color: var(--ink); color: #fff; }
.chip__n { font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-3); }
.chip.is-on .chip__n { color: var(--yellow); }
.filter-note {
  margin-top: 12px; padding: 10px 14px;
  background: var(--cyan-soft); border-left: 3px solid var(--cyan-deep);
  font-size: 13.5px; color: var(--cyan-deep); font-weight: 600;
}
.empty-note {
  padding: 34px 20px; text-align: center;
  border: 1px dashed var(--line-2); background: #fff;
  font-size: 14.5px; color: var(--ink-3);
}

.lgrid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 30px; align-items: start; }
.lrow--lead { border: 1px solid var(--line); background: #fff; }
.lrow--lead .fig__pic { aspect-ratio: 16 / 9; border-bottom: 1px solid var(--line); }
.cards2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.card2 { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); min-width: 0; height: 100%; }
.card2__pic { display: block; aspect-ratio: 16 / 9; overflow: hidden; border-bottom: 1px solid var(--line); background: var(--paper-2); }
.card2__pic img { width: 100%; height: 100%; object-fit: cover; }
.card2__body { padding: 15px 17px 17px; display: flex; flex-direction: column; flex: 1; }
.card2__title { display: block; font-size: 16.5px; font-weight: 700; line-height: 1.42; margin-top: 7px; }
.card2__title a { color: var(--ink); }
.card2__title a:hover { color: var(--magenta-deep); text-decoration: none; }
.card2__desc { display: block; font-size: 13.5px; color: var(--ink-2); margin-top: 8px; }
.card2__meta {
  display: flex; flex-wrap: wrap; gap: 6px 13px; margin-top: auto; padding-top: 12px;
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-3);
}

.rows { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
.rowline {
  display: grid; grid-template-columns: 104px minmax(0, 1fr) auto;
  gap: 4px 18px; align-items: start;
  padding: 16px 0; border-top: 1px solid var(--line);
  min-width: 0;
}
.rowline:first-child { border-top: 0; }
.rowline__d {
  display: block;
  font-family: var(--font-mono); font-size: 20px; font-weight: 700; line-height: 1.1;
  color: var(--magenta-deep);   /* 日期属信息性文字：窄屏降为 16px 后需 ≥4.5:1，故不用装饰灰 */
}
.rowline__day { display: block; font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-3); }
.rowline__main { min-width: 0; }
.rowline__cat {
  display: inline-block; font-family: var(--font-mono); font-size: 11px;
  letter-spacing: .08em; color: var(--cyan-deep);
}
.rowline__t { display: block; font-size: 17px; font-weight: 700; line-height: 1.42; margin-top: 5px; }
.rowline__t a { color: var(--ink); }
.rowline__t a:hover { color: var(--magenta-deep); text-decoration: none; }
.rowline__desc { display: block; font-size: 14px; color: var(--ink-2); margin-top: 7px; }
.rowline__meta {
  display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: 8px;
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-3);
}
.rowline__go { align-self: center; color: var(--line-2); }
.rowline__go .i { width: 20px; height: 20px; }
.rowline:hover .rowline__go { color: var(--magenta-deep); }
.rowline.is-hidden { display: none; }

.pager { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; margin-top: 28px; }
.pager__it {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 40px; height: 40px; padding: 0 12px;
  border: 1px solid var(--line-2); background: #fff;
  font-family: var(--font-mono); font-size: 14px; font-weight: 700; color: var(--ink-2);
}
.pager__it:hover { border-color: var(--ink); color: var(--ink); text-decoration: none; }
.pager__it.is-on { background: var(--ink); border-color: var(--ink); color: #fff; }
.pager__it.is-disabled { color: var(--ink-3); border-color: var(--line); background: var(--paper-2); cursor: not-allowed; }
.pager__gap { color: var(--ink-3); padding: 0 2px; }

/* 侧栏 */
.lside { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; align-content: start; }
.widget { background: #fff; border: 1px solid var(--line); padding: 17px 18px 19px; min-width: 0; }
.widget__title {
  display: flex; align-items: center; gap: 9px;
  font-size: 15px; font-weight: 800;
  padding-bottom: 11px; border-bottom: 2px solid var(--ink);
}
.widget__title .i { width: 16px; height: 16px; color: var(--magenta-deep); }
.widget__list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 4px; }
.widget__list li {
  display: grid; grid-template-columns: 22px minmax(0, 1fr);
  gap: 10px; align-items: baseline;
  padding: 11px 0; border-bottom: 1px dashed var(--line);
}
.widget__list li:last-child { border-bottom: 0; padding-bottom: 0; }
.widget__list b { font-family: var(--font-mono); font-size: 13px; color: var(--deco); }
.widget__list li:nth-child(-n + 3) b { color: var(--magenta-deep); }
.widget__list a { font-size: 14px; color: var(--ink-2); line-height: 1.5; }
.widget__list a:hover { color: var(--magenta-deep); text-decoration: none; }
.widget__cat { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.widget__cat a {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 11px; border: 1px solid var(--line-2);
  font-size: 13px; color: var(--ink-2);
}
.widget__cat a:hover { border-color: var(--cyan-deep); color: var(--cyan-deep); text-decoration: none; }
.widget__cat span { font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-3); }
.widget__arch { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 4px; }
.widget__arch li { border-bottom: 1px dashed var(--line); }
.widget__arch li:last-child { border-bottom: 0; }
.widget__arch a {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 11px 0; font-size: 14px; color: var(--ink-2);
}
.widget__arch a:hover { color: var(--magenta-deep); text-decoration: none; }
.widget__arch span { font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-3); }
.widget--cta { background: var(--dark); border-color: var(--dark); color: var(--on-dark); }
.widget--cta .widget__title { color: var(--on-dark); border-bottom-color: var(--on-dark); }
.widget--cta .widget__title .i { color: var(--on-dark-magenta); }
.widget--cta p { font-size: 14px; color: var(--on-dark-2); margin-top: 12px; }
.widget--cta .btn { margin-top: 15px; }
.widget--dark { background: var(--dark); border-color: var(--dark); }
.widget--dark .widget__title { color: var(--on-dark); border-bottom-color: var(--on-dark); }
.widget--dark .widget__title .i { color: var(--on-dark-magenta); }
.widget--dark .widget__list b { color: #7c848c; }
.widget--dark .widget__list li { border-bottom-color: #343941; }
.widget--dark .widget__list li:nth-child(-n + 3) b { color: var(--on-dark-magenta); }
.widget--dark .widget__list a { color: var(--on-dark-2); }
.widget--dark .widget__list a:hover { color: var(--on-dark-cyan); }

/* ---------- 20. 文章页 ---------- */
.article-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 30px; align-items: start; padding-block: 34px 44px; }
.article-main { min-width: 0; }
.article-head { border-bottom: 1px solid var(--line); padding-bottom: 22px; }
.article-head__cat {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 12px;
  background: var(--magenta-deep); color: #fff;
  font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .1em;
}
.article-title {
  font-family: var(--font-serif);
  font-size: clamp(25px, 3.2vw, 38px); font-weight: 700; line-height: 1.28;
  margin-top: 15px;
  text-shadow: 2px 0 0 rgba(13, 127, 140, .22), -2px 0 0 rgba(201, 42, 106, .20);
}
.article-sub { display: block; margin-top: 11px; font-size: 16px; color: var(--ink-2); }
.article-meta {
  display: flex; flex-wrap: wrap; gap: 7px 18px;
  margin-top: 16px;
  font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-3);
}
.article-meta span { display: inline-flex; align-items: center; gap: 6px; }
.article-meta .i { width: 14px; height: 14px; }

.article-body { padding-top: 26px; font-size: 16.5px; line-height: 1.9; color: var(--ink-2); }
.article-body > p { margin-bottom: 18px; }
.article-body > p:first-of-type::first-letter {
  float: left; font-family: var(--font-serif);
  font-size: 3.1em; line-height: .84; font-weight: 700;
  color: var(--magenta-deep); margin: 4px 9px 0 0;
}
.article-body h2 {
  position: relative;
  margin: 38px 0 15px;
  padding-left: 15px;
  font-size: clamp(19px, 1.9vw, 23px); font-weight: 800; line-height: 1.4;
  color: var(--ink);
}
.article-body h2::before { content: ""; position: absolute; left: 0; top: .18em; bottom: .18em; width: 4px; background: var(--magenta); }
.article-body h3 {
  position: relative;
  margin: 26px 0 12px;
  padding-left: 17px;
  font-size: 17.5px; font-weight: 700; color: var(--ink);
}
.article-body h3::before {
  content: ""; position: absolute; left: 0; top: .42em;
  width: 9px; height: 9px; background: var(--cyan);
}
.article-body ul { margin: 0 0 18px; padding-left: 2px; }
.article-body ul li {
  position: relative; padding-left: 20px; margin-bottom: 9px;
}
.article-body ul li::before {
  content: ""; position: absolute; left: 3px; top: .72em;
  width: 6px; height: 6px; background: var(--yellow);
}
.article-body a { color: var(--cyan-deep); border-bottom: 1px solid var(--cyan-soft); }
.scroll-x { margin: 0 0 20px; overflow-x: auto; overscroll-behavior-x: contain; }
.article-body table { width: 100%; min-width: 460px; font-size: 14px; line-height: 1.7; }
.article-body th {
  background: var(--ink); color: var(--on-dark);
  font-weight: 700; text-align: left;
  padding: 10px 13px; border: 1px solid var(--ink);
}
.article-body td { padding: 10px 13px; border: 1px solid var(--line); background: #fff; color: var(--ink-2); vertical-align: top; }
.article-body tr:nth-child(even) td { background: var(--paper); }

.quote {
  margin: 0 0 20px;
  padding: 16px 20px 16px 22px;
  border-left: 4px solid var(--cyan);
  background: var(--cyan-soft);
  font-family: var(--font-serif);
  font-size: 16px; line-height: 1.85; color: #08454d;
}
.quote cite { display: block; margin-top: 9px; font-family: var(--font-mono); font-size: 12px; font-style: normal; color: #0a5a63; }
.tipbox {
  display: flex; gap: 12px;
  margin: 0 0 20px;
  padding: 15px 17px;
  border: 1px solid var(--yellow-deep);
  background: var(--yellow-soft);
  font-size: 14.5px; line-height: 1.8; color: #6b4b00;
}
.tipbox .i { width: 18px; height: 18px; flex: 0 0 auto; margin-top: 4px; }
.figure { margin: 0 0 22px; border: 1px solid var(--line); background: #fff; }
.figure img { width: 100%; height: auto; border-bottom: 1px solid var(--line); }
.figure figcaption {
  padding: 10px 14px;
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-3);
}

.article-foot {
  max-width: 38em;
  margin-top: 26px; padding: 15px 17px;
  border: 1px solid var(--line); background: #fff;
  font-size: 13px; line-height: 1.8; color: var(--ink-3);
}
.article-foot b { display: block; color: var(--ink-2); margin-bottom: 5px; }

.pn { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 28px; }
.pn__it {
  display: flex; flex-direction: column; gap: 7px;
  padding: 15px 17px; border: 1px solid var(--line); background: #fff;
  min-width: 0;
}
.pn__it:hover { border-color: var(--ink); text-decoration: none; }
.pn__lb {
  display: inline-flex; align-items: center; gap: 7px;
  font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .12em;
  color: var(--ink-3);
}
.pn__lb .i { width: 14px; height: 14px; }
.pn__t { display: block; font-size: 15px; font-weight: 700; line-height: 1.5; color: var(--ink); }
.pn__it--next { text-align: right; }
.pn__it--next .pn__lb { justify-content: flex-end; }

.article-side { min-width: 0; align-self: stretch; }
.side-sticky {
  position: sticky; top: 74px;
  max-height: calc(100vh - 96px);
  overflow-y: auto; overscroll-behavior: contain;
  scrollbar-width: thin;
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px;
  align-content: start;
}
.toc { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 4px; }
.toc__it { border-bottom: 1px dashed var(--line); }
.toc__it:last-child { border-bottom: 0; }
.toc__it a {
  display: grid; grid-template-columns: 22px minmax(0, 1fr);
  gap: 8px; align-items: baseline;
  padding: 10px 0; font-size: 13.5px; color: var(--ink-2); line-height: 1.5;
}
.toc__it a:hover { color: var(--magenta-deep); text-decoration: none; }
.toc__no { font-family: var(--font-mono); font-size: 12px; color: var(--ink-3); }
.toc__it.is-on a { color: var(--magenta-deep); font-weight: 700; }
.toc__it.is-on .toc__no { color: var(--magenta-deep); }

/* 相关 / 最新（均无缩略图） */
.rel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
.rel__it {
  display: grid; grid-template-columns: auto minmax(0, 1fr);
  gap: 6px 13px; align-items: baseline;
  padding: 14px 0; border-top: 1px solid var(--line);
}
.rel__no { grid-row: 1 / 3; font-family: var(--font-mono); font-size: 19px; font-weight: 700; color: var(--deco); }
.rel__t { display: block; font-size: 16px; font-weight: 700; line-height: 1.45; }
.rel__t a { color: var(--ink); }
.rel__t a:hover { color: var(--magenta-deep); text-decoration: none; }
.rel__meta { display: flex; flex-wrap: wrap; gap: 6px 13px; font-family: var(--font-mono); font-size: 12px; color: var(--ink-3); }

.latest { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 38px; }
.latest__it { padding: 14px 0; border-top: 1px solid var(--line); min-width: 0; }
.latest__cat { display: inline-block; font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; color: var(--cyan-deep); }
.latest__t { display: block; font-size: 15.5px; font-weight: 700; line-height: 1.45; margin-top: 5px; }
.latest__t a { color: var(--ink); }
.latest__t a:hover { color: var(--magenta-deep); text-decoration: none; }
.latest__d { display: block; font-family: var(--font-mono); font-size: 12px; color: var(--ink-3); margin-top: 6px; }

/* ---------- 21. 断点 ---------- */
@media (min-width: 700px) {
  .hero__inner { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 40px; }
  .cats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .form-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 44px; }
  .page-banner__inner { grid-template-columns: minmax(0, 1fr) 320px; align-items: center; }
  .hero__strip__in { grid-template-columns: auto minmax(0, 1fr); gap: 6px 26px; align-items: center; }
  .hero__strip__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .figs { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 0 26px; }
  .figs__side { margin-top: 0; }
  .article-layout { grid-template-columns: minmax(0, 1fr) 316px; gap: 48px; }
  .lgrid { grid-template-columns: minmax(0, 1fr) 300px; gap: 44px; }
}

@media (min-width: 980px) {
  body .mobile-bar { display: none; }        /* 提特异性，避免被后置基础规则反压 */
  .article-layout { grid-template-columns: minmax(0, 1fr) 336px; gap: 56px; }
  .lgrid { grid-template-columns: minmax(0, 1fr) 320px; gap: 52px; }
  .lside { position: sticky; top: 74px; }
  .hero__strip__list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 1100px) {
  .cats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .foot-main { grid-template-columns: 1.6fr minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }
}

@media (max-width: 979px) {
  /* 抽屉式导航；脚本没跑时导航仍然展开可点 */
  .nav-strip__inner { flex-wrap: wrap; }
  .nav-strip__side { order: 2; }
  .nav { order: 3; flex: 1 0 100%; }
  .nav__list { flex-wrap: wrap; }
  .nav__link { padding: 13px 15px; }
  .nav-strip.is-collapsible .nav { max-height: 0; transition: max-height .28s ease; }
  .nav-strip.is-collapsible .nav.is-open { max-height: 70vh; overflow-y: auto; }
  .nav-strip.is-collapsible .nav-toggle { display: inline-flex; order: 1; }
  .nav-strip:not(.is-collapsible) .nav-toggle { display: none; }
  .masthead__inner { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; padding-block: 14px 13px; }
  p.masthead__meta--r { display: none; }      /* 隐藏规则带上链条，避免被通用规则反压 */
  .masthead__meta { justify-content: center; }
  .sec-head { grid-template-columns: auto minmax(0, 1fr); }
  .sec-head__more { grid-column: 2; grid-row: 3; justify-self: start; margin-top: 8px; }
  .foot-main { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .foot-bottom { grid-template-columns: minmax(0, 1fr); }
  .foot-bottom__r { justify-content: flex-start; }
  .mobile-bar { padding-bottom: env(safe-area-inset-bottom); }
  .site-footer { padding-bottom: 62px; }
}

@media (max-width: 900px) {
  .flow { column-count: 2; }
}

@media (max-width: 760px) {
  .cats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .briefs { grid-template-columns: minmax(0, 1fr); }
  .faq { grid-template-columns: minmax(0, 1fr); }
  .links { grid-template-columns: minmax(0, 1fr); }
  .cards2 { grid-template-columns: minmax(0, 1fr); }
  .rel { grid-template-columns: minmax(0, 1fr); }
  .latest { grid-template-columns: minmax(0, 1fr); }
  .pn { grid-template-columns: minmax(0, 1fr); }
  .pn__it--next { text-align: left; }
  .pn__it--next .pn__lb { justify-content: flex-start; }
  .rowline { grid-template-columns: minmax(0, 1fr) auto; }
  .rowline__date { grid-column: 1; display: flex; gap: 8px; align-items: baseline; }
  .rowline__d { font-size: 16px; }
  .rowline__main { grid-column: 1; }
  .rowline__go { grid-column: 2; grid-row: 1 / 3; }
  .page-banner__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page-banner__stats .stat { padding: 10px 11px; }
  .page-banner__stats .stat__n { font-size: 17px; }
  .page-banner__stats .stat__t { font-size: 11.5px; }
}

@media (max-width: 620px) {
  .hero__lead { font-size: 15.5px; }
  .form { grid-template-columns: minmax(0, 1fr); }
  .flow { column-count: 1; column-rule: 0; }
  .fig--sm { grid-template-columns: 92px minmax(0, 1fr); }
  .foot-main { grid-template-columns: minmax(0, 1fr); }
  .article-body { font-size: 16px; }
  .hero__strip__list { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 560px) {
  .nav-strip__tel { display: none; }          /* 顶栏放不下时把入口交给底部操作条 */
  .cats { grid-template-columns: minmax(0, 1fr); }
  .hero__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sec-head__no { font-size: 24px; padding-right: 11px; }
  .btn { padding: 12px 18px; }
}

/* 窄屏宽表格转键值堆叠 */
@media (max-width: 700px) {
  .article-body table { min-width: 0; }
  .article-body thead { display: none; }
  .article-body table, .article-body tbody, .article-body tr, .article-body td { display: block; width: 100%; }
  .article-body tr { border: 1px solid var(--line); margin-bottom: 12px; background: #fff; }
  .article-body tr:nth-child(even) td { background: transparent; }
  .article-body td { border: 0; border-top: 1px dashed var(--line); padding: 9px 12px; }
  .article-body td:first-child {
    border-top: 0; background: var(--paper-2); font-weight: 700; color: var(--ink);
  }
  .article-body td[data-label]::before {
    content: attr(data-label);
    display: block;
    font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em;
    color: var(--ink-3); margin-bottom: 3px;
  }
  .article-body td:first-child::before { content: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
  html.js-reveal .reveal { opacity: 1; transform: none; }
}

@media print {
  html.js-reveal .reveal { opacity: 1 !important; transform: none !important; }
  .nav-strip, .mobile-bar, .article-side, .site-footer { display: none !important; }
  body { background: #fff; }
}

/* ---------- 22. 补充组件（law19 追加） ---------- */
.is-hidden { display: none !important; }
.lmain { min-width: 0; }
.sec-block { margin-bottom: 34px; }
.sec-block:last-child { margin-bottom: 0; }
.cat__link { display: flex; flex-direction: column; height: 100%; color: inherit; }
.cat__link:hover { text-decoration: none; }
.fig__sm-body { min-width: 0; }
.fig__sm-body .fig__cat { margin-bottom: 3px; }
.figure svg, .fig-svg { width: 100%; height: auto; display: block; }
.figure .fig-svg { border-bottom: 1px solid var(--line); }
body .page-banner__stats .stat { border-bottom: 0; }

/* 关于本站与服务流程 */
.about-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
.about-text p { margin-bottom: 14px; font-size: 15px; color: var(--ink-2); }
.about-text p:last-of-type { margin-bottom: 0; }
.about-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 20px 0 0; }
.about-facts > div { border: 1px solid var(--line); background: #fff; padding: 12px 15px; }
.about-facts dt { font-family: var(--font-mono); font-size: 12px; color: var(--ink-3); }
.about-facts dd { margin: 5px 0 0; font-size: 15px; font-weight: 700; color: var(--ink); }
.steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.step { background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--cyan); padding: 16px 17px 18px; }
.step:nth-child(2) { border-top-color: var(--magenta); }
.step:nth-child(3) { border-top-color: var(--yellow); }
.step:nth-child(4) { border-top-color: var(--ink); }
.step__no { display: block; font-family: var(--font-mono); font-size: 12px; color: var(--ink-3); }
.step__t { display: block; font-size: 16px; font-weight: 700; margin-top: 6px; }
.step__d { display: block; font-size: 13.5px; color: var(--ink-2); margin-top: 7px; }

@media (min-width: 860px) {
  .about-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 46px; }
}
@media (max-width: 520px) {
  .about-facts, .steps { grid-template-columns: minmax(0, 1fr); }
}