function FAQ() {
  const [open, setOpen] = React.useState(0);
  const faqs = [
    { q: "Ile kosztuje wdrożenie?",       a: "Systemy rezerwacji od 2 tys. zł netto, agenci AI od 1,2 tys. zł netto - wszystko w zależności od zakresu. Każdy projekt jest inny, więc konkretną wycenę dostajesz po audycie, dopasowaną do Twoich realnych potrzeb." },
    { q: "Czy zrobisz dla mnie sam system powiadomień, nie chcę całego systemu rezerwacji?", a: "Tak. Wdrażam też pojedyncze automatyzacje - jeśli potrzebujesz tylko systemu powiadomień (SMS, e-mail, WhatsApp), zrobię ten kawałek bez całego systemu rezerwacji. Wycenia się indywidualnie po audycie." },
    { q: "Jak długo trwa wdrożenie?",     a: "Zazwyczaj od 3 do 30 dni - wszystko zależy od specyfiki projektu. Konkretny termin ustalamy na drugim spotkaniu, gdy pokazuję Ci warianty rozwiązania." },
    { q: "Co jeśli na audycie okaże się, że nie potrzebuję tego, co robisz?", a: "Powiem Ci to wprost - nie sprzedaję na siłę i nie biorę pieniędzy za projekt, który nie ma sensu w Twojej firmie." },
    { q: "Czy muszę zrezygnować z Booksy?", a: "Nie. Booksy może zostać jako dodatkowy kanał, ale przestaje być Twoim jedynym. Klientki, które trafiają z reklam, idą bezpośrednio do Twojego systemu - bez prowizji." },
    { q: "Co jeśli coś przestanie działać po wdrożeniu?", a: "Oferuję wsparcie techniczne, w którym monitoruję wdrożone rozwiązanie i naprawiam to, co przestanie działać. Szczegóły zakresu i rozliczenia ustalamy na audycie." },
    { q: "Czy system będzie wyglądać jak moja marka?", a: "Tak. System rezerwacji i widget na stronę projektuję pod Twój branding - tak, żeby pasowały do reszty Twojej marki. Nic nie jest sztywne, ustalamy razem każdy szczegół, żeby finalna wersja Ci się podobała." },
    { q: "Czy będę musiał zmieniać narzędzia, na których aktualnie pracujemy?", a: "Przeważnie nie. Bardzo często udaje się zintegrować nowe rozwiązanie z narzędziami, których już używasz - bez konieczności zmiany. Jeśli jakieś narzędzie nie będzie się dało zintegrować, zarekomenduję Ci kilka konkretnych alternatyw - decyzję podejmujesz Ty." },
    { q: "Czy wystawiasz fakturę VAT?",   a: "Tak, wystawiam faktury VAT." },
  ];
  return (
    <section className="g-section" id="faq">
      <SectionHeader num="07" eyebrow="FAQ" title={<>Najczęstsze <em>pytania</em>.</>} />
      <div className="g-faq">
        {faqs.map((f, i) => (
          <div key={i} className={`g-faq-item ${open === i ? 'g-faq-item--open' : ''}`} onClick={() => setOpen(open === i ? -1 : i)}>
            <button className="g-faq-q">
              <span>{f.q}</span>
              <i data-lucide={open === i ? "minus" : "plus"}></i>
            </button>
            {open === i && <div className="g-faq-a">{f.a}</div>}
          </div>
        ))}
      </div>
    </section>
  );
}

window.FAQ = FAQ;
