function App() {
  const [reserveSignal, setReserveSignal] = React.useState(0);
  const tweaks = window.__TWEAKS__ || {};

  React.useEffect(() => {
    document.documentElement.setAttribute('data-palette', tweaks.palette || 'terracota');
    document.documentElement.setAttribute('data-title-font', tweaks.titleFont || 'dm-serif');
    document.documentElement.setAttribute('data-grain', String(tweaks.showGrain !== false));
  }, []);

  function goReservar() {
    setReserveSignal(s => s + 1);
    const el = document.getElementById('reservas');
    if (el) window.scrollTo({ top: el.offsetTop - 60, behavior: 'smooth' });
  }

  return (
    <>
      <Nav onReservar={goReservar} />
      <Hero onReservar={goReservar} variant={tweaks.heroVariant} />
      <Sobre />
      <Menu />
      <Eventos />
      <Reservas openSignal={reserveSignal} />
      <Visita />
      <Footer />
      <Tweaks />
    </>
  );
}

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