/* AORYN main app — root */

const { useEffect: useEf } = React;

function App() {
  // Setup reveal observer
  useEf(() => {
    const els = document.querySelectorAll('.reveal:not(.in)');
    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 -8% 0px' });
    els.forEach(el => io.observe(el));

    // Smooth scroll for anchor links
    document.querySelectorAll('a[href^="#"]').forEach(a => {
      a.addEventListener('click', (e) => {
        const id = a.getAttribute('href').slice(1);
        const t = document.getElementById(id);
        if (t) {
          e.preventDefault();
          t.scrollIntoView({ behavior: 'smooth', block: 'start' });
        }
      });
    });

    return () => io.disconnect();
  }, []);

  return (
    <>
      <CursorDot />
      <ScrollProgress />
      <Navbar />
      <main>
        <Hero />
        <Marquee />
        <Showcase />
        <Services />
        <Process />
        <Works />
        <Philosophy />
        <Tools />
        <Calculator />
        <Contact />
      </main>
      <Footer />
    </>
  );
}

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