diff --git a/src/layouts/AppLayout.astro b/src/layouts/AppLayout.astro
index a019b9a..5722cbd 100644
--- a/src/layouts/AppLayout.astro
+++ b/src/layouts/AppLayout.astro
@@ -28,6 +28,8 @@ const year = new Date().getFullYear();
       <div class="nav-inner">
         <a href="/" class="wordmark-link" aria-label="Project Bifrost — home">
           <img src="/logo.svg" alt="Fenja AI" class="wordmark" />
+          <span class="wordmark-sep" aria-hidden="true">·</span>
+          <span class="wordmark-project">Project <em class="wordmark-bifrost">Bifrost</em></span>
         </a>
 
         <nav class="nav-right" aria-label="Main navigation">
@@ -110,16 +112,47 @@ const year = new Date().getFullYear();
     flex-shrink: 0;
     display: flex;
     align-items: center;
+    gap: var(--space-3);
     border-bottom: none;
+    color: var(--on-surface);
   }
   .wordmark-link:hover {
     border-bottom: none;
+    color: var(--on-surface);
   }
   .wordmark {
     height: 22px;
     width: auto;
     display: block;
   }
+  .wordmark-sep {
+    color: var(--on-surface-muted);
+    font-size: 1rem;
+    line-height: 1;
+  }
+  .wordmark-project {
+    font-family: var(--font-sans);
+    font-size: var(--text-body-md);
+    font-weight: 500;
+    color: var(--on-surface);
+    letter-spacing: 0;
+  }
+  .wordmark-bifrost {
+    font-family: var(--font-serif);
+    font-style: italic;
+    font-weight: 400;
+    background-image: linear-gradient(
+      90deg,
+      var(--pigment-terracotta) 0%,
+      var(--pigment-ochre)      28%,
+      var(--pigment-copper)     54%,
+      var(--pigment-indigo)     78%,
+      var(--pigment-heather)    100%
+    );
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+  }
 
   /* ── Nav links ──────────────────────────────────────────────────── */
   .nav-right {
diff --git a/src/styles/global.css b/src/styles/global.css
index 1dedfda..806c145 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -232,6 +232,31 @@ a:hover {
 .ghost-border        { border: var(--ghost-border); }
 .ghost-border-bottom { border-bottom: var(--ghost-border); }
 
+/* --- Section link — prominent italic serif, placed at the bottom of
+       its respective box or article. See points 8 + 10 in the v3 spec:
+       italics are reserved for links + the Bifrost wordmark. --- */
+.section-link {
+  display: inline-block;
+  font-family: var(--font-serif);
+  font-style: italic;
+  font-size: var(--text-body-md);
+  color: var(--pigment-terracotta);
+  text-decoration: none;
+  border-bottom: none;
+  transition: opacity var(--duration-fast) var(--ease-standard);
+}
+.section-link:hover {
+  border-bottom: none;
+  opacity: 0.78;
+  color: var(--pigment-terracotta);
+}
+.section-link--ink {
+  color: var(--ink-text);
+}
+.section-link--ink:hover {
+  color: var(--ink-text);
+}
+
 /* --- Focus ring --- */
 :focus-visible {
   outline: 2px solid var(--secondary);
diff --git a/src/styles/tokens.css b/src/styles/tokens.css
index b5f92b7..d030074 100644
--- a/src/styles/tokens.css
+++ b/src/styles/tokens.css
@@ -129,6 +129,6 @@
   --duration-slow: 420ms;
 
   /* --- Layout --- */
-  --content-max: 72rem;   /* 1152px */
+  --content-max: 83rem;   /* 1328px — 15% wider than the original 72rem */
   --reading-max: 42rem;   /*  672px */
 }