style(blog): reduce hero image overlays for better visibility

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">