/* =============================================================
   Simthetica — app assembly
   ============================================================= */
const { useState: useStateA, useRef: useRefA } = React;

function App() {
  const [mode, setMode] = useStateA('pilot');
  const finalRef = useRefA(null);

  // CTA handler used everywhere: set the form mode + scroll to it
  const onJoin = (m) => {
    setMode(m);
    const el = document.getElementById('beta');
    if (el) window.scrollTo({ top: el.offsetTop - 64, behavior: 'smooth' });
  };

  // Safety net: never let a scroll-reveal element stay hidden.
  React.useEffect(() => {
    const revealAll = () => document.querySelectorAll('.reveal:not(.in)').forEach((e) => e.classList.add('in'));
    const t = setTimeout(revealAll, 1600);
    window.addEventListener('scroll', () => {
      document.querySelectorAll('.reveal:not(.in)').forEach((e) => {
        if (e.getBoundingClientRect().top < window.innerHeight * 0.92) e.classList.add('in');
      });
    }, { passive: true });
    return () => clearTimeout(t);
  }, []);

  return (
    <React.Fragment>
      <Nav onJoin={onJoin} />
      <main id="page-main">
        <Hero onJoin={onJoin} />
        <hr className="divider-rule" />
        <PilotValue onJoin={onJoin} />
        <Capture />
        <Demand onJoin={onJoin} />
        <HowItWorks />
        <Scenarios />
        <WhyHuman />
        <FinalCTA mode={mode} setMode={setMode} registerScroll={(r) => (finalRef.current = r)} />
      </main>
      <Footer onJoin={onJoin} />
    </React.Fragment>
  );
}

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