src/app/page.tsx

@@ -66,6 +66,7 @@ export default function LandingPage() {
       background={{
         variant: "cell-wave",
       }}
+      badgeText="Trusted by 5000+ students"
       title="Unlock Your Potential in Tech"
       description="Master in-demand IT skills with expert-led courses, hands-on projects, and career support tailored for your success."
       avatars={[

src/components/sections/hero/HeroCentered.tsx

@@ -29,6 +29,7 @@ type HeroCenteredBackgroundProps = Extract<
 interface HeroCenteredProps {
   title: string;
   description: string;
+  badgeText?: string;
   background: HeroCenteredBackgroundProps;
   avatars: Avatar[];
   avatarText?: string;
@@ -58,6 +59,7 @@ interface HeroCenteredProps {
 const HeroCentered = ({
   title,
   description,
+  badgeText,
   background = { variant: "plain" },
   avatars,
   avatarText,
@@ -90,6 +92,11 @@ const HeroCentered = ({
     >
       <HeroBackgrounds {...background} />
       <div className={cls("w-content-width mx-auto relative z-10", containerClassName)}>
+        {badgeText && (
+          <div className="flex justify-center mb-3">
+            <div className="glasmorphic-badge">{badgeText}</div>
+          </div>
+        )}
         <TextBox
           title={title}
           description={description}