/* ==========================================================================
   FAQ accordion block
   ========================================================================== */
.faq__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-faq-gap);
  margin-top: var(--space-h2-text);
}

.faq__item {
  background-color: var(--color-surface);
  border-radius: var(--radius-sm);
  overflow: hidden;
}

.faq__question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  padding: 1.25rem var(--space-card-padding);
  text-align: left;
  font-size: var(--fs-h3);
  font-weight: var(--fw-semibold);
  color: var(--color-text-primary);
}

.faq__question:hover {
  color: var(--color-heading-gold);
}

.faq__icon {
  flex-shrink: 0;
  color: var(--color-heading-gold);
}

.faq__icon-v {
  transform-origin: center;
  transition: transform var(--transition-fast), opacity var(--transition-fast);
}

.faq__question[aria-expanded="true"] .faq__icon-v {
  transform: scaleY(0);
  opacity: 0;
}

.faq__answer {
  display: grid;
  grid-template-rows: 0fr;
  overflow: hidden;
  transition: grid-template-rows var(--transition-base);
}

.faq__answer.is-open {
  grid-template-rows: 1fr;
}

/* No padding on this element itself: it is the direct CSS Grid item whose
   min-height:0 lets the 0fr row collapse to a true 0px. Any padding placed
   here would still count toward the item's own minimum box size and keep
   the closed accordion from fully collapsing (the answer text would stay
   visible, clipped, in a residual gap). The padding lives one level down
   on .faq__answer-inner p instead, which is just clipped content and does
   not constrain the row track size. */
.faq__answer-inner {
  overflow: hidden;
  min-height: 0;
  color: var(--color-text-muted);
}

.faq__answer-inner p {
  margin-top: 0;
  padding: 0 var(--space-card-padding) 1.25rem;
  color: var(--color-text-muted);
}