diff --git a/app/community/page.tsx b/app/community/page.tsx
new file mode 100644
index 0000000..afab93f
--- /dev/null
+++ b/app/community/page.tsx
@@ -0,0 +1,429 @@
+"use client";
+import React, { useRef } from 'react';
+import { motion, useScroll, useInView } from "framer-motion";
+import Navbar from '@/components/Navbar/navbar';
+import Footer from '@/components/footer';
+
+const Community = () => {
+    // Animation variants
+    const fadeUp = {
+        hidden: { opacity: 0, y: 30 },
+        visible: { 
+            opacity: 1, 
+            y: 0,
+            transition: { duration: 0.7, ease: "easeOut" }
+        }
+    };
+    
+    const staggerContainer = {
+        hidden: { opacity: 0 },
+        visible: {
+            opacity: 1,
+            transition: {
+                staggerChildren: 0.15
+            }
+        }
+    };
+    
+    const cardVariant = {
+        hidden: { opacity: 0, y: 20 },
+        visible: { 
+            opacity: 1, 
+            y: 0,
+            transition: { duration: 0.5, ease: "easeOut" }
+        }
+    };
+
+    return (
+        <div className="w-full bg-[#080E12] overflow-x-hidden">
+            <Navbar />
+            
+            {/* Hero Section */}
+            <motion.section 
+                className="h-screen flex flex-col justify-center items-center max-w-6xl mx-auto px-6 pt-20"
+                initial="hidden"
+                animate="visible"
+                variants={fadeUp}
+            >
+                <motion.h1 
+                    className="text-5xl md:text-7xl text-white mb-6 text-center"
+                    animate={{ 
+                        backgroundPosition: ["0% 0%", "100% 100%"],
+                    }}
+                    transition={{ 
+                        duration: 8, 
+                        repeat: Infinity, 
+                        repeatType: "reverse" 
+                    }}
+                    style={{
+                        backgroundImage: "linear-gradient(90deg, #fff, #a855f7, #ec4899, #fff)",
+                        backgroundSize: "200%",
+                        WebkitBackgroundClip: "text",
+                        WebkitTextFillColor: "transparent"
+                    }}
+                >
+                    Community
+                </motion.h1>
+                
+                <motion.h2 
+                    className="text-3xl text-center text-white mb-8"
+                    variants={{
+                        hidden: { opacity: 0, y: 20 },
+                        visible: { 
+                            opacity: 1, 
+                            y: 0, 
+                            transition: { delay: 0.2, duration: 0.8 }
+                        }
+                    }}
+                >
+                    Connect, Collaborate, and Innovate
+                </motion.h2>
+                
+                <motion.p 
+                    className="text-gray-400 text-xl max-w-3xl text-center mb-12"
+                    variants={{
+                        hidden: { opacity: 0, y: 20 },
+                        visible: { 
+                            opacity: 1, 
+                            y: 0, 
+                            transition: { delay: 0.4, duration: 0.8 }
+                        }
+                    }}
+                >
+                    At Everyday Series, our community is the heartbeat of our innovation. We're building a vibrant network of solopreneurs, developers, AI enthusiasts, and business leaders committed to transforming expertise into powerful AI agents and solutions.
+                </motion.p>
+                
+                <motion.div
+                    className="flex flex-wrap gap-4 justify-center"
+                    variants={{
+                        hidden: { opacity: 0, y: 20 },
+                        visible: { 
+                            opacity: 1, 
+                            y: 0, 
+                            transition: { delay: 0.6, duration: 0.8 }
+                        }
+                    }}
+                >
+                    <a href="#offerings" className="px-8 py-4 rounded-lg text-white bg-gradient-to-r from-pink-500 via-purple-500 to-indigo-500 shadow-lg hover:shadow-xl transition-all duration-300">
+                        Explore Our Offerings
+                    </a>
+                    <a href="#join" className="px-8 py-4 rounded-lg text-white border border-purple-500 hover:bg-purple-500/10 transition-all duration-300">
+                        Join The Community
+                    </a>
+                </motion.div>
+                
+                <motion.div 
+                    className="absolute bottom-10 left-1/2 transform -translate-x-1/2"
+                    animate={{ 
+                        y: [0, 10, 0],
+                    }}
+                    transition={{ 
+                        duration: 2, 
+                        repeat: Infinity, 
+                        repeatType: "loop" 
+                    }}
+                >
+                    <svg 
+                        xmlns="http://www.w3.org/2000/svg" 
+                        width="24" 
+                        height="24" 
+                        viewBox="0 0 24 24" 
+                        fill="none" 
+                        stroke="currentColor" 
+                        strokeWidth="2" 
+                        strokeLinecap="round" 
+                        strokeLinejoin="round" 
+                        className="text-purple-500"
+                    >
+                        <path d="M12 5v14M19 12l-7 7-7-7" />
+                    </svg>
+                </motion.div>
+            </motion.section>
+            
+            {/* What We Offer Section */}
+            <section id="offerings" className="min-h-screen flex items-center py-20 max-w-6xl mx-auto px-6">
+                <motion.div
+                    initial="hidden"
+                    whileInView="visible"
+                    viewport={{ once: true, amount: 0.2 }}
+                    variants={staggerContainer}
+                    className="w-full"
+                >
+                    <motion.h2 
+                        className="text-4xl text-white mb-12"
+                        variants={fadeUp}
+                    >
+                        What We Offer
+                    </motion.h2>
+                    
+                    <div className="grid md:grid-cols-3 gap-8">
+                        {/* Events & Online Meetups */}
+                        <motion.div 
+                            className="bg-[#0F1922] p-8 rounded-xl border border-purple-900/40 hover:border-purple-500/50 transition-all duration-300"
+                            variants={cardVariant}
+                            whileHover={{ y: -5, transition: { duration: 0.2 } }}
+                        >
+                            <div className="bg-gradient-to-br from-pink-500 to-purple-600 w-12 h-12 rounded-lg flex items-center justify-center mb-6">
+                                <svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6 text-white" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+                                    <rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect>
+                                    <line x1="16" y1="2" x2="16" y2="6"></line>
+                                    <line x1="8" y1="2" x2="8" y2="6"></line>
+                                    <line x1="3" y1="10" x2="21" y2="10"></line>
+                                </svg>
+                            </div>
+                            <h3 className="text-2xl text-white mb-4">Events & Online Meetups</h3>
+                            <ul className="space-y-4 text-gray-400">
+                                <li className="flex items-start">
+                                    <span className="text-purple-400 mr-2">•</span>
+                                    <span><strong className="text-white">Live Events:</strong> Attend interactive events and online meetups where industry experts and fellow innovators share insights, success stories, and the latest trends in AI.</span>
+                                </li>
+                                <li className="flex items-start">
+                                    <span className="text-purple-400 mr-2">•</span>
+                                    <span><strong className="text-white">Webinars:</strong> Participate in immersive webinars that dive deep into AI technologies, product demos, and hands-on sessions tailored for solopreneurs and enterprises alike.</span>
+                                </li>
+                            </ul>
+                        </motion.div>
+                        
+                        {/* Cohort-Based Learning */}
+                        <motion.div 
+                            className="bg-[#0F1922] p-8 rounded-xl border border-purple-900/40 hover:border-purple-500/50 transition-all duration-300"
+                            variants={cardVariant}
+                            whileHover={{ y: -5, transition: { duration: 0.2 } }}
+                        >
+                            <div className="bg-gradient-to-br from-pink-500 to-purple-600 w-12 h-12 rounded-lg flex items-center justify-center mb-6">
+                                <svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6 text-white" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+                                    <path d="M12 20h9"></path>
+                                    <path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"></path>
+                                </svg>
+                            </div>
+                            <h3 className="text-2xl text-white mb-4">Cohort-Based Learning</h3>
+                            <ul className="space-y-4 text-gray-400">
+                                <li className="flex items-start">
+                                    <span className="text-purple-400 mr-2">•</span>
+                                    <span><strong className="text-white">Structured Programs:</strong> Enroll in our cohort-based learning initiatives, including our remote Generative AI Readiness Program, designed for corporates, universities, and individual innovators.</span>
+                                </li>
+                                <li className="flex items-start">
+                                    <span className="text-purple-400 mr-2">•</span>
+                                    <span><strong className="text-white">Collaborative Learning:</strong> Work alongside peers in a guided environment where practical projects and real-world challenges help refine your AI skills.</span>
+                                </li>
+                            </ul>
+                        </motion.div>
+                        
+                        {/* Instant Connectivity */}
+                        <motion.div 
+                            className="bg-[#0F1922] p-8 rounded-xl border border-purple-900/40 hover:border-purple-500/50 transition-all duration-300"
+                            variants={cardVariant}
+                            whileHover={{ y: -5, transition: { duration: 0.2 } }}
+                        >
+                            <div className="bg-gradient-to-br from-pink-500 to-purple-600 w-12 h-12 rounded-lg flex items-center justify-center mb-6">
+                                <svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6 text-white" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+                                    <path d="M17 8h3a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2h-3"></path>
+                                    <path d="M13 8H7a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h6"></path>
+                                    <path d="M17 12H7"></path>
+                                    <path d="M7 12v2"></path>
+                                    <path d="M17 12v2"></path>
+                                </svg>
+                            </div>
+                            <h3 className="text-2xl text-white mb-4">Instant Connectivity</h3>
+                            <ul className="space-y-4 text-gray-400">
+                                <li className="flex items-start">
+                                    <span className="text-purple-400 mr-2">•</span>
+                                    <span><strong className="text-white">Whatsapp Group:</strong> Join our dedicated Whatsapp group for real-time updates, lively discussions, and instant support from fellow community members.</span>
+                                </li>
+                                <li className="flex items-start">
+                                    <span className="text-purple-400 mr-2">•</span>
+                                    <span><strong className="text-white">Open Source Modules:</strong> Contribute to and leverage our extensive library of open source modules—collaborate, share, and build solutions that benefit everyone in the community.</span>
+                                </li>
+                            </ul>
+                        </motion.div>
+                        
+                        {/* Collaborative Partnerships - Full width */}
+                        <motion.div 
+                            className="bg-[#0F1922] p-8 rounded-xl border border-purple-900/40 hover:border-purple-500/50 transition-all duration-300 md:col-span-3"
+                            variants={cardVariant}
+                            whileHover={{ y: -5, transition: { duration: 0.2 } }}
+                        >
+                            <div className="bg-gradient-to-br from-pink-500 to-purple-600 w-12 h-12 rounded-lg flex items-center justify-center mb-6">
+                                <svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6 text-white" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+                                    <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
+                                    <circle cx="9" cy="7" r="4"></circle>
+                                    <path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
+                                    <path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
+                                </svg>
+                            </div>
+                            <h3 className="text-2xl text-white mb-4">Collaborative Partnerships</h3>
+                            <div className="grid md:grid-cols-2 gap-6">
+                                <div>
+                                    <h4 className="text-lg text-white mb-3">Solopreneur Network</h4>
+                                    <p className="text-gray-400">Connect with a diverse group of solopreneurs offering innovative products and services, creating opportunities for cross-collaboration.</p>
+                                </div>
+                                <div>
+                                    <h4 className="text-lg text-white mb-3">SMBs & Enterprise</h4>
+                                    <p className="text-gray-400">We partner with small and medium businesses as well as enterprise organizations to co-create and deploy cutting-edge AI solutions that drive growth and efficiency.</p>
+                                </div>
+                            </div>
+                        </motion.div>
+                    </div>
+                </motion.div>
+            </section>
+            
+            {/* Why Join Us Section */}
+            <section className="min-h-screen flex items-center py-20 max-w-6xl mx-auto px-6">
+                <motion.div
+                    initial="hidden"
+                    whileInView="visible"
+                    viewport={{ once: true, amount: 0.2 }}
+                    variants={staggerContainer}
+                    className="w-full"
+                >
+                    <motion.div variants={fadeUp} className="mb-16">
+                        <motion.h2 className="text-4xl text-white mb-6">Why Join Us?</motion.h2>
+                        <motion.div 
+                            className="h-1 w-24 bg-gradient-to-r from-pink-500 to-purple-500"
+                            animate={{
+                                width: ["0%", "10%"],
+                            }}
+                            transition={{
+                                duration: 1,
+                                ease: "easeInOut",
+                            }}
+                        />
+                    </motion.div>
+                    
+                    <div className="grid md:grid-cols-3 gap-8">
+                        <motion.div 
+                            className="relative overflow-hidden rounded-xl group"
+                            variants={cardVariant}
+                            whileHover={{ y: -5, transition: { duration: 0.2 } }}
+                        >
+                            <div className="bg-gradient-to-br from-pink-600/20 to-purple-800/20 p-8 rounded-xl border border-purple-500/30 h-full transition-all duration-300 group-hover:bg-gradient-to-br group-hover:from-pink-600/30 group-hover:to-purple-800/30">
+                                <div className="mb-6">
+                                    <svg xmlns="http://www.w3.org/2000/svg" className="h-12 w-12 text-purple-400" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+                                        <path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"></path>
+                                        <path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"></path>
+                                    </svg>
+                                </div>
+                                <h3 className="text-2xl text-white mb-4">Learn & Grow</h3>
+                                <p className="text-gray-400">Gain exclusive access to resources, expert-led sessions, and collaborative projects that enhance your skills and expand your network.</p>
+                            </div>
+                        </motion.div>
+                        
+                        <motion.div 
+                            className="relative overflow-hidden rounded-xl group"
+                            variants={cardVariant}
+                            whileHover={{ y: -5, transition: { duration: 0.2 } }}
+                        >
+                            <div className="bg-gradient-to-br from-pink-600/20 to-purple-800/20 p-8 rounded-xl border border-purple-500/30 h-full transition-all duration-300 group-hover:bg-gradient-to-br group-hover:from-pink-600/30 group-hover:to-purple-800/30">
+                                <div className="mb-6">
+                                    <svg xmlns="http://www.w3.org/2000/svg" className="h-12 w-12 text-purple-400" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+                                        <polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
+                                    </svg>
+                                </div>
+                                <h3 className="text-2xl text-white mb-4">Innovate Together</h3>
+                                <p className="text-gray-400">Be a part of a community where your ideas matter, and collective intelligence sparks breakthrough innovations.</p>
+                            </div>
+                        </motion.div>
+                        
+                        <motion.div 
+                            className="relative overflow-hidden rounded-xl group"
+                            variants={cardVariant}
+                            whileHover={{ y: -5, transition: { duration: 0.2 } }}
+                        >
+                            <div className="bg-gradient-to-br from-pink-600/20 to-purple-800/20 p-8 rounded-xl border border-purple-500/30 h-full transition-all duration-300 group-hover:bg-gradient-to-br group-hover:from-pink-600/30 group-hover:to-purple-800/30">
+                                <div className="mb-6">
+                                    <svg xmlns="http://www.w3.org/2000/svg" className="h-12 w-12 text-purple-400" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+                                        <circle cx="12" cy="12" r="10"></circle>
+                                        <line x1="2" y1="12" x2="22" y2="12"></line>
+                                        <path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"></path>
+                                    </svg>
+                                </div>
+                                <h3 className="text-2xl text-white mb-4">Real-World Impact</h3>
+                                <p className="text-gray-400">Engage with partners and industry leaders to develop AI solutions that solve real business challenges and drive market success.</p>
+                            </div>
+                        </motion.div>
+                    </div>
+                </motion.div>
+            </section>
+            
+            {/* Call to Action Section */}
+            <motion.section 
+                id="join"
+                className="min-h-screen flex items-center justify-center flex-col max-w-6xl mx-auto px-6 py-20"
+                initial="hidden"
+                whileInView="visible"
+                viewport={{ once: true, amount: 0.3 }}
+                variants={fadeUp}
+            >
+                <motion.div 
+                    className="max-w-3xl mx-auto text-center"
+                    variants={fadeUp}
+                >
+                    <motion.h2 
+                        className="text-4xl md:text-5xl text-white mb-8"
+                        animate={{ 
+                            backgroundPosition: ["0% 0%", "100% 100%"],
+                        }}
+                        transition={{ 
+                            duration: 8, 
+                            repeat: Infinity, 
+                            repeatType: "reverse" 
+                        }}
+                        style={{
+                            backgroundImage: "linear-gradient(90deg, #fff, #a855f7, #ec4899, #fff)",
+                            backgroundSize: "200%",
+                            WebkitBackgroundClip: "text",
+                            WebkitTextFillColor: "transparent"
+                        }}
+                    >
+                        Get Involved
+                    </motion.h2>
+                    <motion.p 
+                        className="text-gray-400 text-xl mb-12"
+                        variants={{
+                            hidden: { opacity: 0, y: 20 },
+                            visible: { 
+                                opacity: 1, 
+                                y: 0, 
+                                transition: { delay: 0.3, duration: 0.8 }
+                            }
+                        }}
+                    >
+                        Ready to shape the future of AI? Join our community and unlock a world of opportunities. Connect, collaborate, and innovate with like-minded individuals who are as passionate about technology and growth as you are.
+                    </motion.p>
+                    <motion.div 
+                        className="flex flex-wrap gap-4 justify-center"
+                        variants={{
+                            hidden: { opacity: 0, y: 20 },
+                            visible: { 
+                                opacity: 1, 
+                                y: 0, 
+                                transition: { delay: 0.5, duration: 0.8 }
+                            }
+                        }}
+                    >
+                        <motion.a 
+                            href="#" 
+                            className="px-8 py-4 rounded-lg text-white font-medium bg-gradient-to-r from-pink-500 via-purple-500 to-indigo-500 shadow-lg hover:shadow-xl transition-all duration-300 inline-block"
+                            whileHover={{ scale: 1.05 }}
+                            whileTap={{ scale: 0.95 }}
+                        >
+                            Join Our Community
+                        </motion.a>
+                        <motion.a 
+                            href="#" 
+                            className="px-8 py-4 rounded-lg text-white font-medium border border-purple-500 hover:bg-purple-500/10 transition-all duration-300 inline-block"
+                            whileHover={{ scale: 1.05 }}
+                            whileTap={{ scale: 0.95 }}
+                        >
+                            Learn More About Our Initiatives
+                        </motion.a>
+                    </motion.div>
+                </motion.div>
+            </motion.section>
+            
+            <Footer />
+        </div>
+    );
+};
+
+export default Community;
\ No newline at end of file
diff --git a/app/marketplace/page.tsx b/app/marketplace/page.tsx
index c6f0c3f..19f472d 100644
--- a/app/marketplace/page.tsx
+++ b/app/marketplace/page.tsx
@@ -1,5 +1,4 @@
 "use client";
-"use client";
 
 import React from 'react';
 import { motion } from 'framer-motion';
diff --git a/app/meetups/page.tsx b/app/meetups/page.tsx
new file mode 100644
index 0000000..9b683d0
--- /dev/null
+++ b/app/meetups/page.tsx
@@ -0,0 +1,375 @@
+"use client";
+
+import React, { useRef } from 'react';
+import { motion, useScroll, useTransform, useInView } from "framer-motion";
+import Navbar from '@/components/Navbar/navbar';
+import Footer from '@/components/footer';
+
+const Meetups = () => {
+    const containerRef = useRef(null);
+
+    // Animation variants
+    const fadeIn = {
+        hidden: { opacity: 0, y: 30 },
+        visible: {
+            opacity: 1,
+            y: 0,
+            transition: { duration: 0.8, ease: "easeOut" }
+        }
+    };
+
+    const staggerContainer = {
+        hidden: { opacity: 0 },
+        visible: {
+            opacity: 1,
+            transition: {
+                staggerChildren: 0.2
+            }
+        }
+    };
+
+    const imageCard = {
+        hidden: { opacity: 0, scale: 0.9 },
+        visible: {
+            opacity: 1,
+            scale: 1,
+            transition: { duration: 0.5, ease: "easeOut" }
+        }
+    };
+
+    return (
+        <div className="w-full bg-[#080E12] overflow-x-hidden" ref={containerRef}>
+            <Navbar />
+
+            {/* Hero Section */}
+            <motion.section
+                className="h-screen flex flex-col justify-center max-w-6xl mx-auto px-6 pt-20"
+                initial="hidden"
+                animate="visible"
+                variants={fadeIn}
+            >
+                <motion.h1
+                    className="text-5xl md:text-7xl text-white mb-6"
+                    animate={{
+                        backgroundPosition: ["0% 0%", "100% 100%"],
+                    }}
+                    transition={{
+                        duration: 8,
+                        repeat: Infinity,
+                        repeatType: "reverse"
+                    }}
+                    style={{
+                        backgroundImage: "linear-gradient(90deg, #fff, #a855f7, #ec4899, #fff)",
+                        backgroundSize: "200%",
+                        WebkitBackgroundClip: "text",
+                        WebkitTextFillColor: "transparent"
+                    }}
+                >
+                    Meetups & Community
+                </motion.h1>
+
+                <motion.p
+                    className="text-gray-400 text-xl max-w-3xl mb-12"
+                    variants={{
+                        hidden: { opacity: 0, y: 20 },
+                        visible: {
+                            opacity: 1,
+                            y: 0,
+                            transition: { delay: 0.3, duration: 0.8 }
+                        }
+                    }}
+                >
+                    Connect, Learn, and Innovate with AI Enthusiasts. Join our vibrant community of over 25,000 AI developers, enthusiasts, and doers at Everyday Series Meetups.
+                </motion.p>
+
+                <motion.div
+                    className="flex flex-wrap gap-4"
+                    variants={{
+                        hidden: { opacity: 0, y: 20 },
+                        visible: {
+                            opacity: 1,
+                            y: 0,
+                            transition: { delay: 0.5, duration: 0.8 }
+                        }
+                    }}
+                >
+                    <a href="#" className="px-8 py-4 rounded-lg text-white font-medium bg-gradient-to-r from-pink-500 via-purple-500 to-indigo-500 shadow-lg hover:shadow-xl transition-all duration-300">
+                        Join a Meetup
+                    </a>
+                    <a href="#explore" className="px-8 py-4 rounded-lg text-white font-medium border border-purple-500 hover:bg-purple-500/10 transition-all duration-300">
+                        Explore Community
+                    </a>
+                </motion.div>
+
+                <motion.div
+                    className="absolute bottom-10 left-1/2 transform -translate-x-1/2"
+                    animate={{
+                        y: [0, 10, 0],
+                    }}
+                    transition={{
+                        duration: 2,
+                        repeat: Infinity,
+                        repeatType: "loop"
+                    }}
+                >
+                    <svg
+                        xmlns="http://www.w3.org/2000/svg"
+                        width="24"
+                        height="24"
+                        viewBox="0 0 24 24"
+                        fill="none"
+                        stroke="currentColor"
+                        strokeWidth="2"
+                        strokeLinecap="round"
+                        strokeLinejoin="round"
+                        className="text-purple-500"
+                    >
+                        <path d="M12 5v14M19 12l-7 7-7-7" />
+                    </svg>
+                </motion.div>
+            </motion.section>
+
+            {/* Features Section */}
+            <section id="explore" className="h-screen flex items-center max-w-6xl mx-auto px-6">
+                <motion.div
+                    initial="hidden"
+                    whileInView="visible"
+                    viewport={{ once: true, amount: 0.3 }}
+                    variants={staggerContainer}
+                    className="w-full"
+                >
+                    <motion.h2
+                        className="text-4xl text-white mb-12"
+                        variants={fadeIn}
+                    >
+                        What We Offer
+                    </motion.h2>
+
+                    <div className="grid md:grid-cols-2 gap-6">
+                        {[
+                            {
+                                title: "Engaging Discussions",
+                                description: "Participate in talks, workshops, and panel discussions covering cutting-edge AI developments.",
+                                image: "https://images.unsplash.com/photo-1517048676732-d65bc937f952?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8M3x8b2ZmaWNlJTIwZGlzY3Vzc2lvbnN8ZW58MHx8MHx8fDA%3D"
+                            },
+                            {
+                                title: "Networking Opportunities",
+                                description: "Connect with like-minded professionals and expand your network within a dynamic, supportive community.",
+                                image: "https://plus.unsplash.com/premium_photo-1661783208371-64db9e60653d?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8OXx8b2ZmaWNlJTIwZGlzY3Vzc2lvbnN8ZW58MHx8MHx8fDA%3D"
+                            },
+                            {
+                                title: "Hands-On Learning",
+                                description: "Gain practical insights through live demos, coding sessions, and interactive Q&A segments.",
+                                image: "https://images.unsplash.com/photo-1551434678-e076c223a692?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8OHx8b2ZmaWNlJTIwZGlzY3Vzc2lvbnN8ZW58MHx8MHx8fDA%3D"
+                            },
+                            {
+                                title: "Diverse Topics",
+                                description: "Explore a broad spectrum of topics, from generative AI to low-code development.",
+                                image: "https://plus.unsplash.com/premium_photo-1733306490808-9c2ec551cbf4?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MjF8fG9mZmljZSUyMGRpc2N1c3Npb25zfGVufDB8fDB8fHww"
+                            }
+                        ].map((item, index) => (
+                            <motion.div
+                                key={index}
+                                className="relative overflow-hidden h-64 rounded-xl group"
+                                variants={imageCard}
+                            >
+                                <motion.div
+                                    className="absolute inset-0 bg-gradient-to-b from-transparent to-black/80 z-10 group-hover:opacity-100 opacity-80 transition-opacity duration-300"
+                                />
+                                <motion.img
+                                    src={item.image}
+                                    alt={item.title}
+                                    className="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110"
+                                />
+                                <motion.div className="absolute bottom-0 left-0 right-0 p-6 z-20 transform transition-transform duration-300">
+                                    <h3 className="text-2xl font-medium text-white mb-2">{item.title}</h3>
+                                    <p className="text-gray-300 text-sm opacity-0 group-hover:opacity-100 transition-opacity duration-300">{item.description}</p>
+                                </motion.div>
+                            </motion.div>
+                        ))}
+                    </div>
+                </motion.div>
+            </section>
+
+            {/* Communities Section */}
+
+            <motion.div
+                className="grid md:grid-cols-1 gap-16 max-w-6xl mx-auto"
+                variants={fadeIn}
+            >
+                <div className="space-y-6">
+                    <motion.h3
+                        className="text-3xl text-white"
+                        variants={{
+                            hidden: { opacity: 0, x: -20 },
+                            visible: {
+                                opacity: 1,
+                                x: 0,
+                                transition: { duration: 0.6 }
+                            }
+                        }}
+                    >
+                        EverydayJS Community
+                    </motion.h3>
+                    <motion.div
+                        className="h-1 w-24 bg-gradient-to-r from-pink-500 to-purple-500"
+                        animate={{
+                            width: ["0%", "10%"],
+                        }}
+                        transition={{
+                            duration: 1,
+                            ease: "easeInOut",
+                        }}
+                    />
+                    <motion.p
+                        className="text-gray-400 text-lg"
+                        variants={{
+                            hidden: { opacity: 0, x: -20 },
+                            visible: {
+                                opacity: 1,
+                                x: 0,
+                                transition: { delay: 0.2, duration: 0.6 }
+                            }
+                        }}
+                    >
+                        For those passionate about NodeJS, our dedicated EverydayJS Community offers a specialized space to dive deep into NodeJS development. Here, developers share tips, collaborate on projects, and discuss the latest trends in the NodeJS ecosystem.
+                    </motion.p>
+                    <motion.a
+                        href="#"
+                        className="inline-block px-6 py-3 rounded-lg text-white font-medium bg-gradient-to-r from-pink-500/40 via-purple-500/40 to-indigo-500/20 shadow-lg hover:shadow-xl transition-all duration-300"
+                        variants={{
+                            hidden: { opacity: 0, x: -20 },
+                            visible: {
+                                opacity: 1,
+                                x: 0,
+                                transition: { delay: 0.4, duration: 0.6 }
+                            }
+                        }}
+                    >
+                        Join Now
+                    </motion.a>
+                </div>
+
+                <div className="space-y-6">
+                    <motion.h3
+                        className="text-3xl text-white"
+                        variants={{
+                            hidden: { opacity: 0, x: 20 },
+                            visible: {
+                                opacity: 1,
+                                x: 0,
+                                transition: { duration: 0.6 }
+                            }
+                        }}
+                    >
+                        Upcoming Events
+                    </motion.h3>
+                    <motion.div
+                        className="h-1 w-24 bg-gradient-to-r from-pink-500 to-purple-500"
+                        animate={{
+                            width: ["0%", "10%"],
+                        }}
+                        transition={{
+                            duration: 1,
+                            ease: "easeInOut",
+                        }}
+                    />
+                    <motion.p
+                        className="text-gray-400 text-lg"
+                        variants={{
+                            hidden: { opacity: 0, x: 20 },
+                            visible: {
+                                opacity: 1,
+                                x: 0,
+                                transition: { delay: 0.2, duration: 0.6 }
+                            }
+                        }}
+                    >
+                        Check out our upcoming meetups on Meetup.com and join us in exploring the future of AI and technology. Whether you're a seasoned professional or just starting out, there's a place for you in our community.
+                    </motion.p>
+                    <motion.a
+                        href="#"
+                        className="inline-block px-6 py-3 rounded-lg text-white font-medium bg-gradient-to-r from-pink-500/40 via-purple-500/40 to-indigo-500/20 shadow-lg hover:shadow-xl transition-all duration-300"
+                        variants={{
+                            hidden: { opacity: 0, x: 20 },
+                            visible: {
+                                opacity: 1,
+                                x: 0,
+                                transition: { delay: 0.4, duration: 0.6 }
+                            }
+                        }}
+                    >
+                        Join a Meetup
+                    </motion.a>
+                </div>
+            </motion.div>
+
+            {/* Call to Action Section */}
+            <motion.section
+                className="min-h-screen flex items-center justify-center flex-col max-w-6xl mx-auto px-6 py-20"
+                initial="hidden"
+                whileInView="visible"
+                viewport={{ once: true, amount: 0.3 }}
+                variants={fadeIn}
+            >
+                <motion.div
+                    className="max-w-3xl mx-auto text-center"
+                    variants={fadeIn}
+                >
+                    <motion.h2
+                        className="text-4xl md:text-5xl text-white mb-8"
+                        animate={{
+                            backgroundPosition: ["0% 0%", "100% 100%"],
+                        }}
+                        transition={{
+                            duration: 8,
+                            repeat: Infinity,
+                            repeatType: "reverse"
+                        }}
+                        style={{
+                            backgroundImage: "linear-gradient(90deg, #fff, #a855f7, #ec4899, #fff)",
+                            backgroundSize: "200%",
+                            WebkitBackgroundClip: "text",
+                            WebkitTextFillColor: "transparent"
+                        }}
+                    >
+                        Ready to Join Our AI Community?
+                    </motion.h2>
+                    <motion.p
+                        className="text-gray-400 text-xl mb-12"
+                        variants={{
+                            hidden: { opacity: 0, y: 20 },
+                            visible: {
+                                opacity: 1,
+                                y: 0,
+                                transition: { delay: 0.3, duration: 0.8 }
+                            }
+                        }}
+                    >
+                        Be part of a thriving ecosystem of innovators, creators, and AI enthusiasts who are shaping the future of technology together.
+                    </motion.p>
+                    <motion.a
+                        href="#"
+                        className="px-8 py-4 rounded-lg text-white font-medium bg-gradient-to-r from-pink-500/40 via-purple-500/40 to-indigo-500/20 shadow-lg hover:shadow-xl transition-all duration-300 inline-block"
+                        variants={{
+                            hidden: { opacity: 0, y: 20 },
+                            visible: {
+                                opacity: 1,
+                                y: 0,
+                                transition: { delay: 0.5, duration: 0.8 }
+                            }
+                        }}
+                        whileHover={{ scale: 1.05 }}
+                        whileTap={{ scale: 0.95 }}
+                    >
+                        Get Started Now
+                    </motion.a>
+                </motion.div>
+            </motion.section>
+
+            <Footer />
+        </div>
+    );
+};
+
+export default Meetups;
\ No newline at end of file
diff --git a/app/pricing/page.tsx b/app/pricing/page.tsx
index 8a4fa4d..373e331 100644
--- a/app/pricing/page.tsx
+++ b/app/pricing/page.tsx
@@ -6,35 +6,45 @@ import { ChevronDown, ChevronUp, Check, HelpCircle, ShieldCheck, Zap, Smartphone
 import Navbar from '@/components/Navbar/navbar';
 import Footer from '@/components/footer';
 
-const PricingCard = ({ title, description, features }) => {
+const PricingCard = ({ title, description, features, pricing }) => {
     return (
         <motion.div
             initial={{ opacity: 0, y: 20 }}
             animate={{ opacity: 1, y: 0 }}
-            className="group relative border border-gray-800 rounded-xl p-8 bg-gray-900/20 transition-all duration-500 overflow-hidden hover:scale-105"
+            className={`flex flex-col justify-between group relative bg-clip-padding backdrop-filter backdrop-blur-lg bg-opacity-10 border border-gray-600 rounded-xl p-8 transition-all duration-500 overflow-hidden ${title === "Professional" ? "scale-110" : ""}`}
         >
             <div className="relative z-10">
-                <h3 className="text-2xl font-semibold text-white mb-4">{title}</h3>
+                <div className="flex justify-between">
+                    <h3 className="text-2xl font-semibold text-white">{title}</h3>
+                    {title==="Professional" && (
+                        <span className="w-fit h-fit px-2 py-1 bg-trasparent border border-gray-300 text-gray-300 rounded-full text-xs shrink-0">
+                            Popular
+                        </span>
+                    )}
+                </div>
                 <p className="text-gray-400 mb-6">{description}</p>
                 <div className="w-full h-[1px] bg-gray-800 my-4" /> {/* Separator Line */}
                 <div className="space-y-4">
                     {features.map((feature, index) => (
-                        <div key={index} className="flex items-center gap-5">
-                            <Check className="w-5 h-5 text-purple-500" />
+                        <div key={index} className="flex items-start gap-5">
+                            <Check className="w-5 h-5 text-purple-500 shrink-0" />
                             <span className="text-gray-300">{feature}</span>
                         </div>
                     ))}
                 </div>
+
+            </div>
+            <div>
                 <div className="w-full h-[1px] bg-gray-800 my-4" /> {/* Separator Line */}
                 <div className="w-full py-4 flex items-center justify-between">
-                    <p className="text-gray-300">For Price : </p>
-                    <motion.button
+                    <p className="text-gray-100 text-2xl">{pricing}</p>
+                    {/* <motion.button
                         whileHover={{ scale: 1.05 }}
                         whileTap={{ scale: 0.98 }}
                         className="px-6 py-3 rounded-lg text-white font-medium bg-gradient-to-r from-pink-500 via-purple-500 to-indigo-500 shadow-lg transition-all duration-500 w-fit"
                     >
                         Contact Us
-                    </motion.button>
+                    </motion.button> */}
                 </div>
             </div>
 
@@ -82,26 +92,52 @@ const FAQ = ({ question, answer }) => {
 const PricingPage = () => {
     const pricingPlans = [
         {
-            title: "Basic",
-            description: "We consider all the drivers of time & change gives the blocks.",
+            title: "Starter",
+            description: "For solopreneurs ready to take a leap.",
             features: [
-                "Full Access to Copler",
-                "100 GB Free Storage",
-                "Unlimited Visitors",
-                "10 Agents",
-                "Live Chat Support"
-            ]
+                "1 monetised site",
+                "10,000 tokens/month",
+                "Use our full suite for internal projects without limits",
+                "Basic Integration",
+                "Basic 24/7 chat support"
+            ],
+            pricing: "£29 GBP/month"
         },
         {
-            title: "Premium",
-            description: "We consider all the drivers of time & change gives the blocks.",
+            title: "Professional",
+            description: "For small teams building multiple revenue streams.",
             features: [
-                "Full Access to Copler",
-                "100 GB Free Storage",
-                "Unlimited Visitors",
-                "10 Agents",
-                "Live Chat Support"
-            ]
+                "Up to 3 active monetised site",
+                "50,000 tokens/month",
+                "Use our full suite for internal projects without limits",
+                "Advanced analytics and integrations",
+                "Basic 24/7 chat support"
+            ],
+            pricing: "£69 GBP/month"
+        },
+        {
+            title: "Business",
+            description: "For growing companies that demand more power and flexibility.",
+            features: [
+                "Up to 10 active monetised site",
+                "200,000 tokens/month",
+                "Unlimited projects internally - build, test, and deploy without limits",
+                "Advanced customizations, integrations, and performance tracking",
+                "Priority 24/7 chat support"
+            ],
+            pricing: "£349 GBP/month"
+        },
+        {
+            title: "Enterprise Plus",
+            description: "For large enterprises with complex needs and full marketplace access.",
+            features: [
+                "Custom limits based on your requirements",
+                "Unlimited custom GPT Tokens",
+                "Full access to our marketplace with exclusive benefits, including a 20% discount on all solopreneur sites",
+                "Advanced customizations, integrations, exclusive downloadable code offerings on a pay-per-code basis",
+                "SLA-backed, enterprise-grade support with dedicated account management and priority phone support"
+            ],
+            pricing: "Starting at $2,500 USD/month (3-year term required)"
         }
     ];
 
@@ -131,7 +167,6 @@ const PricingPage = () => {
     return (
         <div className="w-full p-6 bg-[#080E12] min-h-screen space-y-36">
             <Navbar />
-
             {/* Hero Section */}
             <motion.section
                 initial={{ opacity: 0, y: 20 }}
@@ -150,8 +185,8 @@ const PricingPage = () => {
             </motion.section>
 
             {/* Pricing Cards */}
-            <motion.section className="max-w-6xl mx-auto">
-                <div className="grid md:grid-cols-2 gap-8">
+            <motion.section className="max-w-8xl mx-auto bg-gradient-to-b from-[#080E12] via-[#EC4899]/20 to-[#080E12]">
+                <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
                     {pricingPlans.map((plan, index) => (
                         <PricingCard key={index} {...plan} />
                     ))}
@@ -220,7 +255,7 @@ const PricingPage = () => {
                 <p className="max-w-6xl mx-auto text-gray-400">
                     Efficiently manage and resolve customer issues, improve satisfaction and boost your bottom line with our all-in-one customer support solution. Get the safest way of making online payment & save countless hours of losing money.
                 </p>
-                        {/* <motion.button
+                {/* <motion.button
                                 whileHover={{ scale: 1.05 }}
                                 whileTap={{ scale: 0.98 }}
                                 className="px-6 py-3 rounded-lg text-white font-medium bg-gradient-to-r from-pink-500 via-purple-500 to-indigo-500 shadow-lg transition-all duration-500 w-fit"
diff --git a/components/Agents/business-verticals.tsx b/components/Agents/business-verticals.tsx
index 4649695..89c7bbd 100644
--- a/components/Agents/business-verticals.tsx
+++ b/components/Agents/business-verticals.tsx
@@ -17,49 +17,57 @@ const verticals = [
     icon: <ShoppingCart className="w-5 h-5" />,
     title: "Retail & E-commerce",
     description: "Enhance customer service with real-time chat support, personalized shopping experiences, and seamless order tracking.",
-    gradient: "from-pink-500/20 to-purple-500/20"
+    gradient: "from-pink-500/20 to-purple-500/20",
+    link: "/tools"
   },
   {
     icon: <HeartPulse className="w-5 h-5" />,
     title: "Healthcare & Wellness",
     description: "Improve patient care through virtual consultations, appointment scheduling, and instant access to health resources.",
-    gradient: "from-blue-500/20 to-cyan-500/20"
+    gradient: "from-blue-500/20 to-cyan-500/20",
+    link: "/tools"
   },
   {
     icon: <Wallet className="w-5 h-5" />,
     title: "Finance & Banking",
     description: "Empower customers with financial insights, automated account management, and personalized advisory services.",
-    gradient: "from-green-500/20 to-emerald-500/20"
+    gradient: "from-green-500/20 to-emerald-500/20",
+    link: "/finance"
   },
   {
     icon: <GraduationCap className="w-5 h-5" />,
     title: "Education & eLearning",
     description: "Revolutionize learning with interactive tutoring, course guidance, resource recommendations, and performance tracking.",
-    gradient: "from-orange-500/20 to-yellow-500/20"
+    gradient: "from-orange-500/20 to-yellow-500/20",
+    link: "/tools"
   },
   {
     icon: <Home className="w-5 h-5" />,
     title: "Real Estate & Property Management",
     description: "Streamline property listings, offer virtual tours, schedule viewings, and provide detailed market insights.",
-    gradient: "from-purple-500/20 to-indigo-500/20"
+    gradient: "from-purple-500/20 to-indigo-500/20",
+    link: "/tools"
   },
   {
     icon: <Plane className="w-5 h-5" />,
     title: "Travel & Hospitality",
     description: "Enhance guest experiences with AI-driven booking assistance, itinerary management, and personalized recommendations.",
-    gradient: "from-cyan-500/20 to-blue-500/20"
+    gradient: "from-cyan-500/20 to-blue-500/20",
+    link: "/tools"
   },
   {
     icon: <Scale className="w-5 h-5" />,
     title: "Legal & Consulting",
     description: "Simplify client communications, document management, and consultation scheduling for faster service delivery.",
-    gradient: "from-violet-500/20 to-purple-500/20"
+    gradient: "from-violet-500/20 to-purple-500/20",
+    link: "/tools"
   },
   {
     icon: <Megaphone className="w-5 h-5" />,
     title: "Creative & Marketing",
     description: "Boost engagement through dynamic content creation, campaign management, and customer insights analytics.",
-    gradient: "from-rose-500/20 to-pink-500/20"
+    gradient: "from-rose-500/20 to-pink-500/20",
+    link: "/tools"
   }
 ];
 
@@ -134,6 +142,7 @@ export default function BusinessVerticals() {
                     
                     {/* Action button */}
                     <div className="pl-16 mt-4">
+                      <a href={vertical.link}>
                       <button className="
                         px-4 py-2 rounded-lg
                         bg-purple-500/20 hover:bg-purple-500/30
@@ -141,7 +150,7 @@ export default function BusinessVerticals() {
                         transition-colors duration-300
                       ">
                         Explore Solutions
-                      </button>
+                      </button></a>
                     </div>
                   </div>
                 </div>
diff --git a/components/Agents/sample-agents.tsx b/components/Agents/sample-agents.tsx
index 63f76c2..acdb0eb 100644
--- a/components/Agents/sample-agents.tsx
+++ b/components/Agents/sample-agents.tsx
@@ -135,6 +135,7 @@ export default function SampleAgents() {
 
         {/* CTA Button */}
         <div className="text-center mt-16">
+          <a href="/ai-agents">
           <button className="
             group relative overflow-hidden
             px-8 py-4 rounded-full
@@ -147,7 +148,7 @@ export default function SampleAgents() {
               Explore More Sample Agents
               <ArrowRight className="w-5 h-5 group-hover:translate-x-1 transition-transform" />
             </span>
-          </button>
+          </button></a>
         </div>
       </div>
     </div>
diff --git a/components/Features/features-bento.tsx b/components/Features/features-bento.tsx
index 6dea9af..8e45ab5 100644
--- a/components/Features/features-bento.tsx
+++ b/components/Features/features-bento.tsx
@@ -180,63 +180,17 @@ const SkeletonOne = () => {
 };
 
 const SkeletonTwo = () => {
-    const [isTyping, setIsTyping] = useState(false);
-
-    return (
-        <motion.div
-            className="flex flex-1 w-full h-full min-h-[2rem] bg-gradient-to-br from-purple-900/20 to-blue-900/20 flex-col items-center justify-center p-6 rounded-xl cursor-pointer"
-            onHoverStart={() => setIsTyping(true)}
-            onHoverEnd={() => setIsTyping(false)}
-        >
-            <div className="flex flex-col space-y-4 w-full">
-                <div className="relative w-full h-20 bg-black/40 rounded-xl overflow-hidden group">
-                    <AnimatePresence>
-                        {isTyping && (
-                            <motion.div
-                                className="absolute inset-0 flex items-center justify-start px-4"
-                                initial={{ opacity: 0 }}
-                                animate={{ opacity: 1 }}
-                                exit={{ opacity: 0 }}
-                            >
-                                <motion.div
-                                    initial={{ width: 0 }}
-                                    animate={{
-                                        width: "auto",
-                                        transition: {
-                                            duration: 2,
-                                            repeat: Infinity,
-                                            repeatType: "reverse"
-                                        }
-                                    }}
-                                    className="overflow-hidden whitespace-nowrap text-purple-300"
-                                >
-                                    console.log("Hello World!");
-                                </motion.div>
-                                <motion.div
-                                    animate={{ opacity: [0, 1, 0] }}
-                                    transition={{ duration: 0.8, repeat: Infinity }}
-                                    className="text-purple-300 ml-1"
-                                >
-                                    |
-                                </motion.div>
-                            </motion.div>
-                        )}
-                    </AnimatePresence>
-                </div>
-                <motion.div
-                    className="space-y-2"
-                    animate={{
-                        opacity: isTyping ? 1 : 0.5,
-                        transition: { duration: 1, repeat: Infinity, repeatType: "reverse" }
-                    }}
-                >
-                    <div className="h-3 w-3/4 bg-gradient-to-r from-purple-500/20 to-blue-500/20 rounded-full" />
-                    <div className="h-3 w-1/2 bg-gradient-to-r from-purple-500/20 to-blue-500/20 rounded-full" />
-                    <div className="h-3 w-5/6 bg-gradient-to-r from-purple-500/20 to-blue-500/20 rounded-full" />
-                </motion.div>
-            </div>
-        </motion.div>
-    );
+  return (
+      <motion.div
+          className="flex flex-1 w-full h-full min-h-[2rem] bg-gradient-to-br from-purple-900/20 to-blue-900/20 flex-col items-center justify-center rounded-xl cursor-pointer"
+      > 
+          <img
+              src="https://images.unsplash.com/photo-1484522676511-0f51cc572bb0?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MTJ8fHR5cGluZ3xlbnwwfHwwfHx8MA%3D%3D"
+              alt="Typing Image"
+              className="object-cover h-full w-full rounded-xl"
+          />
+      </motion.div>
+  );
 };
 
 const SkeletonThree = () => {
@@ -244,67 +198,15 @@ const SkeletonThree = () => {
 
   return (
     <motion.div
-      className="flex flex-1 w-full h-full min-h-[6rem] bg-gradient-to-br from-purple-900/20 to-blue-900/20 flex-col items-center justify-center p-6 rounded-xl"
+      className="flex flex-1 w-full h-full min-h-[6rem] bg-gradient-to-br from-purple-900/20 to-blue-900/20 flex-col items-center justify-center rounded-xl"
       onHoverStart={() => setIsHovered(true)}
       onHoverEnd={() => setIsHovered(false)}
     >
-      <div className="relative w-full h-full bg-black/40 rounded-xl overflow-hidden p-6">
-        <motion.div 
-          className="flex flex-col space-y-4"
-          animate={{ y: isHovered ? -10 : 0 }}
-        >
-          {/* <div className="flex items-center justify-between">
-            <div className="h-8 w-24 bg-purple-500/30 rounded-full" />
-            <motion.div 
-              className="text-2xl font-bold text-green-400"
-              animate={{ scale: isHovered ? 1.1 : 1 }}
-            >
-              $0
-            </motion.div>
-          </div> */}
-          
-          {/* Graph container */}
-          <motion.div 
-            className="h-20 w-full bg-gradient-to-r from-purple-500/20 to-blue-500/20 rounded-xl relative overflow-hidden"
-            animate={{ 
-              scale: isHovered ? 1.02 : 1,
-              backgroundColor: isHovered ? "rgba(139, 92, 246, 0.3)" : "rgba(139, 92, 246, 0.2)"
-            }}
-          >
-            {/* Growing graph line */}
-            <motion.div
-              className="absolute bottom-0 left-0 w-full h-full"
-              initial={{ opacity: 0.7 }}
-              animate={{ opacity: isHovered ? 1 : 0.7 }}
-            >
-              <svg width="100%" height="100%" viewBox="0 0 100 50" preserveAspectRatio="none">
-                <motion.path
-                  d="M0,50 L0,35 C10,40 20,20 30,25 C40,30 50,10 60,15 C70,20 80,5 90,10 L100,5 L100,50 Z"
-                  fill="rgba(52, 211, 153, 0.2)"
-                  stroke="rgba(52, 211, 153, 0.8)"
-                  strokeWidth="2"
-                  initial={{ pathLength: 0.3, y: 20 }}
-                  animate={{ 
-                    pathLength: isHovered ? 1 : 0.3,
-                    y: isHovered ? 0 : 20
-                  }}
-                  transition={{ duration: 1.5 }}
-                />
-              </svg>
-            </motion.div>
-          </motion.div>
-          
-          {/* <div className="flex justify-between items-center">
-            <div className="h-6 w-16 bg-purple-500/30 rounded-full" />
-            <motion.div 
-              className="text-xl font-bold text-green-400"
-              animate={{ scale: isHovered ? 1.1 : 1 }}
-            >
-              $499
-            </motion.div>
-          </div> */}
-        </motion.div>
-      </div>
+      <img
+              src="data:image/jpeg;base64,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"
+              alt="Typing Image"
+              className="object-cover h-full w-full rounded-xl"
+          />
     </motion.div>
   );
 };
diff --git a/components/Features/features-clickable.tsx b/components/Features/features-clickable.tsx
index 5248495..cae163e 100644
--- a/components/Features/features-clickable.tsx
+++ b/components/Features/features-clickable.tsx
@@ -2,6 +2,7 @@
 
 import React, { useState } from 'react';
 import { motion } from 'framer-motion';
+import { FaArrowRight } from 'react-icons/fa';
 
 // Define the Item interface
 interface Item {
@@ -9,6 +10,7 @@ interface Item {
     media: string; // URL for image or video
     title: string;
     description: string;
+    link: string;
 }
 
 // Define the items array with type annotations
@@ -19,6 +21,7 @@ const items: Item[] = [
         title: "Product Management",
         description:
             "Coordinate and manage product sprints in collaboration with cross-functional team members, ensuring efficient planning and execution. Work closely with partners from different teams to iterate rapidly, align goals, and drive continuous improvement throughout the development process.",
+        link: "/product-manager",
     },
     {
         id: 2,
@@ -26,6 +29,7 @@ const items: Item[] = [
         title: "Marketing",
         description:
             "Develop and implement marketing strategies to promote products and services, analyze market trends, and identify target audiences. Collaborate with sales teams to create effective campaigns that drive brand awareness and customer engagement while measuring the effectiveness of marketing initiatives.",
+            link: "/marketing",
     },
     {
         id: 3,
@@ -33,6 +37,7 @@ const items: Item[] = [
         title: "Sales",
         description:
             "Drive revenue growth by identifying potential clients, building relationships, and closing sales deals. Develop sales strategies that align with company goals, deliver presentations to prospective customers, and provide exceptional customer service to ensure client satisfaction and retention.",
+            link: "/sales",
     },
     {
         id: 4,
@@ -40,6 +45,7 @@ const items: Item[] = [
         title: "HR",
         description:
             "Manage recruitment processes, employee relations, and organizational development initiatives. Ensure compliance with labor laws and regulations while fostering a positive workplace culture that promotes employee engagement and professional growth. Implement training programs to enhance workforce capabilities and performance.",
+            link: "/hr",
     },
 ];
 
@@ -100,6 +106,7 @@ export default function Cliclables() {
                     <p className="text-gray-600 leading-relaxed">
                         {selectedItem.description}
                     </p>
+                    <a className="text-gray-300 hover:text-gray-100 flex items-center mt-4" href={selectedItem.link}>Learn More <FaArrowRight className='ml-4'/></a>
                 </motion.div>
             </div>
 
diff --git a/components/Features/features.tsx b/components/Features/features.tsx
index 06971c8..82e5a26 100644
--- a/components/Features/features.tsx
+++ b/components/Features/features.tsx
@@ -169,28 +169,11 @@ const VectorCreativeSuite = () => (
 
       {/* Preview Panel */}
       <div className="flex-1 bg-black/20 rounded-xl p-4">
-        <motion.div 
-          className="w-full h-full rounded-lg bg-gradient-to-br from-purple-500/20 to-blue-500/20 relative"
-          animate={{ 
-            boxShadow: [
-              "0 0 0 0 rgba(139, 92, 246, 0)",
-              "0 0 20px 2px rgba(139, 92, 246, 0.3)",
-              "0 0 0 0 rgba(139, 92, 246, 0)"
-            ]
-          }}
-          transition={{ duration: 3, repeat: Infinity }}
-        >
-          <motion.div 
-            className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-16 h-16 border-4 border-purple-500/30 rounded-full border-t-transparent"
-            animate={{ rotate: 360 }}
-            transition={{ duration: 2, repeat: Infinity, ease: "linear" }}
-          />
-          <motion.div 
-            className="absolute bottom-4 left-1/2 -translate-x-1/2 h-2 w-24 bg-purple-500/30 rounded-full"
-            animate={{ width: ["6rem", "8rem", "6rem"] }}
-            transition={{ duration: 2, repeat: Infinity }}
-          />
-        </motion.div>
+        <img
+          src="https://images.unsplash.com/photo-1613327986042-63d4425a1a5d?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8NHx8ZGFyayUyMGFuZCUyMHB1cnBsZXxlbnwwfHwwfHx8MA%3D%3D"
+          alt="Typing Image"
+          className="object-cover h-full w-full rounded-xl"
+        />
       </div>
     </div>
   </motion.div>
@@ -333,9 +316,9 @@ const VectorCommunity = () => {
 
 const VectorMonetization = () => {
   const subscriptionTiers = [
-    { name: "Basic", price: "49", color: "from-blue-500/30 to-purple-500/30" },
-    { name: "Pro", price: "199", color: "from-purple-500/30 to-pink-500/30" },
-    { name: "Enterprise", price: "499", color: "from-pink-500/30 to-orange-500/30" }
+    { name: "Started", price: "29", color: "from-blue-500/30 to-purple-500/30" },
+    { name: "Professional", price: "69", color: "from-purple-500/30 to-pink-500/30" },
+    { name: "Business", price: "349", color: "from-pink-500/30 to-orange-500/30" }
   ];
 
   return (
@@ -403,7 +386,7 @@ const VectorMonetization = () => {
         animate={{ scale: [1, 1.1, 1] }}
         transition={{ duration: 2, repeat: Infinity }}
       >
-                ${tier.price}
+                £{tier.price}
         </motion.div>
         <motion.div 
                 className="text-xs text-purple-200"
diff --git a/components/How/how.tsx b/components/How/how.tsx
index 57da92f..947e9a2 100644
--- a/components/How/how.tsx
+++ b/components/How/how.tsx
@@ -119,19 +119,6 @@ export default function HowItWorks() {
             ))}
           </div>
         </div>
-
-        <div className="text-center mt-24">
-          <button className="
-            group relative overflow-hidden
-            px-10 py-5 rounded-full
-            text-white text-lg
-            transition-all duration-300
-            hover:shadow-lg hover:shadow-purple-500/20
-          ">
-            <div className="absolute inset-0 bg-gradient-to-r from-purple-600 to-blue-600 opacity-80 group-hover:opacity-100 transition-opacity" />
-            <span className="relative">Explore Features</span>
-          </button>
-        </div>
       </div>
     </div>
   );
diff --git a/next.config.ts b/next.config.ts
index e9ffa30..2ae1124 100644
--- a/next.config.ts
+++ b/next.config.ts
@@ -1,7 +1,9 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
-  /* config options here */
+  images: {
+    domains: ["unsplash.com"],
+  },
 };
 
-export default nextConfig;
+export default nextConfig;
\ No newline at end of file