---
import Layout from '../layouts/Layout.astro';
import { t, T } from '../lib/translations';

const translations = Astro.locals.translations ?? {};
---

<Layout title={t(translations, T.page_404_title)}>
  <main class="mx-auto max-w-3xl px-4 py-12 text-center">
    <h1 class="text-3xl font-bold text-zinc-900">404</h1>
    <p class="mt-2 text-zinc-600">{t(translations, T.page_404_text)}</p>
    <a href="/" class="mt-6 inline-block rounded bg-zinc-900 px-4 py-2 text-white hover:bg-zinc-800">
      {t(translations, T.page_404_back)}
    </a>
  </main>
</Layout>
