From 52b8348203e6f7065dd8454b2a03792c4551221b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20Kr=C3=BCger?= <valknar@pivoine.art>
Date: Sun, 14 Jun 2026 19:54:14 +0200
Subject: [PATCH] feat: add 404 page matching app design system

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 app/not-found.tsx | 31 +++++++++++++++++++++++++++++++
 1 file changed, 31 insertions(+)
 create mode 100644 app/not-found.tsx

diff --git a/app/not-found.tsx b/app/not-found.tsx
new file mode 100644
index 0000000..286224c
--- /dev/null
+++ b/app/not-found.tsx
@@ -0,0 +1,31 @@
+import type { Metadata } from 'next'
+import Link from 'next/link'
+
+export const metadata: Metadata = { title: '404 · World Cup' }
+
+export default function NotFound() {
+  return (
+    <div className="max-w-[1200px] mx-auto px-7 py-20 flex flex-col items-center text-center">
+      <div
+        className="pitch-grid rounded-2xl px-12 py-16 w-full max-w-lg"
+        style={{
+          background: 'linear-gradient(145deg,#0a1a0e 0%,#0d2416 100%)',
+          border: '1px solid rgba(34,197,94,0.2)',
+        }}
+      >
+        <div className="font-['Bebas_Neue'] text-[120px] text-[#22c55e] leading-none">
+          404
+        </div>
+        <p className="text-[#6abf7a] text-lg mt-2 mb-8">
+          This page doesn&apos;t exist.
+        </p>
+        <Link
+          href="/"
+          className="inline-block font-['Bebas_Neue'] text-xl tracking-[0.1em] text-[#040d08] bg-[#22c55e] px-8 py-3 rounded-xl hover:bg-[#4ade80] transition-colors"
+        >
+          Back to Home
+        </Link>
+      </div>
+    </div>
+  )
+}