More visual updates

src/pages/index.astro

@@ -4,6 +4,7 @@ import Layout from "../layouts/Layout.astro";
 
 <Layout title="Welcome">
 	<div class="flex flex-col gap-8 max-w-5xl mx-auto p-6">
+		<img src="/hero.jpeg" alt="" height="250" width="250" class="rounded-full mx-auto">
 		<!-- Header -->
 		<div class="text-center space-y-4">
 			<div class="text-5xl font-normal" style="font-family: 'Great Vibes', cursive;">❤️ Natasha + Ixabat ❤️</div>
@@ -55,9 +56,17 @@ import Layout from "../layouts/Layout.astro";
 		<!-- RSVP Section -->
 		<div class="text-center space-y-4">
 			<p class="text-lg">Please RSVP whether you're able to come or not by <span class="font-semibold">April 1</span></p>
-			<a href="/rsvp" class="btn btn-primary btn-lg">
-				RSVP Now
-			</a>
+			<div class="flex flex-col sm:flex-row gap-4 justify-center">
+				<a href="/rsvp" class="btn btn-primary btn-lg">
+					RSVP Now
+				</a>
+				<a href="/registry" class="btn btn-secondary btn-lg">
+					Wedding Registry
+				</a>
+				<a href="/faq" class="btn btn-accent btn-lg">
+					FAQ
+				</a>
+			</div>
 		</div>
 	</div>
 </Layout>

src/pages/registry/index.astro

@@ -10,7 +10,12 @@ import SignOut from "../../components/SignOut.tsx";
 			View and Claim Items from the Registry:
 		</div>
 
-		<RegistryList client:load />
+		<div id="registry-container">
+			<RegistryList client:load />
+			<div id="empty-registry-message" class="text-center p-8 hidden">
+				<p class="text-xl">Nothing here yet! Please check back in a week!</p>
+			</div>
+		</div>
 
 		<div class="flex flex-row gap-2 justify-center items-center">
 			<a class="btn btn-primary" href="/">Back to Home</a>
@@ -36,4 +41,9 @@ import SignOut from "../../components/SignOut.tsx";
 			.getElementById("registry-container")
 			?.classList.remove("hidden");
 	});
+
+	// Check for empty registry
+	document.addEventListener("registry-empty", () => {
+		document.getElementById("empty-registry-message")?.classList.remove("hidden");
+	});
 </script>