diff --git a/site/assets/css/main.css b/site/assets/css/main.css
index 45182a9..9564b1e 100644
--- a/site/assets/css/main.css
+++ b/site/assets/css/main.css
@@ -272,3 +272,19 @@ h2 { font-size: clamp(1.4rem, 3vw, 1.9rem); color: var(--green-dark); }
   .collab-grid { grid-template-columns: 1fr; }
   .rtl-note { flex-direction: column; text-align: center; }
 }
+
+/* Anchor targets clear the sticky header */
+main > section[id],
+.doc :is(h2, h3)[id] { scroll-margin-top: 5.5rem; }
+
+/* Discreet, hover-revealed heading permalinks (About + Legal) */
+.heading-anchor {
+  margin-inline-start: .35em;
+  color: var(--green);
+  text-decoration: none;
+  font-weight: 400;
+  opacity: 0;
+  transition: opacity .15s;
+}
+.doc :is(h2, h3):hover .heading-anchor,
+.heading-anchor:focus { opacity: .6; }
diff --git a/site/layouts/_default/_markup/render-heading.html b/site/layouts/_default/_markup/render-heading.html
new file mode 100644
index 0000000..ca6ec1e
--- /dev/null
+++ b/site/layouts/_default/_markup/render-heading.html
@@ -0,0 +1,4 @@
+<h{{ .Level }} id="{{ .Anchor }}">
+  {{ .Text | safeHTML }}
+  <a class="heading-anchor" href="#{{ .Anchor }}" aria-label="Permalink">#</a>
+</h{{ .Level }}>
diff --git a/site/layouts/index.html b/site/layouts/index.html
index 61df7db..74ae580 100644
--- a/site/layouts/index.html
+++ b/site/layouts/index.html
@@ -1,6 +1,6 @@
 {{ define "main" }}
 {{ $lang := .Site.Language.Lang }}
-<section class="hero">
+<section class="hero" id="top">
   <div class="hero-copy">
     <h1>{{ .Params.hero.title }}</h1>
     <p class="tagline">{{ .Params.hero.tagline }}</p>
@@ -19,7 +19,7 @@
   {{ end }}
 </section>
 
-<section class="status">
+<section class="status" id="status">
   <span class="badge-beta">{{ T "statusBadge" }}</span>
   <div>
     <h2>{{ T "statusTitle" }}</h2>
@@ -27,7 +27,7 @@
   </div>
 </section>
 
-<section class="pillars">
+<section class="pillars" id="pillars">
   {{ range .Params.pillars }}
   <article class="pillar">
     <div class="pillar-icon" aria-hidden="true">{{ .icon }}</div>
@@ -38,7 +38,7 @@
 </section>
 
 {{ with .Params.features }}
-<section class="features">
+<section class="features" id="features">
   <h2>{{ .title }}</h2>
   {{ with .intro }}<p class="features-intro">{{ . }}</p>{{ end }}
   <div class="feature-groups">
@@ -56,7 +56,7 @@
 {{ end }}
 
 {{ $screens := slice "home" "inventory" "market" "calendar" "detail" }}
-<section class="shots">
+<section class="shots" id="screenshots">
   <h2>{{ T "screenshotsTitle" }}</h2>
   <div class="shot-row">
     {{ range $s := $screens }}
@@ -81,14 +81,14 @@
   {{ end }}
 </section>
 
-<section class="values">
+<section class="values" id="values">
   <h2>{{ .Params.values.title }}</h2>
   <ul>
     {{ range .Params.values.points }}<li>{{ . }}</li>{{ end }}
   </ul>
 </section>
 
-<section class="faq">
+<section class="faq" id="faq">
   <h2>{{ T "faqTitle" }}</h2>
   <dl>
     <dt>{{ T "faqFreeQ" }}</dt><dd>{{ T "faqFreeA" }}</dd>
@@ -99,7 +99,7 @@
   </dl>
 </section>
 
-<section class="collab">
+<section class="collab" id="collab">
   <h2>{{ T "collabTitle" }}</h2>
   <p class="lead">{{ T "collabIntro" }}</p>
   <div class="collab-grid">