diff --git a/.Jules/palette.md b/.Jules/palette.md
index 3723067..b6a4027 100644
--- a/.Jules/palette.md
+++ b/.Jules/palette.md
@@ -5,3 +5,7 @@
 ## 2024-06-21 - Added skip-to-content link
 **Learning:** Found a missing skip-to-content link, which is a key accessibility feature to help keyboard and screen reader users bypass navigation. Additionally learned that giving `<main>` `tabindex="-1"` and removing its outline when `:focus-visible` ensures proper focus handling after clicking the skip link without disruptive visual outlines.
 **Action:** Always include a skip-to-content link near the start of the `body` and manage target focus appropriately.
+
+## 2026-06-25 - Fix Header Overlap
+**Learning:** When using a sticky header, clicking anchor links can cause the target element to scroll under the header, hindering the user experience.
+**Action:** Use `scroll-padding-top` on the `html` element with the height of the sticky header to ensure anchor links scroll to a position just below the header.
diff --git a/.gitignore b/.gitignore
index 3c3629e..fafe757 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1 +1,2 @@
 node_modules
+venv/
diff --git a/styles.css b/styles.css
index dfc509c..2ba2dcd 100644
--- a/styles.css
+++ b/styles.css
@@ -15,6 +15,7 @@
   --line: #d6dad8;
   --white: #ffffff;
   --shadow: 0 24px 70px rgba(22, 38, 61, 0.12);
+  --header-offset: 81px;
 }
 
 * {
@@ -23,6 +24,7 @@
 
 html {
   scroll-behavior: smooth;
+  scroll-padding-top: var(--header-offset);
 }
 
 body {
@@ -113,7 +115,7 @@ a {
 }
 
 .hero {
-  min-height: min(620px, calc(100vh - 81px));
+  min-height: min(620px, calc(100vh - var(--header-offset)));
   display: grid;
   grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr);
   gap: clamp(32px, 5vw, 72px);