/* FAQs page — accordion list. Rows are individual cards on --av-black,
   separated by an 8px gap (not a single bordered list — see
   components/disclosure/Accordion.prompt.md). Closed rows show a 16px
   plus, the open row a 12px minus, both at 1.6 stroke. Row radius 14px. */

.av-faq-list {
  display: flex;
  flex-direction: column;
  gap: var(--av-space-2);
  max-width: 800px;
  margin: 0 auto;
}

.av-faq-row {
  border-radius: var(--av-radius-md);
  background: var(--av-bg-inverse);
  overflow: hidden;
}

.av-faq-row__trigger {
  display: flex;
  align-items: center;
  gap: var(--av-space-4);
  width: 100%;
  padding: var(--av-space-5);
  box-sizing: border-box;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
}

.av-faq-row__q {
  flex: 1;
  font-family: var(--av-font-heading);
  font-weight: var(--av-weight-heading);
  font-size: var(--av-text-body-lg);
  line-height: var(--av-leading-card);
  letter-spacing: var(--av-tracking-card);
  color: var(--av-text-inverse);
}

.av-faq-row__icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.av-faq-row__icon svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: opacity var(--av-dur-fast) ease;
}
.av-faq-row__icon-minus { opacity: 0; }
.av-faq-row__icon-plus { opacity: 1; }
.av-faq-row--open .av-faq-row__icon-minus { opacity: 1; }
.av-faq-row--open .av-faq-row__icon-plus { opacity: 0; }

/* Height-animated disclosure via the 0fr/1fr grid-track trick — no fixed
   max-height guess needed, and it collapses to a true 0 when closed. */
.av-faq-row__answer {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows var(--av-dur-mid) var(--av-ease), opacity var(--av-dur-fast) ease;
}
.av-faq-row--open .av-faq-row__answer {
  grid-template-rows: 1fr;
  opacity: 1;
}
.av-faq-row__answer > div {
  overflow: hidden;
  min-height: 0;
}
.av-faq-row__answer p {
  margin: 0;
  padding: 0 var(--av-space-5) var(--av-space-5);
  font-size: var(--av-text-body);
  line-height: var(--av-leading-body);
  color: var(--av-n300);
}
