// ESCALA — App root
const { useEffect: useEffectApp } = React;

function App() {
  useEffectApp(() => {
    const io = new IntersectionObserver((entries) => {
      entries.forEach(e => {
        if (e.isIntersecting) {
          e.target.classList.add("in");
          io.unobserve(e.target);
        }
      });
    }, { threshold: 0.12, rootMargin: "0px 0px -60px 0px" });
    document.querySelectorAll(".fade-in").forEach(el => io.observe(el));
    return () => io.disconnect();
  }, []);

  return (
    <>
      <Hero/>
      <Ticker/>
      <Problema/>
      <ErrorSection/>
      <NuevaCreencia/>
      <Solucion/>
      <Mecanismo/>
      <QueIncluye/>
      <ParaQuien/>
      <Proceso/>
      <Comparacion/>
      <Testimonios/>
      <Objeciones/>
      <FAQ/>
      <CTA/>
    </>
  );
}

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