// Page shell
const { useState: useShellState, useEffect: useShellEffect } = React;

const useScrollReveal = () => {
  useShellEffect(() => {
    const io = new IntersectionObserver((entries) => {
      entries.forEach(e => {
        if (e.isIntersecting) { e.target.classList.add('in'); io.unobserve(e.target); }
      });
    }, { threshold: 0.08, rootMargin: '0px 0px -6% 0px' });
    document.querySelectorAll('.reveal').forEach(el => io.observe(el));
    return () => io.disconnect();
  }, []);
};

function BilgimPage() {
  const [openBrand, setOpenBrand] = useShellState(null);
  useScrollReveal();

  return (
    <div data-screen-label="Bilgim Landing">
      <TopNav />
      <main>
        <Hero />
        <BrandsSection onOpen={setOpenBrand} />
        <Expertise />
        <ServiceAreas />
        <Partners />
        <FAQ />
        <CatalogForm />
        <ContactSection />
      </main>
      <FooterRow />
      <FloatingWA />
      {openBrand && <BrandModal b={openBrand} onClose={() => setOpenBrand(null)} />}
    </div>
  );
}

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<BilgimPage />);