function AppV2() {
  React.useEffect(() => {
    const els = document.querySelectorAll(".reveal");
    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 -40px 0px" });
    els.forEach(el => io.observe(el));
    return () => io.disconnect();
  }, []);

  return (
    <>
      <CursorTrail/>
      <Nav/>
      <main className="main">
        <Hero/>
        <Tape/>
        <Brief/>
        <Exhibits/>
        <Process/>
        {/* <Testimony/> */}
        <Closing/>
      </main>
    </>
  );
}
ReactDOM.createRoot(document.getElementById("root")).render(<AppV2/>);