---
import { Icon } from "astro-icon/components";
import Layout from "../layout.astro";
---

<Layout>
	<div class="grow flex items-center justify-center">
		<div class="bg-amber-50 border-2 border-amber-500 rounded-2xl shadow-lg p-8 max-w-xs w-full text-center flex flex-col">
			<h2 class="text-7xl font-black">404</h2>
			<p>Page not found - you swam off the island!</p>
			<a href="/" class="pill button gap-2 mt-8 w-fit self-center">
				<Icon name="ic:round-home" size={24} />
				Travel Back
			</a>
		</div>
	</div>
</Layout>