// CoreBridge Advisory — single-page app

function App() {
  useRevealOnScroll();

  // Smooth scroll handler — supports both "#xxx" and "index.html#xxx" when already on the home page
  React.useEffect(() => {
    const onIndex = /(^|\/)index\.html$/i.test(location.pathname) || location.pathname === "/" || location.pathname === "";
    const onClick = (e) => {
      const a = e.target.closest("a[href]");
      if (!a) return;
      const raw = a.getAttribute("href") || "";
      let hash = null;
      if (raw.startsWith("#")) hash = raw;
      else if (onIndex && /^index\.html#/i.test(raw)) hash = raw.replace(/^index\.html/i, "");
      if (!hash || hash.length < 2) return;
      const el = document.querySelector(hash);
      if (!el) return;
      e.preventDefault();
      const top = el.getBoundingClientRect().top + window.scrollY - 88;
      window.scrollTo({ top, behavior: window.matchMedia("(prefers-reduced-motion: reduce)").matches ? "auto" : "smooth" });
      history.replaceState(null, "", hash);
    };
    document.addEventListener("click", onClick);
    return () => document.removeEventListener("click", onClick);
  }, []);

  // Header dark mode tracking — dark over hero, light over body
  const [headerDark, setHeaderDark] = React.useState(true);
  React.useEffect(() => {
    const hero = document.querySelector(".hero");
    if (!hero) return;
    const io = new IntersectionObserver(([entry]) => {
      setHeaderDark(entry.isIntersecting && entry.intersectionRatio > 0.05);
    }, { threshold: [0, 0.05, 0.5] });
    io.observe(hero);
    return () => io.disconnect();
  }, []);

  return (
    <React.Fragment>
      <Header dark={headerDark} />
      <main>
        <HeroHome />
        <AboutBlock />
        <PracticesBlock />
        <ImpactBlock />
        <TrustedBlock />
        <TeamBlock />
        <LeadershipEvolutionBlock />
        <PhilosophyBlock />
        <PerspectivesBlock />
        <ContactBlock />
      </main>
      <Footer />
    </React.Fragment>
  );
}

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