Health page creation

app/health/rare-disorders/components/SolutionsOffer.jsx

@@ -0,0 +1,29 @@
+export default function SolutionsOffer() {
+  const solutions = [
+    {
+      name: "Exome",
+      desc: "Whole Exome Sequencing for uncovering the genetic basis of rare diseases."
+    },
+    {
+      name: "ExomeMito",
+      desc: "Exome + Mitochondrial Genome Sequencing for a higher diagnostic yield."
+    }
+  ];
+
+  return (
+    <section className="mx-auto px-10 pt-12">
+      <h2 className="text-2xl font-semibold text-gray-700 text-left pb-2 mb-4">Our Rare Disease Solutions Offer</h2>
+      <div className="grid sm:grid-cols-2 gap-6">
+        {solutions.map((sol, idx) => (
+          <div
+            key={idx}
+            className="border rounded-lg p-6 hover:shadow-lg transition-shadow cursor-pointer"
+          >
+            <h3 className="text-xl font-semibold text-gray-700 mb-2">{sol.name}</h3>
+            <p className="text-gray-600 leading-relaxed text-base">{sol.desc}</p>
+          </div>
+        ))}
+      </div>
+    </section>
+  );
+}