function FAQ() {
  const [open, setOpen] = React.useState(0);
  const faqs = [
    { q: "Ile kosztuje wdrożenie?",       a: "Aplikacje webowe od 5 tys. zł netto, automatyzacje - wycena indywidualna, w zależności od stopnia skomplikowania. Każdy projekt jest inny, więc konkretną wycenę dostajesz po audycie, dopasowaną do Twoich realnych potrzeb." },
    { q: "Nie chcę pełnej aplikacji do zarządzania, chcę pojedynczą automatyzację. Czy możesz w tym pomóc?", a: "Tak. Buduję zarówno aplikacje, jak i pojedyncze automatyzacje - jeśli potrzebujesz tylko jednego procesu zautomatyzowanego (np. faktury, statusy zamówień, integracja z magazynem), zrobię ten kawałek bez budowania całej aplikacji." },
    { 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 mogę zostawić BaseLinker obok mojej aplikacji?", a: "Możesz, ale nie ma to większego sensu. Aplikację buduję pod Ciebie - ma wszystkie funkcje, które ma BaseLinker, plus te, których BaseLinker nie ma, a Ty chciałbyś mieć. Trzymanie obu to przepalanie budżetu." },
    { 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 aplikacja będzie wyglądać jak moja marka?", a: "Tak. Zarówno aplikacje, jak i panele 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;