UI changes and color theme changed

app/(public)/_homeComponents/HowItWorks.tsx

@@ -45,19 +45,7 @@ const steps = [
 
 const HowItWorks = () => {
   return (
-    <section className="py-32 bg-gradient-to-br from-[#c3dbe0] to-white text-center relative overflow-hidden">
-      {/* Soft animated background blobs */}
-      <motion.div
-        animate={{ opacity: [0.3, 0.5, 0.3], scale: [1, 1.1, 1] }}
-        transition={{ duration: 10, repeat: Infinity }}
-        className="absolute bg-[#13afdc] rounded-full blur-3xl opacity-20 w-[28rem] h-[28rem] -top-20 -right-20"
-      />
-      <motion.div
-        animate={{ opacity: [0.3, 0.5, 0.3], scale: [1, 1.05, 1] }}
-        transition={{ duration: 12, repeat: Infinity }}
-        className="absolute bg-[#0d0d0d] rounded-full blur-3xl opacity-10 w-[26rem] h-[26rem] -bottom-20 -left-20"
-      />
-
+    <section className="py-32 bg-[#2563eb] text-center relative overflow-hidden">
       <div className="relative max-w-6xl mx-auto px-6 z-10">
         {/* Heading */}
         <motion.h2
@@ -65,12 +53,9 @@ const HowItWorks = () => {
           whileInView={{ opacity: 1, y: 0 }}
           viewport={{ once: true }}
           transition={{ duration: 0.6 }}
-          className="text-4xl md:text-6xl font-extrabold mb-6 text-[#0d0d0d]"
+          className="text-4xl md:text-6xl font-extrabold mb-6 text-white"
         >
-          How It{" "}
-          <span className="bg-gradient-to-r from-[#13afdc] to-[#0d0d0d] bg-clip-text text-transparent">
-            Works
-          </span>
+          How It Works
         </motion.h2>
 
         <motion.p
@@ -78,7 +63,7 @@ const HowItWorks = () => {
           whileInView={{ opacity: 1, y: 0 }}
           viewport={{ once: true }}
           transition={{ duration: 0.6, delay: 0.2 }}
-          className="max-w-3xl mx-auto text-lg md:text-xl text-[#7c7a7c] mb-16"
+          className="max-w-3xl mx-auto text-lg md:text-xl text-white mb-16"
         >
           Winixco connects your hiring, HR and CRM workflows into one powerful
           operating system — from job posting to payroll & business growth.
@@ -95,7 +80,7 @@ const HowItWorks = () => {
               transition={{ delay: i * 0.15 }}
               className="bg-white p-8 rounded-2xl shadow-lg hover:shadow-xl hover:-translate-y-1 transition"
             >
-              <div className="flex justify-center mb-4 text-[#13afdc]">
+              <div className="flex justify-center mb-4 text-[#2563eb]">
                 {step.icon}
               </div>
               <h3 className="text-xl font-bold mb-2 text-[#0d0d0d]">
@@ -119,4 +104,4 @@ const HowItWorks = () => {
   );
 };
 
-export default HowItWorks;
+export default HowItWorks;