diff --git a/website/index.html b/website/index.html
index 891c357f296..ace59ed8b5e 100644
--- a/website/index.html
+++ b/website/index.html
@@ -25,22 +25,25 @@
     <nav>
         <div class="container">
             <div class="nav-content">
-            <div class="logo">
-                <img src="https://raw.githubusercontent.com/dbort/executorch-logos/main/img/executorch-chip-logo.svg" alt="ExecuTorch Logo" height="40">
-                <span style="color:#e0f2fe;">ExecuTorch</span>
-            </div>
-            <ul class="nav-links" id="navLinks">
-                <li><a href="#why-ondevice">Why On-Device</a></li>
-                <li><a href="#challenges">Challenges</a></li>
-                <li><a href="#features">Solution</a></li>
-                <li><a href="#performance">Backends</a></li>
-                <li><a href="#partners">Partners</a></li>
-                <li><a href="https://github.com/pytorch/executorch" target="_blank">GitHub</a></li>
-            </ul>
-            <form class="nav-search" action="https://docs.pytorch.org/executorch/1.0/search.html" method="get">
-                <input type="text" placeholder="Search docs…" name="q" style="padding: 0.5rem 1rem; border-radius: 6px; border: 1px solid #e2e8f0;">
-            </form>
-            <button class="nav-toggle" onclick="toggleNav()" aria-label="Toggle navigation">☰</button>
+                <div>
+                    <button class="nav-toggle" onclick="toggleNav()" aria-label="Toggle navigation"> &#9776;</button>
+                </div>
+                <div class="nav-logo">
+                    <img src="https://raw.githubusercontent.com/dbort/executorch-logos/main/img/executorch-chip-logo.svg" alt="ExecuTorch Logo" height="40">
+                    <span style="color:#e0f2fe;">ExecuTorch</span>
+                </div>
+                <ul class="nav-links" id="navLinks">
+                    <li class="nav-overview"><a href="#overview">Overview</a></li>
+                    <li><a href="#why-ondevice">Why On-Device</a></li>
+                    <li><a href="#challenges">Challenges</a></li>
+                    <li><a href="#features">Solution</a></li>
+                    <li><a href="#performance">Backends</a></li>
+                    <li><a href="#partners">Partners</a></li>
+                    <li><a href="https://github.com/pytorch/executorch" target="_blank">GitHub</a></li>
+                </ul>
+                <form class="nav-search" action="https://docs.pytorch.org/executorch/1.0/search.html" method="get">
+                    <input type="text" placeholder="Search docs…" name="q" style="padding: 0.5rem 1rem; border-radius: 6px; border: 1px solid #e2e8f0;">
+                </form>
             </div>
         </div>
     </nav>
@@ -54,7 +57,7 @@
             </div>
         </div>
     </section>
-    <section class="hero">
+    <section class="hero" id="overview">
         <div class="container">
             <p class="hero-subtitle">Deploy PyTorch models directly to edge devices. Text, vision, and audio AI with privacy-preserving, real-time inference — no cloud required.</p>
             <div class="stats">
@@ -661,7 +664,7 @@ <h2 class="section-title" style="font-size: 2.5rem; margin-bottom: 0.5rem;">High
             <p class="section-subtitle" style="margin-bottom: 2rem;">Run complex multimodal LLMs with simplified C++ interfaces</p>
 
             <div style="background: #1e293b; border-radius: 12px; padding: 1.5rem; margin-top: 1.5rem;">
-                <div style="display: grid; grid-template-columns: 1fr; gap: 1.5rem;">
+                <div style="display: flex; flex-direction: column; gap: 1.5rem;">
                     <div>
                         <h3 style="color: #06d6a0; font-size: 1.2rem; margin-bottom: 1rem; font-weight: 600;">
                             Multimodal Runner - Text + Vision + Audio in One API
diff --git a/website/style.css b/website/style.css
index 9c60bd3734e..5e1e1e53baa 100644
--- a/website/style.css
+++ b/website/style.css
@@ -92,12 +92,12 @@ nav {
     display: flex;
     justify-content: space-between;
     align-items: center;
-    padding: 1rem 0;
+    padding: 0.75rem 0;
     position: relative;
     z-index: 1;
 }
 
-.logo {
+.nav-logo {
     display: flex;
     align-items: center;
     gap: 0.75rem;
@@ -106,11 +106,15 @@ nav {
     color: var(--text-dark);
 }
 
-.logo img {
+.nav-logo img {
     height: 40px;
     filter: drop-shadow(0 0 2px var(--bg-gray));
 }
 
+.nav-logo span {
+    padding-right: 1rem;
+}
+
 .nav-links {
     display: flex;
     gap: 2rem;
@@ -132,6 +136,10 @@ nav {
     border-bottom: 2px solid var(--primary);
 }
 
+.nav-overview {
+    display: none;
+}
+
 /* nav search */
 .nav-search {
     margin-left: 2rem;
@@ -181,7 +189,7 @@ section.alt {
 
 .title_banner-container {
     position: absolute;
-    left:150px;
+    left: 150px;
     bottom: 60px;
     display: flex;
     gap: 12px;
@@ -199,7 +207,7 @@ section.alt {
     font-weight: 800;
     display: flex;
     align-items: center;
-    gap: 12px;
+    gap: 8px;
 }
 
 /* Hero */
@@ -1014,36 +1022,61 @@ footer a {
 }
 
 /* Responsive */
-@media (max-width: 900px) {
+@media (max-width: 1024px) {
     .container {
         padding: 0 1rem;
     }
-    .nav-search {
-        display: none;
-    }
+
     .grid-2x2 {
         grid-template-columns: 1fr;
     }
-    .title_banner {
-        height: 300px;
-    }
-    .title_banner-container {
-        left: 32%;
-        transform: translateX(-50%);
-        padding: 1rem;
+    .nav-toggle {
+        display: block;
+        margin-left: auto;
+        flex-shrink: 0;
     }
-    .logo-text-container {
-        font-size: 3rem;
+    .nav-links {
+        display: none;
     }
-    .title_banner-logo {
+    .nav-links {
         display: none;
+        flex-direction: column;
+        background: rgba(48,48,48,0.98);
+        position: fixed;
+        top: 62px;
+        left: 0;
+        width: 100%;
+        box-shadow: 0 4px 12px rgba(0,0,0,0.5);
+        padding: 0;
+        gap: 0;
+        z-index: 9999;
+        max-height: calc(100vh - 62px);
+        overflow-y: auto;
+    }
+    .nav-links li {
+        width: 100%;
+        border-bottom: 1px solid rgba(255,255,255,0.1);
+    }
+    .nav-links li a {
+        padding: 1rem 1.5rem;
+        min-height: 48px;
+        display: flex;
+        align-items: center;
+        width: 100%;
+        border-bottom: none;
+    }
+    .nav-links li:last-child {
+        border-bottom: none;
+    }
+    .nav-links.open {
+        display: flex;
+    }
+    .nav-logo {
+        gap: 0.5rem;
     }
 }
 
 @media (max-width: 768px) {
-    .container {
-        padding: 0 1rem;
-    }
     section {
         padding: 3rem 0;
     }
@@ -1104,25 +1137,6 @@ footer a {
     .flow-arrow {
         transform: rotate(90deg);
     }
-    .nav-links {
-        display: none;
-    }
-    .nav-search {
-        display: none;
-    }
-    .title_banner {
-        height: 250px;
-    }
-    .title_banner-container {
-        left: 32%;
-        transform: translateX(-50%);
-    }
-    .logo-text-container {
-        font-size: 2.5rem;
-    }
-    .title_banner-logo {
-        display: none;
-    }
     .card-text {
         font-size: 1rem;
     }
@@ -1139,6 +1153,13 @@ footer a {
     code {
         font-size: 0.8rem !important;
     }
+    .logo-text-container {
+        font-size: 3rem;
+        position: absolute;
+        left: -100%;
+        bottom: 50%;
+        gap: 6px;
+    }
 }
 
 @media (max-width: 700px) {
@@ -1150,22 +1171,9 @@ footer a {
     }
     .nav-content {
         flex-wrap: nowrap;
-        gap: 0.5rem;
-        padding: 0.75rem 0;
+        padding: 0.25rem 0;
         overflow: visible;
     }
-    .logo {
-        font-size: 1.2rem;
-        gap: 0.5rem;
-        flex-shrink: 1;
-        min-width: 0;
-    }
-    .logo span {
-        display: none;
-    }
-    .logo img {
-        height: 32px;
-    }
     .nav-links {
         display: none;
         flex-direction: column;
@@ -1199,20 +1207,38 @@ footer a {
     .nav-links.open {
         display: flex;
     }
-    .nav-toggle {
-        display: block;
-        margin-left: auto;
-        flex-shrink: 0;
+    .nav-logo {
+        font-size: 1.2rem;
+        gap: 0.25rem;
+        flex-shrink: 1;
     }
-    .nav-search {
-        display: none;
+    .nav-logo img {
+        height: 32px;
     }
     .logo-text-container {
-        font-size: 2rem;
-        gap: 8px;
+        position: absolute;
+        left: -150%;
+        bottom: 60%;
+        font-size: 2.75rem;
+        gap: 4px;
+    }
+}
+
+@media (max-width: 650px) {
+    .title_banner {
+        height: 300px;
     }
     .title_banner-logo {
-        height: 40px;
+        height: 68px;
+    }
+    .logo-text-container {
+        display: flex;
+        align-items: center;
+        position: absolute;
+        left: -175%;
+        bottom: 25%;
+        font-size: 2.5rem;
+        font-weight: 800;
     }
 }
 
@@ -1232,14 +1258,21 @@ footer a {
         font-size: 1.2rem;
         padding: 1rem;
     }
-    .title_banner {
-        height: 200px;
+    .nav-overview {
+        display: block;
     }
-    .logo-text-container {
-        font-size: 1.5rem;
+    .nav-logo {
+        gap: 0rem;
+    }
+    /* Banner and logo sizing */
+    .title_banner {
+        height: 275px;
     }
     .title_banner-logo {
-        display: none;
+        height: 64px;
+    }
+    .logo-text-container {
+        font-size: 2.25rem;
     }
     .btn {
         padding: 0.75rem 1.5rem;
@@ -1275,3 +1308,9 @@ footer a {
         padding: 0 0.5rem;
     }
 }
+
+@media (max-width: 400px) {
+    .nav-logo span {
+        display: none;
+    }
+}