<script lang="ts">
	import { fade } from "svelte/transition";
	import SocialLinks from "$lib/components/SocialLinks.svelte";
</script>

<div class="text-center" in:fade={{ delay: 1500, duration: 1000 }}>
	<div
		class="flex flex-col items-center gap-2 bg-white/50 dark:bg-black/30 backdrop-blur-sm px-8 py-4 rounded-2xl border border-white/50 dark:border-white/10 shadow-sm"
	>
		<p
			class="text-xs uppercase tracking-[0.2em] text-gray-500 dark:text-gray-300 font-bold"
		>
			A project by George Powell & Silent Summit Co.
		</p>
		<!-- <p class="text-xs uppercase tracking-[0.2em] text-gray-500 font-bold">
			For questions, comments, job opportunities, or cash donations,
			please email <a
				class="text-blue-400"
				href="mailto:george+bibdle@silentsummit.co"
				>george@silentsummit.co</a
			>
		</p> -->
		<!-- <p class="text-lg font-triodion font-black text-gray-800 tabular-nums">

		</p> -->

		<!-- Bluesky Social Media Button -->
	</div>

	<div class="mt-8">
		<SocialLinks />
	</div>

</div>
