diff --git a/app/[locale]/blog/[slug]/page.tsx b/app/[locale]/blog/[slug]/page.tsx
index 819a0a19..fd79c51d 100644
--- a/app/[locale]/blog/[slug]/page.tsx
+++ b/app/[locale]/blog/[slug]/page.tsx
@@ -88,7 +88,7 @@ export default async function BlogPost({ params }: BlogPostProps) {
               }}
             />
           </div>
-          <div className="absolute inset-0 bg-gradient-to-t from-neutral-dark via-neutral-dark/40 to-transparent" />
+          <div className="absolute inset-0 bg-gradient-to-t from-neutral-dark/90 via-neutral-dark/40 to-transparent" />
 
           {/* Title overlay on image */}
           <div className="absolute inset-0 flex flex-col justify-end pb-16 md:pb-24">
diff --git a/app/[locale]/blog/page.tsx b/app/[locale]/blog/page.tsx
index 5892351f..263efddd 100644
--- a/app/[locale]/blog/page.tsx
+++ b/app/[locale]/blog/page.tsx
@@ -73,7 +73,7 @@ export default async function BlogIndex({ params }: BlogIndexProps) {
                 sizes="100vw"
                 priority
               />
-              <div className="absolute inset-0 image-overlay-gradient" />
+              <div className="absolute inset-0 bg-neutral-dark/20" />
             </>
           )}
 
@@ -177,11 +177,11 @@ export default async function BlogIndex({ params }: BlogIndexProps) {
                           sizes="(max-width: 768px) 100vw, 100vw"
                           loading="lazy"
                         />
-                        <div className="absolute inset-0 bg-neutral-dark/40 group-hover:bg-neutral-dark/30 transition-colors duration-500" />
+                        <div className="absolute inset-0 bg-neutral-dark/10 group-hover:bg-neutral-dark/5 transition-colors duration-500" />
                       </>
                     )}
 
-                    <div className="relative z-10 w-full p-6 md:p-10 bg-neutral-dark/50 backdrop-blur-md border-t border-white/10 flex flex-col">
+                    <div className="relative z-10 w-full p-6 md:p-10 bg-gradient-to-t from-neutral-dark/95 via-neutral-dark/70 to-transparent flex flex-col pt-40">
                       <div className="flex flex-wrap items-center gap-4 mb-4">
                         {post.frontmatter.category && (
                           <Badge variant="accent" className="shadow-md">
diff --git a/components/home/RecentPosts.tsx b/components/home/RecentPosts.tsx
index 332552aa..578ae707 100644
--- a/components/home/RecentPosts.tsx
+++ b/components/home/RecentPosts.tsx
@@ -60,11 +60,11 @@ export default async function RecentPosts({ locale, data }: RecentPostsProps) {
                         sizes="(max-width: 768px) 100vw, 100vw"
                         loading="lazy"
                       />
-                      <div className="absolute inset-0 bg-neutral-dark/40 group-hover:bg-neutral-dark/30 transition-colors duration-500" />
+                      <div className="absolute inset-0 bg-neutral-dark/10 group-hover:bg-neutral-dark/5 transition-colors duration-500" />
                     </>
                   )}
 
-                  <div className="relative z-10 w-full p-6 md:p-8 bg-neutral-dark/50 backdrop-blur-md border-t border-white/10 flex flex-col">
+                  <div className="relative z-10 w-full p-6 md:p-8 bg-gradient-to-t from-neutral-dark/90 via-neutral-dark/60 to-transparent flex flex-col pt-32">
                     <div className="flex flex-wrap items-center gap-4 mb-4">
                       {post.frontmatter.category && (
                         <Badge variant="accent" className="shadow-md">
diff --git a/next-env.d.ts b/next-env.d.ts
index 9edff1c7..c4b7818f 100644
--- a/next-env.d.ts
+++ b/next-env.d.ts
@@ -1,6 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-import "./.next/types/routes.d.ts";
+import "./.next/dev/types/routes.d.ts";
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.