/* ============================================================
   FAQ - page-specific layout.
   Section-by-section translation of the approved Claude Design
   prototype (project/FAQ.dc.html), reusing css/components.css and
   the shared shell rules in css/page.css / css/vault.css (.hero,
   .hero--sub, .section, .accordion, .cta, .cta--tight) wherever the
   visual is identical to an existing page. Only what's new to this
   page - the numbered category header row - lives here.
   ============================================================ */

.faq-category { width: 100%; max-width: var(--container-lg); display: flex; gap: var(--space-20); align-items: flex-start; }
.faq-category__intro { flex: 0 0 340px; display: flex; flex-direction: column; gap: 6px; }
.faq-category__num {
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
  margin-bottom: -8px;
}
.faq-category__intro h2 {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: 36px;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: var(--text-primary);
  text-wrap: pretty;
}
.faq-category__body { flex: 1; min-width: 0; }

@media (max-width: 960px) {
  /* align-items: stretch - same fix as .faq-layout in vault.css: the
     base rule's flex-start is for the row layout, and left in place
     through the switch to column here it sizes .faq-category__intro to
     its own content width instead of the full stacked width. */
  .faq-category { flex-direction: column; align-items: stretch; gap: var(--space-16); }
  .faq-category__intro { flex: none; }
  /* Header-to-content spacing convention (see page.css) - .faq-category's
     own gap (--space-16, 64px) is too much between the title and the
     first question, same 32px target as everywhere else on the site -
     same fix already applied to .faq-layout (vault.css) for the same
     stacked title-then-accordion shape, just missed here. */
  .faq-category__body { margin-top: -32px; }
}