.page-faq{
  --faq-cut:14px;
  --faq-cut-s:8px;
  background:var(--paper);
  color:var(--ink);
  overflow-x:hidden;
}

.page-faq h1,
.page-faq h2{
  font-family:var(--font-display);
  font-weight:900;
  line-height:1.24;
  margin:0;
}
.page-faq p{margin:0;}
.page-faq ul,
.page-faq ol{list-style:none;margin:0;padding:0;}
.page-faq figure{margin:0;}
.page-faq img{max-width:100%;height:auto;display:block;}

/* ---------- 首屏 ---------- */
.page-faq .faq-hero{
  position:relative;
  background:var(--deep);
  color:var(--paper);
  padding:26px 0 0;
  overflow:hidden;
  isolation:isolate;
}
.page-faq .faq-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(135deg,rgba(212,175,55,.07) 0 2px,transparent 2px 16px);
  z-index:0;
}
.page-faq .faq-hero::after{
  content:"";
  position:absolute;
  top:-25%;
  right:-32%;
  width:78%;
  height:150%;
  background:var(--deep-2);
  opacity:.85;
  clip-path:polygon(30% 0,100% 0,100% 100%,0 100%);
  z-index:0;
}
.page-faq .faq-hero__inner{
  position:relative;
  z-index:1;
  padding-bottom:26px;
}
.page-faq .faq-hero .breadcrumb__link{color:rgba(246,242,233,.7);}
.page-faq .faq-hero .breadcrumb__link:hover{color:var(--gold);}
.page-faq .faq-hero .breadcrumb__sep{color:var(--gold-dark);}
.page-faq .faq-hero .breadcrumb__current{color:var(--gold);}

.page-faq .faq-hero__grid{
  display:grid;
  gap:var(--gap-m);
  margin-top:24px;
}
.page-faq .faq-hero__copy .tag{margin-bottom:14px;}
.page-faq .faq-hero h1{
  font-size:clamp(29px,5.4vw,52px);
  letter-spacing:.01em;
  color:var(--paper);
}
.page-faq .faq-hero__lead{
  margin-top:16px;
  font-size:16.5px;
  line-height:1.8;
  color:rgba(246,242,233,.82);
  max-width:48ch;
}

.page-faq .faq-hero__aside{
  border-left:2px solid var(--gold);
  padding-left:16px;
}
.page-faq .faq-hero__aside-title{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:14px;
}
.page-faq .faq-hero__notes{display:grid;gap:12px;}
.page-faq .faq-hero__notes li{
  font-size:14px;
  line-height:1.7;
  color:rgba(246,242,233,.8);
  padding-bottom:12px;
  border-bottom:1px dashed rgba(212,175,55,.3);
}
.page-faq .faq-hero__notes li:last-child{border-bottom:none;padding-bottom:0;}
.page-faq .mono{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.12em;
  color:var(--cyan);
  margin-right:8px;
}

.page-faq .faq-quick{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px 14px;
  margin-top:34px;
  padding-top:18px;
  border-top:1px solid rgba(212,175,55,.35);
}
.page-faq .faq-quick__label{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.12em;
  color:rgba(246,242,233,.6);
}
.page-faq .faq-quick__link{
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.03em;
  text-decoration:none;
  color:var(--paper);
  padding:8px 14px;
  border:1px solid rgba(212,175,55,.55);
  background:rgba(212,175,55,.1);
  clip-path:polygon(var(--faq-cut-s) 0,100% 0,100% calc(100% - var(--faq-cut-s)),calc(100% - var(--faq-cut-s)) 100%,0 100%,0 var(--faq-cut-s));
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.page-faq .faq-quick__link:hover,
.page-faq .faq-quick__link:focus-visible{
  background:var(--gold);
  border-color:var(--gold);
  color:var(--deep);
}

/* ---------- 两步路径条 ---------- */
.page-faq .faq-path{
  background:var(--paper-warm);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding:var(--gap-m) 0;
}
.page-faq .faq-path__inner{
  display:grid;
  gap:var(--gap-s);
  align-items:center;
}
.page-faq .faq-path__media img{
  width:100%;
  aspect-ratio:3/2;
  object-fit:cover;
}
.page-faq .faq-path__body .tag{margin-bottom:12px;}
.page-faq .faq-path__body .tag--gold{
  color:var(--gold-dark);
  border-color:var(--gold);
  background:rgba(212,175,55,.16);
}
.page-faq .faq-path__body h2{font-size:clamp(22px,3.6vw,32px);}
.page-faq .faq-path__lead{
  margin-top:12px;
  font-size:16px;
  line-height:1.75;
  color:var(--ink-soft);
  max-width:46ch;
}

.page-faq .path{margin-top:22px;display:grid;gap:14px;}
.page-faq .path__item{
  position:relative;
  display:grid;
  gap:6px;
  padding:15px 18px 15px 20px;
  background:var(--surface);
  border:1px solid var(--border);
  clip-path:polygon(var(--faq-cut-s) 0,100% 0,100% calc(100% - var(--faq-cut-s)),calc(100% - var(--faq-cut-s)) 100%,0 100%,0 var(--faq-cut-s));
}
.page-faq .path__item + .path__item::before{
  content:"";
  position:absolute;
  left:22px;
  top:-11px;
  width:9px;
  height:9px;
  border-right:2px solid var(--orange);
  border-bottom:2px solid var(--orange);
  transform:rotate(45deg);
}
.page-faq .path__num{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.14em;
  color:var(--gold-dark);
}
.page-faq .path__item strong{
  font-family:var(--font-display);
  font-size:17px;
  font-weight:900;
  color:var(--ink);
}
.page-faq .path__note{
  font-size:13.5px;
  line-height:1.6;
  color:var(--ink-soft);
}

/* ---------- 问答列表 ---------- */
.page-faq .faq-list{padding:var(--gap-l) 0 0;}
.page-faq .faq-group + .faq-group{margin-top:var(--gap-l);}
.page-faq .faq-stack{margin-top:var(--gap-s);}

.page-faq .qa{
  position:relative;
  margin-bottom:14px;
  background:var(--surface);
  border:1px solid var(--border);
  scroll-margin-top:96px;
  clip-path:polygon(var(--faq-cut) 0,100% 0,100% calc(100% - var(--faq-cut)),calc(100% - var(--faq-cut)) 100%,0 100%,0 var(--faq-cut));
}
.page-faq .qa:last-child{margin-bottom:0;}
.page-faq .qa::before{
  content:"";
  position:absolute;
  left:0;
  top:var(--faq-cut);
  bottom:0;
  width:3px;
  background:var(--gold);
  transform:scaleY(0);
  transform-origin:top center;
  transition:transform .28s ease;
}
.page-faq .qa[open]::before{transform:scaleY(1);}

.page-faq .qa__summary{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:18px 18px 18px 22px;
  cursor:pointer;
  list-style:none;
  font-family:var(--font-display);
  font-weight:700;
  font-size:16.5px;
  line-height:1.5;
  color:var(--ink);
}
.page-faq .qa__summary::-webkit-details-marker{display:none;}
.page-faq .qa__summary:focus-visible{
  outline:2px solid var(--orange);
  outline-offset:-3px;
}
.page-faq .qa__num{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.08em;
  color:var(--gold-dark);
  border:1px solid var(--gold);
  padding:2px 7px;
}
.page-faq .qa__chev{
  width:11px;
  height:11px;
  border-right:2px solid var(--gold-dark);
  border-bottom:2px solid var(--gold-dark);
  transform:rotate(45deg);
  transition:transform .24s ease,border-color .24s ease;
}
.page-faq .qa[open] .qa__chev{
  transform:rotate(-135deg);
  border-color:var(--orange);
}

.page-faq .qa__body{
  padding:0 18px 22px 22px;
  border-top:1px dashed var(--hair);
  padding-top:18px;
  font-size:15.5px;
  line-height:1.78;
  color:var(--ink-soft);
}
.page-faq .qa__body > * + *{margin-top:16px;}
.page-faq .qa__hint{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.06em;
  color:var(--gold-dark);
}

.page-faq .qa__media{
  border:1px solid var(--border);
}
.page-faq .qa__media img{
  width:100%;
  aspect-ratio:3/2;
  object-fit:cover;
}

.page-faq .faq-link{
  color:var(--deep-2);
  font-weight:600;
  text-decoration:none;
  border-bottom:1px solid var(--gold);
  padding-bottom:1px;
}
.page-faq .faq-link:hover,
.page-faq .faq-link:focus-visible{
  color:var(--orange);
  border-bottom-color:var(--orange);
}

/* 步骤 */
.page-faq .steps{display:grid;}
.page-faq .steps__item{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:6px;
  padding:14px 0;
  border-bottom:1px solid var(--hair);
}
.page-faq .steps__item:last-child{border-bottom:none;padding-bottom:0;}
.page-faq .steps__idx{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.1em;
  color:var(--deep-2);
}
.page-faq .steps__title{
  display:block;
  font-size:16px;
  font-weight:700;
  color:var(--ink);
  margin-bottom:4px;
}

/* 结果字段 */
.page-faq .faq-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.page-faq .faq-chips li{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.03em;
  color:var(--deep-2);
  background:rgba(18,194,176,.11);
  border:1px solid rgba(18,194,176,.42);
  padding:5px 10px;
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);
}

/* 赛季对照 */
.page-faq .compare{display:grid;gap:12px;}
.page-faq .compare__col{
  background:var(--paper);
  border:1px solid var(--border);
  border-top:3px solid var(--gold);
  padding:14px 16px;
}
.page-faq .compare__col .tag{margin-bottom:10px;}
.page-faq .compare__col .tag--gold{
  color:var(--gold-dark);
  border-color:var(--gold);
  background:rgba(212,175,55,.16);
}
.page-faq .compare__col .tag--cyan{
  color:var(--deep-2);
  border-color:var(--cyan);
  background:rgba(18,194,176,.14);
}
.page-faq .compare__col p{font-size:14.5px;line-height:1.7;}

/* 排查分支 */
.page-faq .branch{
  background:var(--paper);
  border:1px solid var(--border);
  padding:18px;
}
.page-faq .branch__root{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.04em;
  color:var(--paper);
  background:var(--deep);
  padding:7px 12px;
}
.page-faq .branch__list{
  position:relative;
  margin-top:18px;
  display:grid;
  gap:18px;
}
.page-faq .branch__list::before{
  content:"";
  position:absolute;
  left:13px;
  top:6px;
  bottom:12px;
  width:1px;
  background:var(--gold-dark);
  opacity:.55;
}
.page-faq .branch__item{
  position:relative;
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  gap:14px;
  align-items:start;
}
.page-faq .branch__dot{
  position:relative;
  z-index:1;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--deep);
  background:var(--gold);
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
}
.page-faq .branch__item strong{
  display:block;
  font-size:15.5px;
  color:var(--ink);
}
.page-faq .branch__item p{
  margin-top:6px;
  font-size:14.5px;
  line-height:1.7;
}

/* 显示设置 */
.page-faq .settings{display:grid;}
.page-faq .settings__item{
  display:grid;
  gap:7px;
  padding:15px 0;
  border-bottom:1px solid var(--hair);
}
.page-faq .settings__item:first-child{padding-top:2px;}
.page-faq .settings__item:last-child{border-bottom:none;padding-bottom:0;}
.page-faq .settings__key{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.12em;
  color:var(--gold-dark);
}

/* ---------- 结尾联络面板 ---------- */
.page-faq .faq-help{padding:var(--gap-l) 0 var(--gap-m);}
.page-faq .faq-help__panel{
  padding:32px 22px;
  border-top:3px solid var(--gold);
}
.page-faq .faq-help__panel h2{
  color:var(--paper);
  font-size:clamp(21px,3.4vw,30px);
}
.page-faq .faq-help__panel p{
  margin-top:14px;
  font-size:15.5px;
  line-height:1.8;
  color:rgba(246,242,233,.82);
  max-width:62ch;
}
.page-faq .faq-help__links{
  margin-top:24px;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

/* ---------- 断点 ---------- */
@media (min-width:640px){
  .page-faq .compare{grid-template-columns:repeat(2,minmax(0,1fr));}
  .page-faq .steps__item{
    grid-template-columns:86px minmax(0,1fr);
    gap:16px;
    align-items:start;
  }
  .page-faq .steps__idx{padding-top:3px;}
  .page-faq .faq-hero__inner{padding-bottom:32px;}
  .page-faq .faq-help__panel{padding:38px 34px;}
}

@media (min-width:900px){
  .page-faq .faq-hero{padding-top:34px;}
  .page-faq .faq-hero__grid{
    grid-template-columns:minmax(0,7fr) minmax(0,5fr);
    align-items:end;
    gap:var(--gap-m);
  }
  .page-faq .faq-path__inner{
    grid-template-columns:minmax(0,5fr) minmax(0,7fr);
    gap:var(--gap-m);
  }
  .page-faq .path{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;}
  .page-faq .path__item + .path__item::before{
    left:-18px;
    top:50%;
    margin-top:-5px;
    transform:rotate(-45deg);
  }
  .page-faq .qa__summary{
    grid-template-columns:auto minmax(0,1fr) auto;
    gap:18px;
    padding:20px 24px 20px 28px;
    font-size:18px;
  }
  .page-faq .qa__body{
    padding:20px 32px 26px 28px;
    font-size:16px;
  }
  .page-faq .branch{padding:24px 26px;}
  .page-faq .qa__media img{aspect-ratio:16/9;}
}
<<<END>>>