Card

export default function Card() {
  return (
    <div className="flex flex-col gap-4 items-center justify-center py-20">
      <div className="bg-white dark:bg-neutral-900 p-8 rounded-2xl shadow-[0_0_15px_-5px_rgba(0,0,0,0.1)] border border-border max-w-md w-full mx-4 text-center grid gap-4">
        <h2 className="text-4xl font-bold text-secondary-foreground">Oops!</h2>
        <p className="font-medium text-balance tracking-tight">
          Looks like we&apos;ve hit a dead end. The page you&apos;re looking for
          doesn&apos;t exist or may have been moved.
        </p>
        <button
          className="bg-blue-800 w-full hover:bg-blue-800 text-white px-4 py-2 rounded-lg
        transition-all duration-200 
        focus:outline-none focus:ring-2 focus:ring-blue-800 focus:ring-offset-2
        shadow-sm hover:shadow-md active:scale-95 ring-offset-2 ring-offset-white dark:ring-offset-black "
        >
          Go Back
        </button>
      </div>
    </div>
  );
}