change blog sectio from home page

components/pages/home/blog.tsx

@@ -2,6 +2,7 @@ import Image from "next/image";
 import { ChevronRight } from "lucide-react";
 import DotAnimatsiya from "@/components/dot/DotAnimatsiya";
 import { useTranslations } from "next-intl";
+import ProductCard from "../products/productCard";
 
 export function Blog() {
   const t = useTranslations();
@@ -40,22 +41,22 @@ export function Blog() {
           <div className="mb-4 flex items-center justify-center gap-2">
             <DotAnimatsiya />
             <span className="font-almarai text-sm font-semibold tracking-wider text-white uppercase">
-              {t("home.blog.title")}
+              {t("products.banner.title")}
             </span>
           </div>
           <h2
-            className="font-unbounded bg-linear-to-br from-white via-white to-black
+            className="font-unbounded bg-linear-to-br from-white py-2 via-white to-black
   text-transparent bg-clip-text text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl"
           >
-            {t("home.blog.subtitle")}
+            {t("products.ourproducts")}
           </h2>
         </div>
 
         {/* Blog Cards Grid */}
         <div className="grid gap-8 md:grid-cols-2 lg:grid-cols-3 max-sm:place-items-center">
-          {blogPosts.map((post) => (
+          {/* {blogPosts.map((post) => (
             <article key={post.id} className="group">
-              {/* Image Container */}
+
               <div className="relative mb-6 aspect-4/2 md:aspect-4/3 overflow-hidden rounded-lg">
                 <Image
                   src={post.image || "/placeholder.svg"}
@@ -63,7 +64,7 @@ export function Blog() {
                   fill
                   className="object-cover transition-transform duration-300 group-hover:scale-105"
                 />
-                {/* Category Badge */}
+
                 <div className="absolute bottom-4 left-4">
                   <span className="font-almarai rounded bg-red-600 px-4 py-2 text-sm font-medium text-white">
                     {post.category}
@@ -71,7 +72,6 @@ export function Blog() {
                 </div>
               </div>
 
-              {/* Content */}
               <div>
                 <h3 className="font-unbounded uppercase mb-3 text-lg font-bold leading-tight tracking-wide text-white md:text-xl">
                   {post.title}
@@ -91,7 +91,19 @@ export function Blog() {
                 </a>
               </div>
             </article>
-          ))}
+          ))} */}
+          {Array(3)
+            .fill(null)
+            .map((_, index) => (
+              <ProductCard
+                key={index}
+                title="Elektr yong'in detektori-Ypres ver.2"
+                name="P-0834404"
+                image="/images/products/products.webp"
+                slug="P_0834404"
+                status="full"
+              />
+            ))}
         </div>
       </div>
     </section>