.page-faq{
  --faq-panel:#FFFFFF;
  --faq-rail:264px;
  --faq-orange-soft:rgba(255,74,28,.08);
  --faq-orange-line:rgba(255,74,28,.30);
  --faq-mute:rgba(26,39,51,.76);
  --faq-mute-soft:rgba(26,39,51,.62);
  --faq-on-dark:#CFD9E3;
  background:var(--paper);
  color:var(--text);
  font-family:var(--font-body);
  overflow-wrap:break-word;
}

.page-faq *{box-sizing:border-box;}

.page-faq .faq-hero{
  position:relative;
  overflow:hidden;
  padding:clamp(20px,4vw,36px) 0 clamp(34px,5vw,60px);
  color:var(--paper);
  background:
    radial-gradient(760px 320px at 94% -14%, rgba(255,74,28,.30), transparent 70%),
    radial-gradient(520px 260px at 6% 110%, rgba(51,240,208,.10), transparent 72%),
    linear-gradient(158deg, var(--ink) 0%, var(--ink-800) 82%);
  border-bottom:1px solid var(--line-blue);
}

.page-faq .faq-hero::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:26px;
  background-image:repeating-linear-gradient(90deg, var(--line-blue) 0 1px, transparent 1px 56px);
  opacity:.55;
  pointer-events:none;
}

.page-faq .faq-hero .breadcrumb__link{color:var(--steel);}
.page-faq .faq-hero .breadcrumb__link:hover{color:var(--cyan);}
.page-faq .faq-hero .breadcrumb__current{color:var(--paper);}

.page-faq .faq-hero__grid{
  display:grid;
  gap:clamp(24px,4vw,40px);
  margin-top:clamp(18px,3vw,30px);
}
@media (min-width:900px){
  .page-faq .faq-hero__grid{
    grid-template-columns:minmax(0,1.6fr) minmax(0,.84fr);
    align-items:end;
  }
}

.page-faq .faq-hero__main{min-width:0;}

.page-faq .faq-hero h1{
  margin:14px 0 0;
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(30px,4.5vw,52px);
  line-height:1.08;
  letter-spacing:.005em;
  color:var(--paper);
}

.page-faq .faq-hero__lead{
  margin:18px 0 0;
  max-width:58ch;
  font-size:clamp(15px,1.6vw,17px);
  line-height:1.8;
  color:var(--faq-on-dark);
}

.page-faq .faq-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:26px;
}
.page-faq .faq-hero__actions .btn{border-radius:2px;}

.page-faq .faq-board{
  padding:18px 18px 15px;
  border:1px solid var(--line-blue);
  border-radius:2px;
  background:rgba(19,41,61,.74);
}
.page-faq .faq-board__title{
  margin:0 0 12px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  color:var(--steel);
}
.page-faq .faq-board__list{
  list-style:none;
  margin:0;
  padding:0;
}
.page-faq .faq-board__list li{
  display:flex;
  align-items:center;
  gap:9px;
  padding:9px 0;
  border-top:1px solid rgba(43,74,99,.7);
  font-size:13.5px;
  line-height:1.5;
  color:var(--faq-on-dark);
}
.page-faq .faq-board__list li:first-child{border-top:0;}
.page-faq .faq-board__val{
  margin-left:auto;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.05em;
  color:var(--cyan);
}
.page-faq .faq-board__foot{
  margin:12px 0 0;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  color:var(--steel);
}

.page-faq .faq-body{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(26px,4vw,48px);
  padding-block:clamp(34px,6vw,72px);
}

@media (min-width:960px){
  .page-faq .faq-body{
    grid-template-columns:var(--faq-rail) minmax(0,1fr);
    gap:clamp(32px,4vw,64px);
    align-items:start;
  }
  .page-faq .faq-index{
    position:sticky;
    top:calc(var(--header-h) + 28px);
  }
}

.page-faq .faq-index{
  scroll-margin-top:calc(var(--header-h) + 24px);
  border-top:2px solid var(--ink);
  padding-top:16px;
}
.page-faq .faq-index__title{
  margin:0 0 12px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.2em;
  color:var(--steel);
}
.page-faq .faq-index__list{
  list-style:none;
  margin:0;
  padding:0;
  border-left:1px solid var(--cool);
}
.page-faq .faq-index__link{
  display:flex;
  align-items:baseline;
  gap:10px;
  margin-left:-1px;
  padding:10px 0 10px 16px;
  border-left:2px solid transparent;
  color:var(--text);
  font-size:14.5px;
  line-height:1.5;
  text-decoration:none;
  transition:color .18s var(--ease), border-color .18s var(--ease), background .18s var(--ease);
}
.page-faq .faq-index__link:hover,
.page-faq .faq-index__link:focus-visible{
  color:var(--dy-orange-deep);
  border-left-color:var(--dy-orange);
  background:var(--faq-orange-soft);
}
.page-faq .faq-index__no{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  color:var(--steel);
}
.page-faq .faq-index__note{
  margin:18px 0 0;
  padding-left:14px;
  border-left:2px solid var(--dy-orange);
  font-size:13px;
  line-height:1.7;
  color:var(--faq-mute-soft);
}

.page-faq .faq-stream{min-width:0;}

.page-faq .faq-section{
  scroll-margin-top:calc(var(--header-h) + 24px);
}
.page-faq .faq-section + .faq-section{
  margin-top:clamp(42px,6vw,80px);
  padding-top:clamp(28px,4vw,44px);
  border-top:1px solid var(--cool);
}

.page-faq .faq-section__no{
  display:inline-block;
  margin:0;
  padding-bottom:7px;
  border-bottom:1px solid var(--dy-orange);
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.22em;
  color:var(--dy-orange-deep);
}
.page-faq .faq-section h2{
  margin:14px 0 0;
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(23px,3vw,34px);
  line-height:1.18;
  color:var(--text);
}
.page-faq .faq-section__intro{
  margin:12px 0 0;
  max-width:66ch;
  font-size:15.5px;
  line-height:1.8;
  color:var(--faq-mute);
}
.page-faq .faq-inline-link{
  color:var(--ink);
  text-decoration:none;
  border-bottom:1px solid var(--dy-orange);
  padding-bottom:1px;
  transition:color .18s var(--ease);
}
.page-faq .faq-inline-link:hover{color:var(--dy-orange-deep);}

.page-faq .faq-figure{
  margin:22px 0 0;
  border:1px solid var(--cool);
  background:#fff;
}
.page-faq .faq-figure .media-frame__img{
  display:block;
  width:100%;
  object-fit:cover;
}

.page-faq .accordion{margin-top:22px;}

.page-faq .accordion__item{
  border:1px solid var(--cool);
  border-left:2px solid var(--cool);
  border-radius:2px;
  background:var(--faq-panel);
  box-shadow:var(--shadow-soft);
  transition:border-color .2s var(--ease);
}
.page-faq .accordion__item + .accordion__item{margin-top:10px;}
.page-faq .accordion__item[data-open]{border-left-color:var(--dy-orange);}

.page-faq .accordion__trigger{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  padding:15px 18px;
  border:0;
  background:none;
  text-align:left;
  font-family:var(--font-body);
  font-size:15.5px;
  font-weight:600;
  line-height:1.5;
  color:var(--text);
  cursor:pointer;
}
.page-faq .accordion__index{
  flex:0 0 auto;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.1em;
  color:var(--steel);
}
.page-faq .accordion__label{min-width:0;}
.page-faq .accordion__item[data-open] .accordion__index{color:var(--dy-orange-deep);}

.page-faq .accordion__icon{
  position:relative;
  flex:0 0 16px;
  width:16px;
  height:16px;
  margin-left:auto;
}
.page-faq .accordion__icon::before,
.page-faq .accordion__icon::after{
  content:"";
  position:absolute;
  background:var(--steel);
  transition:transform .2s var(--ease), background .2s var(--ease);
}
.page-faq .accordion__icon::before{left:0;top:7px;width:16px;height:1.5px;}
.page-faq .accordion__icon::after{left:7px;top:0;width:1.5px;height:16px;}
.page-faq .accordion__item[data-open] .accordion__icon::before{background:var(--dy-orange);}
.page-faq .accordion__item[data-open] .accordion__icon::after{transform:scaleY(0);}

.page-faq .accordion__panel-inner{padding:0 18px 18px;}
.page-faq .accordion__body{
  padding-top:14px;
  border-top:1px solid var(--cool);
  font-size:15px;
  line-height:1.78;
  color:var(--faq-mute);
}

.page-faq .faq-state{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:3px 8px;
  border:1px solid var(--faq-orange-line);
  border-radius:2px;
  background:var(--faq-orange-soft);
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:.12em;
  color:var(--dy-orange-deep);
}

.page-faq .faq-steps{
  list-style:none;
  counter-reset:faqstep;
  margin:14px 0 0;
  padding:0;
}
.page-faq .faq-steps li{
  counter-increment:faqstep;
  position:relative;
  margin-bottom:12px;
  padding-left:32px;
  font-size:14.8px;
  line-height:1.75;
  color:var(--faq-mute);
}
.page-faq .faq-steps li:last-child{margin-bottom:0;}
.page-faq .faq-steps li::before{
  content:counter(faqstep, decimal-leading-zero);
  position:absolute;
  left:0;
  top:2px;
  display:flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:20px;
  border:1px solid var(--faq-orange-line);
  border-radius:2px;
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:.02em;
  color:var(--dy-orange-deep);
}
.page-faq .faq-steps--loose{margin-top:24px;}
.page-faq .faq-steps--loose li{
  padding:12px 16px 12px 46px;
  margin-bottom:10px;
  border:1px solid var(--cool);
  border-radius:2px;
  background:#fff;
  font-size:15px;
}
.page-faq .faq-steps--loose li::before{left:14px;top:14px;}

.page-faq .route-path{
  list-style:none;
  margin:24px 0 0;
  padding:0;
  display:grid;
  gap:10px;
}
.page-faq .route-path li{
  position:relative;
  padding:14px 16px;
  border:1px solid var(--cool);
  border-left:2px solid var(--dy-orange);
  border-radius:2px;
  background:#fff;
  box-shadow:var(--shadow-soft);
}
.page-faq .route-path__label{
  display:block;
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:.18em;
  color:var(--steel);
}
.page-faq .route-path__name{
  display:block;
  margin-top:5px;
  font-weight:700;
  font-size:15px;
  color:var(--text);
}
.page-faq .route-path__desc{
  display:block;
  margin-top:6px;
  font-size:13.6px;
  line-height:1.7;
  color:var(--faq-mute-soft);
}
@media (min-width:760px){
  .page-faq .route-path{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
}

.page-faq .faq-template{
  margin-top:24px;
  padding:20px;
  border:1px solid var(--line-blue);
  border-radius:2px;
  background:linear-gradient(150deg, var(--ink) 0%, var(--ink-800) 88%);
  color:var(--paper);
}
.page-faq .faq-template__label{
  margin:0 0 14px;
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:.2em;
  color:var(--cyan);
}
.page-faq .faq-template__list{
  list-style:none;
  margin:0;
  padding:0;
}
.page-faq .faq-template__list li{
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  gap:14px;
  padding:9px 0;
  border-top:1px solid rgba(43,74,99,.72);
  font-size:13.6px;
  line-height:1.62;
}
.page-faq .faq-template__list li:first-child{border-top:0;}
.page-faq .faq-template__k{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  color:var(--steel);
}
.page-faq .faq-template__v{color:#D8E0E8;}
.page-faq .faq-template__hint{
  margin:16px 0 0;
  font-size:13.4px;
  line-height:1.7;
  color:#A9BCCB;
}

.page-faq .faq-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:18px;
  margin-top:26px;
}
.page-faq .faq-actions .btn{border-radius:2px;}

.page-faq .faq-back__link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding-bottom:3px;
  border-bottom:1px solid var(--dy-orange);
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.12em;
  color:var(--ink);
  text-decoration:none;
  transition:color .18s var(--ease);
}
.page-faq .faq-back__link:hover,
.page-faq .faq-back__link:focus-visible{color:var(--dy-orange-deep);}

@media (max-width:420px){
  .page-faq .faq-template__list li{grid-template-columns:minmax(0,1fr);gap:2px;}
  .page-faq .faq-steps--loose li{padding:12px 14px 12px 44px;}
  .page-faq .faq-steps--loose li::before{left:12px;}
}

@media (prefers-reduced-motion:reduce){
  .page-faq *,
  .page-faq *::before,
  .page-faq *::after{
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
  }
}
<<<END>>>