.page-faq{
  --faq-hero-bg:#0A0A0C;
  --faq-panel-radius:1.125rem;
  background-color:var(--color-bg-light);
  color:var(--color-text);
}

.page-faq .faq-hero{
  position:relative;
  overflow:hidden;
  background-color:var(--faq-hero-bg);
  color:#FFFFFF;
  border-bottom:4px solid var(--color-brand);
}

.page-faq .faq-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:22px 22px;
  pointer-events:none;
}

.page-faq .faq-hero::after{
  content:"HERO / SUPPORT";
  position:absolute;
  right:-2rem;
  bottom:-1.25rem;
  font-family:var(--font-code);
  font-size:clamp(3rem,10vw,7rem);
  font-weight:700;
  line-height:1;
  color:rgba(255,255,255,.04);
  letter-spacing:-.04em;
  pointer-events:none;
  transform:rotate(-6deg);
}

.page-faq .faq-hero-inner{
  position:relative;
  z-index:1;
  padding:2.25rem 1.25rem 3rem;
}

.page-faq .faq-breadcrumb{
  margin-bottom:2.25rem;
}

.page-faq .faq-breadcrumb .breadcrumb-link{
  color:rgba(255,255,255,.65);
  text-decoration:none;
}

.page-faq .faq-breadcrumb .breadcrumb-link:hover{
  color:#FFFFFF;
}

.page-faq .faq-breadcrumb .breadcrumb-sep{
  color:rgba(255,255,255,.4);
  margin:0 .375rem;
}

.page-faq .faq-hero-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:2.25rem;
}

.page-faq .faq-hero-main .index-tag{
  color:var(--color-brand);
  border-color:rgba(255,77,0,.45);
}

.page-faq .faq-hero-title{
  margin:1rem 0 .875rem;
  font-family:var(--font-heading);
  font-size:var(--text-display);
  font-weight:700;
  line-height:1.15;
  letter-spacing:-.02em;
  color:#FFFFFF;
}

.page-faq .faq-hero-lead{
  max-width:42rem;
  margin:0;
  font-size:1rem;
  line-height:1.85;
  color:rgba(255,255,255,.78);
}

.page-faq .faq-quick-links{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  margin-top:1.75rem;
}

.page-faq .faq-quick-link{
  display:inline-flex;
  align-items:center;
  padding:.5rem .9375rem;
  border:1px solid rgba(255,255,255,.28);
  border-radius:var(--radius-pill);
  font-family:var(--font-code);
  font-size:.75rem;
  color:rgba(255,255,255,.85);
  text-decoration:none;
  transition:background-color .2s ease, border-color .2s ease, color .2s ease;
}

.page-faq .faq-quick-link:hover{
  background-color:var(--color-brand);
  border-color:var(--color-brand);
  color:#FFFFFF;
}

.page-faq .faq-hero-meta{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.5rem;
  align-content:start;
}

.page-faq .faq-hero-meta-item{
  padding:.75rem .875rem;
  border-radius:var(--radius-md);
  background-color:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  backdrop-filter:blur(4px);
}

.page-faq .faq-hero-meta-label{
  display:block;
  margin-bottom:.25rem;
  font-family:var(--font-code);
  font-size:.6875rem;
  color:rgba(255,255,255,.55);
}

.page-faq .faq-hero-meta-value{
  display:inline-flex;
  align-items:center;
  gap:.375rem;
  font-size:.875rem;
  font-weight:600;
  color:#FFFFFF;
}

.page-faq .faq-hero-meta-value .status-dot--live{
  width:.5rem;
  height:.5rem;
  border-radius:50%;
  background-color:var(--color-success);
  box-shadow:0 0 0 3px rgba(16,185,129,.2);
}

.page-faq .faq-body{
  background-color:var(--color-bg-light);
  background-image:
    linear-gradient(rgba(26,26,26,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(26,26,26,.03) 1px, transparent 1px);
  background-size:24px 24px;
}

.page-faq .faq-layout{
  display:grid;
  grid-template-columns:1fr;
  gap:2.75rem;
  padding:3rem 1.25rem 4.5rem;
  max-width:var(--container-max);
  margin-inline:auto;
}

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

.page-faq .faq-section{
  margin-bottom:3.5rem;
}

.page-faq .faq-section:last-of-type{
  margin-bottom:0;
}

.page-faq .faq-section-head{
  margin-bottom:1.375rem;
}

.page-faq .faq-section-head .index-tag{
  color:var(--color-brand);
  border-color:rgba(255,77,0,.35);
  margin-bottom:.75rem;
}

.page-faq .faq-section-title{
  margin:.375rem 0 .25rem;
  font-family:var(--font-heading);
  font-size:var(--text-h2);
  font-weight:700;
  line-height:1.25;
  letter-spacing:-.01em;
  color:var(--color-text);
}

.page-faq .faq-section-desc{
  margin:0;
  font-size:.9375rem;
  line-height:1.7;
  color:var(--color-text-secondary);
}

.page-faq .faq-panel{
  border-top:1px solid var(--color-grid);
}

.page-faq .faq-accordion{
  border:1px solid var(--color-grid);
  border-top:none;
  background-color:var(--color-bg-light);
  border-radius:0;
  transition:border-color .2s ease, box-shadow .2s ease;
}

.page-faq .faq-accordion:first-child{
  border-radius:var(--faq-panel-radius) var(--faq-panel-radius) 0 0;
  border-top:1px solid var(--color-grid);
}

.page-faq .faq-accordion:last-child{
  border-radius:0 0 var(--faq-panel-radius) var(--faq-panel-radius);
}

.page-faq .faq-accordion[open]{
  border-color:var(--color-brand);
  border-width:1px;
  box-shadow:0 8px 30px rgba(255,77,0,.08);
  margin:0 -1px 0 0;
}

.page-faq .faq-accordion[open]:first-child{
  border-top-width:1px;
}

.page-faq .faq-accordion[open] + .faq-accordion{
  border-top-color:var(--color-brand);
}

.page-faq .faq-accordion summary{
  display:flex;
  align-items:flex-start;
  gap:.875rem;
  padding:1.15rem 1rem;
  cursor:pointer;
  list-style:none;
  transition:background-color .2s ease;
}

.page-faq .faq-accordion summary::-webkit-details-marker{
  display:none;
}

.page-faq .faq-accordion summary:hover{
  background-color:rgba(255,77,0,.035);
}

.page-faq .faq-accordion summary:focus-visible{
  outline:2px solid var(--color-brand);
  outline-offset:-2px;
}

.page-faq .faq-q-num{
  flex-shrink:0;
  min-width:2.5rem;
  font-family:var(--font-code);
  font-size:.75rem;
  line-height:1.6;
  font-weight:600;
  color:var(--color-brand);
  padding-top:.15rem;
}

.page-faq .faq-q-text{
  font-size:1rem;
  font-weight:600;
  line-height:1.5;
  color:var(--color-text);
  flex:1;
}

.page-faq .faq-accordion summary::after{
  content:"＋";
  font-size:1.25rem;
  line-height:1;
  color:var(--color-brand);
  margin-left:auto;
  flex-shrink:0;
  padding-top:.15rem;
  transition:transform .25s ease;
}

.page-faq .faq-accordion[open] summary::after{
  content:"－";
}

.page-faq .faq-answer{
  padding:0 1rem 1.375rem;
  font-size:.9375rem;
  line-height:1.85;
  color:var(--color-text-secondary);
  animation:faqFadeIn .25s ease;
}

.page-faq .faq-answer p{
  margin:0 0 .75rem;
}

.page-faq .faq-answer p:last-child{
  margin-bottom:0;
}

.page-faq .faq-answer a{
  color:var(--color-blue-deep);
  text-decoration:underline;
  text-underline-offset:.25em;
}

.page-faq .faq-answer a:hover{
  color:var(--color-brand);
}

.page-faq .faq-answer ul{
  margin:.75rem 0 0;
  padding-left:1.25rem;
}

.page-faq .faq-answer li + li{
  margin-top:.375rem;
}

.page-faq .faq-figure{
  margin:1.25rem 0 0;
  border-radius:var(--radius-md);
  overflow:hidden;
  background-color:var(--color-bg-card);
}

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

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

.page-faq .faq-figure figcaption{
  padding:.625rem .875rem;
  font-family:var(--font-code);
  font-size:.75rem;
  color:var(--color-text-secondary);
  background-color:var(--color-bg-card);
}

.page-faq .faq-aside{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
  align-content:start;
}

.page-faq .faq-help-card,
.page-faq .faq-metric-card,
.page-faq .faq-platform-card{
  padding:1.5rem;
  border-radius:var(--radius-lg);
  border:1px solid var(--color-grid);
  background-color:var(--color-bg-light);
}

.page-faq .faq-help-card{
  background-color:var(--color-bg-dark);
  border-color:var(--color-bg-dark);
  color:#FFFFFF;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:18px 18px;
}

.page-faq .faq-help-card .index-tag{
  color:var(--color-brand);
  border-color:rgba(255,77,0,.5);
}

.page-faq .faq-help-title,
.page-faq .faq-metric-title,
.page-faq .faq-platform-title{
  margin:.75rem 0 .5rem;
  font-family:var(--font-heading);
  font-size:1.25rem;
  font-weight:700;
  line-height:1.3;
}

.page-faq .faq-help-card .faq-help-title{
  color:#FFFFFF;
}

.page-faq .faq-help-desc,
.page-faq .faq-platform-desc{
  margin:0 0 1rem;
  font-size:.875rem;
  line-height:1.7;
  color:var(--color-text-secondary);
}

.page-faq .faq-help-card .faq-help-desc{
  color:rgba(255,255,255,.7);
}

.page-faq .faq-contact-lines{
  margin:0 0 1.25rem;
  padding:0;
  list-style:none;
}

.page-faq .faq-contact-lines li{
  position:relative;
  padding:.35rem 0 .35rem 1.25rem;
  font-size:.8125rem;
  line-height:1.55;
  color:rgba(255,255,255,.82);
}

.page-faq .faq-contact-lines li::before{
  content:"";
  position:absolute;
  left:0;
  top:.85rem;
  width:.4rem;
  height:.4rem;
  border-radius:50%;
  background-color:var(--color-brand);
}

.page-faq .faq-metric-list{
  margin:0;
  padding:0;
  list-style:none;
}

.page-faq .faq-metric-list li{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:1rem;
  padding:.625rem 0;
  border-bottom:1px solid var(--color-grid);
}

.page-faq .faq-metric-list li:last-child{
  border-bottom:none;
  padding-bottom:0;
}

.page-faq .faq-metric-label{
  font-size:.875rem;
  color:var(--color-text-secondary);
}

.page-faq .faq-metric-value{
  font-family:var(--font-code);
  font-size:1.0625rem;
  font-weight:700;
  color:var(--color-text);
}

.page-faq .faq-platform-card{
  background-color:var(--color-bg-card);
  border-color:var(--color-bg-card);
}

.page-faq .faq-platform-card .btn{
  width:100%;
  justify-content:center;
}

@keyframes faqFadeIn{
  from{
    opacity:0;
    transform:translateY(-4px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

@media (prefers-reduced-motion: reduce){
  .page-faq .faq-answer{
    animation:none;
  }
  .page-faq .faq-quick-link,
  .page-faq .faq-accordion summary,
  .page-faq .faq-accordion summary::after{
    transition:none;
  }
}

@media (min-width: 640px){
  .page-faq .faq-hero-inner{
    padding:2.75rem 2rem 3.5rem;
  }

  .page-faq .faq-hero-grid{
    gap:2.5rem;
  }

  .page-faq .faq-hero-meta{
    grid-template-columns:repeat(3,1fr);
    max-width:none;
  }

  .page-faq .faq-layout{
    padding:3.5rem 2rem 5rem;
  }

  .page-faq .faq-accordion summary{
    padding:1.25rem 1.375rem;
  }

  .page-faq .faq-answer{
    padding:0 1.375rem 1.5rem;
  }
}

@media (min-width: 1080px){
  .page-faq .faq-hero-inner{
    padding:3rem 2rem 4rem;
  }

  .page-faq .faq-hero-grid{
    grid-template-columns:minmax(0,1fr) 21rem;
    gap:4rem;
    align-items:start;
  }

  .page-faq .faq-hero-meta{
    grid-template-columns:1fr;
    gap:.625rem;
    padding-top:.25rem;
  }

  .page-faq .faq-hero-meta-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
  }

  .page-faq .faq-hero-meta-label{
    margin-bottom:0;
  }

  .page-faq .faq-layout{
    grid-template-columns:minmax(0,1fr) 21rem;
    gap:4rem;
    padding:4rem 2rem 6rem;
  }

  .page-faq .faq-aside{
    position:sticky;
    top:calc(var(--header-h) + 2rem);
  }
}