diff --git a/src/components/mobile-nav.tsx b/src/components/mobile-nav.tsx
index 28d36ee..1c8b580 100644
--- a/src/components/mobile-nav.tsx
+++ b/src/components/mobile-nav.tsx
@@ -16,7 +16,7 @@ function NavContent({
 }) {
   return (
     <nav className="flex flex-col gap-4 mt-8">
-      <ScrollSpy activeClass="nav-active">
+      <ScrollSpy activeClass="nav-active" offsetTop={80}>
 
         {linksOrder.map((value) => (
           <a key={value} href={`#${value}`} className="text-lg hover:text-primary transition-colors">
diff --git a/src/components/nav.tsx b/src/components/nav.tsx
index 2edf2fd..3a51147 100644
--- a/src/components/nav.tsx
+++ b/src/components/nav.tsx
@@ -24,7 +24,7 @@ export function MainpageNav({
     <NavContainer title={t.nav.title}>
       <>
         <div className="hidden md:flex md:items-center md:gap-4 lg:gap-8">
-          <ScrollSpy activeClass="nav-active">
+          <ScrollSpy activeClass="nav-active" offsetTop={80}>
 
             {linksOrder.map((value) => (
               <a