.page-faq{
  padding-bottom:64px;
}

/* ---------- 面包屑 ---------- */
.page-faq .crumbs{
  padding:18px 0 6px;
}
.page-faq .crumbs__list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  list-style:none;
  margin:0;
  padding:0;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.04em;
  color:var(--ink-dim);
}
.page-faq .crumbs__list li + li::before{
  content:"/";
  margin-right:8px;
  color:var(--line);
}
.page-faq .crumbs__list a{
  color:var(--ink-dim);
  text-decoration:none;
}
.page-faq .crumbs__list a:hover,
.page-faq .crumbs__list a:focus-visible{
  color:var(--c-gold-bright);
}
.page-faq .crumbs__list [aria-current="page"]{
  color:var(--c-gold);
}

/* ---------- 首屏 ---------- */
.page-faq .faq-hero{
  position:relative;
  overflow:hidden;
  padding:34px 0 38px;
  background:linear-gradient(158deg,var(--c-navy) 0%,var(--c-deep) 62%);
  border-bottom:1px solid var(--line);
}
.page-faq .faq-hero::before{
  content:"";
  position:absolute;
  top:-20%;
  right:-14%;
  width:min(560px,82%);
  height:140%;
  background:linear-gradient(140deg,rgba(214,165,74,.22),rgba(18,60,105,0) 62%);
  clip-path:polygon(38% 0,100% 0,100% 100%,0 100%);
  pointer-events:none;
}
.page-faq .faq-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(143,166,191,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(143,166,191,.08) 1px,transparent 1px);
  background-size:52px 52px;
  -webkit-mask-image:linear-gradient(118deg,transparent 34%,#000 92%);
  mask-image:linear-gradient(118deg,transparent 34%,#000 92%);
  pointer-events:none;
}
.page-faq .faq-hero__grid{
  position:relative;
  z-index:1;
  display:grid;
  gap:26px;
}
.page-faq .faq-hero__main h1{
  margin:14px 0 0;
  font-family:var(--font-display);
  font-weight:900;
  font-size:clamp(28px,6.2vw,50px);
  line-height:1.16;
  letter-spacing:-.01em;
  color:var(--ink);
}
.page-faq .faq-hero__lede{
  margin:16px 0 0;
  max-width:44em;
  font-family:var(--font-body);
  font-size:clamp(15px,1.5vw,17px);
  line-height:1.9;
  color:var(--ink-2);
}
.page-faq .faq-hero__side{
  align-self:start;
  padding:16px 18px;
  background:rgba(18,60,105,.42);
  border:1px solid var(--line-soft);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%);
}
.page-faq .faq-hero__side-title{
  margin:0 0 10px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.16em;
  color:var(--c-gold);
}
.page-faq .faq-jump{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:2px;
}
.page-faq .faq-jump a{
  display:block;
  padding:7px 0 7px 14px;
  position:relative;
  font-family:var(--font-ui);
  font-size:14px;
  color:var(--ink-2);
  text-decoration:none;
  transition:color .2s var(--ease),padding-left .2s var(--ease);
}
.page-faq .faq-jump a::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:6px;
  height:1px;
  background:var(--c-gold);
  transform:translateY(-50%);
  transition:width .2s var(--ease);
}
.page-faq .faq-jump a:hover,
.page-faq .faq-jump a:focus-visible{
  color:var(--c-gold-bright);
  padding-left:20px;
}
.page-faq .faq-jump a:hover::before,
.page-faq .faq-jump a:focus-visible::before{
  width:12px;
}
.page-faq .faq-hero__side-note{
  margin:14px 0 0;
  padding-top:12px;
  border-top:1px solid var(--line-soft);
  font-size:12.5px;
  line-height:1.7;
  color:var(--ink-dim);
}
.page-faq .faq-hero__side-note a{
  color:var(--c-gold);
  text-decoration:none;
  border-bottom:1px solid var(--line);
}
.page-faq .faq-hero__side-note a:hover,
.page-faq .faq-hero__side-note a:focus-visible{
  color:var(--c-gold-bright);
}

/* ---------- 双栏布局 ---------- */
.page-faq .faq-layout{
  display:grid;
  gap:30px;
  margin-top:32px;
  align-items:start;
}
.page-faq .faq-index{
  border-top:1px solid var(--line);
  padding-top:16px;
}
.page-faq .faq-index__title{
  margin:0 0 12px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  color:var(--c-gold);
}
.page-faq .faq-index__list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.page-faq .faq-index__list li{
  margin:0;
}
.page-faq .faq-index__list a{
  display:flex;
  align-items:baseline;
  gap:8px;
  padding:7px 12px;
  font-family:var(--font-ui);
  font-size:13.5px;
  color:var(--ink-2);
  text-decoration:none;
  background:var(--field);
  border:1px solid var(--line-soft);
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);
  transition:color .2s var(--ease),border-color .2s var(--ease);
}
.page-faq .faq-index__list a:hover,
.page-faq .faq-index__list a:focus-visible{
  color:var(--c-gold-bright);
  border-color:var(--line);
}
.page-faq .faq-index__num{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  color:var(--c-gold);
}
.page-faq .faq-index__foot{
  margin:16px 0 0;
  padding-top:12px;
  border-top:1px solid var(--line-soft);
  font-size:13px;
  color:var(--ink-dim);
}
.page-faq .faq-index__foot a{
  color:var(--c-gold);
  text-decoration:none;
  border-bottom:1px solid var(--line);
}
.page-faq .faq-index__foot a:hover,
.page-faq .faq-index__foot a:focus-visible{
  color:var(--c-gold-bright);
}

/* ---------- 问题区块 ---------- */
.page-faq .faq-sec{
  position:relative;
  padding:0 0 30px;
  margin-bottom:26px;
  scroll-margin-top:calc(var(--bar-h) + 20px);
  border-bottom:1px solid var(--line-soft);
}
.page-faq .faq-sec:last-child{
  border-bottom:0;
  margin-bottom:0;
}
.page-faq .faq-sec__head{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  margin-bottom:12px;
}
.page-faq .faq-sec__num{
  display:inline-grid;
  place-items:center;
  padding:3px 9px;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.1em;
  color:var(--c-deep);
  background:var(--c-gold);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%);
}
.page-faq .faq-sec__head h2{
  margin:0;
  font-family:var(--font-display);
  font-weight:800;
  font-size:clamp(20px,3.4vw,28px);
  line-height:1.3;
  color:var(--ink);
}
.page-faq .faq-tag{
  margin-left:auto;
  font-size:11.5px;
}
.page-faq .faq-tag--entry{
  color:var(--c-gold-bright);
  border-color:rgba(214,165,74,.55);
}
.page-faq .faq-tag--login{
  color:#F0A79A;
  border-color:rgba(200,64,46,.6);
  background:rgba(200,64,46,.14);
}
.page-faq .faq-sec__intro{
  margin:0 0 16px;
  max-width:42em;
  font-family:var(--font-body);
  font-size:15px;
  line-height:1.85;
  color:var(--ink-dim);
}

/* ---------- 手风琴 ---------- */
.page-faq .faq-acc{
  display:grid;
  gap:10px;
}
.page-faq .faq-acc--tight{
  margin-top:16px;
}
.page-faq .faq-item{
  background:linear-gradient(152deg,rgba(18,60,105,.55),rgba(11,37,69,.62));
  border:1px solid var(--line-soft);
  clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));
  transition:border-color .22s var(--ease),background .22s var(--ease);
}
.page-faq .faq-item[open]{
  border-color:var(--line);
  background:linear-gradient(152deg,rgba(18,60,105,.78),rgba(11,37,69,.7));
}
.page-faq .faq-item summary{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:15px 18px;
  cursor:pointer;
  list-style:none;
  font-family:var(--font-ui);
  font-size:15.5px;
  font-weight:600;
  line-height:1.55;
  color:var(--ink);
}
.page-faq .faq-item summary::-webkit-details-marker{
  display:none;
}
.page-faq .faq-item summary::marker{
  content:"";
}
.page-faq .faq-item summary:focus-visible{
  outline:2px solid var(--c-gold);
  outline-offset:-3px;
}
.page-faq .faq-item summary::after{
  content:"+";
  flex:0 0 auto;
  font-family:var(--font-mono);
  font-size:19px;
  line-height:1.2;
  color:var(--c-gold);
  transition:transform .25s var(--ease),color .25s var(--ease);
}
.page-faq .faq-item[open] summary::after{
  transform:rotate(45deg);
  color:var(--c-gold-bright);
}
.page-faq .faq-item__body{
  padding:0 18px 18px;
  font-family:var(--font-body);
  font-size:15px;
  line-height:1.85;
  color:var(--ink-2);
}
.page-faq .faq-item__body a{
  color:var(--c-gold);
  text-decoration:none;
  border-bottom:1px solid var(--line);
}
.page-faq .faq-item__body a:hover,
.page-faq .faq-item__body a:focus-visible{
  color:var(--c-gold-bright);
}

/* ---------- 步骤条 ---------- */
.page-faq .steps{
  counter-reset:step;
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:11px;
}
.page-faq .steps li{
  position:relative;
  counter-increment:step;
  padding-left:38px;
  padding-top:1px;
}
.page-faq .steps li::before{
  content:counter(step,decimal-leading-zero);
  position:absolute;
  left:0;
  top:0;
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.02em;
  color:var(--c-gold);
  border:1px solid var(--line);
  background:rgba(7,26,51,.55);
  clip-path:polygon(0 0,100% 0,100% 68%,68% 100%,0 100%);
}
.page-faq .steps li::after{
  content:"";
  position:absolute;
  left:13px;
  top:28px;
  bottom:-9px;
  width:1px;
  background:linear-gradient(var(--line),rgba(214,165,74,0));
}
.page-faq .steps li:last-child::after{
  display:none;
}

/* ---------- 图片 ---------- */
.page-faq .faq-figure{
  margin:18px 0 0;
}
.page-faq .faq-figure img{
  width:100%;
  height:auto;
  display:block;
  object-fit:cover;
}
.page-faq .media-frame__cap{
  display:block;
  margin-top:9px;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.04em;
  line-height:1.6;
  color:var(--c-ash);
}

/* ---------- 联系卡片 ---------- */
.page-faq .contact-grid{
  display:grid;
  gap:12px;
}
.page-faq .faq-contact-card{
  padding:16px 18px;
  background:linear-gradient(150deg,rgba(18,60,105,.6),rgba(11,37,69,.6));
}
.page-faq .faq-contact-card__label{
  margin:0;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.16em;
  color:var(--c-gold);
}
.page-faq .faq-contact-card__value{
  margin:8px 0 0;
  font-family:var(--font-mono);
  font-size:15px;
  line-height:1.5;
  word-break:break-word;
  color:var(--ink);
}
.page-faq .faq-contact-card__value--sm{
  font-family:var(--font-ui);
  font-size:14.5px;
  font-weight:600;
}
.page-faq .faq-contact-card__hint{
  margin:8px 0 0;
  font-size:12.5px;
  line-height:1.7;
  color:var(--ink-dim);
}

/* ---------- 平板及以上 ---------- */
@media (min-width:720px){
  .page-faq .faq-hero{
    padding:46px 0 50px;
  }
  .page-faq .faq-hero__grid{
    grid-template-columns:minmax(0,1fr) 272px;
    gap:34px;
    align-items:start;
  }
  .page-faq .contact-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .page-faq .faq-sec{
    padding-bottom:34px;
    margin-bottom:30px;
  }
}

/* ---------- 桌面：左侧目录贴顶 ---------- */
@media (min-width:960px){
  .page-faq .faq-layout{
    grid-template-columns:248px minmax(0,1fr);
    gap:52px;
    margin-top:40px;
  }
  .page-faq .faq-index{
    position:sticky;
    top:calc(var(--bar-h) + 22px);
    border-top:0;
    border-left:2px solid var(--line);
    padding-top:0;
    padding-left:18px;
  }
  .page-faq .faq-index__list{
    display:grid;
    gap:2px;
  }
  .page-faq .faq-index__list a{
    background:transparent;
    border:0;
    border-bottom:1px dashed transparent;
    clip-path:none;
    padding:8px 0;
    font-size:14.5px;
    transition:color .2s var(--ease),border-color .2s var(--ease);
  }
  .page-faq .faq-index__list a:hover,
  .page-faq .faq-index__list a:focus-visible{
    border-bottom-color:var(--line);
    color:var(--c-gold-bright);
  }
  .page-faq .faq-item summary{
    padding:17px 22px;
    font-size:16px;
  }
  .page-faq .faq-item__body{
    padding:0 22px 20px;
    font-size:15.5px;
  }
  .page-faq .faq-figure{
    max-width:760px;
  }
}

@media (min-width:1200px){
  .page-faq .faq-hero__grid{
    grid-template-columns:minmax(0,1fr) 300px;
    gap:48px;
  }
}

/* ---------- 减少动效 ---------- */
@media (prefers-reduced-motion:reduce){
  .page-faq .faq-jump a,
  .page-faq .faq-jump a::before,
  .page-faq .faq-item,
  .page-faq .faq-item summary::after,
  .page-faq .faq-index__list a{
    transition:none;
  }
  .page-faq .faq-jump a:hover,
  .page-faq .faq-jump a:focus-visible{
    padding-left:14px;
  }
}
<<<END>>>