make Why Vortex section more consistent

src/components/WhyVortex/index.tsx

@@ -33,16 +33,16 @@ const features: Feature[] = [
 const FeatureCard = ({ icon, title, description, subtext }: Feature) => (
   <div className="flex flex-col items-center text-center">
     <img src={icon} alt={title} className="w-[100px] h-[100px] mb-4" />
-    <h3 className="mb-4 text-2xl font-extrabold text-blue-900">{title}</h3>
-    <p className="mb-2 text-lg text-black">{description}</p>
-    <p className="text-xl text-gray-600 text-pink-600">{subtext}</p>
+    <h3 className="mb-4 text-xl font-bold text-blue-900">{title}</h3>
+    <p className="mb-2 text-black">{description}</p>
+    <p className="text-gray-600 text-pink-600">{subtext}</p>
   </div>
 );
 
 export const WhyVortex = () => (
   <section className="container py-12 mx-auto mt-12">
-    <h2 className="mb-8 text-4xl font-bold text-center text-blue-900">Why Vortex?</h2>
-    <div className="grid grid-cols-1 gap-x-36 gap-y-8 md:grid-cols-3">
+    <h1 className="mb-6 text-4xl text-center text-black">Why Vortex?</h1>
+    <div className="grid grid-cols-1 gap-x-20 gap-y-8 md:grid-cols-3">
       {features.map((feature) => (
         <FeatureCard key={feature.title} {...feature} />
       ))}