.page-faq{
  --faq-side:15rem;
  --faq-gap:clamp(1.5rem,3.4vw,3rem);
  --faq-scroll:calc(var(--topbar-h) + 1.5rem);
  color:var(--ink);
}

.page-faq .breadcrumb{
  margin-top:1.25rem;
}

.page-faq .breadcrumb ol{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.5rem;
  margin:0;
  padding:0;
  list-style:none;
  font-size:.8125rem;
}

.page-faq .breadcrumb a{
  color:var(--ink-mute);
  text-decoration:none;
}

.page-faq .breadcrumb a:hover{
  color:var(--ink);
}

.page-faq .breadcrumb li{
  display:flex;
  align-items:center;
  color:var(--ink-mute);
}

.page-faq .breadcrumb li + li::before{
  content:"/";
  margin-right:.5rem;
  color:var(--line);
}

/* ---------- 首屏拼贴 ---------- */

.page-faq .faq-hero{
  display:grid;
  gap:clamp(1.5rem,3vw,2.5rem);
  align-items:end;
  padding-block:clamp(2rem,5vw,3.5rem) clamp(1.5rem,3vw,2.5rem);
}

.page-faq .faq-hero__copy{
  max-width:42rem;
}

.page-faq .faq-hero h1{
  margin:.8rem 0 0;
  font-family:var(--font-display);
  font-weight:800;
  letter-spacing:-.02em;
  font-size:clamp(2rem,5.4vw,3.5rem);
  line-height:1.04;
}

.page-faq .faq-hero .lede{
  margin:1.25rem 0 0;
  max-width:38rem;
  font-size:clamp(1rem,1.6vw,1.125rem);
  line-height:1.8;
  color:var(--ink);
}

.page-faq .faq-hero__facts{
  display:flex;
  flex-wrap:wrap;
  gap:.9rem 2.25rem;
  margin:1.75rem 0 0;
  padding:1.2rem 0 0;
  border-top:1px solid var(--line-soft);
  list-style:none;
}

.page-faq .faq-hero__facts li{
  display:flex;
  flex-direction:column;
  gap:.3rem;
}

.page-faq .faq-hero__facts .num{
  font-family:var(--font-mono);
  font-size:1rem;
  font-variant-numeric:tabular-nums;
  color:var(--data);
}

.page-faq .faq-hero__facts li > span:last-child{
  font-size:.75rem;
  line-height:1.5;
  color:var(--ink-mute);
}

.page-faq .faq-hero__figure{
  position:relative;
  margin:0;
}

.page-faq .faq-hero__figure img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
  border:1px solid var(--line-soft);
  filter:saturate(.82) contrast(1.06);
}

.page-faq .faq-hero__figure::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(5,13,11,0) 42%,rgba(5,13,11,.58));
  pointer-events:none;
}

@media (min-width:900px){
  .page-faq .faq-hero{
    grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);
    column-gap:clamp(2rem,4vw,4rem);
  }
}

/* ---------- 区块标题 ---------- */

.page-faq .faq-section__head{
  max-width:44rem;
  margin-bottom:clamp(1.5rem,3vw,2.5rem);
}

.page-faq .faq-section__head h2{
  margin:.65rem 0 0;
  font-family:var(--font-display);
  font-weight:800;
  letter-spacing:-.02em;
  font-size:clamp(1.5rem,3.4vw,2.25rem);
  line-height:1.12;
}

.page-faq .faq-section__lead{
  margin:.9rem 0 0;
  font-size:.9375rem;
  line-height:1.8;
  color:var(--ink-mute);
}

.page-faq .note{
  font-size:.8125rem;
  line-height:1.7;
  color:var(--ink-mute);
}

/* ---------- 三步 ---------- */

.page-faq .steps{
  display:grid;
  gap:1px;
  margin:0;
  padding:0;
  list-style:none;
  background:var(--line-faint);
  border:1px solid var(--line-faint);
}

.page-faq .step{
  position:relative;
  padding:clamp(1.25rem,3vw,2rem);
  background:var(--panel);
}

.page-faq .step::before{
  content:"";
  position:absolute;
  top:0;
  left:clamp(1.25rem,3vw,2rem);
  width:2.5rem;
  height:2px;
  background:var(--accent);
}

.page-faq .step__num{
  display:block;
  font-family:var(--font-mono);
  font-size:clamp(1.75rem,5vw,2.5rem);
  font-weight:500;
  line-height:1;
  color:var(--line);
  font-variant-numeric:tabular-nums;
}

.page-faq .step h3{
  margin:.85rem 0 .55rem;
  font-size:1rem;
  font-weight:700;
  letter-spacing:.01em;
}

.page-faq .step p{
  margin:0;
  font-size:.9375rem;
  line-height:1.75;
}

.page-faq .step .note{
  margin-top:.65rem;
}

@media (min-width:760px){
  .page-faq .steps{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

/* ---------- 流程图 ---------- */

.page-faq .faq-flow{
  margin:clamp(1.5rem,3vw,2.25rem) 0 0;
  padding:clamp(1rem,2.5vw,1.75rem);
  background:var(--data-soft);
  border:1px dashed var(--line-soft);
  overflow-x:auto;
}

.page-faq .faq-flow svg{
  display:block;
  width:100%;
  min-width:34rem;
  height:auto;
}

/* ---------- 问答双栏 ---------- */

.page-faq .faq-layout{
  display:grid;
  gap:var(--faq-gap);
  align-items:start;
}

.page-faq .faq-index{
  padding:1rem 1rem 1.25rem;
  background:var(--glass);
  border:1px solid var(--glass-line);
  backdrop-filter:blur(10px);
}

.page-faq .faq-index__title{
  margin:0 0 .75rem;
  font-family:var(--font-display);
  font-weight:800;
  letter-spacing:-.01em;
  font-size:.9375rem;
}

.page-faq .faq-index__label{
  margin:1rem 0 .4rem;
  font-size:.6875rem;
  letter-spacing:.14em;
  color:var(--ink-mute);
}

.page-faq .faq-index__group:first-of-type .faq-index__label{
  margin-top:.25rem;
}

.page-faq .faq-index ul{
  display:grid;
  gap:.125rem;
  margin:0;
  padding:0;
  list-style:none;
}

.page-faq .faq-index a{
  display:block;
  position:relative;
  padding:.5rem .5rem .5rem .85rem;
  font-size:.8125rem;
  line-height:1.55;
  color:var(--ink-mute);
  text-decoration:none;
  border-left:2px solid transparent;
  transition:color .18s var(--ease),border-color .18s var(--ease),background-color .18s var(--ease);
}

.page-faq .faq-index a:hover{
  color:var(--ink);
  background:rgba(255,255,255,.04);
}

.page-faq .faq-index a[aria-current]{
  color:var(--data);
  border-left-color:var(--data);
  background:var(--data-soft);
}

@media (min-width:1000px){
  .page-faq .faq-layout{
    grid-template-columns:var(--faq-side) minmax(0,1fr);
    column-gap:clamp(2rem,4vw,4rem);
  }

  .page-faq .faq-index{
    position:sticky;
    top:var(--faq-scroll);
    max-height:calc(100vh - var(--topbar-h) - 3rem);
    overflow:auto;
  }
}

.page-faq .faq-columns{
  display:grid;
  gap:clamp(2rem,4vw,3rem);
  min-width:0;
}

.page-faq .faq-group__head{
  margin-bottom:1.5rem;
  padding-bottom:.9rem;
  border-bottom:1px solid var(--line-soft);
}

.page-faq .faq-group__head h2{
  margin:0;
  font-family:var(--font-display);
  font-weight:800;
  letter-spacing:-.02em;
  font-size:clamp(1.35rem,2.8vw,1.875rem);
  line-height:1.15;
}

.page-faq .faq-group__head .note{
  margin:.6rem 0 0;
  max-width:40rem;
}

.page-faq .qa{
  margin-bottom:.75rem;
  padding:1.15rem 1.25rem;
  background:var(--panel);
  border:1px solid var(--line-faint);
  scroll-margin-top:var(--faq-scroll);
  transition:border-color .12s var(--ease);
}

.page-faq .qa:hover{
  border-color:var(--accent);
}

.page-faq .qa h3{
  margin:0 0 .6rem;
  font-size:1rem;
  font-weight:700;
  line-height:1.5;
}

.page-faq .qa p{
  margin:0;
  font-size:.9375rem;
  line-height:1.78;
}

.page-faq .qa p + p{
  margin-top:.65rem;
}

/* ---------- 纠错材料 ---------- */

.page-faq .fix{
  display:grid;
  gap:clamp(1.75rem,3.4vw,2.75rem);
  align-items:start;
}

.page-faq .check-list{
  display:grid;
  gap:.5rem;
  margin:1.25rem 0 0;
  padding:0;
  list-style:none;
}

.page-faq .check-list label{
  display:flex;
  align-items:flex-start;
  gap:.7rem;
  padding:.7rem .85rem;
  font-size:.9375rem;
  line-height:1.65;
  background:var(--card);
  border:1px solid var(--line-faint);
  cursor:pointer;
  transition:border-color .12s var(--ease);
}

.page-faq .check-list label:hover{
  border-color:var(--accent);
}

.page-faq .check-list input{
  flex:0 0 auto;
  width:1rem;
  height:1rem;
  margin:.32rem 0 0;
  appearance:none;
  -webkit-appearance:none;
  background:transparent;
  border:1px solid var(--line);
  cursor:pointer;
  transition:background-color .12s var(--ease),border-color .12s var(--ease);
}

.page-faq .check-list input:checked{
  background:var(--accent);
  border-color:var(--accent);
}

.page-faq .check-list input:focus-visible{
  outline:2px solid var(--data);
  outline-offset:2px;
}

.page-faq .fix__note{
  margin:1rem 0 0;
  font-size:.8125rem;
  line-height:1.7;
  color:var(--ink-mute);
}

.page-faq .fix__contact{
  margin-top:1.75rem;
  padding:1.15rem 1.25rem;
  background:var(--glass);
  border-left:2px solid var(--accent);
}

.page-faq .fix__contact-key{
  margin:0;
  font-size:.6875rem;
  letter-spacing:.14em;
  color:var(--ink-mute);
}

.page-faq .fix__contact-value{
  margin:.45rem 0 .7rem;
  font-family:var(--font-mono);
  font-size:.9375rem;
  word-break:break-all;
  color:var(--data);
}

.page-faq .fix__contact p:last-child{
  margin:.7rem 0 0;
}

.page-faq .fix__aside{
  display:grid;
  gap:1rem;
  align-content:start;
}

.page-faq .fix__figure{
  margin:0;
}

.page-faq .fix__figure img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
  border:1px solid var(--line-soft);
  filter:saturate(.8) contrast(1.05);
}

.page-faq .fix__aside p{
  margin:0;
}

@media (min-width:880px){
  .page-faq .fix{
    grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  }
}

/* ---------- 术语速查 ---------- */

.page-faq .term-list{
  display:grid;
  gap:.75rem;
  margin:0;
  padding:0;
  list-style:none;
}

.page-faq .term{
  position:relative;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.6rem 1rem;
  padding:1rem 1.15rem;
  background:var(--panel);
  border:1px solid var(--line-soft);
  outline:none;
  cursor:help;
  transition:border-color .12s var(--ease);
}

.page-faq .term:hover,
.page-faq .term:focus,
.page-faq .term:focus-visible{
  border-color:var(--accent);
}

.page-faq .term__name{
  font-family:var(--font-mono);
  font-size:.9375rem;
  color:var(--data);
}

.page-faq .term__hint{
  margin-left:auto;
  font-size:.6875rem;
  letter-spacing:.12em;
  color:var(--ink-mute);
}

.page-faq .term__card{
  flex:1 1 100%;
  max-height:0;
  margin-top:0;
  overflow:hidden;
  opacity:0;
  font-size:.8125rem;
  line-height:1.75;
  color:var(--ink-mute);
  transition:max-height .2s var(--ease),opacity .2s var(--ease),margin-top .2s var(--ease);
}

.page-faq .term:hover .term__card,
.page-faq .term:focus .term__card,
.page-faq .term:focus-within .term__card{
  max-height:13rem;
  margin-top:.7rem;
  opacity:1;
}

@media (min-width:720px){
  .page-faq .term-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* ---------- 收尾入口 ---------- */

.page-faq .faq-next__inner{
  display:grid;
  gap:1.5rem;
  padding:clamp(1.5rem,3.4vw,2.5rem);
  background:var(--panel);
  border:1px solid var(--line-soft);
  border-top:2px solid var(--accent);
}

.page-faq .faq-next__inner h2{
  margin:.6rem 0 0;
  font-family:var(--font-display);
  font-weight:800;
  letter-spacing:-.02em;
  font-size:clamp(1.35rem,2.8vw,1.875rem);
  line-height:1.15;
}

.page-faq .faq-next__inner p{
  margin:.9rem 0 0;
  max-width:40rem;
  font-size:.9375rem;
  line-height:1.8;
  color:var(--ink-mute);
}

.page-faq .faq-next__actions{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  align-items:center;
}

@media (min-width:900px){
  .page-faq .faq-next__inner{
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    column-gap:clamp(2rem,4vw,4rem);
  }
}

@media (prefers-reduced-motion:reduce){
  .page-faq .faq-index a,
  .page-faq .qa,
  .page-faq .term,
  .page-faq .term__card,
  .page-faq .check-list label,
  .page-faq .check-list input{
    transition:none;
  }
}