Update src/app/workshops/page.tsx

Merge version_2 into main

src/app/classes/page.tsx

@@ -5,8 +5,6 @@ import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleAp
 import HeroBillboardScroll from "@/components/sections/hero/HeroBillboardScroll";
 import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
 import TestimonialCardOne from "@/components/sections/testimonial/TestimonialCardOne";
-import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
-import TeamCardFive from "@/components/sections/team/TeamCardFive";
 import FaqDouble from "@/components/sections/faq/FaqDouble";
 import FooterCard from "@/components/sections/footer/FooterCard";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
@@ -14,13 +12,12 @@ import {
   Sparkles,
   Zap,
   Award,
-  DollarSign,
+  BookOpen,
   Users,
   HelpCircle,
-  Calendar,
-  Lock,
-  BarChart3,
-  Smartphone,
+  Play,
+  Target,
+  TrendingUp,
   Twitter,
   Linkedin,
   Mail,
@@ -54,15 +51,15 @@ export default function ClassesPage() {
 
       <div id="hero" data-section="hero">
         <HeroBillboardScroll
-          title="Ongoing Classes for Continuous Learning"
-          description="Structured, semester-based classes that meet regularly to help you master subjects deeply. From beginner fundamentals to advanced specializations, find the perfect class for your learning journey."
-          tag="Class Catalog"
+          title="Ongoing Classes & Skill Development"
+          description="Enroll in comprehensive courses designed to build expertise over time. Learn from experienced instructors in a structured environment with support every step of the way."
+          tag="Continuous Learning"
           tagIcon={Sparkles}
           background={{ variant: "animated-grid" }}
           imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-banner-image-showing-a-dive-1773149958687-87f99901.jpg?_wi=1"
-          imageAlt="Professional training classroom environment"
+          imageAlt="Professional classroom training environment"
           buttons={[
-            { text: "Browse Classes", href: "#features" },
+            { text: "Browse All Classes", href: "/classes" },
             { text: "View Pricing", href: "/pricing" },
           ]}
           tagAnimation="slide-up"
@@ -72,29 +69,29 @@ export default function ClassesPage() {
 
       <div id="features" data-section="features">
         <FeatureHoverPattern
-          title="Class Features"
-          description="Everything you need for successful ongoing learning with structured progression"
+          title="Why Choose ClassHub Classes"
+          description="Structured learning paths with ongoing support and community engagement"
           tag="Class Benefits"
           tagIcon={Zap}
           features={[
             {
-              icon: Calendar,
-              title: "Flexible Scheduling",              description: "Classes meet at consistent times throughout the semester. Choose from morning, afternoon, or evening sessions. Weekday or weekend options available."},
+              icon: BookOpen,
+              title: "Structured Curriculum",              description: "Carefully designed courses build skills progressively. Each module builds on previous knowledge with clear learning objectives and milestones."},
+            {
+              icon: Play,
+              title: "Live & On-Demand Options",              description: "Attend live classes for real-time interaction or access recorded sessions. Never miss a class with our comprehensive video library and flexible replay access."},
             {
               icon: Users,
-              title: "Community Learning",              description: "Build relationships with fellow students and instructors. Collaborative projects and group discussions enhance your learning experience."},
+              title: "Community Support",              description: "Connect with classmates in dedicated forums. Collaborate on projects, share experiences, and build professional networks with peers in your field."},
             {
-              icon: BarChart3,
-              title: "Progress Tracking",              description: "Monitor your advancement with regular assessments and feedback. Personalized learning paths adapted to your pace and goals."},
+              icon: Target,
+              title: "Goal-Oriented Learning",              description: "Clear outcomes with measurable progress tracking. Know exactly what you'll achieve and monitor your advancement through personalized learning dashboards."},
+            {
+              icon: TrendingUp,
+              title: "Career Advancement",              description: "Develop skills employers value. Gain credentials that boost your resume and open doors to new opportunities in your industry."},
             {
               icon: Award,
-              title: "Structured Curriculum",              description: "Follow a proven learning progression from fundamentals to advanced topics. Each class builds on previous concepts systematically."},
-            {
-              icon: Lock,
-              title: "Support Resources",              description: "Access office hours, tutoring sessions, and peer study groups. Comprehensive support materials and discussion forums."},
-            {
-              icon: Smartphone,
-              title: "Multi-Format Options",              description: "Choose between in-person, hybrid, or fully online classes. Switch formats as needed to accommodate your schedule."},
+              title: "Completion Recognition",              description: "Earn certificates and badges demonstrating mastery. Share achievements on LinkedIn and professional profiles to showcase your expertise."},
           ]}
           animationType="slide-up"
           textboxLayout="default"
@@ -104,9 +101,9 @@ export default function ClassesPage() {
 
       <div id="testimonials" data-section="testimonials">
         <TestimonialCardOne
-          title="Class Success Stories"
-          description="Students sharing their experiences in our ongoing classes and their learning achievements"
-          tag="Student Achievements"
+          title="Transformation Through Classes"
+          description="Real people sharing how our structured classes changed their careers and lives"
+          tag="Student Testimonials"
           tagIcon={Award}
           testimonials={[
             {
@@ -135,89 +132,29 @@ export default function ClassesPage() {
         />
       </div>
 
-      <div id="pricing" data-section="pricing">
-        <PricingCardOne
-          title="Class Pricing Plans"
-          description="Affordable pricing for ongoing classes. All plans include instructor-led sessions, course materials, and community access."
-          tag="Class Subscriptions"
-          tagIcon={DollarSign}
-          plans={[
-            {
-              id: "1",              badge: "Starter",              badgeIcon: Sparkles,
-              price: "$9.99/mo",              subtitle: "Perfect for casual learners",              features: [
-                "Access to all classes",                "Book up to 4 classes per month",                "Student community forum",                "Digital materials",                "Basic progress tracking"],
-            },
-            {
-              id: "2",              badge: "Popular",              badgeIcon: Zap,
-              price: "$24.99/mo",              subtitle: "Ideal for dedicated students",              features: [
-                "Unlimited class access",                "Priority instructor support",                "Office hours & tutoring",                "Advanced analytics",                "Certificates of completion",                "Peer study groups"],
-            },
-            {
-              id: "3",              badge: "Professional",              badgeIcon: Award,
-              price: "$49.99/mo",              subtitle: "For career advancement",              features: [
-                "Everything in Popular",                "1-on-1 mentorship",                "Custom learning pathways",                "Career counseling",                "Exclusive masterclasses",                "Priority course registration"],
-            },
-            {
-              id: "4",              badge: "Team License",              badgeIcon: Users,
-              price: "$299/month",              subtitle: "For organizations & groups",              features: [
-                "Up to 10 team members",                "Team analytics dashboard",                "Group discounts",                "Custom class planning",                "Admin management tools",                "Dedicated support"],
-            },
-          ]}
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-        />
-      </div>
-
-      <div id="team" data-section="team">
-        <TeamCardFive
-          title="Class Instructors"
-          description="Experienced educators committed to student success and ongoing learning support"
-          tag="Teaching Excellence"
-          tagIcon={Users}
-          team={[
-            {
-              id: "1",              name: "Margaret Johnson",              role: "Piano Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-piano-instruc-1773149958833-7e1afaf0.png?_wi=1",              imageAlt: "Margaret Johnson piano instructor"},
-            {
-              id: "2",              name: "Jessica Lee",              role: "Dance Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-dance-instruc-1773149955255-d32fb4cc.jpg?_wi=1",              imageAlt: "Jessica Lee dance instructor"},
-            {
-              id: "3",              name: "Marcus Williams",              role: "Yoga Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-yoga-instruct-1773149958540-4c8fc93c.jpg?_wi=1",              imageAlt: "Marcus Williams yoga instructor"},
-            {
-              id: "4",              name: "Sofia Rossi",              role: "Art Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-an-art-instruct-1773149958976-9ea3327d.png?_wi=1",              imageAlt: "Sofia Rossi art instructor"},
-            {
-              id: "5",              name: "Ahmed Hassan",              role: "Language Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-language-inst-1773149958360-43c50b1b.jpg?_wi=1",              imageAlt: "Ahmed Hassan language instructor"},
-            {
-              id: "6",              name: "Lisa Anderson",              role: "Fitness Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-fitness-instr-1773149958873-1119546c.png?_wi=1",              imageAlt: "Lisa Anderson fitness instructor"},
-          ]}
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-        />
-      </div>
-
       <div id="faq" data-section="faq">
         <FaqDouble
-          title="Classes FAQ"
-          description="Frequently asked questions about class enrollment, schedules, and the ongoing learning experience"
-          tag="Help & Support"
+          title="Classes FAQs"
+          description="Everything you need to know about enrolling and attending our ongoing classes"
+          tag="Class Help"
           tagIcon={HelpCircle}
           faqs={[
             {
-              id: "1",              title: "What is the difference between classes and workshops?",              content: "Classes are ongoing, semester-based courses that meet regularly (weekly or bi-weekly) for deeper learning over time. Workshops are intensive, short-term learning experiences. Classes are better for comprehensive understanding, while workshops focus on rapid skill acquisition."},
+              id: "1",              title: "How long do classes typically run?",              content: "Most classes run for 8-16 weeks with 1-3 sessions per week. Each class specifies its duration when you enroll. You can see the exact start and end dates, total hours, and session schedule before registering."},
             {
-              id: "2",              title: "How long do classes typically run?",              content: "Most classes run for one semester (12-16 weeks) meeting once or twice per week. Some beginner classes are 8 weeks, and advanced specializations may span multiple semesters. You can see the duration in each class listing."},
+              id: "2",              title: "Can I join a class that has already started?",              content: "Some classes accept late enrollments during the first 2 weeks. You'll receive access to recorded sessions from earlier classes to catch up. Check each course page to see if late enrollment is available."},
             {
-              id: "3",              title: "Can I join a class mid-semester?",              content: "It depends on the class. Some classes allow late enrollment with catch-up materials provided. Others require starting from the beginning. Check with individual class instructors about their enrollment policies."},
+              id: "3",              title: "What if I fall behind?",              content: "We offer catch-up support including recorded session videos, one-on-one mentoring, and extended access to learning materials. Contact your instructor if you need help staying on track."},
             {
-              id: "4",              title: "What happens if I miss a class session?",              content: "Most classes provide recorded sessions and materials for missed classes. You can catch up at your own pace. However, active participation is important for group discussion and collaborative projects."},
+              id: "4",              title: "Are classes live or recorded?",              content: "Most classes are live with instructors. Live sessions are recorded and available on-demand if you miss them. Some intensive sessions are structured exclusively as live experiences for maximum interaction."},
             {
-              id: "5",              title: "Do I need prerequisites for advanced classes?",              content: "Yes, advanced classes typically require completion of foundational courses or equivalent experience. We offer beginner, intermediate, and advanced levels. Check prerequisites in the class description."},
+              id: "5",              title: "What if I need to skip a session?",              content: "You can typically skip up to 2 sessions without penalty and access recordings later. More than 2 absences may affect certification eligibility depending on course requirements. Always contact your instructor in advance."},
             {
-              id: "6",              title: "How are grades or progress measured?",              content: "Progress is tracked through assignments, projects, assessments, and participation. You receive regular feedback from instructors. Upon completion, you can earn a certificate if you meet course requirements."},
+              id: "6",              title: "How much time should I dedicate per week?",              content: "Plan for 4-6 hours per week for typical classes, including live sessions and homework. Intensive courses may require up to 10 hours. Course descriptions specify expected time commitment so you can plan accordingly."},
             {
-              id: "7",              title: "Can I change my enrollment or drop a class?",              content: "Yes, you can drop within the first 2 weeks for a full refund. After that, you can audit the class or request a transfer to another session. Changes must be made through your student dashboard."},
+              id: "7",              title: "Will I get feedback on my work?",              content: "Yes! Instructors provide personalized feedback on assignments and projects. You'll also get peer feedback through group discussions and collaborative assignments with classmates."},
             {
-              id: "8",              title: "What support is available during the class?",              content: "Instructors hold weekly office hours, and tutoring support is available. You also have access to peer study groups, forums, and community resources. Professional and premium tier subscribers get priority support."},
+              id: "8",              title: "Can I transfer to a different class section?",              content: "Yes, you can transfer to another section of the same class at no additional cost if spots are available. Changes must be made at least 48 hours before your current class starts. Contact support to arrange transfers."},
           ]}
           faqsAnimation="slide-up"
           textboxLayout="default"

src/app/login/page.tsx

@@ -3,11 +3,8 @@
 import Link from "next/link";
 import { useState } from "react";
 import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
-import Input from "@/components/form/Input";
-import ButtonExpandHover from "@/components/button/ButtonExpandHover";
-import FooterCard from "@/components/sections/footer/FooterCard";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import { Mail, Lock, Twitter, Linkedin } from "lucide-react";
+import { Mail, Lock, ArrowRight } from "lucide-react";
 
 const navItems = [
   { name: "Home", id: "/" },
@@ -20,22 +17,26 @@ const navItems = [
 export default function LoginPage() {
   const [email, setEmail] = useState("");
   const [password, setPassword] = useState("");
-  const [loading, setLoading] = useState(false);
+  const [isLoading, setIsLoading] = useState(false);
   const [error, setError] = useState("");
 
-  const handleLogin = async (e: React.FormEvent) => {
+  const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
-    setLoading(true);
     setError("");
-    
+    setIsLoading(true);
+
     try {
-      // Placeholder for login logic
-      console.log("Login attempt with:", { email, password });
-      // Add your login API call here
+      // Placeholder for actual login logic
+      if (!email || !password) {
+        setError("Please fill in all fields");
+        return;
+      }
+      // API call would go here
+      console.log("Login attempt:", { email, password });
     } catch (err) {
       setError("Login failed. Please try again.");
     } finally {
-      setLoading(false);
+      setIsLoading(false);
     }
   };
 
@@ -56,98 +57,122 @@ export default function LoginPage() {
         <NavbarStyleApple brandName="ClassHub" navItems={navItems} />
       </div>
 
-      <div className="min-h-screen flex items-center justify-center px-4 py-20">
+      <div id="login" data-section="login" className="min-h-screen flex items-center justify-center py-20 px-4">
         <div className="w-full max-w-md">
-          <div className="mb-8 text-center">
-            <h1 className="text-4xl font-bold mb-2">Welcome Back</h1>
-            <p className="text-foreground/70">Sign in to your ClassHub account</p>
-          </div>
+          <div className="bg-card rounded-2xl p-8 shadow-lg border border-foreground/10">
+            {/* Header */}
+            <div className="mb-8">
+              <h1 className="text-3xl font-bold text-foreground mb-2">Welcome Back</h1>
+              <p className="text-foreground/60">Sign in to your ClassHub account</p>
+            </div>
 
-          <form onSubmit={handleLogin} className="space-y-6">
+            {/* Error Message */}
             {error && (
-              <div className="bg-red-500/10 border border-red-500/20 rounded-lg p-4 text-red-600 text-sm">
-                {error}
+              <div className="mb-6 p-4 bg-red-500/10 border border-red-500/30 rounded-lg">
+                <p className="text-red-500 text-sm">{error}</p>
               </div>
             )}
 
-            <div>
-              <label className="block text-sm font-medium mb-2">Email Address</label>
-              <Input
-                type="email"
-                value={email}
-                onChange={(value) => setEmail(value)}
-                placeholder="you@example.com"
-                required
-              />
+            {/* Form */}
+            <form onSubmit={handleSubmit} className="space-y-5">
+              {/* Email Field */}
+              <div>
+                <label htmlFor="email" className="block text-sm font-medium text-foreground mb-2">
+                  Email Address
+                </label>
+                <div className="relative">
+                  <Mail className="absolute left-3 top-3 w-5 h-5 text-foreground/40" />
+                  <input
+                    id="email"
+                    type="email"
+                    value={email}
+                    onChange={(e) => setEmail(e.target.value)}
+                    placeholder="you@example.com"
+                    className="w-full pl-10 pr-4 py-2.5 bg-background border border-foreground/10 rounded-lg text-foreground placeholder:text-foreground/40 focus:outline-none focus:ring-2 focus:ring-primary-cta/50"
+                    disabled={isLoading}
+                  />
+                </div>
+              </div>
+
+              {/* Password Field */}
+              <div>
+                <div className="flex justify-between items-center mb-2">
+                  <label htmlFor="password" className="block text-sm font-medium text-foreground">
+                    Password
+                  </label>
+                  <Link
+                    href="#forgot-password"
+                    className="text-sm text-primary-cta hover:text-primary-cta/80 transition-colors"
+                  >
+                    Forgot?
+                  </Link>
+                </div>
+                <div className="relative">
+                  <Lock className="absolute left-3 top-3 w-5 h-5 text-foreground/40" />
+                  <input
+                    id="password"
+                    type="password"
+                    value={password}
+                    onChange={(e) => setPassword(e.target.value)}
+                    placeholder="••••••••"
+                    className="w-full pl-10 pr-4 py-2.5 bg-background border border-foreground/10 rounded-lg text-foreground placeholder:text-foreground/40 focus:outline-none focus:ring-2 focus:ring-primary-cta/50"
+                    disabled={isLoading}
+                  />
+                </div>
+              </div>
+
+              {/* Submit Button */}
+              <button
+                type="submit"
+                disabled={isLoading}
+                className="w-full mt-6 px-4 py-3 bg-primary-cta hover:bg-primary-cta/90 text-foreground rounded-lg font-medium transition-all duration-200 flex items-center justify-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed"
+              >
+                {isLoading ? "Signing in..." : "Sign In"}
+                <ArrowRight className="w-4 h-4" />
+              </button>
+            </form>
+
+            {/* Divider */}
+            <div className="my-6 flex items-center gap-3">
+              <div className="flex-1 h-px bg-foreground/10"></div>
+              <span className="text-xs text-foreground/40">OR</span>
+              <div className="flex-1 h-px bg-foreground/10"></div>
             </div>
 
-            <div>
-              <label className="block text-sm font-medium mb-2">Password</label>
-              <Input
-                type="password"
-                value={password}
-                onChange={(value) => setPassword(value)}
-                placeholder="Enter your password"
-                required
-              />
+            {/* Social Login */}
+            <div className="space-y-3">
+              <button className="w-full px-4 py-2.5 border border-foreground/10 rounded-lg text-foreground hover:bg-foreground/5 transition-colors flex items-center justify-center gap-2 text-sm font-medium">
+                <svg className="w-4 h-4" viewBox="0 0 24 24" fill="currentColor">
+                  <path d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z" />
+                  <path d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" />
+                  <path d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z" />
+                  <path d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z" />
+                </svg>
+                Google
+              </button>
+              <button className="w-full px-4 py-2.5 border border-foreground/10 rounded-lg text-foreground hover:bg-foreground/5 transition-colors flex items-center justify-center gap-2 text-sm font-medium">
+                <svg className="w-4 h-4" viewBox="0 0 24 24" fill="currentColor">
+                  <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v 3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z" />
+                </svg>
+                GitHub
+              </button>
             </div>
 
-            <div className="flex items-center justify-between text-sm">
-              <label className="flex items-center">
-                <input type="checkbox" className="mr-2" />
-                <span>Remember me</span>
-              </label>
-              <Link href="/forgot-password" className="text-primary-cta hover:underline">
-                Forgot password?
-              </Link>
-            </div>
-
-            <button
-              type="submit"
-              disabled={loading}
-              className="w-full bg-primary-cta text-background py-3 rounded-lg font-medium hover:opacity-90 transition disabled:opacity-50"
-            >
-              {loading ? "Signing in..." : "Sign In"}
-            </button>
-          </form>
-
-          <div className="mt-6 text-center text-sm">
-            <p className="text-foreground/70">
+            {/* Footer */}
+            <p className="text-center text-sm text-foreground/60 mt-6">
               Don't have an account?{" "}
-              <Link href="/register" className="text-primary-cta hover:underline font-medium">
-                Create one here
+              <Link href="/register" className="text-primary-cta hover:text-primary-cta/80 font-medium transition-colors">
+                Sign up
               </Link>
             </p>
           </div>
 
-          <div className="mt-8 pt-8 border-t border-foreground/10">
-            <p className="text-center text-sm text-foreground/50 mb-4">Or continue with</p>
-            <div className="flex gap-4 justify-center">
-              <button className="flex-1 py-2 px-4 rounded-lg bg-card hover:bg-card/80 transition text-sm font-medium">
-                Google
-              </button>
-              <button className="flex-1 py-2 px-4 rounded-lg bg-card hover:bg-card/80 transition text-sm font-medium">
-                GitHub
-              </button>
-            </div>
+          {/* Additional Info */}
+          <div className="text-center mt-8 text-xs text-foreground/40">
+            <p>By signing in, you agree to our Terms of Service and Privacy Policy</p>
           </div>
         </div>
       </div>
-
-      <div id="footer" data-section="footer">
-        <FooterCard
-          logoText="ClassHub"
-          copyrightText="© 2025 ClassHub. All rights reserved. Empowering learners worldwide."
-          socialLinks={[
-            {
-              icon: Twitter,
-              href: "https://twitter.com/classhub",              ariaLabel: "Follow ClassHub on Twitter"},
-            {
-              icon: Linkedin,
-              href: "https://linkedin.com/company/classhub",              ariaLabel: "Follow ClassHub on LinkedIn"},
-          ]}
-        />
-      </div>
     </ThemeProvider>
   );
-}
+}

src/app/page.tsx

@@ -244,4 +244,4 @@ export default function HomePage() {
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/pricing/page.tsx

@@ -3,28 +3,20 @@
 import Link from "next/link";
 import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
 import HeroBillboardScroll from "@/components/sections/hero/HeroBillboardScroll";
-import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
-import TestimonialCardOne from "@/components/sections/testimonial/TestimonialCardOne";
 import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
-import TeamCardFive from "@/components/sections/team/TeamCardFive";
 import FaqDouble from "@/components/sections/faq/FaqDouble";
 import FooterCard from "@/components/sections/footer/FooterCard";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import {
   Sparkles,
+  DollarSign,
+  HelpCircle,
   Zap,
   Award,
-  DollarSign,
   Users,
-  HelpCircle,
-  Calendar,
-  Lock,
-  BarChart3,
-  Smartphone,
   Twitter,
   Linkedin,
   Mail,
-  CheckCircle,
 } from "lucide-react";
 
 const navItems = [
@@ -56,14 +48,14 @@ export default function PricingPage() {
       <div id="hero" data-section="hero">
         <HeroBillboardScroll
           title="Simple, Transparent Pricing"
-          description="Choose the perfect plan for your learning goals. Scale from casual learner to professional educator with flexible pricing that grows with you."
-          tag="Plans for Everyone"
+          description="Choose the perfect plan for your learning goals. No hidden fees, no surprise charges. Cancel anytime. All prices shown include access to our complete platform."
+          tag="Affordable Learning"
           tagIcon={Sparkles}
           background={{ variant: "animated-grid" }}
           imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-banner-image-showing-a-dive-1773149958687-87f99901.jpg?_wi=1"
-          imageAlt="Professional pricing planning environment"
+          imageAlt="Pricing plans presentation"
           buttons={[
-            { text: "View All Plans", href: "#pricing" },
+            { text: "Start Learning Today", href: "/classes" },
             { text: "Contact Sales", href: "/contact" },
           ]}
           tagAnimation="slide-up"
@@ -71,64 +63,32 @@ export default function PricingPage() {
         />
       </div>
 
-      <div id="features" data-section="features">
-        <FeatureHoverPattern
-          title="What's Included"
-          description="All plans include core platform features with increasing levels of support and access"
-          tag="Plan Comparison"
-          tagIcon={Zap}
-          features={[
-            {
-              icon: Calendar,
-              title: "Access to Content",              description: "All plans include access to our full catalog of workshops and classes. Browse, filter, and register for courses that match your interests and schedule."},
-            {
-              icon: Users,
-              title: "Community & Support",              description: "Join our learning community with peer forums, discussion groups, and networking opportunities. Support level varies by plan tier."},
-            {
-              icon: Award,
-              title: "Certificates",              description: "Earn recognized certificates upon course completion. Paid plans include certificates; free tier includes basic completion badges."},
-            {
-              icon: Lock,
-              title: "Secure Platform",              description: "Enterprise-grade security protects your data and learning progress. All plans include SSL encryption and secure authentication."},
-            {
-              icon: BarChart3,
-              title: "Progress Tracking",              description: "Monitor your learning journey with progress analytics and personalized recommendations. Premium tiers include advanced analytics."},
-            {
-              icon: Smartphone,
-              title: "Multi-Device Access",              description: "Learn on your terms across desktop, tablet, and mobile. Fully responsive platform designed for all devices."},
-          ]}
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-        />
-      </div>
-
       <div id="pricing" data-section="pricing">
         <PricingCardOne
           title="Our Pricing Plans"
-          description="Choose the plan that fits your learning path. All plans can be upgraded or downgraded anytime."
-          tag="Flexible & Affordable"
+          description="Transparent pricing designed to fit every budget and learning style. Choose annual billing for 20% savings on any plan."
+          tag="Flexible Plans"
           tagIcon={DollarSign}
           plans={[
             {
-              id: "1",              badge: "Free",              badgeIcon: Sparkles,
-              price: "$0/mo",              subtitle: "Start learning",              features: [
-                "Browse all courses",                "1 free class access",                "Community forums",                "Basic profile",                "Mobile app access"],
+              id: "1",              badge: "Popular",              badgeIcon: Sparkles,
+              price: "$9.99/mo",              subtitle: "Perfect for casual learners",              features: [
+                "Access to all workshops",                "Book up to 5 classes per month",                "Student community forum",                "Mobile app access",                "Basic progress tracking"],
             },
             {
-              id: "2",              badge: "Popular",              badgeIcon: Zap,
-              price: "$14.99/mo",              subtitle: "Most popular choice",              features: [
-                "Unlimited class access",                "5 workshops per month",                "Email support",                "Course certificates",                "Priority booking",                "Offline access"],
+              id: "2",              badge: "Best Value",              badgeIcon: Zap,
+              price: "$24.99/mo",              subtitle: "Ideal for dedicated students",              features: [
+                "Unlimited class bookings",                "Priority instructor support",                "Advanced progress analytics",                "Certificate of completion",                "Video replay access",                "Networking events"],
             },
             {
               id: "3",              badge: "Professional",              badgeIcon: Award,
-              price: "$49.99/mo",              subtitle: "For career growth",              features: [
-                "Unlimited access",                "Priority support",                "1-on-1 mentoring",                "Custom learning paths",                "Career counseling",                "Advanced analytics"],
+              price: "$49.99/mo",              subtitle: "For career advancement",              features: [
+                "Everything in Pro plan",                "1-on-1 mentorship sessions",                "Custom learning pathways",                "Career placement assistance",                "Exclusive workshops",                "Priority booking access"],
             },
             {
-              id: "4",              badge: "Educator License",              badgeIcon: Users,
-              price: "$99.99/mo",              subtitle: "Teach & earn",              features: [
-                "Create courses",                "Student management",                "Revenue dashboard",                "Marketing tools",                "24/7 support",                "API access"],
+              id: "4",              badge: "Teacher License",              badgeIcon: Users,
+              price: "$99.99/mo",              subtitle: "Teach and earn",              features: [
+                "Create & manage classes",                "Student management tools",                "Booking analytics dashboard",                "Revenue tracking",                "Marketing support",                "24/7 technical support"],
             },
           ]}
           animationType="slide-up"
@@ -137,88 +97,29 @@ export default function PricingPage() {
         />
       </div>
 
-      <div id="testimonials" data-section="testimonials">
-        <TestimonialCardOne
-          title="Why Choose ClassHub"
-          description="Real students share what they love about our platform and pricing"
-          tag="Customer Love"
-          tagIcon={Award}
-          testimonials={[
-            {
-              id: "1",              name: "Sarah Chen",              role: "Software Engineer",              company: "Tech Startup",              rating: 5,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/portrait-photograph-of-a-professional-wo-1773149958697-b0d1653b.png?_wi=1",              imageAlt: "Sarah Chen professional portrait"},
-            {
-              id: "2",              name: "Michael Rodriguez",              role: "Creative Director",              company: "Design Agency",              rating: 5,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/portrait-photograph-of-a-professional-ma-1773149960412-c73ce951.png?_wi=1",              imageAlt: "Michael Rodriguez professional portrait"},
-            {
-              id: "3",              name: "Emily Watson",              role: "Marketing Manager",              company: "E-Commerce Business",              rating: 5,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/portrait-photograph-of-a-young-professio-1773149959161-e0640722.png?_wi=1",              imageAlt: "Emily Watson professional portrait"},
-            {
-              id: "4",              name: "David Kim",              role: "Freelance Developer",              company: "Independent",              rating: 5,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/portrait-photograph-of-a-professional-ma-1773149958765-b75148e4.png?_wi=1",              imageAlt: "David Kim professional portrait"},
-            {
-              id: "5",              name: "Jessica Thompson",              role: "Product Manager",              company: "SaaS Company",              rating: 5,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/portrait-photograph-of-a-diverse-profess-1773149958342-9fec15d1.jpg?_wi=1",              imageAlt: "Jessica Thompson professional portrait"},
-            {
-              id: "6",              name: "James Morrison",              role: "Business Consultant",              company: "Management Consulting",              rating: 5,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/portrait-photograph-of-a-professional-ma-1773149959785-c28fc4c1.png?_wi=1",              imageAlt: "James Morrison professional portrait"},
-          ]}
-          gridVariant="uniform-all-items-equal"
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-        />
-      </div>
-
-      <div id="team" data-section="team">
-        <TeamCardFive
-          title="Trusted by Thousands"
-          description="Join students and educators from around the world learning on ClassHub"
-          tag="Our Community"
-          tagIcon={Users}
-          team={[
-            {
-              id: "1",              name: "Margaret Johnson",              role: "Piano Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-piano-instruc-1773149958833-7e1afaf0.png?_wi=1",              imageAlt: "Margaret Johnson piano instructor"},
-            {
-              id: "2",              name: "Jessica Lee",              role: "Dance Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-dance-instruc-1773149955255-d32fb4cc.jpg?_wi=1",              imageAlt: "Jessica Lee dance instructor"},
-            {
-              id: "3",              name: "Marcus Williams",              role: "Yoga Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-yoga-instruct-1773149958540-4c8fc93c.jpg?_wi=1",              imageAlt: "Marcus Williams yoga instructor"},
-            {
-              id: "4",              name: "Sofia Rossi",              role: "Art Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-an-art-instruct-1773149958976-9ea3327d.png?_wi=1",              imageAlt: "Sofia Rossi art instructor"},
-            {
-              id: "5",              name: "Ahmed Hassan",              role: "Language Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-language-inst-1773149958360-43c50b1b.jpg?_wi=1",              imageAlt: "Ahmed Hassan language instructor"},
-            {
-              id: "6",              name: "Lisa Anderson",              role: "Fitness Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-fitness-instr-1773149958873-1119546c.png?_wi=1",              imageAlt: "Lisa Anderson fitness instructor"},
-          ]}
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-        />
-      </div>
-
       <div id="faq" data-section="faq">
         <FaqDouble
-          title="Pricing FAQ"
-          description="Common questions about our plans, billing, and account management"
-          tag="Questions Answered"
+          title="Pricing FAQs"
+          description="Get answers to common questions about our pricing, billing, and subscription management"
+          tag="Pricing Help"
           tagIcon={HelpCircle}
           faqs={[
             {
-              id: "1",              title: "Can I change my plan anytime?",              content: "Yes! You can upgrade or downgrade your plan anytime. Changes take effect on your next billing cycle. If you upgrade, you'll get an immediate credit for unused days on your current plan."},
+              id: "1",              title: "Can I change my plan anytime?",              content: "Yes! You can upgrade or downgrade your plan at any time. Changes take effect immediately for upgrades. Downgrades apply at the start of your next billing cycle, and we'll prorate any overpayment."},
             {
-              id: "2",              title: "What payment methods do you accept?",              content: "We accept all major credit cards (Visa, Mastercard, American Express), PayPal, and bank transfers. All payments are processed securely through industry-standard encryption."},
+              id: "2",              title: "Is there an annual billing discount?",              content: "Yes! Annual subscriptions include a 20% discount on the monthly price. For example, the Pro plan costs $239.88/year instead of $299.88. Pay for 10 months and get 2 months free!"},
             {
-              id: "3",              title: "Do you offer annual subscriptions?",              content: "Yes! Annual subscriptions save you 20% compared to monthly pricing. You can switch to annual billing in your account settings. Annual subscriptions auto-renew each year."},
+              id: "3",              title: "What payment methods do you accept?",              content: "We accept all major credit cards (Visa, Mastercard, American Express), PayPal, and bank transfers for annual plans. All transactions are secured with SSL encryption. Invoices are provided automatically after each payment."},
             {
-              id: "4",              title: "What if I want to cancel my subscription?",              content: "You can cancel anytime with no penalties or hidden fees. Cancel through your account settings. You'll retain access until the end of your current billing period."},
+              id: "4",              title: "Is there a free trial?",              content: "Yes! All new users get a 7-day free trial of any plan. No credit card required to start. Cancel anytime within 7 days with no charges. After the trial ends, you'll be charged the plan price you selected."},
             {
-              id: "5",              title: "Do you offer discounts for teams or organizations?",              content: "Yes! We offer special volume pricing for teams of 10+ members or organizations. Contact our sales team at sales@classhub.com for a custom quote."},
+              id: "5",              title: "Do you offer group or team discounts?",              content: "Absolutely! Groups of 5 or more get special pricing. Corporate teams receive custom pricing, single sign-on, admin dashboard, and dedicated support. Contact our sales team for enterprise packages."},
             {
-              id: "6",              title: "Is there a free trial?",              content: "We offer a Free plan with limited features that never expires. You can also try a paid plan for 7 days with a full refund if not satisfied."},
+              id: "6",              title: "What's your refund policy?",              content: "We offer a 30-day money-back guarantee if you're not completely satisfied. If you purchased a subscription and want a refund, contact support within 30 days. Refunds are processed within 5-7 business days."},
             {
-              id: "7",              title: "What happens if I don't use my monthly booking credits?",              content: "Credits are monthly and don't roll over. However, if you upgrade to unlimited access, you'll never need to worry about booking limits."},
+              id: "7",              title: "Will I be charged when my trial ends?",              content: "Yes, if you don't cancel before your trial expires, your payment method will be charged for the plan you selected. You'll receive email reminders 7 days and 1 day before your trial ends."},
             {
-              id: "8",              title: "Are there any hidden fees?",              content: "No! Our pricing is completely transparent. The price you see is what you pay—no hidden fees, no surprise charges. Your invoice clearly breaks down what you're paying for."},
+              id: "8",              title: "Can I cancel my subscription?",              content: "Yes, cancel anytime from your account settings. Your access continues through the end of your billing period. You won't be charged again unless you reactivate your subscription."},
           ]}
           faqsAnimation="slide-up"
           textboxLayout="default"

src/app/register/page.tsx

@@ -3,11 +3,8 @@
 import Link from "next/link";
 import { useState } from "react";
 import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
-import Input from "@/components/form/Input";
-import ButtonExpandHover from "@/components/button/ButtonExpandHover";
-import FooterCard from "@/components/sections/footer/FooterCard";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import { Mail, Lock, User, Twitter, Linkedin } from "lucide-react";
+import { Mail, Lock, User, CheckCircle2, ArrowRight } from "lucide-react";
 
 const navItems = [
   { name: "Home", id: "/" },
@@ -17,43 +14,73 @@ const navItems = [
   { name: "Contact", id: "/contact" },
 ];
 
+interface PasswordStrength {
+  score: number;
+  label: string;
+  color: string;
+}
+
+const getPasswordStrength = (password: string): PasswordStrength => {
+  if (password.length < 6) return { score: 0, label: "Too weak", color: "bg-red-500" };
+  if (password.length < 8) return { score: 1, label: "Weak", color: "bg-orange-500" };
+  if (!/[A-Z]/.test(password) || !/[0-9]/.test(password)) return { score: 2, label: "Fair", color: "bg-yellow-500" };
+  if (!/[^a-zA-Z0-9]/.test(password)) return { score: 3, label: "Good", color: "bg-blue-500" };
+  return { score: 4, label: "Strong", color: "bg-green-500" };
+};
+
 export default function RegisterPage() {
-  const [formData, setFormData] = useState({
-    firstName: "",    lastName: "",    email: "",    password: "",    confirmPassword: ""});
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState("");
+  const [fullName, setFullName] = useState("");
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
   const [agreeToTerms, setAgreeToTerms] = useState(false);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState("");
+  const [success, setSuccess] = useState(false);
 
-  const handleChange = (field: string, value: string) => {
-    setFormData((prev) => ({
-      ...prev,
-      [field]: value,
-    }));
-  };
+  const passwordStrength = getPasswordStrength(password);
 
-  const handleRegister = async (e: React.FormEvent) => {
+  const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
     setError("");
 
-    if (formData.password !== formData.confirmPassword) {
+    // Validation
+    if (!fullName || !email || !password || !confirmPassword) {
+      setError("Please fill in all fields");
+      return;
+    }
+
+    if (password !== confirmPassword) {
       setError("Passwords do not match");
       return;
     }
 
-    if (!agreeToTerms) {
-      setError("You must agree to the terms and conditions");
+    if (password.length < 8) {
+      setError("Password must be at least 8 characters long");
       return;
     }
 
-    setLoading(true);
+    if (!agreeToTerms) {
+      setError("You must agree to the Terms of Service and Privacy Policy");
+      return;
+    }
+
+    setIsLoading(true);
+
     try {
-      // Placeholder for registration logic
-      console.log("Registration attempt with:", formData);
-      // Add your registration API call here
+      // Placeholder for actual registration logic
+      console.log("Registration attempt:", { fullName, email, password });
+      setSuccess(true);
+      // Reset form
+      setFullName("");
+      setEmail("");
+      setPassword("");
+      setConfirmPassword("");
+      setAgreeToTerms(false);
     } catch (err) {
       setError("Registration failed. Please try again.");
     } finally {
-      setLoading(false);
+      setIsLoading(false);
     }
   };
 
@@ -74,142 +101,194 @@ export default function RegisterPage() {
         <NavbarStyleApple brandName="ClassHub" navItems={navItems} />
       </div>
 
-      <div className="min-h-screen flex items-center justify-center px-4 py-20">
+      <div id="register" data-section="register" className="min-h-screen flex items-center justify-center py-20 px-4">
         <div className="w-full max-w-md">
-          <div className="mb-8 text-center">
-            <h1 className="text-4xl font-bold mb-2">Create Account</h1>
-            <p className="text-foreground/70">Join ClassHub and start learning today</p>
-          </div>
-
-          <form onSubmit={handleRegister} className="space-y-4">
-            {error && (
-              <div className="bg-red-500/10 border border-red-500/20 rounded-lg p-4 text-red-600 text-sm">
-                {error}
+          <div className="bg-card rounded-2xl p-8 shadow-lg border border-foreground/10">
+            {/* Success State */}
+            {success ? (
+              <div className="text-center py-8">
+                <div className="w-16 h-16 bg-green-500/10 rounded-full flex items-center justify-center mx-auto mb-4">
+                  <CheckCircle2 className="w-8 h-8 text-green-500" />
+                </div>
+                <h2 className="text-2xl font-bold text-foreground mb-2">Welcome to ClassHub!</h2>
+                <p className="text-foreground/60 mb-6">Your account has been created successfully. Please check your email to verify your address.</p>
+                <Link
+                  href="/login"
+                  className="inline-flex items-center gap-2 px-6 py-3 bg-primary-cta hover:bg-primary-cta/90 text-foreground rounded-lg font-medium transition-all"
+                >
+                  Go to Login
+                  <ArrowRight className="w-4 h-4" />
+                </Link>
               </div>
+            ) : (
+              <>
+                {/* Header */}
+                <div className="mb-8">
+                  <h1 className="text-3xl font-bold text-foreground mb-2">Create Account</h1>
+                  <p className="text-foreground/60">Join ClassHub and start learning today</p>
+                </div>
+
+                {/* Error Message */}
+                {error && (
+                  <div className="mb-6 p-4 bg-red-500/10 border border-red-500/30 rounded-lg">
+                    <p className="text-red-500 text-sm">{error}</p>
+                  </div>
+                )}
+
+                {/* Form */}
+                <form onSubmit={handleSubmit} className="space-y-5">
+                  {/* Full Name Field */}
+                  <div>
+                    <label htmlFor="fullName" className="block text-sm font-medium text-foreground mb-2">
+                      Full Name
+                    </label>
+                    <div className="relative">
+                      <User className="absolute left-3 top-3 w-5 h-5 text-foreground/40" />
+                      <input
+                        id="fullName"
+                        type="text"
+                        value={fullName}
+                        onChange={(e) => setFullName(e.target.value)}
+                        placeholder="John Doe"
+                        className="w-full pl-10 pr-4 py-2.5 bg-background border border-foreground/10 rounded-lg text-foreground placeholder:text-foreground/40 focus:outline-none focus:ring-2 focus:ring-primary-cta/50"
+                        disabled={isLoading}
+                      />
+                    </div>
+                  </div>
+
+                  {/* Email Field */}
+                  <div>
+                    <label htmlFor="email" className="block text-sm font-medium text-foreground mb-2">
+                      Email Address
+                    </label>
+                    <div className="relative">
+                      <Mail className="absolute left-3 top-3 w-5 h-5 text-foreground/40" />
+                      <input
+                        id="email"
+                        type="email"
+                        value={email}
+                        onChange={(e) => setEmail(e.target.value)}
+                        placeholder="you@example.com"
+                        className="w-full pl-10 pr-4 py-2.5 bg-background border border-foreground/10 rounded-lg text-foreground placeholder:text-foreground/40 focus:outline-none focus:ring-2 focus:ring-primary-cta/50"
+                        disabled={isLoading}
+                      />
+                    </div>
+                  </div>
+
+                  {/* Password Field */}
+                  <div>
+                    <label htmlFor="password" className="block text-sm font-medium text-foreground mb-2">
+                      Password
+                    </label>
+                    <div className="relative">
+                      <Lock className="absolute left-3 top-3 w-5 h-5 text-foreground/40" />
+                      <input
+                        id="password"
+                        type="password"
+                        value={password}
+                        onChange={(e) => setPassword(e.target.value)}
+                        placeholder="••••••••"
+                        className="w-full pl-10 pr-4 py-2.5 bg-background border border-foreground/10 rounded-lg text-foreground placeholder:text-foreground/40 focus:outline-none focus:ring-2 focus:ring-primary-cta/50"
+                        disabled={isLoading}
+                      />
+                    </div>
+                    {password && (
+                      <div className="mt-2">
+                        <div className="flex gap-1 mb-1">
+                          {[...Array(5)].map((_, i) => (
+                            <div
+                              key={i}
+                              className={`flex-1 h-1 rounded-full transition-colors ${
+                                i < passwordStrength.score ? passwordStrength.color : "bg-foreground/10"
+                              }`}
+                            />
+                          ))}
+                        </div>
+                        <span className={`text-xs font-medium ${
+                          passwordStrength.score === 4 ? "text-green-500" :
+                          passwordStrength.score === 3 ? "text-blue-500" :
+                          passwordStrength.score === 2 ? "text-yellow-500" :
+                          passwordStrength.score === 1 ? "text-orange-500" :
+                          "text-red-500"
+                        }`}>
+                          {passwordStrength.label}
+                        </span>
+                      </div>
+                    )}
+                  </div>
+
+                  {/* Confirm Password Field */}
+                  <div>
+                    <label htmlFor="confirmPassword" className="block text-sm font-medium text-foreground mb-2">
+                      Confirm Password
+                    </label>
+                    <div className="relative">
+                      <Lock className="absolute left-3 top-3 w-5 h-5 text-foreground/40" />
+                      <input
+                        id="confirmPassword"
+                        type="password"
+                        value={confirmPassword}
+                        onChange={(e) => setConfirmPassword(e.target.value)}
+                        placeholder="••••••••"
+                        className="w-full pl-10 pr-4 py-2.5 bg-background border border-foreground/10 rounded-lg text-foreground placeholder:text-foreground/40 focus:outline-none focus:ring-2 focus:ring-primary-cta/50"
+                        disabled={isLoading}
+                      />
+                    </div>
+                    {confirmPassword && password !== confirmPassword && (
+                      <p className="text-xs text-red-500 mt-1">Passwords do not match</p>
+                    )}
+                  </div>
+
+                  {/* Terms Checkbox */}
+                  <div className="flex items-start gap-3">
+                    <input
+                      id="terms"
+                      type="checkbox"
+                      checked={agreeToTerms}
+                      onChange={(e) => setAgreeToTerms(e.target.checked)}
+                      className="mt-1 w-4 h-4 rounded border-foreground/20 bg-background cursor-pointer"
+                      disabled={isLoading}
+                    />
+                    <label htmlFor="terms" className="text-sm text-foreground/60 cursor-pointer">
+                      I agree to the{" "}
+                      <Link href="#terms" className="text-primary-cta hover:text-primary-cta/80 font-medium">
+                        Terms of Service
+                      </Link>
+                      {" "}and{" "}
+                      <Link href="#privacy" className="text-primary-cta hover:text-primary-cta/80 font-medium">
+                        Privacy Policy
+                      </Link>
+                    </label>
+                  </div>
+
+                  {/* Submit Button */}
+                  <button
+                    type="submit"
+                    disabled={isLoading || !agreeToTerms}
+                    className="w-full mt-6 px-4 py-3 bg-primary-cta hover:bg-primary-cta/90 text-foreground rounded-lg font-medium transition-all duration-200 flex items-center justify-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed"
+                  >
+                    {isLoading ? "Creating Account..." : "Create Account"}
+                    <ArrowRight className="w-4 h-4" />
+                  </button>
+                </form>
+
+                {/* Footer */}
+                <p className="text-center text-sm text-foreground/60 mt-6">
+                  Already have an account?{" "}
+                  <Link href="/login" className="text-primary-cta hover:text-primary-cta/80 font-medium transition-colors">
+                    Sign in
+                  </Link>
+                </p>
+              </>
             )}
-
-            <div className="grid grid-cols-2 gap-4">
-              <div>
-                <label className="block text-sm font-medium mb-2">First Name</label>
-                <Input
-                  type="text"
-                  value={formData.firstName}
-                  onChange={(value) => handleChange("firstName", value)}
-                  placeholder="John"
-                  required
-                />
-              </div>
-              <div>
-                <label className="block text-sm font-medium mb-2">Last Name</label>
-                <Input
-                  type="text"
-                  value={formData.lastName}
-                  onChange={(value) => handleChange("lastName", value)}
-                  placeholder="Doe"
-                  required
-                />
-              </div>
-            </div>
-
-            <div>
-              <label className="block text-sm font-medium mb-2">Email Address</label>
-              <Input
-                type="email"
-                value={formData.email}
-                onChange={(value) => handleChange("email", value)}
-                placeholder="you@example.com"
-                required
-              />
-            </div>
-
-            <div>
-              <label className="block text-sm font-medium mb-2">Password</label>
-              <Input
-                type="password"
-                value={formData.password}
-                onChange={(value) => handleChange("password", value)}
-                placeholder="Create a strong password"
-                required
-              />
-            </div>
-
-            <div>
-              <label className="block text-sm font-medium mb-2">Confirm Password</label>
-              <Input
-                type="password"
-                value={formData.confirmPassword}
-                onChange={(value) => handleChange("confirmPassword", value)}
-                placeholder="Confirm your password"
-                required
-              />
-            </div>
-
-            <div className="flex items-start">
-              <input
-                type="checkbox"
-                id="terms"
-                checked={agreeToTerms}
-                onChange={(e) => setAgreeToTerms(e.target.checked)}
-                className="mt-1 mr-2"
-              />
-              <label htmlFor="terms" className="text-sm text-foreground/70">
-                I agree to the{" "}
-                <Link href="/terms" className="text-primary-cta hover:underline">
-                  Terms of Service
-                </Link>
-                {" "}and{" "}
-                <Link href="/privacy" className="text-primary-cta hover:underline">
-                  Privacy Policy
-                </Link>
-              </label>
-            </div>
-
-            <button
-              type="submit"
-              disabled={loading}
-              className="w-full bg-primary-cta text-background py-3 rounded-lg font-medium hover:opacity-90 transition disabled:opacity-50 mt-6"
-            >
-              {loading ? "Creating account..." : "Create Account"}
-            </button>
-          </form>
-
-          <div className="mt-6 text-center text-sm">
-            <p className="text-foreground/70">
-              Already have an account?{" "}
-              <Link href="/login" className="text-primary-cta hover:underline font-medium">
-                Sign in here
-              </Link>
-            </p>
           </div>
 
-          <div className="mt-8 pt-8 border-t border-foreground/10">
-            <p className="text-center text-sm text-foreground/50 mb-4">Or sign up with</p>
-            <div className="flex gap-4 justify-center">
-              <button className="flex-1 py-2 px-4 rounded-lg bg-card hover:bg-card/80 transition text-sm font-medium">
-                Google
-              </button>
-              <button className="flex-1 py-2 px-4 rounded-lg bg-card hover:bg-card/80 transition text-sm font-medium">
-                GitHub
-              </button>
-            </div>
+          {/* Additional Info */}
+          <div className="text-center mt-8 text-xs text-foreground/40">
+            <p>We'll never share your personal information with anyone</p>
           </div>
         </div>
       </div>
-
-      <div id="footer" data-section="footer">
-        <FooterCard
-          logoText="ClassHub"
-          copyrightText="© 2025 ClassHub. All rights reserved. Empowering learners worldwide."
-          socialLinks={[
-            {
-              icon: Twitter,
-              href: "https://twitter.com/classhub",              ariaLabel: "Follow ClassHub on Twitter"},
-            {
-              icon: Linkedin,
-              href: "https://linkedin.com/company/classhub",              ariaLabel: "Follow ClassHub on LinkedIn"},
-          ]}
-        />
-      </div>
     </ThemeProvider>
   );
-}
+}

src/app/workshops/page.tsx

@@ -5,8 +5,6 @@ import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleAp
 import HeroBillboardScroll from "@/components/sections/hero/HeroBillboardScroll";
 import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
 import TestimonialCardOne from "@/components/sections/testimonial/TestimonialCardOne";
-import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
-import TeamCardFive from "@/components/sections/team/TeamCardFive";
 import FaqDouble from "@/components/sections/faq/FaqDouble";
 import FooterCard from "@/components/sections/footer/FooterCard";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
@@ -14,13 +12,12 @@ import {
   Sparkles,
   Zap,
   Award,
-  DollarSign,
+  Clock,
   Users,
   HelpCircle,
   Calendar,
-  Lock,
-  BarChart3,
-  Smartphone,
+  MapPin,
+  Star,
   Twitter,
   Linkedin,
   Mail,
@@ -54,15 +51,15 @@ export default function WorkshopsPage() {
 
       <div id="hero" data-section="hero">
         <HeroBillboardScroll
-          title="Discover Expert-Led Workshops"
-          description="Intensive, focused learning experiences designed to master specific skills in a short timeframe. From coding bootcamps to creative masterclasses, find workshops that accelerate your growth."
-          tag="Workshop Catalog"
+          title="Intensive Workshops & Expert Sessions"
+          description="Join focused, hands-on workshops designed to accelerate your learning. From beginner fundamentals to advanced techniques, our workshops deliver results in condensed timeframes."
+          tag="Accelerated Learning"
           tagIcon={Sparkles}
           background={{ variant: "animated-grid" }}
           imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-banner-image-showing-a-dive-1773149958687-87f99901.jpg?_wi=1"
           imageAlt="Professional workshop training environment"
           buttons={[
-            { text: "Browse Workshops", href: "#features" },
+            { text: "Browse All Workshops", href: "/workshops" },
             { text: "View Pricing", href: "/pricing" },
           ]}
           tagAnimation="slide-up"
@@ -72,29 +69,29 @@ export default function WorkshopsPage() {
 
       <div id="features" data-section="features">
         <FeatureHoverPattern
-          title="Workshop Highlights"
-          description="Choose from intensive, project-based learning experiences led by industry experts"
-          tag="What You Get"
+          title="Why Choose Our Workshops"
+          description="Structured learning experiences designed for maximum impact and retention"
+          tag="Workshop Advantages"
           tagIcon={Zap}
           features={[
+            {
+              icon: Clock,
+              title: "Intensive Format",              description: "Condensed curriculum packed into focused sessions. Learn faster with structured modules designed for practical application and immediate results."},
             {
               icon: Calendar,
-              title: "Intensive Schedule",              description: "Concentrated learning sessions ranging from half-day to multi-week intensive courses. Structured curriculum designed for rapid skill acquisition."},
+              title: "Flexible Scheduling",              description: "Weekend workshops, evening sessions, and full-day intensives. Choose formats that fit your lifestyle without compromising on learning quality."},
             {
               icon: Users,
-              title: "Small Class Sizes",              description: "Limited enrollment ensures personalized attention and hands-on guidance from instructors. Interactive group discussions and peer learning."},
+              title: "Small Group Learning",              description: "Limited class sizes ensure personalized attention. Get feedback directly from instructors and network with motivated peers in your field."},
+            {
+              icon: Star,
+              title: "Expert Facilitators",              description: "Learn from industry leaders with proven track records. Instructors bring real-world experience and current best practices to every workshop."},
+            {
+              icon: MapPin,
+              title: "Multiple Locations",              description: "Workshop venues in major cities plus virtual options. Attend in-person for hands-on experiences or join online for flexibility."},
             {
               icon: Award,
-              title: "Certifications",              description: "Earn recognized certificates upon completion. Showcase your achievements on LinkedIn and professional profiles."},
-            {
-              icon: Zap,
-              title: "Hands-On Projects",              description: "Real-world projects and practical exercises. Build a portfolio piece while learning industry best practices."},
-            {
-              icon: Lock,
-              title: "Lifetime Access",              description: "Access to workshop materials, recordings, and resources forever. Review content anytime and reinforce your learning."},
-            {
-              icon: Smartphone,
-              title: "Hybrid Options",              description: "Choose between in-person, online, or hybrid workshop formats. Learn at your preferred location and pace."},
+              title: "Certificates Included",              description: "Receive completion certificates recognized by industry partners. Add credentials to your resume and showcase your new skills."},
           ]}
           animationType="slide-up"
           textboxLayout="default"
@@ -105,8 +102,8 @@ export default function WorkshopsPage() {
       <div id="testimonials" data-section="testimonials">
         <TestimonialCardOne
           title="Workshop Success Stories"
-          description="Real feedback from professionals who advanced their careers through our workshops"
-          tag="Student Transformations"
+          description="Professionals who transformed their careers through intensive skill development"
+          tag="Student Testimonials"
           tagIcon={Award}
           testimonials={[
             {
@@ -135,89 +132,29 @@ export default function WorkshopsPage() {
         />
       </div>
 
-      <div id="pricing" data-section="pricing">
-        <PricingCardOne
-          title="Workshop Pricing"
-          description="Choose the perfect workshop plan. All workshops include instructor-led sessions, materials, and lifetime access to recordings."
-          tag="Affordable Learning"
-          tagIcon={DollarSign}
-          plans={[
-            {
-              id: "1",              badge: "Starter",              badgeIcon: Sparkles,
-              price: "$49/workshop",              subtitle: "Single workshop access",              features: [
-                "One full-day workshop",                "Expert instructor guidance",                "Digital course materials",                "Certificate of completion",                "Lifetime access to recordings"],
-            },
-            {
-              id: "2",              badge: "Popular",              badgeIcon: Zap,
-              price: "$199/series",              subtitle: "Multi-workshop series",              features: [
-                "4-week intensive series",                "Priority instructor support",                "Project portfolio building",                "Professional certification",                "Networking events",                "Career guidance sessions"],
-            },
-            {
-              id: "3",              badge: "Professional",              badgeIcon: Award,
-              price: "$499/quarter",              subtitle: "Comprehensive bootcamp",              features: [
-                "12-week intensive bootcamp",                "One-on-one mentorship",                "Career placement support",                "Advanced certification",                "Private Slack community",                "Job interview prep"],
-            },
-            {
-              id: "4",              badge: "Corporate",              badgeIcon: Users,
-              price: "Custom Pricing",              subtitle: "Team & enterprise solutions",              features: [
-                "Custom workshop design",                "On-site or virtual delivery",                "Unlimited team access",                "Progress tracking dashboard",                "Dedicated account manager",                "Custom certification"],
-            },
-          ]}
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-        />
-      </div>
-
-      <div id="team" data-section="team">
-        <TeamCardFive
-          title="Workshop Instructors"
-          description="Learn from industry veterans with proven track records of teaching and mentoring"
-          tag="Expert Educators"
-          tagIcon={Users}
-          team={[
-            {
-              id: "1",              name: "Margaret Johnson",              role: "Piano Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-piano-instruc-1773149958833-7e1afaf0.png?_wi=1",              imageAlt: "Margaret Johnson piano instructor"},
-            {
-              id: "2",              name: "Jessica Lee",              role: "Dance Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-dance-instruc-1773149955255-d32fb4cc.jpg?_wi=1",              imageAlt: "Jessica Lee dance instructor"},
-            {
-              id: "3",              name: "Marcus Williams",              role: "Yoga Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-yoga-instruct-1773149958540-4c8fc93c.jpg?_wi=1",              imageAlt: "Marcus Williams yoga instructor"},
-            {
-              id: "4",              name: "Sofia Rossi",              role: "Art Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-an-art-instruct-1773149958976-9ea3327d.png?_wi=1",              imageAlt: "Sofia Rossi art instructor"},
-            {
-              id: "5",              name: "Ahmed Hassan",              role: "Language Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-language-inst-1773149958360-43c50b1b.jpg?_wi=1",              imageAlt: "Ahmed Hassan language instructor"},
-            {
-              id: "6",              name: "Lisa Anderson",              role: "Fitness Instructor",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkwR5I869xG7mvZJi1gLiW16GY/professional-portrait-of-a-fitness-instr-1773149958873-1119546c.png?_wi=1",              imageAlt: "Lisa Anderson fitness instructor"},
-          ]}
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-        />
-      </div>
-
       <div id="faq" data-section="faq">
         <FaqDouble
-          title="Workshop FAQ"
-          description="Common questions about our workshop programs, enrollment, and learning experience"
-          tag="Help & Support"
+          title="Workshop FAQs"
+          description="Common questions about our workshop programs and registration process"
+          tag="Workshop Help"
           tagIcon={HelpCircle}
           faqs={[
             {
-              id: "1",              title: "What is the difference between workshops and classes?",              content: "Workshops are intensive, focused learning experiences typically lasting 1-4 weeks with project-based curricula. Classes are ongoing courses that meet regularly throughout a semester. Choose workshops for rapid skill acquisition and classes for deeper, sustained learning."},
+              id: "1",              title: "What's the difference between workshops and classes?",              content: "Workshops are intensive, focused sessions typically lasting 1-3 days on specific topics. Classes are ongoing courses meeting regularly over weeks or months. Choose workshops for rapid skill acquisition and classes for sustained learning."},
             {
-              id: "2",              title: "Do I need prior experience to join a workshop?",              content: "Most workshops are designed for intermediate learners, but we offer beginner, intermediate, and advanced levels. Each workshop listing clearly indicates the required skill level. We also offer prerequisite courses if needed."},
+              id: "2",              title: "How many students attend each workshop?",              content: "We keep workshops small, typically 8-15 participants per session. This ensures personalized attention from instructors and meaningful peer interaction. Intimate group sizes enhance learning and collaboration."},
             {
-              id: "3",              title: "What is included in the workshop price?",              content: "Workshop pricing includes all instructor-led sessions, digital course materials, project resources, and lifetime access to workshop recordings. Depending on the tier, you may also get certification, mentorship, and networking opportunities."},
+              id: "3",              title: "Do I need prior experience to attend?",              content: "Each workshop lists its prerequisite skill level. We offer beginner-friendly introductory workshops requiring no prior experience, plus advanced sessions for experienced practitioners. Choose the level matching your background."},
             {
-              id: "4",              title: "Are workshops offered online or in-person?",              content: "We offer hybrid options for most workshops. You can choose between in-person, fully online, or a mix of both. Check individual workshop listings for available formats."},
+              id: "4",              title: "What materials are provided?",              content: "All workshops include detailed handouts, resource guides, and access to video recordings. Premium participants receive digital workbooks and templates to continue learning after the workshop ends."},
             {
-              id: "5",              title: "Can I access workshop materials after completion?",              content: "Yes! You have lifetime access to all workshop recordings, slides, and digital materials. You can review and refresh your knowledge anytime after the workshop ends."},
+              id: "5",              title: "Can I cancel my workshop registration?",              content: "Yes! Full refunds are available if you cancel 7 days before the workshop. Cancellations within 7 days receive store credit. No refunds for no-shows, but you can transfer to another session."},
             {
-              id: "6",              title: "Do workshops offer professional certification?",              content: "Most of our workshops include recognized certifications upon completion. These certificates can be added to your LinkedIn profile and resume to showcase your new skills to employers."},
+              id: "6",              title: "Are workshops available online?",              content: "Many of our workshops are offered in both in-person and virtual formats. Virtual workshops include live instructor interaction, breakout group discussions, and access to the same materials as in-person attendees."},
             {
-              id: "7",              title: "What is your cancellation policy for workshops?",              content: "You can cancel up to 7 days before the workshop starts for a full refund. Cancellations within 7 days receive store credit. If we cancel a workshop, you receive a full refund or can transfer to another workshop."},
+              id: "7",              title: "Do I get a certificate?",              content: "Yes! All workshop participants receive a certificate of completion. Certificates detail the workshop topic, hours completed, and instructor name. They're recognized by our partner organizations and valued by employers."},
             {
-              id: "8",              title: "Do you offer group discounts for workshops?",              content: "Yes! Groups of 5 or more students receive special pricing. Contact our sales team at sales@classhub.com to discuss custom rates for your group or organization."},
+              id: "8",              title: "What if I miss part of the workshop?",              content: "Partial attendance is allowed for single-day workshops. Multi-day workshops require attending all sessions for certification. If you miss sessions, video recordings and catch-up materials are provided where applicable."},
           ]}
           faqsAnimation="slide-up"
           textboxLayout="default"