/* 版式密度：在 V1.2 的内容框架内收紧节奏、把“标题＋一段话”改成两栏、角色页右侧吸顶栏、电梯航迹、首页数字带与问题入口。
   文案一字不改，只改排布。 */

/* ---- 1. 节奏收紧 ---- */
.section { padding: 64px 0; }
.hero-inner { padding: 96px 24px 110px; }
.hero-inner.short { padding: 72px 24px 80px; }
.block { padding: 40px 0; }
footer { padding: 44px 0 36px; margin-top: 32px; }
.cta-strip { padding: 44px 44px; }

/* ---- 2. 标题＋段落 两栏 ---- */
@media (min-width: 961px) {
  .sec-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); column-gap: 56px; row-gap: 4px; max-width: none; margin-bottom: 30px; padding-top: 26px; align-items: end; }
  .sec-head .wp { grid-column: 1; grid-row: 1; margin-bottom: 8px; }
  .sec-head h2 { grid-column: 1; grid-row: 2; margin-bottom: 0; }
  .sec-head p { grid-column: 2; grid-row: 1 / span 2; align-self: end; margin: 0; padding-bottom: 6px; }
  .prose { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); column-gap: 56px; max-width: none; }
  .prose h2 { grid-column: 1; align-self: start; position: sticky; top: 90px; margin: 0; }
  .prose > p, .prose > .facing, .prose > .quote, .prose > ul, .prose > ol, .prose > div { grid-column: 2; }
  .prose > p:last-child { margin-bottom: 0; }
}

/* ---- 3. 角色页：正文 + 右侧吸顶栏 ---- */
@media (min-width: 1100px) {
  .page-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; column-gap: 56px; align-items: start; }
  .page-aside { position: sticky; top: 90px; }
}
.page-aside { display: grid; gap: 14px; }
.aside-card { background: #fff; border: 1px solid var(--line, #e4eaef); border-radius: 14px; padding: 16px 18px; box-shadow: 0 1px 2px rgba(19,32,44,.04); }
.aside-card h4 { font-size: 12.5px; letter-spacing: .14em; color: var(--muted, #6b7d8f); font-weight: 600; margin-bottom: 10px; }
.aside-nav a { display: block; font-size: 14.5px; color: var(--body, #42566b); padding: 5px 0 5px 14px; position: relative; border-left: 2px solid var(--line, #e4eaef); }
.aside-nav a.on { color: var(--steel, #22485b); font-weight: 600; border-left-color: var(--rose, #c48385); }
.aside-q button { display: block; width: 100%; text-align: left; border: 1px solid var(--line, #e4eaef); border-radius: 10px; background: #fff; color: var(--ink, #1b2e3e); font-family: inherit; font-size: 14px; padding: 8px 12px; margin-bottom: 8px; cursor: pointer; line-height: 1.5; }
.aside-q button::before { content: "问 "; color: var(--rose-d, #a9666c); font-weight: 700; }
.aside-q button:hover { border-color: var(--steel, #22485b); color: var(--steel, #22485b); transform: translateY(-1px); }
.aside-q button:last-child { margin-bottom: 0; }
.aside-contact p { font-size: 14px; color: var(--body, #42566b); margin: 0 0 4px; }
.aside-contact .btn { margin-top: 10px; }
@media (max-width: 1099px) { .page-aside { margin-top: 32px; } }

/* ---- 4. 电梯航迹（右侧竖向） ---- */
.lj-elev { position: fixed; right: 22px; top: 50%; transform: translateY(-50%); z-index: 45; display: none; }
@media (min-width: 1200px) { html.has-elev .lj-elev { display: block; } }
.lj-elev::before { content: ""; position: absolute; left: 5px; top: 0; bottom: 0; border-left: 1px dashed #c3d0da; }
.lj-elev a { position: relative; display: flex; align-items: center; gap: 12px; height: 26px; color: transparent; font-size: 12.5px; text-decoration: none; }
.lj-elev a i { width: 11px; height: 11px; border-radius: 50%; background: #fff; border: 1.5px solid #b9c8d3; flex: none; transition: transform .25s cubic-bezier(.2,.7,.2,1), background .2s, border-color .2s, box-shadow .2s; }
.lj-elev a span { position: absolute; right: 24px; white-space: nowrap; background: var(--ink, #1b2e3e); color: #fff; border-radius: 8px; padding: 3px 10px; font-size: 12px; opacity: 0; transform: translateX(6px); transition: opacity .18s, transform .18s; pointer-events: none; }
.lj-elev a:hover span, .lj-elev a.on span { opacity: 1; transform: none; }
.lj-elev a.on i { background: var(--grad, linear-gradient(115deg,#22485b,#e28e8d)); border-color: transparent; transform: scale(1.25); box-shadow: 0 0 0 5px rgba(196,131,133,.16); }
.lj-elev a.on span { background: var(--steel, #22485b); }

/* ---- 5. 首页：数字带 + 常见问题直达 ---- */
.stats { background: #fff; border-bottom: 1px solid var(--line, #e4eaef); }
.stats .container { display: grid; grid-template-columns: repeat(4, 1fr); }
.stat { padding: 22px 8px 20px 0; border-left: 1px solid var(--line, #e4eaef); padding-left: 22px; }
.stat:first-child { border-left: 0; padding-left: 0; }
.stat b { display: block; font-family: var(--serif, serif); font-size: 30px; font-weight: 600; color: var(--ink, #1b2e3e); line-height: 1.2; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.stat b small { font-family: var(--sans, sans-serif); font-size: 13px; font-weight: 500; color: var(--muted, #6b7d8f); margin-left: 4px; letter-spacing: 0; }
.stat span { display: block; font-size: 13px; color: var(--muted, #6b7d8f); margin-top: 4px; }
.qrow { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 26px; }
.qrow .lb { font-size: 12.5px; letter-spacing: .14em; color: var(--muted, #6b7d8f); margin-right: 4px; }
.qrow button { border: 1px solid var(--line, #e4eaef); border-radius: 999px; background: #fff; color: var(--body, #42566b); font-family: inherit; font-size: 13.5px; padding: 7px 14px; cursor: pointer; transition: border-color .15s, color .15s, transform .18s, box-shadow .18s; }
.qrow button::before { content: "问 "; color: var(--rose-d, #a9666c); font-weight: 700; }
.qrow button:hover { border-color: var(--steel, #22485b); color: var(--steel, #22485b); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(19,32,44,.08); }
@media (max-width: 960px) { .stats .container { grid-template-columns: repeat(2, 1fr); } .stat:nth-child(3) { border-left: 0; padding-left: 0; } }
@media (max-width: 720px) { .stats .container { grid-template-columns: 1fr 1fr; } .stat b { font-size: 24px; } .section { padding: 48px 0; } }

/* 页脚备案号：与版权行同色，鼠标悬停显示为链接（工信部要求可点击跳转 beian.miit.gov.cn） */
.foot-meta .sep { color: #c6d0d9; margin: 0 2px; }
.foot-meta a.icp { color: inherit; text-decoration: none; border-bottom: 1px solid transparent; transition: color .2s, border-color .2s; }
.foot-meta a.icp:hover { color: var(--accent, #1f6feb); border-bottom-color: currentColor; }