Upload components/Services.jsx with huggingface_hub

components/Services.jsx

@@ -0,0 +1,41 @@
+export default function Services() {
+  const services = [
+    {
+      title: "Submarine Design",
+      description: "Custom submarine design and engineering solutions.",
+      icon: "🚤"
+    },
+    {
+      title: "Marine Research",
+      description: "Advanced marine research and exploration services.",
+      icon: "🔬"
+    },
+    {
+      title: "Underwater Maintenance",
+      description: "Professional underwater maintenance and repairs.",
+      icon: "🔧"
+    },
+    {
+      title: "Marine Consulting",
+      description: "Expert consulting for marine operations.",
+      icon: "💼"
+    }
+  ];
+
+  return (
+    <section className="py-16 bg-white">
+      <div className="container mx-auto px-4">
+        <h2 className="text-3xl font-bold text-center text-marine-blue mb-12">Our Services</h2>
+        <div className="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
+          {services.map((service, index) => (
+            <div key={index} className="bg-marine-light p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow">
+              <div className="text-4xl mb-4">{service.icon}</div>
+              <h3 className="text-xl font-bold text-marine-blue mb-2">{service.title}</h3>
+              <p className="text-marine-blue">{service.description}</p>
+            </div>
+          ))}
+        </div>
+      </div>
+    </section>
+  );
+}