diff --git a/src/app/page.js b/src/app/page.js
index 25656f3..42166a2 100644
--- a/src/app/page.js
+++ b/src/app/page.js
@@ -7,8 +7,6 @@ export default function Home() {
   return (
     <>
     <Hero />
-    <Homepage/>
-      
     </>
   );
 }
diff --git a/src/components/Global/Hero.jsx b/src/components/Global/Hero.jsx
index 88a9a66..e4d2d38 100644
--- a/src/components/Global/Hero.jsx
+++ b/src/components/Global/Hero.jsx
@@ -1,130 +1,195 @@
-'use client'
-import { motion } from "framer-motion";
-import { useState, useEffect } from "react";
+"use client";
+import React from 'react';
+import { motion, useScroll, useTransform, useSpring } from "framer-motion";
+import { Github, Instagram, Twitter, Linkedin, MapPin, Book, Users, Phone } from 'lucide-react';
 
-const HeroSkeleton = () => (
-  <div className="relative h-[600px] bg-gray-100 overflow-hidden border border-gray-300 animate-pulse">
-    <div className="absolute inset-0 grid grid-cols-12 gap-4 bg-[length:60px_60px] bg-gray-200" />
-
-    {/* Skeleton floating circles */}
-    <div className="absolute top-[-35px] left-[300px] h-36 w-36 bg-gray-300 rounded-full animate-pulse" />
-    <div className="absolute top-[50px] right-[50px] h-[400px] w-[400px] bg-gray-300 rounded-full animate-pulse" />
-    <div className="absolute bottom-10 right-[500px] h-28 w-28 bg-gray-300 rounded-full animate-pulse" />
-    <div className="absolute bottom-[-60px] left-8 h-[200px] w-[200px] bg-gray-300 rounded-full animate-pulse" />
-
-    {/* Skeleton for text content */}
-    <div className="relative z-10 flex flex-col items-start justify-center h-full pl-12 text-left space-y-4">
-      <div className="h-10 w-3/4 bg-gray-300 rounded-md" />
-      <div className="h-10 w-2/3 bg-gray-300 rounded-md mt-2" />
-      <div className="h-5 w-1/2 bg-gray-300 rounded-md mt-4" />
-      <div className="h-5 w-1/2 bg-gray-300 rounded-md mt-2" />
-      
-      {/* Skeleton for buttons */}
-      <div className="flex space-x-4 mt-8">
-        <div className="h-10 w-24 bg-gray-300 rounded-md" />
-        <div className="h-10 w-24 bg-gray-300 rounded-md" />
-      </div>
-    </div>
-  </div>
+// Google Dot component with wavy animation effect
+const GoogleDot = ({ color, delay = 0, size = "w-4 h-4" }) => (
+  <motion.div
+    className={`${size} rounded-full ${color}`}
+    initial={{ y: 0 }}
+    animate={{ y: [0, -8, 0] }}
+    transition={{
+      delay,
+      duration: 0.8,
+      repeat: Infinity,
+      ease: "easeInOut"
+    }}
+  />
 );
 
-const Hero = () => {
-  const [loading, setLoading] = useState(true);
 
-  // Simulate loading delay
-  useEffect(() => {
-    const timer = setTimeout(() => setLoading(false), 2000); // Adjust duration as needed
-    return () => clearTimeout(timer);
-  }, []);
+const ParallaxSection = ({ children, yOffset = 0 }) => {
+  const ref = React.useRef(null);
+  const { scrollYProgress } = useScroll({
+    target: ref,
+    offset: ["start end", "end start"]
+  });
+  const y = useTransform(scrollYProgress, [0, 1], [0, yOffset]);
+
+  return (
+    <motion.div ref={ref} style={{ y }}>
+      {children}
+    </motion.div>
+  );
+};
 
-  if (loading) {
-    return <HeroSkeleton />;
-  }
+const GDSCLanding = () => {
+  const { scrollYProgress } = useScroll();
+  const scaleX = useSpring(scrollYProgress, { stiffness: 100 });
 
   return (
-      <div className="relative h-[600px] md:h-[500px] lg:h-[600px] bg-white overflow-hidden border border-gray-300">
+    <div className="bg-gray-900 text-white overflow-hidden">
+      {/* Hero Section */}
+      <section className="min-h-screen relative overflow-hidden bg-gray-50">
+        <div className="absolute inset-0">
           <motion.div
-              className="absolute inset-0 grid grid-cols-12 gap-4 bg-[length:60px_60px]"
-              style={{
-                  backgroundImage: `
-        linear-gradient(270deg, hsla(0, 0%, 100%, 0) 25%, hsla(0, 0%, 100%, 0) 25.1%),
-        linear-gradient(to right, #e2e8f0 0.5px, transparent 3.1px),
-        linear-gradient(to bottom, #e2e8f0 1px, transparent 1px),
-        linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0) 70%)`,
-              }}
+            className="absolute inset-0"
+            animate={{
+              background: [
+                "radial-gradient(circle at 100% 100%, #4285f4 0%, transparent 50%)",
+                "radial-gradient(circle at 0% 100%, #34a853 0%, transparent 50%)",
+                "radial-gradient(circle at 100% 0%, #ea4335 0%, transparent 50%)",
+                "radial-gradient(circle at 0% 0%, #fbbc05 0%, transparent 50%)",
+              ]
+            }}
+            transition={{
+              duration: 10,
+              repeat: Infinity,
+              repeatType: "reverse"
+            }}
+            style={{ opacity: 0.1 }}
+          />
+        </div>
+
+        <div className="container mx-auto px-4 pt-32 pb-16 relative">
+          {/* Google Dots Wavy Animation */}
+          <div className="flex justify-center space-x-3 mb-8">
+            <GoogleDot color="bg-blue-500" delay={0} />
+            <GoogleDot color="bg-red-500" delay={0.2} />
+            <GoogleDot color="bg-yellow-500" delay={0.4} />
+            <GoogleDot color="bg-green-500" delay={0.6} />
+          </div>
+
+          <motion.h1
+            className="text-5xl text-black md:text-7xl font-bold text-center mb-4"
+            initial={{ opacity: 0, y: 50 }}
+            animate={{ opacity: 1, y: 0 }}
+            transition={{ duration: 0.8 }}
           >
-              {/* Floating Circles with subtle scaling and hovering animation */}
-              <motion.div
-                  className="absolute top-[-35px] left-[200px] md:left-[100px] lg:left-[300px] h-24 w-24 md:h-32 md:w-32 lg:h-36 lg:w-36 bg-yellow-500 rounded-full"
-                  animate={{ scale: [1, 1.1, 1] }}
-                  transition={{ duration: 2, repeat: Infinity }}
-              />
-              <motion.div
-                  className="absolute top-[50px] right-[20px] md:right-[50px] h-[250px] w-[250px] md:h-[300px] md:w-[300px] lg:h-[400px] lg:w-[400px] bg-blue-700 rounded-full"
-                  animate={{ scale: [1, 1.1, 1] }}
-                  transition={{ duration: 2, repeat: Infinity, delay: 0.3 }}
-              />
-              <motion.div
-                  className="absolute bottom-10 right-[150px] md:right-[300px] h-20 w-20 md:h-24 md:w-24 lg:h-28 lg:w-28 bg-red-500 rounded-full"
-                  animate={{ scale: [1, 1.1, 1] }}
-                  transition={{ duration: 2, repeat: Infinity, delay: 0.5 }}
-              />
-              <motion.div
-                  className="absolute bottom-[-40px] left-4 md:left-8 h-20 w-20 md:h-24 md:w-24 lg:h-[200px] lg:w-[200px] bg-green-500 rounded-full"
-                  animate={{ scale: [1, 1.1, 1] }}
-                  transition={{ duration: 2, repeat: Infinity, delay: 0.7 }}
-              />
+            Bridging The Gap Between
+            <br />
+            <span className="bg-clip-text text-transparent bg-gradient-to-r from-blue-500 via-red-500 to-yellow-500">
+              Theory And Practice
+            </span>
+          </motion.h1>
+
+          <motion.p
+            className="text-xl text-center text-gray-600 max-w-2xl mx-auto mb-12"
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            transition={{ delay: 0.5 }}
+          >
+            The Google Developer Student Club at RCCIIT is a university-based community group powered by Google Developers.
+          </motion.p>
+
+          <motion.div
+            className="flex justify-center space-x-4"
+            initial={{ opacity: 0, y: 20 }}
+            animate={{ opacity: 1, y: 0 }}
+            transition={{ delay: 0.8 }}
+          >
+            <button className="px-8 py-3 bg-blue-500 text-white rounded-full hover:bg-blue-600 transition-colors">
+              Join Us
+            </button>
+            <button className="px-8 py-3 border-2 border-blue-500 text-blue-500 rounded-full hover:bg-blue-50 transition-colors">
+              Contact Us
+            </button>
           </motion.div>
+        </div>
+      </section>
 
-          {/* Main Content */}
-          <div className="relative z-10 flex flex-col items-start justify-center h-full pl-6 md:pl-10 lg:pl-12 text-left">
-              <motion.h1
-                  className="text-3xl md:text-4xl lg:text-5xl font-bold text-black"
-                  initial={{ opacity: 0, y: 20 }}
-                  animate={{ opacity: 1, y: 0 }}
-                  transition={{ duration: 0.8 }}
-              >
-                  Bridging The Gap Between
-              </motion.h1>
-              <motion.h1
-                  className="text-3xl md:text-4xl lg:text-5xl font-bold text-black mt-2 md:mt-4"
-                  initial={{ opacity: 0, y: 20 }}
-                  animate={{ opacity: 1, y: 0 }}
-                  transition={{ duration: 0.8, delay: 0.3 }}
-              >
-                  Theory And Practice.
-              </motion.h1>
-              <motion.p
-                  className="mt-2 md:mt-4 max-w-md text-sm md:text-lg text-gray-600"
-                  initial={{ opacity: 0, y: 20 }}
-                  animate={{ opacity: 1, y: 0 }}
-                  transition={{ duration: 0.8, delay: 0.5 }}
-              >
-                  The Google Developer Student Club at RCCIIT is a
-                  university-based community group powered by Google Developers.
-              </motion.p>
+      {/* Vision Mission Goals Section with Parallax */}
+      <section className="py-24 bg-gray-100">
+        <div className="container mx-auto px-4">
+          <ParallaxSection yOffset={-30}>
+            <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+              {[
+                {
+                  title: "🌟 Vision",
+                  content: "Our vision is to create a world where technology and innovation lead to the betterment of human lives.",
+                  color: "from-blue-500 to-blue-600"
+                },
+                {
+                  title: "🎯 Mission",
+                  content: "Our mission is to empower individuals and organizations through cutting-edge technological solutions.",
+                  color: "from-red-500 to-red-600"
+                },
+                {
+                  title: "🚀 Goal",
+                  content: "Our goal is to continuously push the boundaries of what's possible and lead the way towards a more prosperous future.",
+                  color: "from-yellow-500 to-yellow-600"
+                }
+              ].map((item, index) => (
+                <motion.div
+                  key={index}
+                  className="rounded-xl overflow-hidden"
+                  initial={{ opacity: 0, y: 50 }}
+                  whileInView={{ opacity: 1, y: 0 }}
+                  transition={{ delay: index * 0.2 }}
+                  viewport={{ once: true }}
+                >
+                  <div className={`p-8 bg-gradient-to-br ${item.color} text-white h-full`}>
+                    <h3 className="text-2xl font-bold mb-4">{item.title}</h3>
+                    <p>{item.content}</p>
+                  </div>
+                </motion.div>
+              ))}
+            </div>
+          </ParallaxSection>
+        </div>
+      </section>
+      {/* Resources Section */}
+      {/* Resources Section */}
+      <section className="relative py-24 bg-gradient-to-br from-blue-50 via-yellow-50 to-red-50">
+        <div className="container mx-auto px-4">
+          <motion.div
+            initial={{ scale: 0.95, opacity: 0 }}
+            whileInView={{ scale: 1, opacity: 1 }}
+            exit={{ scale: 0.95, opacity: 0 }}
+            transition={{ duration: 0.5 }}
+            className="text-center mb-16"
+          >
+            <h2 className="text-4xl font-bold text-gray-800">Resources</h2>
+            <p className="text-gray-600 mt-2 max-w-3xl mx-auto">
+              Explore key resources to help you get started, learn more, and apply your skills.
+            </p>
+          </motion.div>
+
+          <div className="grid grid-cols-2 md:grid-cols-4 gap-8">
+            {[
+              { icon: <MapPin size={24} />, text: "Location" },
+              { icon: <Book size={24} />, text: "About GDG" },
+              { icon: <Users size={24} />, text: "How to Apply" },
+              { icon: <Phone size={24} />, text: "Who can apply?" }
+            ].map((item, index) => (
               <motion.div
-                  className="mt-4 md:mt-8 space-x-2 md:space-x-4"
-                  initial={{ opacity: 0, y: 20 }}
-                  animate={{ opacity: 1, y: 0 }}
-                  transition={{ duration: 0.8, delay: 0.7 }}
+                key={index}
+                initial={{ opacity: 0, scale: 0.9 }}
+                whileInView={{ opacity: 1, scale: 1 }}
+                exit={{ opacity: 0, scale: 0.9 }}
+                transition={{ duration: 0.3, delay: index * 0.1 }}
+                className="flex flex-col items-center text-center p-6 bg-white rounded-xl shadow-md hover:shadow-lg transition-transform transform hover:scale-105"
               >
-                  <a
-                      href="#"
-                      className="inline-block px-4 py-2 md:px-6 md:py-3 text-white bg-blue-600 rounded-md hover:bg-blue-700"
-                  >
-                      Join Us
-                  </a>
-                  <a
-                      href="#"
-                      className="inline-block px-4 py-2 md:px-6 md:py-3 text-gray-800 border-2 border-gray-300 rounded-md hover:bg-gray-50 bg-white"
-                  >
-                      Contact Us
-                  </a>
+                <div className="mb-4 text-blue-500">{item.icon}</div>
+                <p className="font-semibold text-gray-700">{item.text}</p>
               </motion.div>
+            ))}
           </div>
-      </div>
+        </div>
+      </section>
+    </div>
   );
 };
 
-export default Hero;
+export default GDSCLanding;
diff --git a/src/components/ui/homepage.jsx b/src/components/ui/homepage.jsx
index 1890cb7..b3c5d4e 100644
--- a/src/components/ui/homepage.jsx
+++ b/src/components/ui/homepage.jsx
@@ -1,129 +1,74 @@
-// export default function Homepage() {
-//     return (
-//         <div className="bg-white text-gray-900 select-none">
-//             <section className="py-12 px-6 md:px-16 ml-40 mr-40">
-//                 <h2 className="text-4xl font-bold text-center mb-12 text-blue-600">Path to Success</h2>
-//                 <div className="flex flex-col md:flex-row items-center mb-16">
-//                     <img
-//                         src="/vision.webp"
-//                         alt="Vision"
-//                         className="w-full md:w-1/2 h-64 object-contain rounded-lg transition-transform duration-300 hover:scale-105"
-//                     />
-//                     <div className="md:ml-8 text-center md:text-left mt-6 md:mt-0 md:w-1/2">
-//                         <h3 className="text-4xl font-semibold text-gray-800 mb-4">🌟 Vision</h3>
-//                         <p className="text-xl text-gray-600 leading-relaxed">
-//                             Our vision is to create a world where technology and innovation lead to the betterment of human lives, driving progress and success.
-//                             We aim to bridge gaps and create opportunities through collaboration and forward-thinking strategies that inspire change and growth across all sectors.
-//                         </p>
-//                     </div>
-//                 </div>
-//                 <div className="flex flex-col md:flex-row-reverse items-center mb-16">
-//                     <img
-//                         src="/mission.webp"
-//                         alt="Mission"
-//                         className="w-full md:w-1/2 h-64 object-contain rounded-lg transition-transform duration-300 hover:scale-105"
-//                     />
-//                     <div className="md:mr-8 text-center md:text-left mt-6 md:mt-0 md:w-1/2">
-//                         <h3 className="text-4xl font-semibold text-gray-800 mb-4">🎯 Mission</h3>
-//                         <p className="text-xl text-gray-600 leading-relaxed">
-//                             Our mission is to empower individuals and organizations through cutting-edge technological solutions, fostering growth and innovation.
-//                             By providing comprehensive support and resources, we strive to cultivate an environment where creativity and technology thrive together.
-//                         </p>
-//                     </div>
-//                 </div>
-//                 <div className="flex flex-col md:flex-row items-center mb-16">
-//                     <img
-//                         src="/goal.webp"
-//                         alt="Goal"
-//                         className="w-full md:w-1/2 h-64 object-contain rounded-lg transition-transform duration-300 hover:scale-105"
-//                     />
-//                     <div className="md:ml-8 text-center md:text-left mt-6 md:mt-0 md:w-1/2">
-//                         <h3 className="text-4xl font-semibold text-gray-800 mb-4">🚀 Goal</h3>
-//                         <p className="text-xl text-gray-600 leading-relaxed">
-//                             Our goal is to continuously push the boundaries of what's possible and lead the way towards a more prosperous, tech-driven future.
-//                             We aim to inspire and equip the next generation of innovators to tackle challenges and seize opportunities that arise in a rapidly evolving digital landscape.
-//                         </p>
-//                     </div>
-//                 </div>
-//             </section>
-//             <section className="bg-blue-600 py-16 px-8">
-//                 <div className="max-w-4xl mx-auto text-center relative bg-white rounded-lg shadow-lg p-12 transform transition-transform duration-500 hover:scale-105">
-//                     <div className="absolute inset-0 bg-blue-600 opacity-10 rounded-lg"></div>
-
-//                     <blockquote className="relative text-3xl font-semibold text-gray-800 italic mb-6">
-//                         <svg xmlns="http://www.w3.org/2000/svg" className="w-12 h-12 text-blue-600 inline-block" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-//                             <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 11V9a6 6 0 0112 0v1a6 6 0 01-6 6h-3v2a6 6 0 11-12 0v-1" />
-//                         </svg>
-//                         "Coming together is a beginning, staying together is progress, and working together is success."
-//                     </blockquote>
-
-//                     <cite className="relative text-lg font-medium text-gray-700">
-//                         - Henry Ford
-//                     </cite>
-//                 </div>
-//             </section>
-//         </div>
-//     );
-// }
 'use client'
 import { motion } from "framer-motion";
-import Slider from "react-slick"; // Make sure to install react-slick and slick-carousel
-import "slick-carousel/slick/slick.css"; // Corrected import
-import "slick-carousel/slick/slick-theme.css"; // Corrected import
 
 export default function Homepage() {
-    // Slider settings
-    const sliderSettings = {
-        dots: true,
-        infinite: true,
-        speed: 500,
-        slidesToShow: 1,
-        slidesToScroll: 1,
-        autoplay: true, // Enable autoplay
-        autoplaySpeed: 3000, // Slide every 3 seconds
-    };
-
     return (
         <div className="bg-white text-gray-900 select-none">
-    <section className="py-12 px-6 md:px-16 lg:ml-40 lg:mr-40">
-        <motion.h2 
-            className="text-3xl md:text-4xl font-bold text-center mb-8 md:mb-12 text-blue-600"
-            initial={{ opacity: 0, y: -50 }}
-            animate={{ opacity: 1, y: 0 }}
-            transition={{ duration: 0.6 }}
-        >
-            Path to Success
-        </motion.h2>
+            <section className="py-12 px-6 md:px-16 ml-40 mr-40">
+                <motion.h2
+                    className="text-4xl font-bold text-center mb-12 text-blue-600"
+                    initial={{ opacity: 0, y: -50 }}
+                    animate={{ opacity: 1, y: 0 }}
+                    transition={{ duration: 0.6 }}
+                >
+                    Path to Success
+                </motion.h2>
 
-        <motion.div 
-            className="flex flex-col md:flex-row items-center mb-12 md:mb-16"
-            initial={{ opacity: 0, x: -100 }}
-            animate={{ opacity: 1, x: 0 }}
-            transition={{ duration: 0.6 }}
-        >
-            <motion.img
-                src="/vision.webp"
-                alt="Vision"
-                className="w-full md:w-1/2 h-48 md:h-64 object-contain rounded-lg"
-                whileHover={{ scale: 1.05 }}
-                transition={{ duration: 0.3 }}
-            />
-            <motion.div 
-                className="md:ml-8 text-center md:text-left mt-6 md:mt-0 md:w-1/2"
-                initial={{ opacity: 0, x: 100 }}
-                animate={{ opacity: 1, x: 0 }}
-                transition={{ duration: 0.6 }}
-            >
-                <h3 className="text-2xl md:text-4xl font-semibold text-gray-800 mb-4">🌟 Vision</h3>
-                <p className="text-base md:text-xl text-gray-600 leading-relaxed">
-                    Our vision is to create a world where technology and innovation lead to the betterment of human lives, driving progress and success.
-                    We aim to bridge gaps and create opportunities through collaboration and forward-thinking strategies that inspire change and growth across all sectors.
-                </p>
-            </motion.div>
-        </motion.div>
+                <motion.div
+                    className="flex flex-col md:flex-row items-center mb-16"
+                    initial={{ opacity: 0, x: -100 }}
+                    animate={{ opacity: 1, x: 0 }}
+                    transition={{ duration: 0.6 }}
+                >
+                    <motion.img
+                        src="/vision.webp"
+                        alt="Vision"
+                        className="w-full md:w-1/2 h-64 object-contain rounded-lg"
+                        whileHover={{ scale: 1.05 }}
+                        transition={{ duration: 0.3 }}
+                    />
+                    <motion.div
+                        className="md:ml-8 text-center md:text-left mt-6 md:mt-0 md:w-1/2"
+                        initial={{ opacity: 0, x: 100 }}
+                        animate={{ opacity: 1, x: 0 }}
+                        transition={{ duration: 0.6 }}
+                    >
+                        <h3 className="text-4xl font-semibold text-gray-800 mb-4">🌟 Vision</h3>
+                        <p className="text-xl text-gray-600 leading-relaxed">
+                            Our vision is to create a world where technology and innovation lead to the betterment of human lives, driving progress and success.
+                            We aim to bridge gaps and create opportunities through collaboration and forward-thinking strategies that inspire change and growth across all sectors.
+                        </p>
+                    </motion.div>
+                </motion.div>
 
+                <motion.div
+                    className="flex flex-col md:flex-row-reverse items-center mb-16"
+                    initial={{ opacity: 0, x: 100 }}
+                    animate={{ opacity: 1, x: 0 }}
+                    transition={{ duration: 0.6 }}
+                >
+                    <motion.img
+                        src="/mission.webp"
+                        alt="Mission"
+                        className="w-full md:w-1/2 h-64 object-contain rounded-lg"
+                        whileHover={{ scale: 1.05 }}
+                        transition={{ duration: 0.3 }}
+                    />
+                    <motion.div
+                        className="md:mr-8 text-center md:text-left mt-6 md:mt-0 md:w-1/2"
+                        initial={{ opacity: 0, x: -100 }}
+                        animate={{ opacity: 1, x: 0 }}
+                        transition={{ duration: 0.6 }}
+                    >
+                        <h3 className="text-4xl font-semibold text-gray-800 mb-4">🎯 Mission</h3>
+                        <p className="text-xl text-gray-600 leading-relaxed">
+                            Our mission is to empower individuals and organizations through cutting-edge technological solutions, fostering growth and innovation.
+                            By providing comprehensive support and resources, we strive to cultivate an environment where creativity and technology thrive together.
+                        </p>
+                    </motion.div>
+                </motion.div>
 
-                <motion.div 
+                <motion.div
                     className="flex flex-col md:flex-row items-center mb-16"
                     initial={{ opacity: 0, x: -100 }}
                     animate={{ opacity: 1, x: 0 }}
@@ -136,7 +81,7 @@ export default function Homepage() {
                         whileHover={{ scale: 1.05 }}
                         transition={{ duration: 0.3 }}
                     />
-                    <motion.div 
+                    <motion.div
                         className="md:ml-8 text-center md:text-left mt-6 md:mt-0 md:w-1/2"
                         initial={{ opacity: 0, x: 100 }}
                         animate={{ opacity: 1, x: 0 }}
@@ -149,162 +94,33 @@ export default function Homepage() {
                         </p>
                     </motion.div>
                 </motion.div>
-
-                <h2 className="text-4xl font-bold text-center mb-12 text-blue-600">User Testimonials & Achievements</h2>
-                
-                <div className="flex flex-col md:flex-row justify-around mb-16">
-                    <div className="bg-white shadow-lg rounded-lg p-6 m-4 md:w-1/3">
-                        <h3 className="text-2xl font-semibold text-gray-800 mb-2">🏆 Hackathon Winner</h3>
-                        <p className="text-gray-600">
-                            "Participating in the annual hackathon was a transformative experience. Our team won first place with our innovative project!"
-                        </p>
-                    </div>
-                    <div className="bg-white shadow-lg rounded-lg p-6 m-4 md:w-1/3">
-                        <h3 className="text-2xl font-semibold text-gray-800 mb-2">🌟 Successful Project</h3>
-                        <p className="text-gray-600">
-                            "Our project not only met the goals but also exceeded expectations, leading to a successful launch and positive feedback from users."
-                        </p>
-                    </div>
-                    <div className="bg-white shadow-lg rounded-lg p-6 m-4 md:w-1/3">
-                        <h3 className="text-2xl font-semibold text-gray-800 mb-2">🎉 Impactful Event</h3>
-                        <p className="text-gray-600">
-                            "The recent event brought together industry leaders and aspiring innovators, creating a platform for collaboration and inspiration."
-                        </p>
-                    </div>
-                </div>
-
-                <section className="py-12 px-6 md:px-16 ml-40 mr-40">
-                    <h2 className="text-4xl font-bold text-center mb-12 text-blue-600">User Reviews</h2>
-                    
-                    <Slider {...sliderSettings}>
-                        <div className="bg-blue-50 shadow-lg rounded-lg p-6 m-4 transition-transform transform hover:scale-105">
-                            <p className="text-gray-800 text-lg">
-                                "This platform has transformed the way I approach my projects. The resources available are top-notch! 🚀"
-                            </p>
-                            <cite className="block text-right text-blue-600 font-semibold">- User 1</cite>
-                        </div>
-                        <div className="bg-blue-50 shadow-lg rounded-lg p-6 m-4 transition-transform transform hover:scale-105">
-                            <p className="text-gray-800 text-lg">
-                                "I had an amazing experience collaborating with others. The community is incredibly supportive! 🤝"
-                            </p>
-                            <cite className="block text-right text-blue-600 font-semibold">- User 2</cite>
-                        </div>
-                        <div className="bg-blue-50 shadow-lg rounded-lg p-6 m-4 transition-transform transform hover:scale-105">
-                            <p className="text-gray-800 text-lg">
-                                "The events organized are insightful and provide great networking opportunities. 🌐"
-                            </p>
-                            <cite className="block text-right text-blue-600 font-semibold">- User 3</cite>
-                        </div>
-                        <div className="bg-blue-50 shadow-lg rounded-lg p-6 m-4 transition-transform transform hover:scale-105">
-                            <p className="text-gray-800 text-lg">
-                                "I learned so much from the workshops. Highly recommend to anyone looking to grow their skills! 📚"
-                            </p>
-                            <cite className="block text-right text-blue-600 font-semibold">- User 4</cite>
-                        </div>
-                        <div className="bg-blue-50 shadow-lg rounded-lg p-6 m-4 transition-transform transform hover:scale-105">
-                            <p className="text-gray-800 text-lg">
-                                "The support from mentors has been invaluable. I feel more confident in my abilities now. 💪"
-                            </p>
-                            <cite className="block text-right text-blue-600 font-semibold">- User 5</cite>
-                        </div>
-                        <div className="bg-blue-50 shadow-lg rounded-lg p-6 m-4 transition-transform transform hover:scale-105">
-                            <p className="text-gray-800 text-lg">
-                                "A fantastic platform for innovation and collaboration. I can't wait for the next event! 🎉"
-                            </p>
-                            <cite className="block text-right text-blue-600 font-semibold">- User 6</cite>
-                        </div>
-                        <div className="bg-blue-50 shadow-lg rounded-lg p-6 m-4 transition-transform transform hover:scale-105">
-                            <p className="text-gray-800 text-lg">
-                                "The community is filled with passionate individuals. It's inspiring to be a part of it! 🌟"
-                            </p>
-                            <cite className="block text-right text-blue-600 font-semibold">- User 7</cite>
-                        </div>
-                    </Slider>
-                </section>
             </section>
 
-        <motion.div 
-            className="flex flex-col md:flex-row-reverse items-center mb-12 md:mb-16"
-            initial={{ opacity: 0, x: 100 }}
-            animate={{ opacity: 1, x: 0 }}
-            transition={{ duration: 0.6 }}
-        >
-            <motion.img
-                src="/mission.webp"
-                alt="Mission"
-                className="w-full md:w-1/2 h-48 md:h-64 object-contain rounded-lg"
-                whileHover={{ scale: 1.05 }}
-                transition={{ duration: 0.3 }}
-            />
-            <motion.div 
-                className="md:mr-8 text-center md:text-left mt-6 md:mt-0 md:w-1/2"
-                initial={{ opacity: 0, x: -100 }}
-                animate={{ opacity: 1, x: 0 }}
-                transition={{ duration: 0.6 }}
-            >
-                <h3 className="text-2xl md:text-4xl font-semibold text-gray-800 mb-4">🎯 Mission</h3>
-                <p className="text-base md:text-xl text-gray-600 leading-relaxed">
-                    Our mission is to empower individuals and organizations through cutting-edge technological solutions, fostering growth and innovation.
-                    By providing comprehensive support and resources, we strive to cultivate an environment where creativity and technology thrive together.
-                </p>
-            </motion.div>
-        </motion.div>
-
-
-        <motion.div 
-            className="flex flex-col md:flex-row items-center mb-12 md:mb-16"
-            initial={{ opacity: 0, x: -100 }}
-            animate={{ opacity: 1, x: 0 }}
-            transition={{ duration: 0.6 }}
-        >
-            <motion.img
-                src="/goal.webp"
-                alt="Goal"
-                className="w-full md:w-1/2 h-48 md:h-64 object-contain rounded-lg"
-                whileHover={{ scale: 1.05 }}
-                transition={{ duration: 0.3 }}
-            />
-            <motion.div 
-                className="md:ml-8 text-center md:text-left mt-6 md:mt-0 md:w-1/2"
-                initial={{ opacity: 0, x: 100 }}
-                animate={{ opacity: 1, x: 0 }}
-                transition={{ duration: 0.6 }}
+            <motion.section
+                className="bg-blue-600 py-16 px-8"
+                initial={{ opacity: 0 }}
+                animate={{ opacity: 1 }}
+                transition={{ duration: 1.2 }}
             >
-                <h3 className="text-2xl md:text-4xl font-semibold text-gray-800 mb-4">🚀 Goal</h3>
-                <p className="text-base md:text-xl text-gray-600 leading-relaxed">
-                    Our goal is to continuously push the boundaries of what's possible and lead the way towards a more prosperous, tech-driven future.
-                    We aim to inspire and equip the next generation of innovators to tackle challenges and seize opportunities that arise in a rapidly evolving digital landscape.
-                </p>
-            </motion.div>
-        </motion.div>
-    </section>
-
-    <motion.section 
-        className="bg-blue-600 py-16 px-6 md:px-8"
-        initial={{ opacity: 0 }}
-        animate={{ opacity: 1 }}
-        transition={{ duration: 1.2 }}
-    >
-        <motion.div 
-            className="max-w-2xl md:max-w-4xl mx-auto text-center relative bg-white rounded-lg shadow-lg p-8 md:p-12"
-            whileHover={{ scale: 1.05 }}
-            transition={{ duration: 0.5 }}
-        >
-            <div className="absolute inset-0 bg-blue-600 opacity-10 rounded-lg"></div>
-
-            <blockquote className="relative text-xl md:text-3xl font-semibold text-gray-800 italic mb-4 md:mb-6">
-                <svg xmlns="http://www.w3.org/2000/svg" className="w-8 md:w-12 h-8 md:h-12 text-blue-600 inline-block" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 11V9a6 6 0 0112 0v1a6 6 0 01-6 6h-3v2a6 6 0 11-12 0v-1" />
-                </svg>
-                "Coming together is a beginning, staying together is progress, and working together is success."
-            </blockquote>
-
-            <cite className="relative text-base md:text-lg font-medium text-gray-700">
-                - Henry Ford
-            </cite>
-        </motion.div>
-    </motion.section>
-</div>
-
+                <motion.div
+                    className="max-w-4xl mx-auto text-center relative bg-white rounded-lg shadow-lg p-12"
+                    whileHover={{ scale: 1.05 }}
+                    transition={{ duration: 0.5 }}
+                >
+                    <div className="absolute inset-0 bg-blue-600 opacity-10 rounded-lg"></div>
+
+                    <blockquote className="relative text-3xl font-semibold text-gray-800 italic mb-6">
+                        <svg xmlns="http://www.w3.org/2000/svg" className="w-12 h-12 text-blue-600 inline-block" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 11V9a6 6 0 0112 0v1a6 6 0 01-6 6h-3v2a6 6 0 11-12 0v-1" />
+                        </svg>
+                        "Coming together is a beginning, staying together is progress, and working together is success."
+                    </blockquote>
+
+                    <cite className="relative text-lg font-medium text-gray-700">
+                        - Henry Ford
+                    </cite>
+                </motion.div>
+            </motion.section>
+        </div>
     );
 }