// site/main.jsx — root app

function App() {
  const [mode, setMode] = React.useState('light');
  const [palette, setPalette] = React.useState('clay');

  React.useEffect(() => {
    const root = document.documentElement;
    root.setAttribute('data-mode', mode);
    root.setAttribute('data-palette', palette);
  }, [mode, palette]);

  return (
    <React.Fragment>
      <Nav mode={mode} setMode={setMode} palette={palette} setPalette={setPalette}/>
      <Hero/>
      <WordmarkBand/>
      <Features/>
      <Calendar/>
      <Download/>
      <FAQ/>
      <CTABands/>
      <Footer/>
    </React.Fragment>
  );
}

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