Docker config

app/Hero/HeroSection.jsx

@@ -0,0 +1,41 @@
+import React from "react";
+
+const HeroSection = () => {
+  return (
+    <section className="relative h-[40rem] overflow-hidden rounded-3xl m-6">
+      {/* Background Video */}
+      <video
+        autoPlay
+        muted
+        loop
+        className="absolute inset-0 w-full h-full object-cover rounded-3xl"
+      >
+        <source src="/images/homepage-2/DNA-BG.mp4" type="video/mp4" />
+        Your browser does not support the video tag.
+      </video>
+
+      {/* Overlay */}
+      <div className="absolute inset-0 bg-black bg-opacity-50 rounded-3xl"></div>
+
+      {/* Content */}
+      <div className="relative z-10 container mx-auto px-8 h-full flex items-center">
+        <div className="text-white max-w-4xl">
+          {/* Badge */}
+          <div className="inline-block mb-6">
+            <span className="bg-gray-800 bg-opacity-80 text-white px-4 py-2 rounded-full text-sm font-medium border border-gray-600">
+              #WEBSITEUNDERCONSTRUCTION
+            </span>
+          </div>
+          
+          {/* Main Heading */}
+          <h1 className="text-4xl md:text-5xl lg:text-6xl font-bold leading-tight text-white">
+            Unleash The Genomic Secrets<br />
+            With Us!
+          </h1>
+        </div>
+      </div>
+    </section>
+  );
+};
+
+export default HeroSection;