// Main app: orchestrates sections + nav
function App() {
  const { lang, setLang, t } = useT();
  const [active, setActive] = React.useState('home');
  const [pitchOpen, setPitchOpen] = React.useState(false);

  React.useEffect(() => {
    window.scrollTo({ top: 0, behavior: 'smooth' });
  }, [active]);

  return (
    <>
      <TopBar lang={lang} setLang={setLang} t={t} onPitch={() => setPitchOpen(true)} />
      <main>
        <div data-screen-label={`Section: ${active}`} key={active}>
          {active === 'home' && <HomeSection t={t} lang={lang} setActive={setActive} />}
          {active === 'team' && <TeamSection t={t} lang={lang} />}
          {active === 'demands' && <DemandsSection t={t} lang={lang} />}
          {active === 'events' && <EventsSection t={t} lang={lang} />}
          {active === 'contact' && <ContactSection t={t} lang={lang} />}
        </div>
        <FooterNote t={t} />
      </main>
      <BottomNav active={active} setActive={setActive} t={t} />
      <Pitch open={pitchOpen} onClose={() => setPitchOpen(false)} t={t} lang={lang} />
    </>
  );
}

ReactDOM.createRoot(document.getElementById('app')).render(<App />);