Bob AI: Add a glassmorphic badge with the text '5000 happy students'

src/app/page.tsx

@@ -73,6 +73,7 @@ export default function LandingPage() {
       title="Unlock Your Tech Potential"
       description="Join our IT Academy and transform your career. Learn from industry experts and master the skills to thrive in the digital world."
       tag="Your Future Starts Here"
+      badge="5000 happy students"
       buttons={[
         {
           text: "Explore Courses",

src/components/sections/hero/HeroBillboardRotatedCarousel.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-
 import TextBox from "@/components/Textbox";
 import AngledCarousel from "@/components/cardStack/layouts/carousels/AngledCarousel";
 import HeroBackgrounds, { type HeroBackgroundVariantProps } from "@/components/background/HeroBackgrounds";
@@ -39,6 +38,7 @@ interface HeroBillboardRotatedCarouselProps {
   title: string;
   description: string;
   background: HeroBillboardRotatedCarouselBackgroundProps;
+  badge?: string;
   tag?: string;
   tagIcon?: LucideIcon;
   tagAnimation?: ButtonAnimationType;
@@ -64,6 +64,7 @@ const HeroBillboardRotatedCarousel = ({
   title,
   description,
   background = { variant: "plain" },
+  badge,
   tag,
   tagIcon,
   tagAnimation = "opacity",
@@ -87,11 +88,16 @@ const HeroBillboardRotatedCarousel = ({
   return (
     <section
       aria-label={ariaLabel}
-      className={cls("relative w-full h-fit md:min-h-svh flex items-center justify-center py-hero-page-padding", className)}
+      className={cls("relative w-full h-fit md:min-h-svh flex items-center justify-center py-hero-page-padding text-primary-cta-text", className)}
     >
       <HeroBackgrounds {...background} />
       <div className={cls("w-full flex flex-col gap-14 md:gap-15 relative z-10", containerClassName)}>
-        <div className="w-content-width mx-auto" >
+        <div className="w-content-width mx-auto flex flex-col items-center gap-3" >
+          {badge && (
+            <div className="rounded-full px-4 py-1 text-sm backdrop-blur-sm bg-card/20 border border-card/30">
+              {badge}
+            </div>
+          )}
           <TextBox
             title={title}
             description={description}