/* The FAQ: a reading page, not a scene. Plain paper, one column, no animation —
   the point is that a person and a crawler both get the answer in one pass. */

/* A reading page has no hero to scroll past, so the header is simply always there —
   the home page fades it in on scroll, which would leave this page with no header at all. */
.faq-body .top-bar { position: sticky; opacity: 1; visibility: visible; transform: none; pointer-events: auto; }

.faq-page { padding-top: 2rem; }

.faq-head { padding-block: 2rem 2.5rem; max-width: 46rem; }
.faq-head .h-display { margin-block: 0.6rem 1rem; }

.faq-list { max-width: 46rem; padding-bottom: 4rem; }

.faq__item { padding-block: 1.9rem; border-top: 1px solid var(--line); }
.faq__item:first-child { border-top: none; padding-top: 0.5rem; }

.faq__q {
  font-family: var(--font-serif);
  font-size: clamp(1.25rem, 2.1vw, 1.6rem);
  line-height: 1.18;
  letter-spacing: -0.02em;
  font-weight: 460;
  font-variation-settings: "opsz" 48, "SOFT" 30, "WONK" 0;
  margin-bottom: 0.7rem;
  text-wrap: balance;
}
.faq__a { color: var(--ink-soft); max-width: var(--measure); text-wrap: pretty; }
.faq__a + .faq__a { margin-top: 0.7rem; }
.faq__a a { color: var(--accent); text-underline-offset: 0.2em; }
.faq__a strong { color: var(--ink); font-weight: 600; }

/* The disclaimer earns a plate of its own: it is the one line that must not be skimmed. */
.faq__note {
  margin-top: 1rem; padding: 0.85rem 1rem;
  border: 1px solid var(--line); border-radius: 0.6rem;
  background: color-mix(in srgb, var(--paper-2) 60%, transparent);
}
.faq__note p { font-size: 0.92rem; color: var(--ink-soft); }

.faq-more {
  max-width: 46rem; padding-block: 2rem 4rem; border-top: 1px solid var(--line);
  display: flex; gap: 0.75rem 2rem; flex-wrap: wrap;
}
.faq-more a { color: var(--accent); text-decoration: none; border-bottom: 1px solid var(--line); padding-bottom: 2px; }
.faq-more a:hover { border-bottom-color: currentColor; }

@media (max-width: 620px) {
  .faq-page { padding-top: 1.25rem; }
  .faq__item { padding-block: 1.5rem; }
}
