const { Navbar, Footer } = window.NotHumanDesignSystem_3e0b8e;
const parse = () => (location.hash.replace(/^#\/?/, '') || 'home');
function App() {
  const [route, setRoute] = React.useState(parse);
  React.useEffect(() => { const on = () => { setRoute(parse()); window.scrollTo({ top: 0 }); }; window.addEventListener('hashchange', on); return () => window.removeEventListener('hashchange', on); }, []);
  const scrollTo = (id) => { const el = document.getElementById(id); if (el) window.scrollTo({ top: el.getBoundingClientRect().top + window.scrollY - 72, behavior: 'smooth' }); };
  const go = (r) => {
    if (r === 'book') { location.href = NH_BOOK; return; }
    if (r === 'what-we-do') {
      if (route.split('/')[0] !== 'home') { history.pushState(null, '', '#/'); setRoute('home'); setTimeout(() => scrollTo('what-we-do'), 150); } else scrollTo('what-we-do');
      return;
    }
    const h = r === 'home' ? '#/' : '#/' + r;
    if (location.hash === h) { window.scrollTo({ top: 0, behavior: 'smooth' }); return; }
    location.hash = h;
  };
  const base = route.split('/')[0];
  let page;
  if (base === 'work' && route.includes('/')) page = <CaseStudyPage id={route.split('/')[1]} go={go} />;
  else if (base === 'work') page = <WorkPage go={go} />;
  else if (base === 'about') page = <AboutPage go={go} />;
  else page = <HomePage go={go} />;
  React.useEffect(() => { document.title = base === 'work' ? 'Work — NotHuman' : base === 'about' ? 'About — NotHuman' : 'NotHuman | Digital Characters for Modern Brands'; }, [route]);
  return (
    <>
      <Navbar links={NH_LINKS} active={base === 'home' ? undefined : base} onNavigate={go} brandHref="#/" ctaHref={NH_BOOK} />
      <div key={route}>{page}</div>
      <Footer links={NH_LINKS} social={NH_SOCIAL} onNavigate={go} ctaHref={NH_BOOK} />
    </>
  );
}
ReactDOM.createRoot(document.getElementById('root')).render(<App />);