diff --git a/src/components/AboutHero.tsx b/src/components/AboutHero.tsx
index 2dd314e..cb2373a 100644
--- a/src/components/AboutHero.tsx
+++ b/src/components/AboutHero.tsx
@@ -3,7 +3,7 @@ import { Button } from '@/components/Button'
 export function AboutHero() {
 
   return (
-    <div className="mx-auto max-w-2xl py-32">
+    <div className="mx-auto max-w-2xl py-32 px-6">
           <div className="text-center">
              <p className="subtitle text-black">ABOUT</p>
             <h1 className="h1-default text-gray-900">
diff --git a/src/components/ContactHero.tsx b/src/components/ContactHero.tsx
index 7f1ba27..64cc317 100644
--- a/src/components/ContactHero.tsx
+++ b/src/components/ContactHero.tsx
@@ -83,7 +83,7 @@ export function ContactHero() {
         </div>
 
         {/* Right container (image) */}
-        <div className="relative flex items-center justify-center bg-gray-100 px-6 py-32 lg:px-8">
+        <div className="relative flex items-center justify-center bg-gray-100 px-6 lg:py-24 pt-12 pb-24 lg:px-8">
           <div className="w-full max-w-md overflow-hidden rounded-lg shadow-lg">
             <Image
               src="/images/contact/contact.jpg"
diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx
index b00f107..92aefed 100644
--- a/src/components/Hero.tsx
+++ b/src/components/Hero.tsx
@@ -25,7 +25,7 @@ export function Hero() {
       
       {/* Content */}
       
-      <Container className="relative z-20 pt-24 pb-24 text-center lg:pt-32">
+      <Container className="relative z-20 pt-24 pb-12 text-center lg:pt-32">
         <div className="hidden sm:mb-8 sm:flex sm:justify-center">
             <div className="relative rounded-full px-3 py-1 text-sm/6 text-gray-100 ring-1 ring-gray-100/20 hover:ring-gray-100/5">
               Interested to Take Part?{' '}