.page-faq{
  --faq-pad: clamp(1rem, 2vw, 1.75rem);
  --faq-black: #111111;
  --faq-deep: #0A2E24;
  --faq-green: #0B3B2E;
  --faq-gold: #D4AF37;
  --faq-gold-dark: #A8851E;
  --faq-gray: #A0A0A0;
  --faq-white: #FFFFFF;
  --faq-off-white: #F5F5F0;
  --faq-neon: #39FF14;
  --faq-gold-line: rgba(212,175,55,0.45);
  --faq-neon-line: rgba(57,255,20,0.7);
  --faq-skin: #D8D8D0;
  background: linear-gradient(135deg, var(--faq-green) 0%, var(--faq-deep) 62%, var(--faq-black) 140%);
  color: var(--faq-white);
  padding-bottom: 3rem;
}
.page-faq .faq-hero{
  position: relative;
  overflow: hidden;
  padding: 2rem 0 2.5rem;
}
.page-faq .faq-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background: repeating-linear-gradient(-45deg, rgba(212,175,55,0.05) 0 1px, transparent 1px 13px);
  pointer-events:none;
}
.page-faq .faq-hero::after{
  content:"";
  position:absolute;
  top:-3rem;
  right:-8%;
  width:46%;
  height:150%;
  background: linear-gradient(135deg, transparent 30%, rgba(17,17,17,0.55) 30%, rgba(17,17,17,0.55) 63%, transparent 63%);
  transform: skewX(-6deg);
  pointer-events:none;
}
.page-faq .faq-hero > *{
  position:relative;
  z-index:1;
}
.page-faq .faq-hero .breadcrumb{
  font-family: var(--font-mono);
  font-size: .78rem;
  color: var(--faq-gray);
  letter-spacing: .04em;
  margin: 0 0 1.35rem;
}
.page-faq .faq-hero .breadcrumb a{
  color: var(--faq-gold);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color .2s, border-color .2s;
}
.page-faq .faq-hero .breadcrumb a:hover{
  color: var(--faq-white);
  border-color: var(--faq-gold-dark);
}
.page-faq .faq-hero .breadcrumb__sep{
  margin: 0 .5rem;
  color: var(--faq-gold-dark);
}
.page-faq .faq-hero__title{
  font-family: var(--font-display);
  font-size: clamp(2.1rem, 8vw, 4.3rem);
  font-weight: 400;
  line-height: .98;
  letter-spacing: .01em;
  text-transform: uppercase;
  max-width: 16em;
  margin: 0;
  color: var(--faq-off-white);
  text-shadow: 0 2px 0 var(--faq-black), 0 6px 18px rgba(0,0,0,0.35);
}
.page-faq .faq-hero__lead{
  margin: 1.1rem 0 0;
  max-width: 74ch;
  font-size: clamp(1rem, 2vw, 1.15rem);
  line-height: 1.8;
  color: #E8E8E0;
}
.page-faq .faq-hero__statusline{
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
  margin-top: 1.8rem;
  background: var(--faq-black);
  border: 1px solid var(--faq-gold-dark);
  border-left: 4px solid var(--faq-gold);
  padding: .8rem 1rem;
  max-width: 100%;
}
.page-faq .faq-hero__status{
  font-family: var(--font-mono);
  font-size: .8rem;
  color: var(--faq-gray);
  display:inline-flex;
  align-items: baseline;
  gap:.35rem;
  padding-right: .9rem;
  margin-right: .45rem;
  border-right: 1px solid rgba(212,175,55,0.25);
}
.page-faq .faq-hero__status:last-child{
  border-right:0;
  margin-right:0;
  padding-right:0;
}
.page-faq .faq-hero__status-label{
  text-transform: uppercase;
  letter-spacing: .08em;
}
.page-faq .faq-hero__status strong{
  color: var(--faq-neon);
  font-weight: 500;
}
.page-faq .faq-layout{
  display:grid;
  gap:2rem;
  align-items:start;
  margin-top: 2.5rem;
}
.page-faq .faq-directory{
  background: var(--faq-black);
  border: 1px solid var(--faq-gold-dark);
  padding: 1.1rem 1rem .9rem;
  position:relative;
  overflow:hidden;
}
.page-faq .faq-directory::before{
  content:"";
  position:absolute;
  top:0;
  right:0;
  width:64px;
  height:64px;
  background: linear-gradient(135deg, transparent 48%, rgba(212,175,55,0.35) 48%, rgba(212,175,55,0.35) 52%, transparent 52%);
  pointer-events:none;
}
.page-faq .faq-directory__head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:1rem;
  padding-right:2rem;
}
.page-faq .faq-directory__head .kicker{
  font-family: var(--font-mono);
  font-size: .7rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--faq-gold);
}
.page-faq .faq-directory__hint{
  font-size: .72rem;
  color: var(--faq-gray);
  white-space: nowrap;
}
.page-faq .faq-directory__nav{
  margin-top: .7rem;
}
.page-faq .faq-directory__link{
  display:flex;
  align-items:center;
  gap:.75rem;
  padding: .7rem .45rem;
  color: var(--faq-white);
  text-decoration:none;
  border-bottom: 1px solid rgba(212,175,55,0.12);
  border-left: 3px solid transparent;
  transition: background .22s var(--ease-out), border-color .22s, padding-left .22s, color .2s;
  font-size: .92rem;
  white-space: nowrap;
}
.page-faq .faq-directory__link:hover{
  background: rgba(212,175,55,0.08);
  border-left-color: var(--faq-gold);
  padding-left: .65rem;
  color: var(--faq-gold);
}
.page-faq .faq-directory__num{
  font-family: var(--font-mono);
  font-size: .78rem;
  color: var(--faq-gold);
  flex:0 0 auto;
}
.page-faq .faq-directory__name{
  flex:1 1 auto;
  font-weight: 500;
}
.page-faq .faq-directory__extra{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  margin-top:.85rem;
}
.page-faq .faq-content{
  min-width:0;
}
.page-faq .faq-topic{
  scroll-margin-top: calc(var(--header-h) + 1rem);
  padding-top: 2.4rem;
}
.page-faq .faq-topic + .faq-topic{
  margin-top: 2.6rem;
  border-top: 1px solid rgba(212,175,55,0.22);
}
.page-faq .faq-topic__head{
  margin-bottom: 1.2rem;
}
.page-faq .faq-topic__head .kicker{
  font-family: var(--font-mono);
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--faq-gold);
  margin: 0 0 .4rem;
}
.page-faq .faq-topic__title{
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 4vw, 2.4rem);
  font-weight: 400;
  line-height: 1.08;
  text-transform: uppercase;
  letter-spacing: .015em;
  color: var(--faq-off-white);
  border-left: 4px solid var(--faq-gold);
  padding-left: .65rem;
  margin: 0;
}
.page-faq .faq-topic__inner{
  display:grid;
  gap:1.5rem;
  margin-top: 1.4rem;
}
.page-faq .faq-topic--media .faq-topic__inner{
  align-items:start;
}
.page-faq .faq-topic--plain .faq-topic__inner{
  display:block;
  max-width: 780px;
}
.page-faq .faq-media{
  position:relative;
  margin:0;
  background: var(--faq-black);
  border: 1px solid var(--faq-gold-dark);
}
.page-faq .faq-media::after{
  content: attr(data-caption);
  display:block;
  padding: .6rem .8rem;
  border-top: 1px solid var(--faq-gold-dark);
  font-family: var(--font-mono);
  font-size: .74rem;
  color: var(--faq-gold);
  background: var(--faq-black);
  line-height: 1.55;
}
.page-faq .faq-media img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
}
.page-faq .faq-accordion{
  border-top: 1px solid var(--faq-gold-dark);
  min-width:0;
}
.page-faq .faq-accordion .accordion__item{
  border-bottom: 1px solid rgba(212,175,55,0.22);
}
.page-faq .faq-q{
  margin:0;
}
.page-faq .accordion__trigger{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  text-align:left;
  background:transparent;
  border:0;
  padding: 1.05rem .35rem 1.05rem .1rem;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  color: var(--faq-white);
  line-height: 1.5;
  cursor:pointer;
  transition: color .2s, padding-left .2s, background .2s;
}
.page-faq .accordion__trigger:hover{
  color: var(--faq-gold);
  padding-left: .45rem;
}
.page-faq .accordion__trigger[aria-expanded="true"]{
  color: var(--faq-gold);
}
.page-faq .faq-arrow{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:25px;
  height:25px;
  flex: 0 0 25px;
  border: 1px solid var(--faq-gold-dark);
  color: var(--faq-gold);
  font-family: var(--font-mono);
  font-size: 1rem;
  line-height: 1;
  transition: background .25s, color .25s, transform .3s var(--ease-out);
}
.page-faq .faq-arrow::after{
  content:"+";
}
.page-faq .accordion__trigger[aria-expanded="true"] .faq-arrow{
  background: var(--faq-gold);
  color: var(--faq-black);
  transform: rotate(45deg);
}
.page-faq .accordion__inner{
  padding: 0 0 1.25rem .1rem;
}
.page-faq .accordion__inner-content{
  color: var(--faq-skin);
  font-size: .95rem;
  line-height: 1.8;
  max-width: 68ch;
}
.page-faq .accordion__inner-content a{
  color: var(--faq-gold);
  text-decoration: none;
  border-bottom: 1px solid var(--faq-gold-dark);
  transition: color .2s, border-color .2s;
}
.page-faq .accordion__inner-content a:hover{
  color: var(--faq-white);
  border-color: var(--faq-gold);
}
.page-faq .faq-contact{
  display:grid;
  gap:1rem;
  margin-top: 1.5rem;
}
.page-faq .faq-contact__card{
  background: var(--faq-black);
  border: 1px solid var(--faq-gold-dark);
  padding: 1.2rem;
  position: relative;
}
.page-faq .faq-contact__card::before{
  content:"";
  position:absolute;
  top:-1px;
  left:-1px;
  width:36px;
  height:36px;
  background: linear-gradient(135deg, var(--faq-gold) 0%, var(--faq-gold) 3px, transparent 3px);
  pointer-events:none;
}
.page-faq .faq-contact__label{
  display:block;
  font-family: var(--font-mono);
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: var(--faq-gray);
}
.page-faq .faq-contact__value{
  display:block;
  margin-top: .55rem;
  font-family: var(--font-mono);
  font-size: .95rem;
  color: var(--faq-gold);
  word-break: break-all;
  line-height: 1.45;
}
.page-faq .faq-contact__desc{
  display:block;
  margin-top: .4rem;
  font-size: .8rem;
  color: var(--faq-gray);
  line-height: 1.55;
}
.page-faq .faq-contact__note{
  margin-top: 1.5rem;
  padding: 1rem 1.2rem;
  border-left: 4px solid var(--faq-neon-line);
  background: rgba(57,255,20,0.06);
  color: var(--faq-skin);
  font-size: .9rem;
  line-height: 1.8;
}
.page-faq .faq-contact__slogan{
  margin: 1.5rem 0 0;
  color: var(--faq-gold);
  font-size: .98rem;
  font-weight: 600;
}
.page-faq .faq-contact__links{
  margin-top: .8rem;
  font-size: .9rem;
  display:flex;
  flex-wrap:wrap;
  gap:.6rem;
}
.page-faq .faq-contact__links a{
  color: var(--faq-gold);
  text-decoration: none;
  border-bottom: 1px solid var(--faq-gold-dark);
  padding-bottom: .1rem;
  transition: color .2s, border-color .2s;
}
.page-faq .faq-contact__links a:hover{
  color: var(--faq-white);
  border-color: var(--faq-gold);
}
@media (max-width: 899px){
  .page-faq .faq-hero__status{
    border-right:0;
    padding-right:0;
    margin-right:0;
  }
  .page-faq .faq-directory__nav{
    display:flex;
    overflow-x:auto;
    gap:.4rem;
    padding-bottom:.6rem;
    margin-right:-.4rem;
    scrollbar-width: thin;
    scrollbar-color: var(--faq-gold-dark) var(--faq-black);
  }
  .page-faq .faq-directory__link{
    flex: 0 0 auto;
    border-left:none;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    padding: .6rem .55rem;
  }
  .page-faq .faq-directory__link:hover{
    border-left:none;
    border-bottom-color: var(--faq-gold);
  }
}
@media (min-width: 700px){
  .page-faq .faq-contact{
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 900px){
  .page-faq .faq-hero{
    padding: 3.2rem 0 3.5rem;
  }
  .page-faq .faq-layout{
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 2.5rem;
  }
  .page-faq .faq-directory{
    position: sticky;
    top: calc(var(--header-h) + 1rem);
    z-index: 5;
  }
  .page-faq .faq-directory__nav{
    display:block;
  }
  .page-faq .faq-topic{
    padding-top: 2.8rem;
  }
  .page-faq .faq-topic--media .faq-topic__inner{
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.4fr);
  }
  .page-faq .faq-topic--flip .faq-topic__inner{
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.9fr);
  }
  .page-faq .faq-topic--flip .faq-media{
    order: 2;
  }
  .page-faq .faq-topic--flip .faq-accordion{
    order: 1;
  }
  .page-faq .faq-media img{
    min-height: 240px;
    height: 100%;
  }
}
@media (min-width: 1200px){
  .page-faq .faq-media img{
    min-height: 280px;
  }
}
