// App.jsx
function App() {
  const [lang, setLang] = React.useState("ru");
  const [toast, setToast] = React.useState(null);
  const t = window.translations[lang];

  const showToast = (msg) => {
    setToast(msg);
    setTimeout(() => setToast(null), 4000);
  };

  // fade-up observer
  React.useEffect(() => {
    const els = document.querySelectorAll(".fade-up");
    const io = new IntersectionObserver((entries) => {
      entries.forEach(e => {
        if (e.isIntersecting) {
          e.target.classList.add("in");
          io.unobserve(e.target);
        }
      });
    }, { threshold: 0.12 });
    els.forEach(el => io.observe(el));
    return () => io.disconnect();
  });

  return (
    <window.I18nContext.Provider value={{ lang, t, setLang }}>
      <window.Nav />
      <window.Hero />
      <window.WhySection />
      <window.AboutFormat />
      <window.RouteMap />
      <window.BusinessProgram />
      <window.Stats />
      <window.Participants />
      <window.Pricing />
      <window.FAQ />
      <window.ApplicationForm onToast={showToast} />
      <window.Footer />

      <div className={`toast ${toast ? "show" : ""}`}>{toast}</div>
    </window.I18nContext.Provider>
  );
}

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