diff --git a/site/index.html b/site/index.html
index 5d2a93a1e..a201228bf 100644
--- a/site/index.html
+++ b/site/index.html
@@ -17,6 +17,8 @@
 --fs-hero:clamp(40px,7vw,76px);--fs-h2:clamp(28px,4.2vw,44px);--fs-h3:clamp(18px,2vw,22px);--gutter:clamp(16px,4vw,32px);--max:1200px}
 *{box-sizing:border-box}
 html{scroll-behavior:smooth}
+section,[id]{scroll-margin-top:84px}
+@media (max-width:900px){section,[id]{scroll-margin-top:80px}}
 @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
 body{margin:0;background:var(--obsidian);color:var(--bone);font-family:'IBM Plex Sans',system-ui,-apple-system,sans-serif;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
 a{color:inherit;text-decoration:none}
@@ -281,7 +283,7 @@ footer .wrap{padding-block:48px 32px}
   </div>
 </section>
 
-<section id="randomx" style="padding-top:0">
+<section id="randomx" style="padding-top:8px">
   <div class="wrap">
     <div class="sec-head reveal">
       <h2>Monero's idea, finished for GPUs</h2>
@@ -306,7 +308,7 @@ footer .wrap{padding-block:48px 32px}
   </div>
 </section>
 
-<section id="build" style="padding-top:0">
+<section id="build" style="padding-top:8px">
   <div class="wrap">
     <h2 class="reveal" style="margin-bottom:28px">One chain, three jobs</h2>
     <div class="jobs">
@@ -367,7 +369,7 @@ footer .wrap{padding-block:48px 32px}
   </div>
 </section>
 
-<section id="economics" style="padding-top:0">
+<section id="economics" style="padding-top:8px">
   <div class="wrap" style="display:grid;gap:48px;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));align-items:center">
     <div class="reveal" style="display:flex;flex-direction:column;gap:20px">
       <h2>Every coin, mined</h2>