diff --git a/client/pages/docs/DocsGettingStarted.tsx b/client/pages/docs/DocsGettingStarted.tsx
index 49eeb01a..4ef9eb1a 100644
--- a/client/pages/docs/DocsGettingStarted.tsx
+++ b/client/pages/docs/DocsGettingStarted.tsx
@@ -1,3 +1,4 @@
+import DocsLayout from "@/components/docs/DocsLayout";
 import { Link } from "react-router-dom";
 import {
   Card,
@@ -190,6 +191,11 @@ const explorationLinks = [
 
 export default function DocsGettingStarted() {
   return (
+    <DocsLayout
+      title="Getting Started"
+      description="Launch your first AeThex project in under 30 minutes"
+      breadcrumbs={[{ label: "Getting Started" }]}
+    >
     <div className="space-y-12">
       <section className="space-y-4">
         <Badge className="bg-purple-600/20 text-purple-200 uppercase tracking-wide">
@@ -443,5 +449,6 @@ export default function DocsGettingStarted() {
         </div>
       </section>
     </div>
+    </DocsLayout>
   );
 }
diff --git a/client/pages/docs/DocsPlatform.tsx b/client/pages/docs/DocsPlatform.tsx
index 09053651..6ec78fe3 100644
--- a/client/pages/docs/DocsPlatform.tsx
+++ b/client/pages/docs/DocsPlatform.tsx
@@ -1,3 +1,4 @@
+import DocsLayout from "@/components/docs/DocsLayout";
 import {
   Card,
   CardContent,
@@ -163,6 +164,11 @@ const resourceLinks = [
 
 export default function DocsPlatform() {
   return (
+    <DocsLayout
+      title="Platform"
+      description="Deliver cohesive player and builder journeys on AeThex"
+      breadcrumbs={[{ label: "Platform" }]}
+    >
     <div className="space-y-12">
       <section className="space-y-4">
         <Badge className="bg-cyan-500/20 text-cyan-100 uppercase tracking-wide">
@@ -394,5 +400,6 @@ export default function DocsPlatform() {
         </div>
       </section>
     </div>
+    </DocsLayout>
   );
 }