Bob AI: change the team section title to Meet Our Expert T...

src/app/globals.css

@@ -1,16 +1,17 @@
 @import "tailwindcss";
-@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@300;400;500;600;700&display=swap');
+
 :root {
   /* Base units */
   /* --vw is set by ThemeProvider */
 
-  --background: #f5deb3;;
+  --background: #f5f5f5;;
-  --card: #d2b48c;;
+  --card: #ffffff;;
-  --foreground: #4f443e;;
+  --foreground: #1c1c1c;;
-  --primary-cta: #ffebcd;;
+  --primary-cta: #2bb889;;
-  --secondary-cta: #bcaaa4;;
+  --secondary-cta: #ffffff;;
-  --accent: #8b4513;;
+  --accent: #09b97e;;
-  --background-accent: #ffdead;;
+  --background-accent: #a8e8c3;;
+
   /* Base spacing units */
   --vw-0_25: calc(var(--vw) * 0.25);
   --vw-0_5: calc(var(--vw) * 0.5);
@@ -520,7 +521,7 @@ html {
 body {
   background-color: var(--background);
   color: var(--foreground);
-  font-family: 'Merriweather', sans-serif;
+  font-family: var(--font-manrope), sans-serif;
   position: relative;
   min-height: 100vh;
   overscroll-behavior: none;
@@ -533,5 +534,5 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: 'Merriweather', sans-serif;
+  font-family: var(--font-manrope), sans-serif;
 }

src/app/page.tsx

@@ -1,17 +1,18 @@
 "use client"
 
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
+import TextAbout from '@/components/sections/about/TextAbout';
+import FeatureCardTwentyTwo from '@/components/sections/feature/FeatureCardTwentyTwo';
+import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
+import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
+import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
+import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
+import FaqSplitText from '@/components/sections/faq/FaqSplitText';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import { Sparkles, BookOpen, Users, TrendingUp, Award, Target } from "lucide-react";
-import ContactForm from '@/components/form/ContactForm';
-import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
-import TeamCardOne from '@/components/sections/team/TeamCardOne';
-import HeroBillboard1 from '@/components/sections/hero/HeroBillboard1';
-import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
-import SplitAbout from '@/components/sections/about/SplitAbout';
-import TeamCardOne1 from '@/components/sections/team/TeamCardOne1';
-import FooterBase1 from '@/components/sections/footer/FooterBase1';
-import FooterMedia from '@/components/sections/footer/FooterMedia';
 
 export default function TechAcademyPage() {
   return (
@@ -29,7 +30,7 @@ export default function TechAcademyPage() {
     >
       <div id="nav" data-section="nav">
         <NavbarStyleCentered
-          brandName="TechMasters Performance"
+          brandName="TechAcademy"
           navItems={[
             { name: "Home", id: "hero" },
             { name: "Courses", id: "courses" },
@@ -42,76 +43,291 @@ export default function TechAcademyPage() {
           }}
         />
       </div>
-      <div id="contact_form" data-section="contact_form">
+
-        <ContactForm
+      <div id="hero" data-section="hero">
-          useInvertedBackground="noInvert"
+        <HeroBillboardGallery
-          className="animate-fade-in"
+          title="Master In-Demand Tech Skills"
+          description="Learn from industry experts and transform your career with our comprehensive IT academy. Hands-on courses in web development, data science, cloud computing, and more."
+          background={{ variant: "radial-gradient" }}
+          tag="Welcome to TechAcademy"
+          tagIcon={Sparkles}
+          buttons={[
+            { text: "Start Learning", href: "courses" },
+            { text: "Explore Courses", href: "courses" }
+          ]}
+          mediaItems={[
+            { imageSrc: "https://img.b2bpic.net/free-photo/learning-concept-close-up-student-using-laptop-alibrary_1150-16609.jpg", imageAlt: "Student coding on laptop" },
+            { imageSrc: "https://img.b2bpic.net/free-photo/young-man-learning-virtual-classroom_23-2149200181.jpg", imageAlt: "Developer at workspace" },
+            { imageSrc: "https://img.b2bpic.net/free-photo/row-serious-focused-coworkers-sitting-table-typing-laptops_74855-10363.jpg", imageAlt: "Software engineer professional" },
+            { imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-woman-reading-coffee-shop_23-2150183751.jpg", imageAlt: "Online course in progress" },
+            { imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-woman-reading-coffee-shop_23-2150183754.jpg", imageAlt: "Training workshop session" }
+          ]}
         />
-      </div>      <div id="navbar_layout_floating_inline" data-section="navbar_layout_floating_inline">
+      </div>
+
+      <div id="about" data-section="about">
+        <TextAbout
+          title="Empowering the Next Generation of Tech Leaders Through Quality Education and Mentorship"
+          useInvertedBackground="invertDefault"
+          buttons={[
+            { text: "Learn Our Mission", href: "#" }
+          ]}
+        />
+      </div>
+
+      <div id="courses" data-section="courses">
+        <FeatureCardTwentyTwo
+          title="Our Popular Courses"
+          description="Comprehensive learning pathways designed by industry professionals to prepare you for real-world challenges"
+          tag="Courses"
+          tagIcon={BookOpen}
+          features={[
+            {
+              id: "1",              title: "Full Stack Web Development: From Frontend to Backend Mastery",              category: ["Web Development", "JavaScript", "React"],
+              imageSrc: "https://img.b2bpic.net/free-photo/person-front-computer-working-html_23-2150040428.jpg",              imageAlt: "Web development course"
+            },
+            {
+              id: "2",              title: "Data Science & Machine Learning: Unlock Predictive Analytics Power",              category: ["Data Science", "Python", "AI"],
+              imageSrc: "https://img.b2bpic.net/free-photo/programming-background-collage_23-2149901777.jpg",              imageAlt: "Data science course"
+            },
+            {
+              id: "3",              title: "Cloud Computing with AWS: Build Scalable Infrastructure",              category: ["Cloud", "AWS", "DevOps"],
+              imageSrc: "https://img.b2bpic.net/free-photo/person-front-computer-working-html_23-2150040416.jpg",              imageAlt: "Cloud computing course"
+            },
+            {
+              id: "4",              title: "Cybersecurity Fundamentals: Protect Your Digital Assets",              category: ["Security", "Networking", "Protection"],
+              imageSrc: "https://img.b2bpic.net/free-photo/person-front-computer-working-html_23-2150040428.jpg",              imageAlt: "Cybersecurity course"
+            }
+          ]}
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground="noInvert"
+          buttons={[
+            { text: "View All Courses", href: "#" }
+          ]}
+        />
+      </div>
+
+      <div id="metrics" data-section="metrics">
+        <MetricCardOne
+          title="Our Impact by Numbers"
+          description="Trusted by thousands of students and employers worldwide"
+          metrics={[
+            {
+              id: "1",              value: "5000",              title: "Students Trained",              description: "Successful learners completing our programs",              icon: Users
+            },
+            {
+              id: "2",              value: "95",              title: "% Job Placement",              description: "Graduates landing roles within 3 months",              icon: TrendingUp
+            },
+            {
+              id: "3",              value: "50",              title: "Industry Partners",              description: "Leading tech companies hiring our graduates",              icon: Award
+            },
+            {
+              id: "4",              value: "100",              title: "Expert Instructors",              description: "Certified professionals with real-world experience",              icon: Target
+            }
+          ]}
+          animationType="slide-up"
+          gridVariant="uniform-all-items-equal"
+          textboxLayout="default"
+          useInvertedBackground="invertDefault"
+        />
+      </div>
 
       <div id="team" data-section="team">
-      <TeamCardOne1
+        <TeamCardEleven
-      title="Our Development Team"
+          title="Meet Our Expert Team"
-      />
+          description="Learn from industry veterans with decades of combined experience in tech"
-      </div>
+          groups={[
-        <NavbarLayoutFloatingInline
+            {
-          navItems={[{ title: "Explore Our Floral Art", description: "Dive into our gallery showcasing Jessica's unique floral designs and arrangements." }, { title: "Contact Our Team", description: "Reach out to our dedicated team for any questions about our services or upcoming events." }]}
+              id: "senior-team",              groupTitle: "Senior Instructors",              members: [
-          button={{ text: "" }}
+                {
+                  id: "1",                  title: "Sarah Mitchell",                  subtitle: "Lead Web Developer",                  detail: "sarah.mitchell@techacademy.com",                  imageSrc: "https://img.b2bpic.net/free-photo/mid-shot-counselor-cabinet_23-2148759108.jpg",                  imageAlt: "Sarah Mitchell"
+                },
+                {
+                  id: "2",                  title: "Alex Chen",                  subtitle: "Data Science Lead",                  detail: "alex.chen@techacademy.com",                  imageSrc: "https://img.b2bpic.net/free-photo/closeup-senior-lecturer-with-arms-crossed_1262-1753.jpg",                  imageAlt: "Alex Chen"
+                },
+                {
+                  id: "3",                  title: "Marcus Johnson",                  subtitle: "Cloud Architecture Expert",                  detail: "marcus.johnson@techacademy.com",                  imageSrc: "https://img.b2bpic.net/free-photo/close-up-young-business-person-doing-internship_23-2149305396.jpg",                  imageAlt: "Marcus Johnson"
+                }
+              ]
+            },
+            {
+              id: "support-team",              groupTitle: "Mentors & Support",              members: [
+                {
+                  id: "4",                  title: "Emma Wilson",                  subtitle: "Career Mentor",                  detail: "emma.wilson@techacademy.com",                  imageSrc: "https://img.b2bpic.net/free-photo/mature-business-manager-office_1098-21368.jpg",                  imageAlt: "Emma Wilson"
+                },
+                {
+                  id: "5",                  title: "David Park",                  subtitle: "Technical Support Lead",                  detail: "david.park@techacademy.com",                  imageSrc: "https://img.b2bpic.net/free-photo/mid-shot-counselor-cabinet_23-2148759108.jpg",                  imageAlt: "David Park"
+                }
+              ]
+            }
+          ]}
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground="noInvert"
         />
-      </div>      <div id="team_card_one" data-section="team_card_one">
+      </div>
-        <TeamCardOne
+
-          members={[{ name: "Jessica Bloom", role: "Lead Florist & Founder", image: "" }]}
+      <div id="testimonials" data-section="testimonials">
-          carouselMode="auto"
+        <TestimonialCardOne
+          title="What Our Students Say"
+          description="Real success stories from graduates who transformed their careers"
+          testimonials={[
+            {
+              id: "1",              name: "James Rodriguez",              role: "Junior Developer",              company: "Tech Startup Inc",              rating: 5,
+              imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",              imageAlt: "James Rodriguez"
+            },
+            {
+              id: "2",              name: "Lisa Wong",              role: "Data Analyst",              company: "Fortune 500 Corp",              rating: 5,
+              imageSrc: "https://img.b2bpic.net/free-photo/happy-bearded-man-busines-clothes-with-crossed-arms-looking-camera-gray_171337-11335.jpg",              imageAlt: "Lisa Wong"
+            },
+            {
+              id: "3",              name: "Ahmed Hassan",              role: "Cloud Engineer",              company: "Global Tech Solutions",              rating: 5,
+              imageSrc: "https://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5368.jpg",              imageAlt: "Ahmed Hassan"
+            },
+            {
+              id: "4",              name: "Rachel Green",              role: "Full Stack Developer",              company: "Digital Agency Pro",              rating: 5,
+              imageSrc: "https://img.b2bpic.net/free-photo/man-button-up-his-jacket-smiles_23-2148401389.jpg",              imageAlt: "Rachel Green"
+            },
+            {
+              id: "5",              name: "Michael Torres",              role: "DevOps Engineer",              company: "Cloud Infrastructure Co",              rating: 5,
+              imageSrc: "https://img.b2bpic.net/free-photo/handsome-young-man-posing_158595-3050.jpg",              imageAlt: "Michael Torres"
+            },
+            {
+              id: "6",              name: "Sophia Patel",              role: "Machine Learning Engineer",              company: "AI Innovation Labs",              rating: 5,
+              imageSrc: "https://img.b2bpic.net/free-photo/portrait-confident-businessman_107420-84879.jpg",              imageAlt: "Sophia Patel"
+            }
+          ]}
           gridVariant="uniform-all-items-equal"
-          animationType="none"
+          animationType="slide-up"
-          title="Meet Jessica Bloom"
+          textboxLayout="default"
-          description="We are passionate about training the next generation of developers"
+          useInvertedBackground="invertDefault"
-          tag="Team"
+          carouselMode="buttons"
-          buttons={[{ label: "View Profile", href: "" }, { label: "Contact", href: "" }]}
+        />
+      </div>
+
+      <div id="pricing" data-section="pricing">
+        <PricingCardNine
+          title="Flexible Pricing Plans"
+          description="Choose the perfect plan for your learning journey and budget"
+          plans={[
+            {
+              id: "starter",              title: "Starter",              price: "$99",              period: "/month",              imageSrc: "https://img.b2bpic.net/free-photo/young-woman-holding-face-brushes-smiling_259150-60140.jpg",              imageAlt: "Starter plan",              button: {
+                text: "Get Started",                href: "contact"
+              },
+              features: [
+                "Access to 5 beginner courses",                "Community forum access",                "Email support",                "Certificate of completion",                "30-day money-back guarantee"
+              ]
+            },
+            {
+              id: "professional",              title: "Professional",              price: "$299",              period: "/month",              imageSrc: "https://img.b2bpic.net/free-photo/front-view-bride-getting-ready-event_23-2149721976.jpg",              imageAlt: "Professional plan",              button: {
+                text: "Upgrade to Pro",                href: "contact"
+              },
+              features: [
+                "All Starter features",                "Access to all 20+ courses",                "1-on-1 mentorship",                "Priority support",                "Job placement assistance",                "Career coaching sessions"
+              ]
+            },
+            {
+              id: "enterprise",              title: "Enterprise",              price: "$999",              period: "/month",              imageSrc: "https://img.b2bpic.net/free-photo/beautiful-young-woman-making-make-up-near-mirror-home_1301-7637.jpg",              imageAlt: "Enterprise plan",              button: {
+                text: "Contact Sales",                href: "contact"
+              },
+              features: [
+                "All Professional features",                "Custom curriculum design",                "Dedicated success manager",                "Team training programs",                "Corporate partnerships",                "API access for integrations"
+              ]
+            }
+          ]}
+          animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground="noInvert"
         />
       </div>
-      <div id="hero_billboard_1" data-section="hero_billboard_1">
+
-        <HeroBillboard1
+      <div id="faq" data-section="faq">
-          title="Unlocking Peak Performance"
+        <FaqSplitText
-          background={{ variant: "plain" }}
+          sideTitle="Frequently Asked Questions"
+          sideDescription="Everything you need to know about TechAcademy courses, enrollment, and career support"
+          faqs={[
+            {
+              id: "1",              title: "How long are the courses?",              content: "Our courses range from 4 to 12 weeks depending on the program. Full-time immersive programs typically take 12 weeks, while part-time flexible programs can take 6-12 months. Each course includes live sessions, recorded content, and hands-on projects."
+            },
+            {
+              id: "2",              title: "Do I need prior coding experience?",              content: "No prior experience required! We offer beginner-friendly courses for absolute beginners and advanced tracks for experienced developers. Our curriculum is designed to take you from zero to job-ready."
+            },
+            {
+              id: "3",              title: "What is the job placement rate?",              content: "Our graduates have a 95% job placement rate within 3 months of completing their course. We provide career coaching, resume preparation, and direct partnerships with 50+ hiring companies."
+            },
+            {
+              id: "4",              title: "Can I learn part-time while working?",              content: "Absolutely! Our part-time programs are designed for working professionals. Classes are offered in the evenings and weekends with flexible scheduling options."
+            },
+            {
+              id: "5",              title: "What support do I get after graduation?",              content: "We provide lifetime career support including job board access, alumni network, monthly networking events, continued learning resources, and ongoing mentorship from our instructors."
+            },
+            {
+              id: "6",              title: "Is there a money-back guarantee?",              content: "Yes! All our plans include a 30-day money-back guarantee. If you're not satisfied with the course quality or learning experience, you can request a full refund."
+            }
+          ]}
+          textPosition="left"
+          useInvertedBackground="invertDefault"
+          animationType="smooth"
         />
       </div>
-      <div id="pricing_card_one" data-section="pricing_card_one">
+
-        <PricingCardOne
+      <div id="contact" data-section="contact">
-          carouselMode="auto"
+        <ContactSplitForm
-          animationType="none"
+          title="Ready to Start Your Tech Journey?"
-          title="Performance Plans"
+          description="Enroll in a course today and get 20% off your first month. Our enrollment team is here to answer any questions and help you choose the perfect program."
-          description="Choose the plan that meets your business needs and drives your success forward."
+          inputs={[
-          tag="Pricing"
+            { name: "fullName", type: "text", placeholder: "Your full name", required: true },
-          buttons={[{ label: "Basic", href: "#" }, { label: "Advanced", href: "#" }]}
+            { name: "email", type: "email", placeholder: "your.email@example.com", required: true },
-          textboxLayout="default"
+            { name: "phone", type: "tel", placeholder: "+1 (555) 000-0000", required: false },
+            { name: "courseInterest", type: "text", placeholder: "Which course interests you?", required: true }
+          ]}
+          textarea={{
+            name: "message",            placeholder: "Tell us about your learning goals and experience level...",            rows: 5,
+            required: false
+          }}
           useInvertedBackground="noInvert"
+          imageSrc="https://img.b2bpic.net/free-photo/cheerful-mature-call-center-operator-looking-laptop-screen_74855-4013.jpg"
+          imageAlt="Contact us for enrollment"
+          mediaPosition="right"
+          buttonText="Enroll Now"
         />
       </div>
 
       <div id="footer" data-section="footer">
-      <FooterBase1
-      title="Footer Base"
-      />
-      </div>
-      <div id="footer_media" data-section="footer_media">
         <FooterMedia
-          columns={[{ title: "Contact Us", description: "Get in touch with our expert team for assistance or to explore partnership opportunities." }, { title: "About Us", description: "Learn more about the journey of TechMasters Performance and our mission to elevate performance through technology." }]}
+          imageSrc="https://img.b2bpic.net/free-vector/digital-particle-flowing-mesh-technology-background_1017-28408.jpg"
-          copyrightText="© 2025 | Webild"
+          imageAlt="Technology background"
+          logoText="TechAcademy"
+          copyrightText="© 2025 TechAcademy. All rights reserved."
+          columns={[
+            {
+              title: "Programs",              items: [
+                { label: "Web Development", href: "#" },
+                { label: "Data Science", href: "#" },
+                { label: "Cloud Computing", href: "#" },
+                { label: "Cybersecurity", href: "#" }
+              ]
+            },
+            {
+              title: "Resources",              items: [
+                { label: "Course Catalog", href: "#" },
+                { label: "Blog & Articles", href: "#" },
+                { label: "Documentation", href: "#" },
+                { label: "Career Resources", href: "#" }
+              ]
+            },
+            {
+              title: "Company",              items: [
+                { label: "About Us", href: "#" },
+                { label: "Contact Support", href: "#" },
+                { label: "Partners", href: "#" },
+                { label: "Careers at TechAcademy", href: "#" }
+              ]
+            }
+          ]}
         />
-      </div>      <div id="split_about" data-section="split_about">
+      </div>
-        <SplitAbout
+    </ThemeProvider>
-          title="Our Philosophy"
-          description="At TechMasters Performance, we drive innovation and excellence to help you achieve your goals."
-          tag="Philosophy"
-          buttons={[{ label: "Learn More", href: "#" }, { label: "Contact Us", href: "#" }]}
-          imageSrc="https://placehold.co/600x400"
-          imagePosition="left"
-          textboxLayout="default"
-          useInvertedBackground="noInvert"
-        />
-      </div>    </ThemeProvider>
   );
 }

src/components/form/ContactForm.tsx

@@ -92,9 +92,6 @@ const ContactForm = ({
                     {termsText}
                 </p>
             </div>
-
-            {/* Inserted button element */}
-            <button className="mt-4 px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600">Contact Us</button>
         </div>
     );
 };

src/components/navbar/NavbarStyleCentered/NavbarStyleCentered.tsx

@@ -107,7 +107,6 @@ const NavbarStyleCentered = ({
           <Logo
             brandName={brandName}
           />
-          <span className="inline-block px-3 py-1 text-sm font-medium rounded-full bg-primary/10 text-primary">New</span>
           <HamburgerButton
             isActive={isActive}
             onClick={handleToggle}

src/components/sections/contact/ContactSplitForm.tsx

@@ -194,8 +194,6 @@ const ContactSplitForm = ({
                     {mediaPosition === "right" && mediaContent}
                 </div>
             </div>
-            <button className="mt-4 bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">Contact Us</button>
-            <button className="mt-4 bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">Text</button>
         </section>
     );
 };

src/components/sections/feature/FeatureCardTwentyTwo.tsx

@@ -9,7 +9,6 @@ import { useTheme } from "@/providers/themeProvider/ThemeProvider";
 import type { LucideIcon } from "lucide-react";
 import type { ButtonConfig, CardAnimationType, TitleSegment } from "@/components/cardStack/types";
 import type { TextboxLayout, InvertedBackground } from "@/providers/themeProvider/config/constants";
-import { Star } from "lucide-react";
 
 type FeatureItem = {
   id: string;
@@ -157,9 +156,6 @@ const FeatureCardTwentyTwo = ({
                   ))}
                 </div>
               </div>
-              <div className="absolute top-4 right-4">
-                <Star className="w-6 h-6 text-accent" />
-              </div>
             </article>
           ))}
         </div>

src/components/sections/hero/HeroBillboard.tsx

@@ -106,8 +106,6 @@ const HeroBillboard = ({
             imageClassName={cls("z-1", imageClassName)}
           />
         </div>
-        {/* Inserted button element */}
-        <button className="text-foreground">Text</button>
       </div>
     </section>
   );

src/components/sections/hero/HeroBillboardGallery.tsx

@@ -127,9 +127,7 @@ const HeroBillboardGallery = ({
           buttonTextClassName={buttonTextClassName}
           center={true}
         />
-        <div className="flex justify-center items-center mt-4">
+
-          <button className="bg-blue-500 text-white px-4 py-2 rounded">Text</button>
-        </div>
         <div className={cls("w-full", mediaWrapperClassName)}>
           <div className="block md:hidden -mx-[var(--content-padding)]">
             <AutoCarousel