/* 404 — shown when the hash route doesn't match any known route */

function NotFound() {
  const t = window.t;
  return (
    <section className="section nf-page" id="notfound">
      <div className="container nf-wrap">
        <span className="nf-badge">{t('notfound.badge')}</span>
        <h1 className="nf-title">&lt;{t('notfound.badge')} /&gt;</h1>
        <p className="nf-message">{t('notfound.title')}</p>
        <p className="nf-sub">{t('notfound.message')}</p>
        <a href="#/" className="btn btn-primary nf-cta">
          <span>{t('notfound.action')}</span>
          <svg className="btn-arrow" width="14" height="14" viewBox="0 0 14 14" fill="none">
            <path d="M3 11L11 3M11 3H5M11 3V9" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"/>
          </svg>
        </a>
      </div>
    </section>
  );
}

window.NotFound = NotFound;