Show logo on landing page

app/page.tsx

@@ -1,3 +1,4 @@
+import Image from "next/image";
 import { CreatePlanForm } from "@/components/create-plan-form";
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
 
@@ -5,9 +6,22 @@ export default function Home() {
   return (
     <main className="flex min-h-screen flex-col items-center justify-center p-4 bg-muted/20">
       <div className="w-full max-w-md space-y-4">
-        <div className="text-center space-y-2">
+        <div className="text-center space-y-4">
-          <h1 className="text-3xl font-bold tracking-tighter">Cat Sitting Planner</h1>
+          <div className="flex justify-center">
-          <p className="text-muted-foreground">Coordinate care for your furry friends while you're away.</p>
+            <div className="bg-white p-4 rounded-full shadow-lg border-2 border-primary/20">
+              <Image
+                src="/icon.png"
+                alt="Cat Sitting Planner Logo"
+                width={80}
+                height={80}
+                className="rounded-lg"
+              />
+            </div>
+          </div>
+          <div className="space-y-2">
+            <h1 className="text-3xl font-bold tracking-tighter">Cat Sitting Planner</h1>
+            <p className="text-muted-foreground">Coordinate care for your furry friends while you're away.</p>
+          </div>
         </div>
 
         <Card>