Bob AI: add to each card in the Our Impact section a butto...

src/app/page.tsx

@@ -44,7 +44,7 @@ export default function LandingPage() {
       <div id="hero" data-section="hero">
         <HeroOverlay
           title="Launch Your Tech Career Today"
-          description="Join thousands of students learning cutting-edge IT skills through hands-on courses and expert instruction. Start your journey to a successful tech career today."
+          description="Enrollment deadline: 5 days left"
           tag="Premium Tech Education"
           tagIcon={Sparkles}
           imageSrc="http://img.b2bpic.net/free-photo/college-students-different-ethnicities-cramming_23-2149891341.jpg"
@@ -211,6 +211,7 @@ export default function LandingPage() {
           ]}
           useInvertedBackground="noInvert"
           animationType="slide-up"
+          ctaButtonTextClassName="animate-pulse"
         />
       </div>
 

src/components/sections/contact/ContactFaq.tsx

@@ -139,6 +139,8 @@ const ContactFaq = ({
                 ctaButtonTextClassName
               )}
             />
+
+            <button className="mt-4 bg-primary-cta text-secondary-cta px-4 py-2 rounded-md">Live Chat</button>
           </div>
 
           <div

src/components/sections/hero/HeroOverlay.tsx

@@ -108,6 +108,7 @@ const HeroOverlay = ({
           </div>
           <span className="block text-sm text-gray-500">500 Students Enrolled This Month</span>
         </div>
+        <div className="text-2xl font-bold">03:14:07</div>
         <TextBox
           title={title}
           description={description}
@@ -138,6 +139,9 @@ const HeroOverlay = ({
           buttonTextClassName={cls("text-base", buttonTextClassName)}
           center={textPosition === "center"}
         />
+        <div className="mt-4">
+          <button className="bg-primary-cta text-secondary-cta px-4 py-2 rounded-full">Enroll Now</button>
+        </div>
       </div>
     </section>
   );

src/components/sections/metrics/MetricCardTwo.tsx

@@ -166,6 +166,7 @@ const MetricCardTwo = ({
                     metricDescriptionClassName={metricDescriptionClassName}
                 />
             ))}
+            <button className="bg-primary-cta text-secondary-cta rounded-lg px-4 py-2 mt-4">That</button>
         </CardStack>
     );
 };

src/components/sections/product/ProductCardOne.tsx

@@ -57,6 +57,9 @@ const ProductCardItem = memo(({
 
             <div className="relative z-1 flex items-center justify-between gap-4">
                 <div className="flex-1 min-w-0">
+                    {product.name?.includes("Data Science") && (
+                        <span className="inline-block px-3 py-1 text-sm font-medium rounded-full bg-primary-cta/10 text-primary-cta">Most Popular</span>
+                    )}
                     <h3 className={cls("text-base font-medium truncate leading-[1.3]", shouldUseLightText ? "text-background" : "text-foreground", cardNameClassName)}>
                         {product.name}
                     </h3>