diff --git a/public/dandelion-hero.png b/public/dandelion-hero.png
new file mode 100644
index 0000000..88b9c64
Binary files /dev/null and b/public/dandelion-hero.png differ
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 029d6ea..2fcb4b8 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -122,14 +122,15 @@ function Navigation() {
 // Hero Section
 function Hero() {
   return (
-    <section className="relative min-h-screen flex items-center justify-center bg-nusqool-sage/20">
-      {/* Background Pattern */}
-      <div className="absolute inset-0 opacity-10">
-        <div className="absolute inset-0 bg-gradient-to-br from-nusqool-sage/30 to-transparent" />
-      </div>
+    <section className="relative min-h-screen flex items-center justify-center">
+      {/* Background Image */}
+      <div
+        className="absolute inset-0 bg-cover bg-center bg-no-repeat"
+        style={{ backgroundImage: "url('/dandelion-hero.png')" }}
+      />
 
-      {/* Hero Image Placeholder */}
-      <div className="absolute inset-0 bg-gradient-to-b from-nusqool-cream/80 via-transparent to-nusqool-cream/90" />
+      {/* Overlay for text readability */}
+      <div className="absolute inset-0 bg-gradient-to-b from-nusqool-cream/70 via-nusqool-cream/40 to-nusqool-cream/80" />
 
       <div className="relative z-10 text-center max-w-4xl mx-auto px-6 pt-20">
         <h1 className="heading-xl text-nusqool-brown mb-6">
@@ -138,7 +139,7 @@ function Hero() {
         <p className="body-text max-w-2xl mx-auto mb-10">
           A sanctuary for healing, growth, and reconnection in the heart of rural Ontario.
         </p>
-        <a href="#adventure" className="btn-primary">
+        <a href="https://dandelion.nusqool.com" className="btn-primary">
           Join the Next Embodiment Circle
         </a>
       </div>