diff --git a/app/layout.tsx b/app/layout.tsx
index b2e7b5c..c0d838a 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -18,7 +18,11 @@ export const metadata: Metadata = {
     "A reboot of the Commons Stack, merging technology with mycelial principles for regenerative systems. Growing from beneath the surface.",
   metadataBase: new URL("https://mycostack.xyz"),
   icons: {
-    icon: "data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🍄</text></svg>",
+    icon: [
+      { url: "/favicon.ico", sizes: "any" },
+      { url: "/favicon-32x32.png", sizes: "32x32", type: "image/png" },
+    ],
+    apple: "/apple-touch-icon.png",
   },
   openGraph: {
     title: "MycoStack — Technology-Augmented Commons",
diff --git a/components/hero-section.tsx b/components/hero-section.tsx
index bf1db31..b57fbf6 100644
--- a/components/hero-section.tsx
+++ b/components/hero-section.tsx
@@ -3,6 +3,7 @@
 import { useSectionReveal } from "@/hooks/use-section-reveal"
 import { ChevronDown } from "lucide-react"
 import { useState, useEffect } from "react"
+import Image from "next/image"
 
 const TITLE = "MycoStack"
 
@@ -70,6 +71,18 @@ export function HeroSection() {
       className="relative min-h-[110vh] flex flex-col items-center justify-center px-6 noise-overlay"
     >
       <div className="section-reveal max-w-4xl mx-auto text-center space-y-8">
+        {/* Logo */}
+        <div className="emerge-letter flex justify-center" style={{ animationDelay: "0.1s" }}>
+          <Image
+            src="/mycostack-logo.png"
+            alt="MycoStack logo"
+            width={418}
+            height={649}
+            className="w-32 sm:w-40 md:w-48 lg:w-56 h-auto drop-shadow-[0_0_30px_rgba(45,140,100,0.3)]"
+            priority
+          />
+        </div>
+
         {/* Title with staggered emergence */}
         <h1 className="font-serif text-6xl sm:text-7xl md:text-8xl lg:text-9xl font-bold tracking-tight">
           {TITLE.split("").map((letter, i) => (
diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png
new file mode 100644
index 0000000..499492e
Binary files /dev/null and b/public/apple-touch-icon.png differ
diff --git a/public/favicon-16x16.png b/public/favicon-16x16.png
new file mode 100644
index 0000000..410b8fe
Binary files /dev/null and b/public/favicon-16x16.png differ
diff --git a/public/favicon-32x32.png b/public/favicon-32x32.png
new file mode 100644
index 0000000..3581cb6
Binary files /dev/null and b/public/favicon-32x32.png differ
diff --git a/public/favicon.ico b/public/favicon.ico
new file mode 100644
index 0000000..4012786
Binary files /dev/null and b/public/favicon.ico differ
diff --git a/public/icon-192x192.png b/public/icon-192x192.png
new file mode 100644
index 0000000..2bf7a61
Binary files /dev/null and b/public/icon-192x192.png differ
diff --git a/public/mycostack-logo.png b/public/mycostack-logo.png
new file mode 100644
index 0000000..83d5b6d
Binary files /dev/null and b/public/mycostack-logo.png differ