diff --git a/site/layouts/index.html b/site/layouts/index.html
index 4fb044f..05e754d 100644
--- a/site/layouts/index.html
+++ b/site/layouts/index.html
@@ -1,3 +1,5 @@
 {{ define "content" }}
-  {{ .Content }}
+  <main data-landing>
+    {{ .Content }}
+  </main>
 {{ end }}
diff --git a/src/layers/12-landing.css b/src/layers/12-landing.css
index 0dfb170..39569a1 100644
--- a/src/layers/12-landing.css
+++ b/src/layers/12-landing.css
@@ -5,6 +5,28 @@
  * Part of: Agentic Semantic Web
  */
 
+/* ── Landing page container ───────────────────────────────────────────── */
+
+[data-landing] {
+  max-width: var(--width-xl);
+  margin-inline: auto;
+  padding-inline: var(--container-padding);
+}
+
+[data-landing] > h2 {
+  text-align: center;
+  margin-top: var(--space-8);
+  margin-bottom: var(--space-5);
+}
+
+[data-landing] > p {
+  text-align: center;
+  color: var(--text-2);
+  max-width: 50ch;
+  margin-inline: auto;
+  margin-bottom: var(--space-5);
+}
+
 /* ── [data-section] — horizontal-rule sections ──────────────────────────
    Usage: <section data-section> or <section data-section="demo">
 ─────────────────────────────────────────────────────────────────────── */