add back image to show case contact part and product sections

components/ShowCase.tsx

@@ -51,7 +51,16 @@ export function ShowCase({
   };
 
   return (
-    <section className="min-h-screen bg-linear-to-br from-gray-50 via-blue-50 to-gray-50 pt-20 pb-20">
+    <section className="relative min-h-screen  pt-20 pb-20">
+      <div className="absolute -z-50 top-0 left-0 h-full w-full">
+        <Image
+          src="/images/hero1.jpg"
+          alt="hero image"
+          fill
+          className="object-cover"
+        />
+      </div>
+      <div className="absolute w-full h-full top-0 left-0 bg-black opacity-25 -z-40" />
       <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
           {/* Left Content */}
@@ -59,6 +68,7 @@ export function ShowCase({
             initial={{ opacity: 0, x: -50 }}
             animate={{ opacity: 1, x: 0 }}
             transition={{ duration: 0.6 }}
+            className="bg-white/80 backdrop-blur-md rounded-xl overflow-hidden p-4"
           >
             <h1 className="text-4xl lg:text-5xl font-bold text-gray-900 mb-6 leading-tight">
               {t(titleKey)}