.page-faq{
  --faq-gap:clamp(1rem,2.4vw,1.6rem);
  --faq-card:rgba(13,42,33,.72);
  --faq-soft:rgba(143,166,184,.09);
}

.page-faq .faq-crumbs{padding-top:clamp(.9rem,2vw,1.4rem);}

/* ---------- 首屏 ---------- */
.page-faq .faq-hero{padding-block:clamp(1rem,2.6vw,1.8rem) clamp(2rem,4.6vw,3.2rem);}
.page-faq .faq-hero__grid{display:grid;gap:clamp(1.2rem,3vw,2.2rem);align-items:center;}
.page-faq .faq-hero__title{margin:.55rem 0 0;max-width:17ch;color:var(--bone);}
.page-faq .faq-hero__lede{margin-top:1rem;max-width:58ch;}
.page-faq .faq-hero__actions{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.5rem;}

.page-faq .faq-hero__figure{
  position:relative;
  margin:0;
  border:2px solid var(--ink-700);
  box-shadow:var(--shadow-hard);
  clip-path:polygon(0 0,100% 0,100% 86%,90% 100%,0 100%);
}
.page-faq .faq-hero__figure img{display:block;width:100%;height:auto;object-fit:cover;}
.page-faq .faq-hero__cap{
  position:absolute;
  left:0;
  bottom:0;
  padding:.4rem .85rem;
  background:var(--lime);
  color:var(--ink-900);
  font-size:.72rem;
  letter-spacing:.08em;
}

/* ---------- 主体两栏 ---------- */
.page-faq .faq-body{
  padding-block:clamp(1.8rem,4.4vw,3rem) clamp(2.2rem,5vw,3.6rem);
  border-top:1px solid var(--line);
}
.page-faq .faq-body__grid{display:grid;gap:clamp(1.4rem,3vw,2.4rem);}

/* ---------- 左侧坐标索引 ---------- */
.page-faq .faq-aside{display:flex;flex-direction:column;gap:1rem;min-width:0;}
.page-faq .faq-aside__head{display:grid;gap:.35rem;}
.page-faq .faq-aside__note{margin:0;color:var(--steel);font-size:.88rem;line-height:1.6;}
.page-faq .faq-aside__figure{
  margin:0;
  border:1px solid var(--line-strong);
  box-shadow:var(--shadow-soft);
}
.page-faq .faq-aside__figure img{display:block;width:100%;height:auto;object-fit:cover;}

.page-faq .faq-aside__list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:.5rem;
  overflow-x:auto;
  padding-bottom:.5rem;
}
.page-faq .faq-aside__item{flex:0 0 auto;}
.page-faq .faq-aside__link{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:.5rem;
  align-items:baseline;
  padding:.55rem .7rem;
  border-bottom:3px solid var(--line);
  color:var(--bone);
  text-decoration:none;
  font-size:.9rem;
  white-space:nowrap;
  transition:color .18s ease,border-color .18s ease,background .18s ease;
}
.page-faq .faq-aside__code{color:var(--steel);font-size:.74rem;}
.page-faq .faq-aside__link:hover,
.page-faq .faq-aside__link:focus-visible{
  border-bottom-color:var(--lime);
  color:var(--lime);
  background:var(--ink-800);
  outline:none;
}
.page-faq .faq-aside__link:hover .faq-aside__code,
.page-faq .faq-aside__link:focus-visible .faq-aside__code{color:var(--lime);}

/* ---------- 问答区 ---------- */
.page-faq .faq-main{min-width:0;}
.page-faq .faq-group{margin-bottom:clamp(1.6rem,3vw,2.4rem);scroll-margin-top:calc(var(--header-h) + 1rem);}
.page-faq .faq-group__head{
  display:flex;
  align-items:baseline;
  gap:.7rem;
  padding-bottom:.55rem;
  border-bottom:2px solid var(--ink-700);
}
.page-faq .faq-group__code{font-size:.76rem;color:var(--lime);letter-spacing:.08em;}
.page-faq .faq-group__title{
  margin:0;
  font-family:var(--font-editorial);
  font-size:clamp(1.05rem,1.9vw,1.32rem);
  color:var(--bone);
  font-weight:600;
}

.page-faq .faq-item{
  background:var(--faq-card);
  border:1px solid var(--line);
  border-left:4px solid var(--steel);
  margin-top:.72rem;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.page-faq .faq-item[open]{
  border-left-color:var(--orange);
  box-shadow:var(--shadow-soft);
}
.page-faq .faq-item summary{
  display:flex;
  align-items:flex-start;
  gap:.7rem;
  padding:.85rem .9rem;
  cursor:pointer;
  list-style:none;
  color:var(--bone);
  font-weight:600;
  font-size:.96rem;
  line-height:1.55;
}
.page-faq .faq-item summary::-webkit-details-marker{display:none;}
.page-faq .faq-item summary::after{
  content:"+";
  margin-left:auto;
  font-family:var(--font-mono);
  font-size:1.15rem;
  line-height:1;
  color:var(--lime);
  flex:0 0 auto;
}
.page-faq .faq-item[open] summary::after{content:"–";color:var(--orange);}
.page-faq .faq-item summary:focus-visible{
  outline:2px solid var(--lime);
  outline-offset:-2px;
}
.page-faq .faq-q__num{font-size:.76rem;color:var(--steel);padding-top:.25em;flex:0 0 auto;}
.page-faq .faq-q__text{flex:1 1 auto;min-width:0;}

.page-faq .faq-a{
  padding:0 .9rem 1rem;
  border-top:1px dashed var(--line);
  margin-top:.1rem;
}
.page-faq .faq-a p{
  margin:.8rem 0 0;
  font-size:.9rem;
  line-height:1.72;
  color:var(--bone);
  opacity:.88;
}

.page-faq .faq-steps{
  list-style:none;
  counter-reset:step;
  margin:.85rem 0 0;
  padding:0;
  display:grid;
  gap:.35rem;
}
.page-faq .faq-steps li{
  display:grid;
  grid-template-columns:1.95rem 1fr;
  gap:.55rem;
  align-items:start;
  padding:.45rem .6rem;
  background:var(--faq-soft);
  border-left:2px solid var(--line-strong);
  font-size:.88rem;
  line-height:1.6;
  color:var(--bone);
}
.page-faq .faq-steps li::before{
  counter-increment:step;
  content:counter(step,decimal-leading-zero);
  font-family:var(--font-mono);
  font-size:.78rem;
  color:var(--lime);
  padding-top:.15em;
}

/* ---------- 联系支持 ---------- */
.page-faq .faq-contact{padding-top:clamp(.5rem,1.5vw,1rem);scroll-margin-top:calc(var(--header-h) + 1rem);}
.page-faq .faq-contact__panel{
  display:grid;
  gap:clamp(1.2rem,3vw,2rem);
  padding:clamp(1.15rem,3vw,2.1rem);
  border:2px solid var(--ink-700);
  background:linear-gradient(135deg,rgba(18,60,47,.92),rgba(7,28,22,.96));
  box-shadow:var(--shadow-hard);
}
.page-faq .faq-contact__copy h3{margin:0;color:var(--bone);}
.page-faq .faq-contact__text{
  margin:.75rem 0 0;
  font-size:.93rem;
  line-height:1.75;
  color:var(--bone);
  opacity:.86;
  max-width:46ch;
}
.page-faq .faq-contact__actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.2rem;}

.page-faq .faq-contact__info{display:grid;align-content:start;gap:0;}
.page-faq .faq-contact__row{
  display:grid;
  grid-template-columns:3.6rem 1fr;
  gap:.7rem;
  align-items:start;
  padding:.62rem 0;
  border-bottom:1px solid var(--line);
  font-size:.88rem;
  line-height:1.6;
  color:var(--bone);
  word-break:break-word;
}
.page-faq .faq-contact__row:first-child{border-top:1px solid var(--line);}
.page-faq .faq-contact__k{
  font-size:.7rem;
  letter-spacing:.1em;
  color:var(--steel);
  padding-top:.28em;
}
.page-faq .faq-contact__v{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;}
.page-faq .faq-contact__v .copy-btn{flex:0 0 auto;}

/* ---------- 响应式 ---------- */
@media (min-width:640px){
  .page-faq .faq-aside__list{overflow-x:visible;flex-wrap:wrap;}
  .page-faq .faq-contact__panel{padding:clamp(1.4rem,3vw,2.1rem);}
}

@media (min-width:880px){
  .page-faq .faq-hero__grid{
    grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
    gap:clamp(1.6rem,3.4vw,3rem);
  }
  .page-faq .faq-contact__panel{
    grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
    align-items:start;
  }
}

@media (min-width:980px){
  .page-faq .faq-body__grid{
    grid-template-columns:minmax(0,286px) minmax(0,1fr);
    gap:clamp(1.8rem,3.2vw,3rem);
    align-items:start;
  }
  .page-faq .faq-aside{
    position:sticky;
    top:calc(var(--header-h) + 1.2rem);
    align-self:start;
    max-height:calc(100vh - var(--header-h) - 2.4rem);
    overflow-y:auto;
    padding-right:.35rem;
  }
  .page-faq .faq-aside__list{flex-direction:column;flex-wrap:nowrap;gap:0;overflow:visible;padding-bottom:0;}
  .page-faq .faq-aside__link{
    border-bottom:none;
    border-left:3px solid var(--line);
    white-space:normal;
    grid-template-columns:2.2rem 1fr;
  }
  .page-faq .faq-aside__link:hover,
  .page-faq .faq-aside__link:focus-visible{border-left-color:var(--lime);border-bottom-color:transparent;}
}

@media (min-width:1200px){
  .page-faq .faq-hero__title{max-width:15ch;}
  .page-faq .faq-item summary{font-size:1rem;padding:.95rem 1.1rem;}
  .page-faq .faq-a{padding:0 1.1rem 1.15rem;}
}

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