function Nav({ active, onNavigate }) {
  const links = [
    { id: "about",    label: "私たちについて" },
    { id: "services", label: "事業内容" },
    { id: "strengths",label: "選ばれる理由" },
    { id: "works",    label: "施工実績" },
    { id: "company",  label: "会社概要" },
    { id: "contact",  label: "お問い合わせ" },
  ];
  return (
    <nav className="site-nav">
      <a className="brand" href="#top" onClick={(e) => { e.preventDefault(); onNavigate("top"); }}>
        <div className="brand-mark">志</div>
        <div className="brand-text">
          大志建設
          <small>Taishi&nbsp;Kensetsu</small>
        </div>
      </a>
      <div className="nav-links">
        {links.map(l => (
          <a
            key={l.id}
            href={"#" + l.id}
            className={"nav-link" + (active === l.id ? " is-active" : "")}
            onClick={(e) => { e.preventDefault(); onNavigate(l.id); }}
          >
            {l.label}
          </a>
        ))}
      </div>
      <div className="nav-actions">
        <a href="tel:0925867547" className="nav-tel">
          092-586-7547
          <small>Mon–Sat 8:00–18:00</small>
        </a>
        <button className="btn btn-primary btn-sm" onClick={() => onNavigate("contact")}>
          ご相談・お見積り <IconArrow/>
        </button>
      </div>
    </nav>
  );
}
Object.assign(window, { Nav });