// Navbar
const { useState: useNavState, useEffect: useNavEffect } = React;

function Navbar() {
  const [scrolled, setScrolled] = useNavState(false);
  const [open, setOpen] = useNavState(false);
  useNavEffect(() => {
    const onScroll = () => setScrolled(window.scrollY > 20);
    window.addEventListener("scroll", onScroll);
    return () => window.removeEventListener("scroll", onScroll);
  }, []);
  const onFoundersPage = typeof window !== "undefined" && /\/founders(\.html)?$/.test(window.location.pathname);
  const home = onFoundersPage ? "/" : "";
  const links = [
    { label: "Work",         href: `${home}#work` },
    { label: "Who We Serve", href: `${home}#who` },
    { label: "Services",     href: `${home}#services` },
    { label: "Process",      href: `${home}#process` },
    { label: "Founders",     href: "/founders" },
  ];
  return (
    <nav className={`ll-nav ${scrolled ? "ll-nav--scrolled" : ""}`}>
      <div className="ll-nav__inner">
        <a href="/" className="ll-nav__brand">
          <img src="assets/learnlytx-logo.svg?v=2" alt="LearnLytx" className="ll-nav__logo" />
          <span className="ll-nav__name">LearnLytx</span>
        </a>
        <div className="ll-nav__links">
          {links.map(l => <a key={l.href} href={l.href} className="ll-nav__link">{l.label}</a>)}
        </div>
        <div className="ll-nav__cta">
          <a href="https://jira-b2c0c.web.app/book/1-1-6c9edd37" target="_blank" rel="noopener noreferrer" className="ll-btn ll-btn--hero ll-btn--lg">Book a Call</a>
        </div>
        <button className="ll-nav__burger" onClick={() => setOpen(!open)} aria-label="Menu">
          <span /><span /><span />
        </button>
      </div>
      {open && (
        <div className="ll-nav__mobile">
          {links.map(l => <a key={l.href} href={l.href} onClick={() => setOpen(false)}>{l.label}</a>)}
          <a href="https://jira-b2c0c.web.app/book/1-1-6c9edd37" target="_blank" rel="noopener noreferrer" className="ll-btn ll-btn--hero" onClick={() => setOpen(false)}>Book a Call</a>
        </div>
      )}
    </nav>
  );
}
window.Navbar = Navbar;
