/* global React, ReactDOM,
   Nav, Hero, Services, Trust, WhyUs, About, Contact, Footer,
   Marquee, FloatingCTA, ICONS, useScrollY */

const PHONE = "+34 634 70 76 55";

function App() {
  const y = useScrollY();
  const vh = typeof window !== "undefined" ? window.innerHeight : 800;
  const docH =
    typeof document !== "undefined"
      ? Math.max(document.body.scrollHeight, document.documentElement.scrollHeight)
      : 4000;
  const nearBottom = y + vh > docH - vh * 1.4;
  const showCTA = y > vh * 0.6 && !nearBottom;

  return (
    <>
      <Nav />
      <main id="contenido-principal">
        <Hero />
        <Marquee
          items={["Solar", "Recarga VE", "Redes", "Mantenimiento", "Eficiencia", "Instalaciones", "48h"]}
          speed={36}
        />
        <Services />
        <Trust />
        <WhyUs />
        <About />
        <Marquee
          items={["15 Años", "Dos Fundadores", "Una Promesa", "España", "Certificados", "Línea directa"]}
          speed={48}
          accent
        />
        <Contact />
      </main>
      <Footer />
      <FloatingCTA show={showCTA} phone={PHONE} ICONS={ICONS} />
    </>
  );
}

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