/* ==========================================================================
   VPNDT · help.css
   帮助中心页（questions.html）专属排布
   组件外观一律沿用 base.css / components.css，此处只写本页特有的结构
   ========================================================================== */

/* ---------- 页首 ---------- */
.help-hero{padding-top:38px;padding-bottom:26px}
.help-hero h1{margin:12px 0 14px}
.help-hero .lead{margin-bottom:20px;max-width:78ch}
.help-hero .btn-row{margin-bottom:20px}

/* 页首装饰线：一条横穿的隧道示意，纯装饰不进可访问性树 */
.help-flow{display:block;width:100%;height:44px;margin-top:24px}
.help-flow__line{fill:none;stroke:var(--accent-22);stroke-width:2;stroke-linecap:round}
.help-flow__tick{fill:none;stroke:var(--accent-10);stroke-width:2;stroke-linecap:round}
.help-flow__dot{fill:var(--accent-14)}
.help-flow__dot--mid{fill:var(--accent)}

/* ---------- 分类跳转条 ----------
   父容器必须是覆盖全部章节的 .help-doc，吸顶才有整篇的行程；
   横向内边距按版心反推，让条子与 .wrap 内的正文左右对齐。 */
.help-doc{display:block;min-width:0}
.help-doc > .toc-tabs{
  padding-inline:max(var(--gutter),calc((100% - var(--wrap)) / 2 + var(--gutter)));
}

/* ---------- 分类区块 ---------- */
.help-sec__head{max-width:840px;margin-bottom:24px}
.help-sec__head h2{margin-bottom:10px}
.help-sec__head p{color:var(--muted);font-size:14.5px}
.help-sec .faq-list{max-width:900px}

/* ---------- 页尾回顶 ---------- */
.help-doc__foot{padding-top:10px;padding-bottom:30px;text-align:right}

@media (max-width:768px){
  .help-hero{padding-top:26px;padding-bottom:18px}
  .help-flow{height:32px;margin-top:18px}
}