worldcup/app/not-found.tsx

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 glass-card-hero rounded-2xl px-12 py-16 w-full max-w-lg"
      >
        <div className="font-['Bebas_Neue'] text-[120px] text-green leading-none">
          404
        </div>
        <p className="text-green-sec 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-bg bg-green px-8 py-3 rounded-xl hover:bg-green-light transition-colors"
        >
          Back to Home
        </Link>
      </div>
    </div>
  )
}