// FaqSection.jsx — Broadacres "About" page FAQ accordion.
// Rendered from window.__FAQS (defined in index head) so the visible Q&A text
// stays identical to the FAQPage JSON-LD that crawlers / AI engines read.

function FaqSection() {
  const faqs = (typeof window !== 'undefined' && window.__FAQS) || [];

  // Group by category, preserving source order.
  const groups = [];
  faqs.forEach((f) => {
    let g = groups.find((x) => x.cat === f.cat);
    if (!g) { g = { cat: f.cat, items: [] }; groups.push(g); }
    g.items.push(f);
  });

  return (
    <section className="faq" id="faqs" aria-labelledby="faq-title">
      <div className="container faq__inner">
        <header className="faq__head reveal">
          <div className="eyebrow-txt">FAQs</div>
          <h2 className="faq__title" id="faq-title">Questions, <em>answered.</em></h2>
          <p className="faq__lead">
            The things families ask us most. Can&rsquo;t find what you&rsquo;re after? Come and see us on a walkabout, or send us a note &mdash; we&rsquo;d love to talk.
          </p>
        </header>

        <div className="faq__groups">
          {groups.map((g, gi) => (
            <div className="faq__group reveal" key={g.cat}>
              <h3 className="faq__group-label">{g.cat}</h3>
              <div className="faq__list">
                {g.items.map((f) => (
                  <details className="faq-item" name={`faq-group-${gi}`} key={f.q}>
                    <summary className="faq-item__q">
                      <span>{f.q}</span>
                      <svg className="faq-item__chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.8" aria-hidden="true"><path d="M6 9l6 6 6-6" /></svg>
                    </summary>
                    <div className="faq-item__a"><p dangerouslySetInnerHTML={{ __html: f.a }} /></div>
                  </details>
                ))}
              </div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

Object.assign(window, { FaqSection });
