{{include "header.html"}}
{{include "nav.html"}}

<section class="min-h-[60vh] flex items-center justify-center bg-stone-50">
  <div class="text-center max-w-md mx-auto px-4">
    <div class="font-serif text-8xl text-accent mb-4">404</div>
    <h1 class="font-serif text-2xl text-ink mb-3">Page not found</h1>
    <p class="text-stone-600 mb-8">The page you are looking for may have moved, or the link is no longer valid.</p>
    <div class="flex gap-3 justify-center">
      <a href="/" class="px-6 py-2.5 bg-primary text-white hover:bg-ink transition rounded-sm">Back to home</a>
      <a href="/inquiry" class="px-6 py-2.5 border border-stone-300 text-stone-700 hover:bg-accent hover:text-white hover:border-accent transition rounded-sm">Send an inquiry</a>
    </div>
  </div>
</section>

{{include "footer.html"}}
{{include "js.html"}}