/* ============================================================
   VPNCZ — help.css
   仅用于 zh-CN/faq.html（帮助中心）：页头事实条、分类分组、
   分类计数胶囊、页尾工单入口。所有颜色/圆角引用设计令牌。
   ============================================================ */

/* ---------- 1. 页头 ---------- */
.help-head{padding-top:56px;padding-bottom:40px}
.help-head h1{margin-bottom:0}
.help-head .lede{max-width:56em;margin-top:16px}
.help-facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.help-facts .fact-pill{min-height:36px}
.help-facts .fact-pill .stat-num{margin-right:2px}

/* ---------- 2. 分类分组 ---------- */
.faq-group{padding-top:56px;padding-bottom:0}
.faq-group:first-of-type{padding-top:40px}
.faq-group-head{
  display:flex;flex-wrap:wrap;align-items:center;gap:12px;
  margin-bottom:10px;min-width:0;
}
.faq-group-head>*{min-width:0}
.faq-count{
  display:inline-flex;align-items:center;min-height:24px;padding:0 10px;
  border-radius:var(--r-pill);background:var(--panel-2);color:var(--muted);
  font-family:var(--font-mono);font-size:12px;font-weight:600;letter-spacing:.02em;
  line-height:1;flex:none;
}
.faq-group-note{
  font-size:15px;line-height:1.7;color:var(--muted);
  max-width:56ch;margin:0 0 22px;
}

/* ---------- 3. 折叠问答内的富文本 ---------- */
.faq-body ul{margin:0 0 10px;padding-left:20px}
.faq-body ul li{list-style:disc;margin-bottom:6px}
.faq-body ol{margin:0 0 10px;padding-left:22px}
.faq-body ol li{list-style:decimal;margin-bottom:6px}
.faq-body strong{color:var(--ink);font-weight:600}
.faq-body code{
  font-family:var(--font-mono);font-size:.9em;
  background:var(--panel-2);border-radius:6px;padding:1px 6px;
  overflow-wrap:anywhere;
}

/* ---------- 4. 页尾工单入口 ---------- */
.help-cta{
  margin-top:64px;padding:32px;border-radius:var(--r-md);
  background:linear-gradient(160deg,var(--panel-2) 0%,var(--bg) 100%);
  min-width:0;
}
.help-cta h2{font-size:clamp(22px,2.2vw,28px);margin-bottom:12px}
.help-cta p{
  font-size:15px;line-height:1.75;color:var(--muted);
  max-width:60ch;margin:0 0 22px;
}

/* ---------- 5. 响应式 ---------- */
@media (max-width:900px){
  .help-head{padding-top:36px;padding-bottom:28px}
  .faq-group{padding-top:44px}
  .help-cta{margin-top:48px;padding:24px}
}
@media (max-width:640px){
  .help-head{padding-top:28px;padding-bottom:20px}
  .help-facts{gap:8px}
  .faq-group{padding-top:36px}
  .faq-group-note{font-size:14px;margin-bottom:18px}
  .help-cta{margin-top:40px;padding:20px}
  .help-cta .cta-row .btn{flex:1 1 100%}
}