diff --git a/apps/web/src/app/(main)/(landing)/page.tsx b/apps/web/src/app/(main)/(landing)/page.tsx
index 94caacb4..48b65119 100644
--- a/apps/web/src/app/(main)/(landing)/page.tsx
+++ b/apps/web/src/app/(main)/(landing)/page.tsx
@@ -1,38 +1,35 @@
-'use client'
-import Bento from '@/components/landing-sections/Bento'
-import Brands from '@/components/landing-sections/Brands'
-import CTA from '@/components/landing-sections/CTA'
-import Footer from '@/components/landing-sections/footer'
-import Hero from '@/components/landing-sections/Hero'
-import HowItWorks from '@/components/landing-sections/how-it-works'
-import Navbar from '@/components/landing-sections/navbar'
-import Testimonials from '@/components/landing-sections/testimonials'
-import Video from '@/components/landing-sections/video'
-import React from 'react'
-import { FaqSection } from '@/components/faq/FaqSection'
-
+"use client";
+import Bento from "@/components/landing-sections/Bento";
+import Brands from "@/components/landing-sections/Brands";
+import CTA from "@/components/landing-sections/CTA";
+import Footer from "@/components/landing-sections/footer";
+import Hero from "@/components/landing-sections/Hero";
+import HowItWorks from "@/components/landing-sections/how-it-works";
+import Navbar from "@/components/landing-sections/navbar";
+import Testimonials from "@/components/landing-sections/testimonials";
+import Video from "@/components/landing-sections/video";
+import React from "react";
+import { FaqSection } from "@/components/faq/FaqSection";
 
 const Landing = () => {
-    return (
-        <main className='min-h-screen w-full bg-[#101010] text-white font-sans overflow-hidden relative'>
-            <Navbar />
-            <div className="min-h-screen w-full max-w-[2000px] mx-auto border-x border-[#252525] overflow-hidden">
-                <Hero />
-                <Bento />
-                <Video />
-                <HowItWorks />
-                <FaqSection />
-                <Brands />
-                <Testimonials />
-            </div>
-            <div className="max-w-[2000px] w-full mx-auto">
-                <CTA />
-                <Footer />
-            </div>
-        </main >
-    )
-}
-
-export default Landing
-
+  return (
+    <main className="min-h-screen w-full bg-[#101010] text-white font-sans overflow-hidden relative">
+      <Navbar />
+      <div className="min-h-screen w-full max-w-[2000px] mx-auto border-x border-[#252525] overflow-hidden">
+        <Hero />
+        <Bento />
+        <Video />
+        <HowItWorks />
+        <FaqSection />
+        <Brands />
+        <Testimonials />
+      </div>
+      <div className="max-w-[2000px] w-full mx-auto">
+        <CTA />
+        <Footer />
+      </div>
+    </main>
+  );
+};
 
+export default Landing;
diff --git a/apps/web/src/components/landing-sections/Hero.tsx b/apps/web/src/components/landing-sections/Hero.tsx
index 414875cb..84bff3f9 100644
--- a/apps/web/src/components/landing-sections/Hero.tsx
+++ b/apps/web/src/components/landing-sections/Hero.tsx
@@ -38,7 +38,7 @@ const Hero = () => {
     trackButtonClick("Get Started", "hero");
   };
   return (
-    <div className="w-full min-h-[50dvh] lg:h-[69dvh] relative overflow-hidden z-10 p-4 lg:p-[60px] flex flex-col items-center justify-center gap-6 ">
+    <div className="w-full  min-h-[50dvh] lg:h-[69dvh] relative  z-50 p-4 lg:p-[60px] flex flex-col items-center justify-center gap-6">
       <Image
         src="/assets/bgmain.svg"
         alt="background"
@@ -88,8 +88,9 @@ const Hero = () => {
           }}
           className="w-full lg:text-2xl tracking-tight font-light sm:max-w-lg mx-auto lg:max-w-4xl lg:text-balance text-text-secondary"
         >
-          Find suitabe OSS repos in seconds. learn the basics,
-          get the mentorship for OSS opportunities, GSoC, etc, and start making progress from today itself.
+          Find suitabe OSS repos in seconds. learn the basics, get the
+          mentorship for OSS opportunities, GSoC, etc, and start making progress
+          from today itself.
         </motion.p>
       </motion.div>
       <motion.div