diff --git a/frontend/src/components/base/PageHero.astro b/frontend/src/components/base/PageHero.astro
index 3565b35..532512b 100644
--- a/frontend/src/components/base/PageHero.astro
+++ b/frontend/src/components/base/PageHero.astro
@@ -15,6 +15,7 @@ interface PageHeroProps {
     modalTarget?: string;
     bgImage?: string;
     minHeight?: string;
+    headerOffset?: string;
     layout?: 'default' | 'with-image';
     sideImage?: string;
     sideImageAlt?: string;
@@ -38,6 +39,7 @@ const {
     modalTarget,
     bgImage = "",
     minHeight = "100vh",
+    headerOffset = "80px",
     layout = "default",
     sideImage = "",
     sideImageAlt = "",
@@ -48,7 +50,7 @@ const {
 const showImage = layout === 'with-image' && sideImage;
 ---
 
-<section class="hero-section" style:min-height={minHeight}>
+<section class="hero-section" style:min-height={minHeight} style:--header-offset={headerOffset}>
     {bgImage && <img src={bgImage} alt="" class="hero-bg-image" decoding="async" />}
     <div class="hero-overlay"></div>
 
@@ -141,7 +143,7 @@ const showImage = layout === 'with-image' && sideImage;
         background-position: center;
         background-repeat: no-repeat;
         margin: 0 !important;
-        padding-top: 80px;
+        padding-top: var(--header-offset, 80px);
         box-sizing: border-box;
         overflow: hidden;
     }