diff --git a/web/app/components/site-header.tsx b/web/app/components/site-header.tsx
index ad7e6202..bc4da923 100644
--- a/web/app/components/site-header.tsx
+++ b/web/app/components/site-header.tsx
@@ -22,7 +22,7 @@ export function SiteHeader({
 
   return (
     <>
-      <header className="sticky top-0 z-30 w-full bg-background/80 backdrop-blur-sm">
+      <header className="sticky top-0 z-30 w-full bg-background">
         <div className="w-full max-w-6xl mx-auto flex items-center px-6 h-12">
           {/* Left: logo + section */}
           <div className="flex flex-1 items-center gap-3 min-w-0">
diff --git a/web/app/docs/docs-nav.tsx b/web/app/docs/docs-nav.tsx
index 30827c7d..243fac73 100644
--- a/web/app/docs/docs-nav.tsx
+++ b/web/app/docs/docs-nav.tsx
@@ -11,7 +11,7 @@ export function DocsNav({ children }: { children: React.ReactNode }) {
   const { open, toggle, close, drawerRef, buttonRef } = useMobileDrawer();
 
   return (
-    <div className="max-w-6xl mx-auto flex px-4">
+    <div className="max-w-6xl mx-auto flex px-0 md:px-4">
       {/* Mobile menu button */}
       <button
         ref={buttonRef}
@@ -62,8 +62,8 @@ export function DocsNav({ children }: { children: React.ReactNode }) {
       </aside>
 
       {/* Content */}
-      <main className="flex-1 min-w-0">
-        <div className="max-w-3xl px-6 pb-10 ml-0" data-dev="docs-content" style={{ paddingTop: 8 }}>
+      <main className="flex-1 min-w-0 overflow-x-hidden">
+        <div className="max-w-full px-6 pb-10 ml-0" data-dev="docs-content" style={{ paddingTop: 16 }}>
           <div className="docs-content text-[15px]">{children}</div>
           <DocsPager />
         </div>
diff --git a/web/app/globals.css b/web/app/globals.css
index a80da967..a10df622 100644
--- a/web/app/globals.css
+++ b/web/app/globals.css
@@ -159,6 +159,11 @@ body {
   box-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
 }
 
+.docs-content pre {
+  overflow-x: auto;
+  max-width: 100%;
+}
+
 .docs-content pre code {
   background: none;
   padding: 0;
diff --git a/web/app/page.tsx b/web/app/page.tsx
index eb78a272..a15bc106 100644
--- a/web/app/page.tsx
+++ b/web/app/page.tsx
@@ -256,6 +256,14 @@ export default function Home() {
           <DownloadButton location="bottom" />
           <GitHubButton />
         </div>
+        <div className="flex justify-center mt-6">
+          <a
+            href="/docs"
+            className="text-sm text-muted hover:text-foreground transition-colors underline underline-offset-2 decoration-border hover:decoration-foreground"
+          >
+            Read the Docs
+          </a>
+        </div>
 
       </main>