404.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>404 - Not Found</title>
    <link href="./src/output.css" rel="stylesheet">
</head>
<body class="frappe bg-mantle min-h-screen flex items-center justify-center">
    <div class="max-w-md bg-base rounded-lg shadow-md p-8 space-y-4 text-center">
        <h1 class="text-2xl md:text-4xl lg:text-6xl font-extrabold text-flamingo">404 - Not Found</h1>
        <p class="text-text">
            <strong>Oops! It seems like the page you're looking for doesn't exist.</strong>
        </p>

        <p class="text-text">
            You can always go back to the <a href="/" class="text-rosewater hover:underline">home page</a>.
        </p>
    </div>
</body>
</html>