/* Shared FAQ accordion (pull-out: click a question, the answer expands).
   Lifted from the /faq page's .qa pattern (faq-page.css) so every page can use
   the same component. Loaded via pageCss on pages that have a FAQ section. */
  .faqgroup{max-width:820px;}
  .qa{border-bottom:1px solid var(--border);}
  .qa summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:flex-start;
    padding:22px 0;font-family:var(--font-display);font-size:clamp(19px,2.1vw,23px);line-height:1.3;color:var(--ink);text-wrap:balance;}
  .qa summary::-webkit-details-marker{display:none;}
  .qa summary .tw{flex:none;width:30px;height:30px;border:1px solid var(--amber-300);border-radius:999px;display:flex;align-items:center;justify-content:center;color:var(--amber-700);transition:transform var(--dur-fast) var(--ease-out),background var(--dur-fast);margin-top:2px;}
  .qa summary .tw iconify-icon{font-size:18px;}
  .qa[open] summary .tw{transform:rotate(45deg);background:var(--amber-500);color:#fff;border-color:var(--amber-500);}
  .qa .a{padding:0 0 24px;max-width:64ch;}
  .qa .a p{font-size:17px;line-height:1.65;color:var(--fg-muted);}
  .qa .a p + p{margin-top:12px;}
  .qa .a a{color:var(--amber-700);}

  /* Two-column FAQ grid (matches the design mock: items flow row-wise, L/R/L/R).
     align-items:start so an open item only grows its own row. Single column on mobile. */
  .faq-2col{display:grid;grid-template-columns:1fr 1fr;gap:0 56px;align-items:start;}
  .faq-2col .qa{margin:0;}
  @media (max-width:760px){ .faq-2col{grid-template-columns:1fr;column-gap:0;} }