Bob AI: i dont like Why Choose TechAcademy section replace...

src/app/page.tsx

@@ -3,13 +3,13 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
 import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
-import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
 import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
 import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
 import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
 import FooterMedia from '@/components/sections/footer/FooterMedia';
 import { Users, TrendingUp, Award, Star } from "lucide-react";
 import Link from "next/link";
+import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
 
 export default function HomePage() {
   return (
@@ -65,7 +65,7 @@ export default function HomePage() {
       </div>
 
       <div id="features" data-section="features">
-        <FeatureCardNine
+      <FeatureCardSeven
       features={[
       {
       id: 1,
@@ -95,9 +95,11 @@ export default function HomePage() {
       }
       }
       ]}
-          showStepNumbers={true}
+      animationType="none"
       title="Why Choose TechAcademy"
       description="Industry-leading education platform designed for career growth"
+      tag="Unique"
+      buttons={[{ text: "View Courses", label: "courses", href: "/courses" }, { text: "Learn More", label: "about", href: "/about" }]}
       textboxLayout="default"
       useInvertedBackground="invertDefault"
       />

src/components/sections/product/ProductCardTwo.tsx

@@ -138,16 +138,10 @@ const ProductCardItem = memo(({
                 </p>
             </div>
             <button
-                className={cls("bg-primary-cta text-secondary-cta px-4 py-2 rounded-full text-sm font-medium", actionButtonClassName)}
+                className={cls("bg-primary-cta text-secondary-cta rounded-lg px-4 py-2 mt-4", actionButtonClassName)}
-                style={{ borderRadius: theme.borderRadius }}
+                onClick={(e) => e.stopPropagation()}
             >
-                Buy
+                ADD TO CART
-            </button>
-            <button
-                className={cls("bg-secondary-cta text-primary-cta px-4 py-2 rounded-full text-sm font-medium mt-2", actionButtonClassName)}
-                style={{ borderRadius: theme.borderRadius }}
-            >
-                Add
             </button>
         </article>
     );