/* Panterra Health — website app shell + router */

function App() {
  const [page, setPage] = React.useState(() => (window.location.hash || '#home').slice(1));
  const [scrolled, setScrolled] = React.useState(false);

  React.useEffect(() => {
    const onScroll = () => setScrolled(window.scrollY > 8);
    onScroll();
    window.addEventListener('scroll', onScroll, { passive: true });
    return () => window.removeEventListener('scroll', onScroll);
  }, []);

  const navigate = (id) => { setPage(id); window.location.hash = id; };

  const view = () => {
    switch (page) {
      case 'about':   return <AboutPage />;
      case 'products': return <ProductsPage onNavigate={navigate} />;
      case 'kalos':   return <KalosPage />;
      case 'hygeia':  return <HygeiaPage />;
      case 'mission': return <MissionPage />;
      case 'contact': return <ContactPage />;
      default:        return <HomePage onNavigate={navigate} />;
    }
  };

  return (
    <>
      <NavBar current={page} onNavigate={navigate} scrolled={scrolled} />
      <main>{view()}</main>
      <Footer onNavigate={navigate} />
    </>
  );
}

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