.page-faq{
  --faq-glass:rgba(11,43,36,.62);
  --faq-hair:rgba(58,174,158,.30);
  --faq-soft:rgba(39,245,212,.06);
  display:block;
  padding-bottom:clamp(3.5rem,8vw,6rem);
  background:
    radial-gradient(120% 55% at 90% -8%, rgba(39,245,212,.10), transparent 62%),
    radial-gradient(90% 45% at -5% 4%, rgba(18,58,50,.75), transparent 58%);
}

.page-faq img{
  max-width:100%;
  height:auto;
  display:block;
}

/* 面包屑 */
.page-faq .faq-crumbs{
  padding-top:clamp(1rem,3vw,1.6rem);
}
.page-faq .breadcrumb-list{
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
  margin:0;
  padding:0;
  list-style:none;
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.06em;
  color:var(--mute);
}
.page-faq .breadcrumb-list li + li::before{
  content:"/";
  margin-right:.45rem;
  color:var(--track);
}
.page-faq .breadcrumb-list a{
  color:var(--mute);
  text-decoration:none;
}
.page-faq .breadcrumb-list a:hover,
.page-faq .breadcrumb-list a:focus-visible{
  color:var(--cyan);
}
.page-faq .breadcrumb-list [aria-current="page"]{
  color:var(--paper);
}

/* 首屏 */
.page-faq .faq-hero{
  padding:clamp(1.2rem,3.5vw,2.2rem) 0 clamp(1.8rem,5vw,3.2rem);
  border-bottom:1px solid var(--track);
}
.page-faq .faq-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(1.4rem,4vw,2.6rem);
}
.page-faq .faq-hero__copy .label{
  margin:0 0 .8rem;
}
.page-faq .faq-hero h1{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(2rem,7vw,4.4rem);
  line-height:1.08;
  letter-spacing:-.035em;
  font-weight:900;
  color:var(--paper);
  max-width:16em;
}
.page-faq .faq-hero__lede{
  margin:clamp(1rem,2.5vw,1.4rem) 0 0;
  max-width:34em;
  color:var(--mute);
  font-size:clamp(.95rem,1.6vw,1.05rem);
  line-height:1.75;
}

/* 命令栏 */
.page-faq .faq-cmd{
  margin-top:clamp(1.1rem,3vw,1.7rem);
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.45rem .3rem;
  padding:.55rem .65rem;
  border:1px solid var(--faq-hair);
  border-radius:var(--radius-m);
  background:linear-gradient(100deg,rgba(18,58,50,.78),rgba(11,43,36,.38));
  box-shadow:inset 0 1px 0 rgba(216,255,248,.06);
}
.page-faq .faq-cmd__lead{
  font-family:var(--font-mono);
  font-size:.9rem;
  color:var(--cyan);
  padding-left:.2rem;
  letter-spacing:.08em;
}
.page-faq .faq-cmd__list{
  display:flex;
  flex-wrap:wrap;
  gap:.35rem;
  margin:0;
  padding:0;
  list-style:none;
}
.page-faq .faq-cmd__list a{
  display:inline-block;
  padding:.34rem .62rem;
  border:1px solid transparent;
  border-radius:999px;
  font-family:var(--font-mono);
  font-size:.71rem;
  letter-spacing:.05em;
  color:var(--mute);
  text-decoration:none;
  transition:color .16s var(--ease),border-color .16s var(--ease),background .16s var(--ease);
}
.page-faq .faq-cmd__list a:hover,
.page-faq .faq-cmd__list a:focus-visible{
  color:var(--cyan);
  border-color:var(--edge);
  background:var(--faq-soft);
}

/* 首屏图 */
.page-faq .faq-hero__media{
  margin:0;
  border:1px solid var(--track);
  border-radius:var(--radius-l);
  overflow:hidden;
  background:var(--panel);
}
.page-faq .faq-hero__media img{
  width:100%;
  object-fit:cover;
}

/* 主体双栏 */
.page-faq .faq-body{
  padding-top:clamp(1.8rem,5vw,3rem);
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(1.6rem,4vw,3rem);
  align-items:start;
}

/* 左侧索引 */
.page-faq .faq-index{
  padding:.9rem 1rem;
  border:1px solid var(--track);
  border-radius:var(--radius-m);
  background:linear-gradient(170deg,rgba(18,58,50,.5),rgba(6,28,24,.6));
}
.page-faq .faq-index__title{
  margin:0 0 .7rem;
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--cyan);
}
.page-faq .faq-index__list{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:.15rem;
}
.page-faq .faq-index__list a{
  display:flex;
  align-items:baseline;
  gap:.55rem;
  padding:.45rem .5rem;
  border-left:2px solid transparent;
  border-radius:0 var(--radius-s) var(--radius-s) 0;
  color:var(--paper);
  font-size:.88rem;
  text-decoration:none;
  transition:color .16s var(--ease),border-color .16s var(--ease),background .16s var(--ease);
}
.page-faq .faq-index__list a:hover,
.page-faq .faq-index__list a:focus-visible{
  color:var(--cyan);
  border-left-color:var(--cyan);
  background:var(--faq-soft);
}
.page-faq .idx-num{
  font-family:var(--font-mono);
  font-size:.7rem;
  color:var(--mute);
}
.page-faq .faq-index__note{
  margin:.9rem 0 0;
  padding-top:.8rem;
  border-top:1px solid var(--track);
  color:var(--mute);
  font-size:.78rem;
  line-height:1.7;
}
.page-faq .faq-index__cta{
  margin-top:.8rem;
  width:100%;
  text-align:center;
}

/* 分组 */
.page-faq .faq-panels{
  min-width:0;
}
.page-faq .faq-group + .faq-group{
  margin-top:clamp(2.2rem,6vw,3.6rem);
}
.page-faq .group-head{
  display:flex;
  align-items:baseline;
  gap:.75rem;
  padding-bottom:.65rem;
  border-bottom:1px solid var(--track);
}
.page-faq .group-num{
  font-family:var(--font-mono);
  font-size:.76rem;
  letter-spacing:.1em;
  color:var(--cyan);
}
.page-faq .group-title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(1.15rem,2.6vw,1.6rem);
  font-weight:800;
  letter-spacing:-.015em;
  color:var(--paper);
}
.page-faq .group-desc{
  margin:.85rem 0 0;
  max-width:38em;
  color:var(--mute);
  font-size:.92rem;
  line-height:1.75;
}

/* 首屏三问卡片 */
.page-faq .starter{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:.65rem;
  margin-top:1.1rem;
}
.page-faq .starter-card{
  display:flex;
  flex-direction:column;
  gap:.4rem;
  padding:.95rem 1rem 1.05rem;
  border:1px solid var(--track);
  border-left:2px solid var(--cyan);
  border-radius:var(--radius-m);
  background:linear-gradient(160deg,rgba(18,58,50,.55),rgba(11,43,36,.92));
  color:var(--paper);
  text-decoration:none;
  transition:border-color .16s var(--ease),transform .16s var(--ease),background .16s var(--ease);
}
.page-faq .starter-card:hover,
.page-faq .starter-card:focus-visible{
  border-color:var(--edge);
  border-left-color:var(--cyan);
  transform:translateY(-2px);
  background:linear-gradient(160deg,rgba(18,58,50,.72),rgba(11,43,36,.95));
}
.page-faq .starter-num{
  font-family:var(--font-mono);
  font-size:.7rem;
  letter-spacing:.1em;
  color:var(--cyan);
}
.page-faq .starter-q{
  font-size:1rem;
  font-weight:700;
  line-height:1.45;
}
.page-faq .starter-a{
  color:var(--mute);
  font-size:.86rem;
  line-height:1.7;
}
.page-faq .starter-go{
  margin-top:.35rem;
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.05em;
  color:var(--cyan);
}

/* 问答手风琴 */
.page-faq .qa-list{
  margin-top:1rem;
  display:grid;
  gap:.55rem;
}
.page-faq .qa-list--flush{
  margin-top:0;
}
.page-faq .qa{
  border:1px solid var(--track);
  border-radius:var(--radius-m);
  background:var(--panel);
  overflow:hidden;
  transition:border-color .16s var(--ease),background .16s var(--ease);
}
.page-faq .qa[open]{
  border-color:var(--faq-hair);
  background:linear-gradient(180deg,rgba(11,43,36,.96),rgba(6,28,24,.96));
}
.page-faq .qa > summary{
  display:grid;
  grid-template-columns:2rem minmax(0,1fr) 1.5rem;
  align-items:center;
  gap:.6rem;
  padding:.85rem .9rem;
  cursor:pointer;
  list-style:none;
}
.page-faq .qa > summary::-webkit-details-marker{
  display:none;
}
.page-faq .qa > summary:focus-visible{
  outline:2px solid var(--cyan);
  outline-offset:-3px;
  border-radius:var(--radius-m);
}
.page-faq .qa__num{
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.06em;
  color:var(--mute);
}
.page-faq .qa[open] .qa__num{
  color:var(--cyan);
}
.page-faq .qa__q{
  font-size:.95rem;
  font-weight:600;
  line-height:1.55;
  color:var(--paper);
}
.page-faq .qa__sign{
  position:relative;
  width:1.35rem;
  height:1.35rem;
  border:1px solid var(--edge);
  border-radius:50%;
  justify-self:end;
}
.page-faq .qa__sign::before,
.page-faq .qa__sign::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  background:var(--cyan);
  transform:translate(-50%,-50%);
  transition:opacity .16s var(--ease);
}
.page-faq .qa__sign::before{
  width:.62rem;
  height:1px;
}
.page-faq .qa__sign::after{
  width:1px;
  height:.62rem;
}
.page-faq .qa[open] .qa__sign::after{
  opacity:0;
}
.page-faq .qa__a{
  margin:0 .85rem .85rem;
  padding:.8rem .9rem;
  border:1px solid rgba(58,174,158,.22);
  border-radius:var(--radius-s);
  background:var(--faq-soft);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
.page-faq .qa__a p{
  margin:0;
  max-width:40em;
  color:var(--paper);
  font-size:.9rem;
  line-height:1.78;
}
.page-faq .qa__a p + p{
  margin-top:.6rem;
}
.page-faq .faq-inline-link{
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.05em;
  color:var(--cyan);
  text-decoration:none;
  border-bottom:1px solid rgba(39,245,212,.4);
  padding-bottom:1px;
}
.page-faq .faq-inline-link:hover,
.page-faq .faq-inline-link:focus-visible{
  color:var(--white);
  border-bottom-color:var(--white);
}

/* 移动阅读分组 */
.page-faq .group-body{
  margin-top:1.1rem;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:1.2rem;
  align-items:start;
}
.page-faq .faq-figure{
  margin:0;
  border:1px solid var(--track);
  border-radius:var(--radius-m);
  overflow:hidden;
  background:var(--panel);
}
.page-faq .faq-figure img{
  width:100%;
  object-fit:cover;
}
.page-faq .faq-figure figcaption{
  padding:.6rem .8rem .7rem;
  font-family:var(--font-mono);
  font-size:.7rem;
  letter-spacing:.05em;
  color:var(--mute);
  border-top:1px solid var(--track);
}

/* 联系区 */
.page-faq .contact-card{
  margin-top:1.1rem;
  padding:clamp(1.1rem,3vw,1.8rem);
  border-radius:var(--radius-l);
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(1rem,3vw,1.6rem);
}
.page-faq .contact-card__main h3{
  margin:0 0 .6rem;
  font-family:var(--font-display);
  font-size:clamp(1.05rem,2.2vw,1.3rem);
  font-weight:800;
  color:var(--paper);
}
.page-faq .contact-card__main p{
  margin:0;
  max-width:36em;
  color:var(--mute);
  font-size:.9rem;
  line-height:1.78;
}
.page-faq .faq-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  margin-top:1.1rem;
}
.page-faq .contact-card__side{
  padding-top:.4rem;
  border-top:1px solid var(--track);
}
.page-faq .contact-row{
  display:grid;
  grid-template-columns:4.2rem minmax(0,1fr);
  gap:.3rem .7rem;
  align-items:baseline;
  padding:.55rem 0;
  border-bottom:1px solid rgba(18,58,50,.9);
  color:var(--paper);
  font-size:.88rem;
  line-height:1.6;
  word-break:break-word;
}
.page-faq .contact-label{
  font-family:var(--font-mono);
  font-size:.7rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--cyan);
}
.page-faq .contact-card__note{
  margin:.85rem 0 0;
  color:var(--mute);
  font-size:.78rem;
  line-height:1.7;
}

/* 断点 */
@media (min-width:720px){
  .page-faq .starter{
    grid-template-columns:1.15fr 1fr 1fr;
  }
  .page-faq .contact-card{
    grid-template-columns:minmax(0,1.05fr) minmax(0,.85fr);
  }
  .page-faq .contact-card__side{
    padding-top:0;
    border-top:0;
    border-left:1px solid var(--track);
    padding-left:clamp(1rem,2.5vw,1.6rem);
  }
}

@media (min-width:820px){
  .page-faq .faq-hero__grid{
    grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
    align-items:end;
  }
  .page-faq .group-body{
    grid-template-columns:minmax(0,1fr) 240px;
    gap:clamp(1.2rem,3vw,1.8rem);
  }
}

@media (min-width:960px){
  .page-faq .faq-body{
    grid-template-columns:220px minmax(0,1fr);
    gap:clamp(2rem,4vw,3.6rem);
  }
  .page-faq .faq-index{
    position:sticky;
    top:7rem;
  }
  .page-faq .qa > summary{
    padding:.95rem 1.1rem;
  }
  .page-faq .qa__a{
    margin:0 1.1rem 1rem;
    padding:.9rem 1.1rem;
  }
}

@media (prefers-reduced-motion: reduce){
  .page-faq .starter-card,
  .page-faq .qa,
  .page-faq .qa__sign::after,
  .page-faq .faq-cmd__list a,
  .page-faq .faq-index__list a{
    transition:none;
  }
  .page-faq .starter-card:hover,
  .page-faq .starter-card:focus-visible{
    transform:none;
  }
}
<<<PAGE_CSS_END>>>
