fix shadow

app/home/components/ProductCard.tsx

@@ -7,12 +7,12 @@ import { Rating } from "react-simple-star-rating";
 
 const ProductCard: FC = () => {
   return (
-    <div className="rounded-xl overflow-hidden">
-      <div>
+    <div>
+      <div className="rounded-xl overflow-hidden">
         <Image src={ProductImage} alt="product-card" width={500} height={500} className="w-full aspect-square object-cover" />
       </div>
-      <div className="bg-white rounded-xl -mt-6 drop-shadow-2xl shadow">
-        <div className="pt-4 text-[#2A3950] font-bold text-center">جعبه کیبوردی</div>
+      <div className="relative bg-white p-4 rounded-xl -mt-6 shadow-[0_4px_20px_rgba(0,0,0,0.1)]">
+        <div className="text-[#2A3950] font-bold text-center">جعبه کیبوردی</div>
         <div className="mt-2 flex justify-center items-center gap-1.5">
           <Rating initialValue={4.5} size={20} readonly rtl allowFraction SVGstyle={{ display: "inline-block" }} />
           <div className="text-xs mt-1">4.5</div>