function Nav({ lang, setLang, onTalk }) {
  return (
    <nav className="nav band band-cream">
      <div className="wrap nav-inner">
        <a className="nav-logo" href="#top">
          <img src="assets/logos/shyft-logo-nobg.png" alt="shyft" />
          <span className="wm">shyft</span>
        </a>
        <div className="nav-links">
          <a href="#what">{t(COPY.nav.what, lang)}</a>
          <a href="#how">{t(COPY.nav.how, lang)}</a>
          <a href="#work">{t(COPY.nav.work, lang)}</a>
          <a href="#pricing">{t(COPY.nav.pricing, lang)}</a>
          <a href="#about">{t(COPY.nav.about, lang)}</a>
          <span className="nav-lang">
            <button className={lang === "de" ? "active" : ""} onClick={() => setLang("de")}>DE</button>
            <span style={{opacity:.3}}>/</span>
            <button className={lang === "en" ? "active" : ""} onClick={() => setLang("en")}>EN</button>
          </span>
          <button className="btn btn-copper" onClick={onTalk}>{t(COPY.nav.talk, lang)}</button>
        </div>
      </div>
    </nav>
  );
}
window.Nav = Nav;
