diff --git a/src/components/extDynamicPages/blogCollection/BlogPageHero.tsx b/src/components/extDynamicPages/blogCollection/BlogPageHero.tsx
index bf2963d31..7c0252067 100644
--- a/src/components/extDynamicPages/blogCollection/BlogPageHero.tsx
+++ b/src/components/extDynamicPages/blogCollection/BlogPageHero.tsx
@@ -14,8 +14,8 @@ const HeroSection: React.FC = () => {
         alt="Hero Background"
       />
       <div className="relative z-30 flex h-full flex-col items-start justify-end px-[5%] pb-16 text-center md:text-left">
-        <div className="w-full py-5 md:w-[50%]">
-          <h1 className="mb-4 text-left text-3xl font-bold leading-[2.3rem] lg:leading-[2.4rem] 2xl:text-6xl">
+        <div className="w-full py-5 pr-6 md:w-[55%]">
+          <h1 className="mb-4 text-left text-3xl font-bold leading-[2.3rem] md:leading-[2.6rem] 2xl:text-5xl">
             Unlock Industry Insights: Get Essential Tips & Boilerplate Hacks
           </h1>
         </div>
diff --git a/src/components/layouts/navbar/index.tsx b/src/components/layouts/navbar/index.tsx
index 07b77596f..c59fa35e8 100644
--- a/src/components/layouts/navbar/index.tsx
+++ b/src/components/layouts/navbar/index.tsx
@@ -34,7 +34,7 @@ const Navbar = ({ is_auth_path = false }: { is_auth_path?: boolean }) => {
   });
   return (
     <nav
-      className={`${scrolling ? "shadow-md" : "shadow-none"} sticky left-0 right-0 top-0 z-10 bg-background px-4`}
+      className={`${scrolling ? "shadow-md" : "shadow-none"} sticky left-0 right-0 top-0 z-40 bg-background px-4`}
     >
       <div
         className={`${scrolling ? "py-2" : "py-4 md:py-9"} mx-auto flex w-full max-w-[1200px] items-center justify-between gap-x-4 transition-all duration-500`}