import Image from "next/image";
import notfound404 from "../../../../public/assets/Images/Image/notfound404.png"
import dynamic from "next/dynamic";

export default function NotFoundPage() {
	return (
		<div className="flex flex-col items-center justify-center min-h-[80vh] md:min-h-screen bg-[#F6F9FC] text-center px-4">
			<div className="relative flex flex-col items-center">
				<div className="mb-4">
					<Image src={notfound404} alt="Sad Pug" />
				</div>
				<p className="text-[--secundary] text-2xl font-bold mb-4">404-ERROR</p>
				<p className="text-4xl md:text-5xl font-bold text-[--primary] mt-2">
					Oops, Página não encontrada!
				</p>
				<p className="text-[--text-color] mt-4 max-w-xl">
					A página que você está procurando não existe ou ocorreu outro erro, 
					<span className="font-bold"> atualize a página</span> ou tente <a href="/" className="text-[--text-color] font-bold">retornar para a página inicial</a>.
				</p>
			</div>
		</div>
	)
}