/* S3 Questions. Source: Paper 2NW-0 (head), 24A-0 / 24F-0 (exchanges), 24K-0
   (closing rule) inside 25O-0 (desktop, lane 1200) and 3GW-0 (mobile 350×602),
   get_jsx / get_computed_styles. Mobile-first; desktop from 1024px.
   2026-10-24, human (variant B): the section moves to the night ground, so
   the inverted «Success fee» row of How we work opens one dark finale
   (questions, final, footer) instead of a paper island between two dark
   blocks. Rules: 1px cream at 25%, as on the sheet. No bottom padding: the
   final's own air and padding set the distance to its display. */
.faq {
  --rule-30: color-mix(in srgb, var(--color-surface) 25%, transparent);
  padding-top: 64px;
  padding-bottom: 0;
}
/* audit 2026-10-24: section distance 88 / 144 incl. the air. */
.faq__title {
  font-size: 28px;
  font-weight: var(--font-weight-medium);
  line-height: 115%;
  letter-spacing: var(--tracking-tight);
}
.faq__list {
  padding-top: 24px;
}

/* Exchange = native <details>: rule, question row (summary) with a «+» / «−»
   mark, answer revealed on open (no transition: R7). The last one closes
   with a rule. */
.faq__exchange {
  border-top: 1px solid var(--rule-30);
}
.faq__exchange:last-child {
  border-bottom: 1px solid var(--rule-30);
}
.faq__q {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding-top: 20px;
  padding-bottom: 20px;
  list-style: none;
  cursor: pointer;
  font-size: 22px;
  font-weight: var(--font-weight-medium); /* audit 2026-10-24: subheads are 500 (was 400) */
  line-height: 125%; /* audit 2026-10-24: 125% like every subhead (was 130%) */
  letter-spacing: -0.01em;
}
.faq__q::-webkit-details-marker {
  display: none;
}
/* Hover feedback for the clickable question (HANDOFF §7: links underline). */
.faq__q:hover .faq__q-text {
  text-decoration: underline;
  text-underline-offset: 0.2em;
  text-decoration-thickness: 1px;
}
.faq__mark {
  flex: 0 0 24px;
  text-align: center;
  font-size: 22px;
  line-height: 125%;
}
.faq__mark::before {
  content: "+";
}
.faq__exchange[open] > .faq__q .faq__mark::before {
  content: "−";
}
.faq__a {
  padding-bottom: 28px;
  font-size: 16px;
  line-height: var(--leading-body);
  opacity: 0.78;
}

@media (min-width: 1024px) {
  /* Question in a 676 lane (proportional below 1440), mark at the far right,
     answer opens in the right lane (starts 48px after the question lane). */
  .faq {
    padding-top: 112px;
    padding-bottom: 0;
  }
  .faq__title {
    font-size: var(--text-h2);
  }
  .faq__list {
    padding-top: 32px;
  }
  .faq__q {
    padding-top: 28px;
    padding-bottom: 28px;
    font-size: var(--text-h3);
  }
  .faq__q-text {
    flex: 0 0 calc((100% - 48px) * 676 / 1152);
  }
  .faq__mark {
    font-size: var(--text-h3);
  }
  .faq__a {
    margin-left: calc((100% - 48px) * 676 / 1152 + 48px);
    padding-bottom: 40px;
    font-size: 20px;
    line-height: 140%;
  }
}