function NavBar() {
  const here = (typeof location !== 'undefined' ? location.pathname : '') || '';
  const is = (prefix) => here === prefix || here.startsWith(prefix) ? ' is-current' : '';
  const isHome = (here === '/' || here === '/index.html') ? ' is-current' : '';
  return (
    <header className="nav nav-glass" role="banner">
      <div className="nav-pill">
        <a href="/" className="nav-logo" aria-label="COHESION home">
          <img src="/assets/logo-wordmark.svg" alt="COHESION" height="20" />
        </a>
        <nav className="nav-links" aria-label="Primary">
          <a href="/"             className={'nav-link' + isHome}>Home</a>
          <a href="/enterprise/"  className={'nav-link' + is('/enterprise')}>Enterprise</a>
          <a href="/api/"         className={'nav-link' + is('/api')}>API</a>
          <a href="/research/"    className={'nav-link' + is('/research')}>Research</a>
          <a href="/demo/"        className={'nav-link' + is('/demo')}>Demo</a>
        </nav>
        <div className="nav-cta">
          <a href="/research/" className="nav-ghost">Read the spec</a>
          <a href="https://calendly.com/peyton-cohesionauth/30min" className="btn btn-primary btn-sm">Book a call</a>
        </div>
      </div>
    </header>
  );
}
window.NavBar = NavBar;