.page-faq{
  --faq-rail:264px;
  --faq-dash:18px;
  --faq-item-gap:10px;
  color:var(--paper);
  padding-block:clamp(20px,3.4vw,36px) clamp(56px,8vw,104px);
}

/* 面包屑 */
.page-faq .faq-crumbs{margin-bottom:clamp(18px,3vw,28px);}
.page-faq .faq-crumbs-list{
  display:flex;flex-wrap:wrap;gap:8px;
  margin:0;padding:0;list-style:none;
  font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.08em;text-transform:uppercase;color:var(--muted);
}
.page-faq .faq-crumbs-list li{display:flex;align-items:center;gap:8px;}
.page-faq .faq-crumbs-list li+li::before{content:"/";color:var(--line);}
.page-faq .faq-crumbs-list a{
  color:var(--muted);text-decoration:none;
  border-bottom:1px solid transparent;transition:color var(--ease),border-color var(--ease);
}
.page-faq .faq-crumbs-list a:hover{color:var(--lime);border-bottom-color:var(--lime);}
.page-faq .faq-crumbs-list [aria-current]{color:var(--paper);}

/* 首屏 */
.page-faq .faq-hero{
  position:relative;
  display:grid;gap:clamp(20px,3vw,32px);
  padding:clamp(22px,3.6vw,40px) 0 clamp(24px,3.6vw,44px);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.page-faq .faq-hero::after{
  content:"";position:absolute;left:0;bottom:-1px;
  width:clamp(56px,12vw,140px);height:3px;background:var(--lime);
}
.page-faq .faq-hero-copy{display:grid;gap:14px;align-content:start;}
.page-faq .faq-hero h1{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(34px,6.4vw,72px);
  font-weight:700;line-height:1.03;letter-spacing:-.02em;
  color:var(--white);max-width:16ch;
}
.page-faq .faq-intro{
  margin:0;max-width:44ch;
  font-size:var(--fs-16);line-height:1.75;color:rgba(243,235,221,.86);
}
.page-faq .faq-hero-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px;}

.page-faq .faq-hero-visual{
  display:flex;flex-direction:column;justify-content:space-between;
  gap:8px;
  padding:14px 16px;
  border:1px solid var(--line);
  background:
    repeating-linear-gradient(135deg,transparent 0 9px,rgba(46,74,63,.55) 9px 10px),
    var(--board);
  min-height:132px;
}
.page-faq .faq-hero-visual-k{
  font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.18em;color:var(--muted);
}
.page-faq .faq-hero-visual-v{
  font-family:var(--font-mono);font-size:clamp(40px,7vw,64px);
  line-height:.9;font-weight:700;color:var(--lime);font-variant-numeric:tabular-nums;
}
.page-faq .faq-hero-visual-t{
  font-family:var(--font-mono);font-size:var(--fs-12);
  line-height:1.6;color:rgba(243,235,221,.7);
}

/* 侧栏与问答流 */
.page-faq .faq-shell{
  display:grid;gap:clamp(22px,3.4vw,44px);
  padding-top:clamp(26px,4vw,44px);
}
.page-faq .faq-index{
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(17,34,28,.92),rgba(11,21,18,.92));
  padding:16px;
}
.page-faq .faq-index-title{
  margin:0 0 12px;
  font-family:var(--font-mono);font-size:var(--fs-12);font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
}
.page-faq .faq-index-list{
  list-style:none;margin:0;padding:0;
  display:grid;gap:2px;
}
.page-faq .faq-index-link{
  display:flex;align-items:baseline;gap:10px;
  padding:9px 8px;
  text-decoration:none;color:rgba(243,235,221,.76);
  font-size:var(--fs-14);line-height:1.5;
  border-left:2px solid transparent;
  transition:color var(--ease),border-color var(--ease),background var(--ease);
}
.page-faq .faq-index-link:hover{color:var(--paper);background:rgba(200,255,77,.06);}
.page-faq .faq-index-link.is-current{
  color:var(--lime);border-left-color:var(--lime);background:rgba(200,255,77,.08);
}
.page-faq .faq-index-num{
  font-family:var(--font-mono);font-size:var(--fs-12);
  color:var(--muted);font-variant-numeric:tabular-nums;
  transition:color var(--ease);
}
.page-faq .faq-index-link.is-current .faq-index-num{color:var(--lime);}
.page-faq .faq-index-note{
  margin:12px 0 0;padding-top:10px;
  border-top:1px solid var(--line);
  font-family:var(--font-mono);font-size:var(--fs-12);
  line-height:1.6;color:var(--muted);
}

/* 问答章节 */
.page-faq .faq-stream{min-width:0;}
.page-faq .faq-section{
  scroll-margin-top:96px;
  padding:clamp(20px,3vw,30px) 0 clamp(24px,3.4vw,38px);
  border-top:1px solid var(--line);
}
.page-faq .faq-section:first-child{border-top:none;padding-top:0;}
.page-faq .faq-cap{
  display:flex;align-items:baseline;gap:12px;
  margin-bottom:10px;
}
.page-faq .faq-cap-num{
  flex:0 0 auto;
  font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.1em;padding:2px 6px;
  background:var(--lime);color:var(--night);
  transition:box-shadow var(--ease);
}
.page-faq .faq-section[data-tone="amber"] .faq-cap-num{background:var(--amber);color:var(--night);}
.page-faq .faq-section[data-tone="press"] .faq-cap-num{background:var(--press);color:var(--paper);}
.page-faq .faq-section.is-current .faq-cap-num{box-shadow:0 0 0 3px rgba(200,255,77,.16);}
.page-faq .faq-cap-title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(24px,3.4vw,34px);
  font-weight:700;line-height:1.1;letter-spacing:-.01em;
  color:var(--white);
}
.page-faq .faq-lead{
  margin:0 0 16px;max-width:48ch;
  font-size:var(--fs-14);line-height:1.75;color:rgba(243,235,221,.8);
}

/* 配图 */
.page-faq .faq-figure{
  margin:0 0 18px;
  border:1px solid var(--line);
  background:var(--board);
}
.page-faq .faq-figure img{
  display:block;width:100%;height:auto;max-width:100%;
  aspect-ratio:3 / 2;object-fit:cover;object-position:center;
}
.page-faq .faq-figure--portrait img{aspect-ratio:10 / 7;}
.page-faq .faq-figure figcaption{
  padding:8px 12px;border-top:1px solid var(--line);
  font-family:var(--font-mono);font-size:var(--fs-12);
  line-height:1.6;color:var(--muted);
}

/* 问答条目 */
.page-faq .faq-list{display:grid;gap:var(--faq-item-gap);}
.page-faq .faq-item{
  border:1px solid var(--line);
  background:var(--board);
  transition:border-color var(--ease),background var(--ease);
}
.page-faq .faq-item[open]{
  border-color:rgba(200,255,77,.5);
  background:rgba(17,34,28,.94);
}
.page-faq .faq-q{
  position:relative;display:block;
  padding:15px 44px 15px 36px;
  cursor:pointer;list-style:none;
  font-family:var(--font-display);
  font-size:clamp(17px,2.1vw,21px);
  font-weight:600;line-height:1.42;letter-spacing:-.005em;
  color:var(--paper);
  transition:color var(--ease);
}
.page-faq .faq-q::-webkit-details-marker{display:none;}
.page-faq .faq-q::before{
  content:"";position:absolute;left:0;top:calc(15px + .68em);
  width:var(--faq-dash);height:3px;
  background:var(--lime);
  transition:background var(--ease);
}
.page-faq .faq-q::after{
  content:"+";position:absolute;right:16px;top:50%;
  transform:translateY(-50%);
  font-family:var(--font-mono);font-size:var(--fs-16);
  line-height:1;color:var(--muted);
  transition:color var(--ease);
}
.page-faq .faq-item[open] .faq-q{color:var(--white);}
.page-faq .faq-item[open] .faq-q::before{background:var(--amber);}
.page-faq .faq-item[open] .faq-q::after{content:"–";color:var(--lime);}
.page-faq .faq-q:hover::after{color:var(--paper);}
.page-faq .faq-q:focus-visible{outline:2px solid var(--lime);outline-offset:-2px;}
.page-faq .faq-a{padding:0 18px 16px 36px;}
.page-faq .faq-a p{
  margin:0;max-width:62ch;
  font-size:var(--fs-16);line-height:1.75;
  color:rgba(243,235,221,.84);
}
.page-faq .faq-num{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  color:var(--lime);
  border-bottom:1px solid rgba(200,255,77,.45);
  padding-bottom:1px;white-space:nowrap;
}

/* 反馈指引 */
.page-faq .faq-help{
  scroll-margin-top:96px;
  margin-top:clamp(28px,4vw,48px);
  padding:clamp(22px,3.6vw,40px);
  background:var(--brown);
  border:1px solid rgba(243,235,221,.3);
}
.page-faq .faq-help-grid{display:grid;gap:clamp(20px,3vw,36px);}
.page-faq .faq-help h2{
  margin:0 0 10px;
  font-family:var(--font-display);
  font-size:clamp(26px,3.6vw,40px);
  font-weight:700;line-height:1.06;letter-spacing:-.02em;
  color:var(--white);
}
.page-faq .faq-help-copy p{
  margin:0 0 12px;max-width:46ch;
  font-size:var(--fs-16);line-height:1.75;color:rgba(243,235,221,.92);
}
.page-faq .faq-help-list{
  margin:0;padding-left:18px;
  font-size:var(--fs-14);line-height:1.85;color:rgba(243,235,221,.9);
}
.page-faq .faq-help-list li+li{margin-top:4px;}
.page-faq .faq-help-card{
  padding:16px;
  background:rgba(11,21,18,.74);
  border:1px solid var(--line);
}
.page-faq .faq-contact{margin:0 0 16px;display:grid;gap:12px;}
.page-faq .faq-contact > div{display:grid;gap:3px;}
.page-faq .faq-contact dt{
  font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
}
.page-faq .faq-contact dd{
  margin:0;
  font-family:var(--font-mono);font-size:var(--fs-16);
  line-height:1.5;color:var(--paper);word-break:break-word;
}
.page-faq .faq-contact > div:first-child dd{color:var(--lime);}

/* 延伸阅读 */
.page-faq .faq-next{
  display:flex;flex-wrap:wrap;gap:10px 20px;
  margin-top:clamp(24px,4vw,40px);
  padding-top:16px;
  border-top:1px solid var(--line);
  font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.06em;
}
.page-faq .faq-next a{
  color:var(--muted);text-decoration:none;
  border-bottom:1px solid var(--line);padding-bottom:2px;
  transition:color var(--ease),border-color var(--ease);
}
.page-faq .faq-next a:hover{color:var(--lime);border-bottom-color:var(--lime);}

/* 响应式 */
@media (min-width:560px) and (max-width:959px){
  .page-faq .faq-index-list{grid-template-columns:1fr 1fr;}
  .page-faq .faq-help-copy p{max-width:58ch;}
}

@media (min-width:800px){
  .page-faq .faq-hero{grid-template-columns:minmax(0,1fr) minmax(180px,236px);align-items:end;}
  .page-faq .faq-hero-visual{height:100%;}
  .page-faq .faq-help-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:start;}
}

@media (min-width:960px){
  .page-faq .faq-shell{grid-template-columns:var(--faq-rail) minmax(0,1fr);}
  .page-faq .faq-index{position:sticky;top:88px;align-self:start;}
  .page-faq .faq-figure--portrait img{aspect-ratio:10 / 7;}
}

@media (min-width:1180px){
  .page-faq .faq-question-pad,
  .page-faq .faq-q{padding-right:48px;}
}

@media (prefers-reduced-motion:reduce){
  .page-faq .faq-q,
  .page-faq .faq-q::before,
  .page-faq .faq-index-link,
  .page-faq .faq-item{transition:none;}
}
<<<END>>>
