.faq-page {
  padding-top: 36px;
}

.faq-intro {
  padding: 56px;
  border-radius: var(--r-panel);
  background: var(--accent);
  color: var(--on-dark);
}

.faq-intro .eyebrow {
  color: var(--on-dark-soft);
}

.faq-intro h1 {
  max-width: 760px;
  margin-bottom: 24px;
}

.faq-intro .lede {
  max-width: 760px;
  color: var(--on-dark-soft);
}

.faq-intro-note {
  max-width: 760px;
  margin-top: 24px;
  margin-bottom: 0;
  color: var(--on-dark-soft);
  font-size: var(--fs-sm);
}

.faq-category-nav {
  margin-top: 28px;
  margin-bottom: 0;
}

.faq-related {
  margin-top: 24px;
  margin-bottom: 0;
  font-size: var(--fs-sm);
}

.faq-page .faq-answer {
  max-width: 960px;
}

@media (max-width: 768px) {
  .faq-intro {
    padding: 32px;
  }
}

@media (max-width: 640px) {
  .faq-page {
    padding-top: 20px;
  }

  .faq-intro {
    padding: 28px 24px;
  }

  .faq-intro .actions {
    align-items: stretch;
  }

  .faq-intro .actions .btn {
    width: 100%;
  }
}