/* PK2 AI Advisors · FAQ rows and the body-copy link
   Lifted out of assessment.css so more than one page can set an FAQ without
   loading a page sheet it has no other use for. Layout only: every colour,
   size, and spacing value resolves through tokens.css.

   Load order: tokens.css, site.css, the page's own sheet, faq.css.

   No hex value appears in this file.
*/

/* A body-copy link: the underline is the link's own colour, not gold. It is
   used once on each page, and on the success page it is the mailto. */
.text-link {
  color: inherit;
  text-decoration: none;
  border-bottom: var(--hair) solid currentColor;
  padding-bottom: var(--hair);
}

.text-link:hover { border-bottom-color: transparent; }

/* ---------------------------------------------------------------- FAQ -- */

/* Native <details>. No script opens or closes anything here, so the keyboard
   and screen-reader behaviour is the browser's own and cannot be broken by the
   motion layer. Every item is closed on load. */
.faq-rows { border-top: var(--hair) solid var(--hairline); }

.section-head + .faq-rows { margin-top: var(--space-heading); }

.faq-item { border-bottom: var(--hair) solid var(--hairline); }

.faq-q {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-4);
  padding-block: var(--space-4);
  list-style: none;
  cursor: pointer;
}

.faq-q::-webkit-details-marker { display: none; }

/* The plus is the whole affordance, so it turns rather than swaps: a quarter
   turn puts a multiplication sign where the plus was. */
.faq-marker {
  color: var(--text-muted);
  transition: transform var(--dur-ui) var(--ease), color var(--dur-ui) ease;
}

.faq-item[open] .faq-marker { transform: rotate(45deg); }

.faq-item:hover .faq-marker { color: var(--ink); }

/* The answer takes the same body column the ruled rows use, so it lines up
   with everything else on the page and ends at the container's right edge. */
.faq-a { padding-bottom: var(--space-4); }