diff --git a/components/Contact/ContactForm.jsx b/components/Contact/ContactForm.jsx
index ae00054..a499b8e 100644
--- a/components/Contact/ContactForm.jsx
+++ b/components/Contact/ContactForm.jsx
@@ -35,13 +35,76 @@ function ContactForm() {
 
     const handleSubmit = (e) => {
         e.preventDefault();
+
+        // Frontend validation before sending
+        if (!formData.name.trim() || formData.name.trim().length < 2) {
+            toast.error("Name must be at least 2 characters long.", {
+                position: "top-center",
+                autoClose: 5000,
+                theme: "colored"
+            });
+            return;
+        }
+
+        if (!formData.email.trim()) {
+            toast.error("Email is required.", {
+                position: "top-center",
+                autoClose: 5000,
+                theme: "colored"
+            });
+            return;
+        }
+
+        if (emailError) {
+            toast.error("Please enter a valid email address.", {
+                position: "top-center",
+                autoClose: 5000,
+                theme: "colored"
+            });
+            return;
+        }
+
+        if (!formData.message.trim() || formData.message.trim().length < 10) {
+            toast.error("Message must be at least 10 characters long.", {
+                position: "top-center",
+                autoClose: 5000,
+                theme: "colored"
+            });
+            return;
+        }
+
+        if (formData.message.trim().length > 2000) {
+            toast.error("Message must be less than 2000 characters.", {
+                position: "top-center",
+                autoClose: 5000,
+                theme: "colored"
+            });
+            return;
+        }
+
         setIsSubmitting(true);
 
+        // Log the data being sent for debugging
+        console.log("📤 Sending form data:", {
+            name: formData.name.trim(),
+            email: formData.email.trim(),
+            message: formData.message.trim(),
+            lengths: {
+                name: formData.name.trim().length,
+                email: formData.email.trim().length,
+                message: formData.message.trim().length
+            }
+        });
+
         axios
-            .post("/api/v1/contact", formData)
+            .post("/api/v1/contact", {
+                name: formData.name.trim(),
+                email: formData.email.trim(),
+                message: formData.message.trim()
+            })
             .then((response) => {
-                console.log("Response:", response.data);
-                toast.success("Your form has been submitted successfully!", {
+                console.log("✅ Response:", response.data);
+                toast.success(response.data.message || "Your form has been submitted successfully!", {
                     position: "top-center",
                     autoClose: 5000,
                     hideProgressBar: false,
@@ -56,25 +119,39 @@ function ContactForm() {
             })
             .catch((error) => {
                 console.error("Error:", error);
-                toast.error(
-                    "There was an error submitting your form. Please try again.",
-                    {
-                        position: "top-center",
-                        autoClose: 5000,
-                        hideProgressBar: false,
-                        closeOnClick: true,
-                        pauseOnHover: true,
-                        draggable: true,
-                        progress: undefined,
-                        theme: "colored"
-                    }
-                );
+
+                // Get specific error message from API response
+                let errorMessage = "There was an error submitting your form. Please try again.";
+
+                if (error.response && error.response.data) {
+                    errorMessage = error.response.data.message || errorMessage;
+                    console.log("API Error Details:", error.response.data);
+                }
+
+                toast.error(errorMessage, {
+                    position: "top-center",
+                    autoClose: 7000,
+                    hideProgressBar: false,
+                    closeOnClick: true,
+                    pauseOnHover: true,
+                    draggable: true,
+                    progress: undefined,
+                    theme: "colored"
+                });
                 setIsSubmitting(false);
             });
     };
 
-    const isFormValid =
-        formData.name && formData.email && formData.message && !emailError;
+    const isFormValid = () => {
+        return (
+            formData.name.trim().length >= 2 &&
+            formData.name.trim().length <= 100 &&
+            formData.email.trim() &&
+            !emailError &&
+            formData.message.trim().length >= 10 &&
+            formData.message.trim().length <= 2000
+        );
+    };
 
     return (
         <>
@@ -94,44 +171,68 @@ function ContactForm() {
                         >
                             Send Us Your Queries
                         </p>
-                        <input
-                            required
-                            type="text"
-                            name="name"
-                            placeholder="Name"
-                            value={formData.name}
-                            onChange={handleChange}
-                            className="border-b-2 border-gray text-white font-dmSans bg-bg_black outline-none w-[90%] sm:w-[70%] my-8 mx-auto mt-10"
-                        />
-                        <input
-                            required
-                            type="email"
-                            name="email"
-                            placeholder="Email"
-                            value={formData.email}
-                            onChange={handleChange}
-                            className="border-b-2 border-gray text-white font-dmSans bg-bg_black outline-none w-[90%] sm:w-[70%] my-8 mx-auto"
-                        />
-                        {emailError && (
-                            <p className="text-red-500 mx-auto">{emailError}</p>
-                        )}
-                        <input
-                            required
-                            type="text"
-                            name="message"
-                            placeholder="Enter Your Query"
-                            value={formData.message}
-                            onChange={handleChange}
-                            className="border-b-2 border-gray text-white font-dmSans bg-bg_black outline-none w-[90%] sm:w-[70%] my-8 mx-auto"
-                        />
+                        <div className="w-[90%] sm:w-[70%] mx-auto">
+                            <input
+                                required
+                                type="text"
+                                name="name"
+                                placeholder="Name"
+                                value={formData.name}
+                                onChange={handleChange}
+                                className={`border-b-2 ${formData.name.length > 0 && formData.name.length < 2 ? 'border-red-500' : 'border-gray'} text-white font-dmSans bg-bg_black outline-none w-full my-8 mt-10`}
+                            />
+                            {formData.name.length > 0 && formData.name.length < 2 && (
+                                <p className="text-red-500 text-sm -mt-6 mb-4">Name must be at least 2 characters</p>
+                            )}
+                            <div className="text-right text-gray-400 text-xs -mt-6 mb-2">
+                                {formData.name.length}/100
+                            </div>
+                        </div>
+
+                        <div className="w-[90%] sm:w-[70%] mx-auto">
+                            <input
+                                required
+                                type="email"
+                                name="email"
+                                placeholder="Email"
+                                value={formData.email}
+                                onChange={handleChange}
+                                className={`border-b-2 ${emailError ? 'border-red-500' : 'border-gray'} text-white font-dmSans bg-bg_black outline-none w-full my-8`}
+                            />
+                            {emailError && (
+                                <p className="text-red-500 text-sm -mt-6 mb-4">{emailError}</p>
+                            )}
+                        </div>
+
+                        <div className="w-[90%] sm:w-[70%] mx-auto">
+                            <textarea
+                                required
+                                name="message"
+                                placeholder="Enter Your Query (minimum 10 characters)"
+                                value={formData.message}
+                                onChange={handleChange}
+                                rows={4}
+                                className={`border-b-2 ${formData.message.length > 0 && formData.message.length < 10 ? 'border-red-500' : 'border-gray'} text-white font-dmSans bg-bg_black outline-none w-full my-8 resize-none`}
+                            />
+                            {formData.message.length > 0 && formData.message.length < 10 && (
+                                <p className="text-red-500 text-sm -mt-6 mb-2">Message must be at least 10 characters</p>
+                            )}
+                            {formData.message.length > 2000 && (
+                                <p className="text-red-500 text-sm -mt-6 mb-2">Message must be less than 2000 characters</p>
+                            )}
+                            <div className="text-right text-gray-400 text-xs -mt-6 mb-4">
+                                <span className={formData.message.length > 2000 ? 'text-red-500' : ''}>
+                                    {formData.message.length}/2000
+                                </span>
+                            </div>
+                        </div>
                         <button
                             onClick={handleSubmit}
-                            disabled={!isFormValid || isSubmitting}
-                            className={`text-black bg-bright_green font-dmSans font-bold  text-md md:text-lg rounded-full py-3 md:py-4 px-4 w-[40%] my-6 mx-auto ${
-                                !isFormValid || isSubmitting
+                            disabled={!isFormValid() || isSubmitting}
+                            className={`text-black bg-bright_green font-dmSans font-bold text-md md:text-lg rounded-full py-3 md:py-4 px-4 w-[40%] my-6 mx-auto transition-opacity ${!isFormValid() || isSubmitting
                                     ? "opacity-50 cursor-not-allowed"
-                                    : ""
-                            }`}
+                                    : "hover:bg-opacity-90"
+                                }`}
                         >
                             {isSubmitting ? "Submitting..." : "Submit"}
                         </button>
diff --git a/components/Home/Gallery.jsx b/components/Home/Gallery.jsx
index a9fbeed..666cb8f 100644
--- a/components/Home/Gallery.jsx
+++ b/components/Home/Gallery.jsx
@@ -20,6 +20,8 @@ import img8 from "../../public/Home/8.JPG";
 import img9 from "../../public/Home/9.JPG";
 import img10 from "../../public/Home/10.JPG";
 import img11 from "../../public/Home/11.jpg";
+import img12 from "../../public/Home/12.JPG";
+import img13 from "../../public/Home/13.JPG";
 
 const serviceData = [
     img1,
@@ -32,7 +34,9 @@ const serviceData = [
     img8,
     img9,
     img10,
-    img11
+    img11,
+    img12,
+    img13
 ];
 
 const ServiceSlider = () => {
@@ -83,14 +87,14 @@ const ServiceSlider = () => {
             //     slideShadows: false
             // }}
             pagination={{
-                dynamicBullets: true
+                clickable: true
             }}
             autoplay={{
                 delay: 2000,
-                disableOnInteraction: true
+                pauseOnHover: true
             }}
             modules={[Autoplay, Pagination]}
-            className="overflow-hidden"
+            className="overflow-hidden pb-12"
         >
             {serviceData.map((item, index) => (
                 <SwiperSlide key={index}>
diff --git a/components/Home/Sponsors.jsx b/components/Home/Sponsors.jsx
index ee021de..650e2d7 100644
--- a/components/Home/Sponsors.jsx
+++ b/components/Home/Sponsors.jsx
@@ -8,41 +8,62 @@ import { useEffect, useState } from "react";
 
 const Sponsors = () => {
     const [sponsors, setSponsors] = useState([]);
+    const [loading, setLoading] = useState(true);
+
     useEffect(() => {
         const fetchSponsors = async () => {
             try {
+                setLoading(true);
                 const response = await fetch("../api/v1/sponsers");
-                const result = await response.json(); 
+                const result = await response.json();
                 console.log("hello")
                 setSponsors(result.data);
             } catch (error) {
                 console.error("Error fetching sponsors:", error);
+            } finally {
+                setLoading(false);
             }
         };
 
         fetchSponsors();
     }, []);
 
+    // Skeleton component for loading state
+    const SponsorSkeleton = () => (
+        <div className="border-gradient rounded-xl">
+            <div className="bg-bg_black p-4 rounded-xl shadow-md flex justify-center items-center h-36 w-36 lg:w-72 lg:h-64">
+                <div className="animate-pulse bg-gray-600 rounded-md w-24 h-12 lg:w-48 lg:h-24"></div>
+            </div>
+        </div>
+    );
+
     return (
         <div className="py-12 text-center mb-10">
             <h2 className="text-4xl text-white mb-10 font-bold font-poppins">Sponsors</h2>
             <div className="flex flex-wrap justify-center items-center gap-10 rounded-xl">
-                {sponsors.map((sponsor, index) => (
-                    <div
-                        key={index}
-                        className="border-gradient rounded-xl transition-transform duration-300 hover:drop-shadow-glow"
-                    >
+                {loading ? (
+                    // Show 6 skeleton components while loading
+                    Array.from({ length: 6 }, (_, index) => (
+                        <SponsorSkeleton key={`skeleton-${index}`} />
+                    ))
+                ) : (
+                    sponsors.map((sponsor, index) => (
                         <div
-                            className="bg-bg_black p-4 rounded-xl shadow-md flex justify-center items-center h-36 w-36 lg:w-72 lg:h-64"
+                            key={index}
+                            className="border-gradient rounded-xl transition-transform duration-300 hover:drop-shadow-glow"
                         >
-                            <img
-                                src={sponsor.logo}
-                                alt={`${sponsor.name} Logo`}
-                                className="object-contain max-w-full max-h-full"
-                            />
+                            <div
+                                className="bg-bg_black p-4 rounded-xl shadow-md flex justify-center items-center h-36 w-36 lg:w-72 lg:h-64"
+                            >
+                                <img
+                                    src={sponsor.logo}
+                                    alt={`${sponsor.name} Logo`}
+                                    className="object-contain max-w-full max-h-full"
+                                />
+                            </div>
                         </div>
-                    </div>
-                ))}
+                    ))
+                )}
             </div>
 
             <style jsx>{`
@@ -56,6 +77,19 @@ const Sponsors = () => {
                     filter: drop-shadow(0 0 20px rgba(13, 255, 78, 1)); /* Stronger glow on hover */
                     transition: filter 0.3s ease-in-out; /* Smooth transition on hover */
                 }
+
+                @keyframes skeleton-pulse {
+                    0%, 100% {
+                        opacity: 0.6;
+                    }
+                    50% {
+                        opacity: 0.3;
+                    }
+                }
+
+                .animate-pulse {
+                    animation: skeleton-pulse 2s ease-in-out infinite;
+                }
             `}</style>
         </div>
     );
diff --git a/components/Shared/Scroll.jsx b/components/Shared/Scroll.jsx
index 1d34774..5ce18cd 100644
--- a/components/Shared/Scroll.jsx
+++ b/components/Shared/Scroll.jsx
@@ -26,7 +26,7 @@ const ScrollToTopButton = () => {
     }, []);
 
     return (
-        <div className="fixed bottom-20 right-16 max-md:right-4 max-md:bottom-4">
+        <div className="fixed bottom-20 right-16 max-md:right-4 max-md:bottom-4 z-50">
             {isVisible && (
                 <button
                     onClick={scrollToTop}
diff --git a/package.json b/package.json
index 5fd31de..992e809 100644
--- a/package.json
+++ b/package.json
@@ -30,6 +30,7 @@
         "mongoose": "^8.2.1",
         "next": "^14.1.0",
         "next-sitemap": "^4.2.3",
+        "node-mailer": "^0.1.1",
         "react": "^18",
         "react-confetti": "^6.1.0",
         "react-dom": "^18",
diff --git a/pages/api/v1/contact/index.js b/pages/api/v1/contact/index.js
index ef5ea1a..3d98510 100644
--- a/pages/api/v1/contact/index.js
+++ b/pages/api/v1/contact/index.js
@@ -1,30 +1,115 @@
-import Contact from "@/utils/models/contact.model";
-import DBInstance from "@/utils/db";
-DBInstance();
+import { sendmail } from "./nodemailer";
+
+const escapeHTML = (str) => {
+    return str.replace(/[&<>"']/g, (char) => {
+        return {
+            '&': '&amp;',
+            '<': '&lt;',
+            '>': '&gt;',
+            '"': '&quot;',
+            "'": '&#39;',
+        }[char];
+    });
+};
 
 export default async function handler(req, res) {
     if (req.method === "POST") {
         try {
-            const { name, email, message } = req.body;
+            // Log the incoming request body for debugging
+            console.log("📥 Received contact form data:", {
+                body: req.body,
+                bodyKeys: Object.keys(req.body || {}),
+                contentType: req.headers['content-type']
+            });
+
+            let { name, email, message } = req.body;
+
+            if (!name || !email || !message) {
+                console.log("❌ Missing required fields:", {
+                    name: !!name,
+                    email: !!email,
+                    message: !!message
+                });
+                return res
+                    .status(400)
+                    .json({
+                        success: false,
+                        message: "All fields are required",
+                        received: {
+                            name: !!name,
+                            email: !!email,
+                            message: !!message
+                        }
+                    });
+            }
+
+            name = escapeHTML(name);
+            email = escapeHTML(email);
+            message = escapeHTML(message);
 
-            const contact = new Contact({
+            // Enhanced validation
+            const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+            if (!emailRegex.test(email)) {
+                console.log("❌ Invalid email format:", email);
+                return res.status(400).json({
+                    success: false,
+                    message: "Please provide a valid email address",
+                    field: "email"
+                });
+            }
+
+            if (name.length < 2 || name.length > 100) {
+                console.log("❌ Invalid name length:", name.length);
+                return res.status(400).json({
+                    success: false,
+                    message: "Name must be between 2 and 100 characters",
+                    field: "name"
+                });
+            }
+
+            if (message.length < 10 || message.length > 2000) {
+                console.log("❌ Invalid message length:", message.length);
+                return res.status(400).json({
+                    success: false,
+                    message: "Message must be between 10 and 2000 characters",
+                    field: "message"
+                });
+            }
+
+            console.log("📧 Processing contact form submission:", {
                 name,
-                email,
-                message
+                email: email.replace(/(.{3}).*(@.*)/, "$1***$2"), // Mask email for logging
+                messageLength: message.length,
+                timestamp: new Date().toISOString()
             });
 
-            await contact.save();
+            const emailResponse = await sendmail(name, email, message);
 
-            res.status(200).json({ message: "Message sent successfully" });
+            if (emailResponse.success) {
+                console.log("✅ Contact form emails sent successfully");
+                return res.status(200).json({
+                    success: true,
+                    message: "Thank you! Your message has been sent successfully. We'll get back to you within 24-48 hours.",
+                    details: emailResponse.details
+                });
+            } else {
+                console.error("❌ Failed to send contact form emails:", emailResponse.message);
+                return res.status(500).json({
+                    success: false,
+                    message: "Sorry, there was an error sending your message. Please try again later or contact us directly."
+                });
+            }
         } catch (error) {
-            console.error(error, res, "INTERNAL_SERVER_ERROR");
+            console.error("❌ Error processing contact request:", error);
+            return res.status(500).json({
+                success: false,
+                message: "Internal server error. Please try again later."
+            });
         }
     } else {
-        console.log("🚫", req.method, "was called and got an error!");
         res.status(405).json({
             success: false,
-            data: null,
-            message: "🚫 HTTP Method not Allowed"
+            message: "Method not allowed. Please use POST."
         });
     }
 }
diff --git a/pages/api/v1/contact/nodemailer.js b/pages/api/v1/contact/nodemailer.js
new file mode 100644
index 0000000..0524eb2
--- /dev/null
+++ b/pages/api/v1/contact/nodemailer.js
@@ -0,0 +1,309 @@
+import nodemailer from "nodemailer";
+
+// Professional HTML email template with GitHub elements
+const createEmailTemplate = (name, email, query) => {
+    const currentDate = new Date().toLocaleString('en-US', {
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit',
+        timeZone: 'Asia/Kolkata'
+    });
+
+    return `
+    <!DOCTYPE html>
+    <html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>New Contact Form Submission</title>
+    </head>
+    <body style="margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif; background-color: #f6f8fa;">
+        <div style="max-width: 600px; margin: 0 auto; background-color: #ffffff; border: 1px solid #d0d7de; border-radius: 6px; overflow: hidden;">
+            
+            <!-- Header -->
+            <div style="background-color: #24292f; padding: 24px; border-bottom: 1px solid #d0d7de;">
+                <div style="display: flex; align-items: center; justify-content: center;">
+                    <svg height="24" width="24" viewBox="0 0 16 16" style="fill: #ffffff; margin-right: 8px;">
+                        <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/>
+                    </svg>
+                    <h1 style="color: #ffffff; margin: 0; font-size: 20px; font-weight: 600;">
+                        New Contact Form Submission
+                    </h1>
+                </div>
+                <p style="color: #7d8590; margin: 8px 0 0 0; font-size: 14px; text-align: center;">
+                    GitHub Community SRM • ${currentDate} (IST)
+                </p>
+            </div>
+
+            <!-- Content -->
+            <div style="padding: 24px;">
+                
+                <!-- Contact Information -->
+                <div style="background-color: #f6f8fa; padding: 16px; border: 1px solid #d0d7de; border-radius: 6px; margin-bottom: 16px;">
+                    <h2 style="color: #24292f; margin: 0 0 12px 0; font-size: 16px; font-weight: 600; border-bottom: 1px solid #d0d7de; padding-bottom: 8px;">
+                        Contact Information
+                    </h2>
+                    
+                    <table style="width: 100%; border-collapse: collapse;">
+                        <tr>
+                            <td style="padding: 6px 0; font-weight: 600; color: #656d76; width: 60px; vertical-align: top;">
+                                Name:
+                            </td>
+                            <td style="padding: 6px 0; color: #24292f;">
+                                ${name}
+                            </td>
+                        </tr>
+                        <tr>
+                            <td style="padding: 6px 0; font-weight: 600; color: #656d76; vertical-align: top;">
+                                Email:
+                            </td>
+                            <td style="padding: 6px 0;">
+                                <a href="mailto:${email}" style="color: #0969da; text-decoration: none;">
+                                    ${email}
+                                </a>
+                            </td>
+                        </tr>
+                    </table>
+                </div>
+
+                <!-- Message Content -->
+                <div style="background-color: #ffffff; padding: 16px; border: 1px solid #d0d7de; border-radius: 6px; margin-bottom: 16px;">
+                    <h2 style="color: #24292f; margin: 0 0 12px 0; font-size: 16px; font-weight: 600; border-bottom: 1px solid #d0d7de; padding-bottom: 8px;">
+                        Message
+                    </h2>
+                    
+                    <div style="background-color: #f6f8fa; padding: 12px; border-radius: 6px; border-left: 3px solid #0969da;">
+                        <p style="margin: 0; color: #24292f; font-size: 14px; line-height: 1.5; white-space: pre-wrap;">
+                            ${query}
+                        </p>
+                    </div>
+                </div>
+
+                <!-- Quick Actions -->
+                <div style="background-color: #f6f8fa; padding: 16px; border: 1px solid #d0d7de; border-radius: 6px; margin-bottom: 16px;">
+                    <h3 style="color: #24292f; margin: 0 0 12px 0; font-size: 14px; font-weight: 600;">
+                        Quick Actions
+                    </h3>
+                    
+                    <div style="text-align: left;">
+                        <a href="mailto:${email}?subject=Re: Your inquiry to GitHub Community SRM&body=Hi ${name},%0A%0AThank you for reaching out to GitHub Community SRM.%0A%0A" 
+                           style="background-color: #238636; color: #ffffff; padding: 8px 16px; text-decoration: none; border-radius: 6px; font-size: 14px; font-weight: 500; display: inline-block; margin-right: 8px; margin-bottom: 8px;">
+                            Reply to ${name}
+                        </a>
+                        <a href="mailto:${email}" 
+                           style="background-color: #0969da; color: #ffffff; padding: 8px 16px; text-decoration: none; border-radius: 6px; font-size: 14px; font-weight: 500; display: inline-block; margin-bottom: 8px;">
+                            Compose Email
+                        </a>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Footer -->
+            <div style="background-color: #f6f8fa; padding: 16px; border-top: 1px solid #d0d7de; text-align: center;">
+                <p style="color: #656d76; margin: 0; font-size: 12px;">
+                    This email was automatically generated from the GitHub Community SRM contact form.
+                </p>
+                <p style="color: #8b949e; margin: 4px 0 0 0; font-size: 11px;">
+                    Please do not reply to this email directly. Use the action buttons above to respond.
+                </p>
+            </div>
+        </div>
+    </body>
+    </html>
+    `;
+};
+
+// Professional confirmation email template
+const createConfirmationTemplate = (name) => {
+    return `
+    <!DOCTYPE html>
+    <html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Thank you for contacting GitHub Community SRM</title>
+    </head>
+    <body style="margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif; background-color: #f6f8fa;">
+        <div style="max-width: 600px; margin: 0 auto; background-color: #ffffff; border: 1px solid #d0d7de; border-radius: 6px; overflow: hidden;">
+            
+            <!-- Header -->
+            <div style="background-color: #24292f; padding: 24px; border-bottom: 1px solid #d0d7de;">
+                <div style="display: flex; align-items: center; justify-content: center;">
+                    <svg height="32" width="32" viewBox="0 0 16 16" style="fill: #ffffff; margin-right: 12px;">
+                        <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/>
+                    </svg>
+                    <div>
+                        <h1 style="color: #ffffff; margin: 0; font-size: 20px; font-weight: 600; line-height: 1;">
+                            GitHub Community SRM
+                        </h1>
+                        <p style="color: #7d8590; margin: 4px 0 0 0; font-size: 14px;">
+                            Message received successfully
+                        </p>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Content -->
+            <div style="padding: 32px 24px;">
+                <h2 style="color: #24292f; margin: 0 0 16px 0; font-size: 20px; font-weight: 600;">
+                    Hello ${name},
+                </h2>
+                
+                <p style="color: #656d76; font-size: 16px; line-height: 1.5; margin-bottom: 24px;">
+                    Thank you for reaching out to <strong>GitHub Community SRM</strong>. We have received your message and our team will respond within <strong>24-48 hours</strong>.
+                </p>
+
+                <div style="background-color: #f6f8fa; padding: 16px; border: 1px solid #d0d7de; border-radius: 6px; margin-bottom: 24px;">
+                    <div style="display: flex; align-items: flex-start;">
+                        <svg height="16" width="16" viewBox="0 0 16 16" style="fill: #656d76; margin-right: 8px; margin-top: 2px; flex-shrink: 0;">
+                            <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm7-3.25v2.992l2.028.812a.75.75 0 0 1-.557 1.392l-2.5-1A.751.751 0 0 1 7 8.25v-3.5a.75.75 0 0 1 1.5 0Z"/>
+                        </svg>
+                        <div>
+                            <p style="color: #24292f; font-size: 14px; margin: 0; font-weight: 600;">
+                                What happens next?
+                            </p>
+                            <p style="color: #656d76; font-size: 14px; margin: 4px 0 0 0; line-height: 1.4;">
+                                Our team will review your message and respond with relevant information or next steps.
+                            </p>
+                        </div>
+                    </div>
+                </div>
+
+                <div style="background-color: #ffffff; padding: 0; margin: 24px 0;">
+                    <h3 style="color: #24292f; margin: 0 0 16px 0; font-size: 16px; font-weight: 600;">
+                        Connect with us
+                    </h3>
+                    <div style="text-align: left;">
+                        <a href="https://github.com/SRM-IST-KTR" 
+                           style="background-color: #24292f; color: #ffffff; padding: 8px 12px; text-decoration: none; border-radius: 6px; font-size: 13px; font-weight: 500; display: inline-block; margin-right: 6px; margin-bottom: 6px;">
+                            <svg height="14" width="14" viewBox="0 0 16 16" style="fill: currentColor; margin-right: 5px; vertical-align: text-bottom;">
+                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/>
+                            </svg>
+                            GitHub
+                        </a>
+                        <a href="https://githubsrmist.in" 
+                           style="background-color: #0969da; color: #ffffff; padding: 8px 12px; text-decoration: none; border-radius: 6px; font-size: 13px; font-weight: 500; display: inline-block; margin-right: 6px; margin-bottom: 6px;">
+                            <svg height="14" width="14" viewBox="0 0 16 16" style="fill: currentColor; margin-right: 5px; vertical-align: text-bottom;">
+                                <path d="M7.775 3.275a.75.75 0 0 0 1.06 1.06l1.25-1.25a2 2 0 1 1 2.83 2.83l-2.5 2.5a2 2 0 0 1-2.83 0 .75.75 0 0 0-1.06 1.06 3.5 3.5 0 0 0 4.95 0l2.5-2.5a3.5 3.5 0 0 0-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 0 1 0-2.83l2.5-2.5a2 2 0 0 1 2.83 0 .75.75 0 0 0 1.06-1.06 3.5 3.5 0 0 0-4.95 0l-2.5 2.5a3.5 3.5 0 0 0 4.95 4.95l1.25-1.25a.75.75 0 0 0-1.06-1.06l-1.25 1.25a2 2 0 0 1-2.83 0z"/>
+                            </svg>
+                            Website
+                        </a>
+                        <a href="https://in.linkedin.com/company/githubsrm" 
+                           style="background-color: #0077b5; color: #ffffff; padding: 8px 12px; text-decoration: none; border-radius: 6px; font-size: 13px; font-weight: 500; display: inline-block; margin-right: 6px; margin-bottom: 6px;">
+                            <svg height="14" width="14" viewBox="0 0 24 24" style="fill: currentColor; margin-right: 5px; vertical-align: text-bottom;">
+                                <path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/>
+                            </svg>
+                            LinkedIn
+                        </a>
+                        <a href="https://instagram.com/githubsrm" 
+                           style="background-color: #e4405f; color: #ffffff; padding: 8px 12px; text-decoration: none; border-radius: 6px; font-size: 13px; font-weight: 500; display: inline-block; margin-right: 6px; margin-bottom: 6px;">
+                            <svg height="14" width="14" viewBox="0 0 24 24" style="fill: currentColor; margin-right: 5px; vertical-align: text-bottom;">
+                                <path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z"/>
+                            </svg>
+                            Instagram
+                        </a>
+                        <a href="https://discord.gg/vdJmdmG4NW" 
+                           style="background-color: #5865f2; color: #ffffff; padding: 8px 12px; text-decoration: none; border-radius: 6px; font-size: 13px; font-weight: 500; display: inline-block; margin-bottom: 6px;">
+                            <svg height="14" width="14" viewBox="0 0 24 24" style="fill: currentColor; margin-right: 5px; vertical-align: text-bottom;">
+                                <path d="M20.317 4.3698a19.7913 19.7913 0 00-4.8851-1.5152.0741.0741 0 00-.0785.0371c-.211.3753-.4447.8648-.6083 1.2495-1.8447-.2762-3.68-.2762-5.4868 0-.1636-.3933-.4058-.8742-.6177-1.2495a.077.077 0 00-.0785-.037 19.7363 19.7363 0 00-4.8852 1.515.0699.0699 0 00-.0321.0277C.5334 9.0458-.319 13.5799.0992 18.0578a.0824.0824 0 00.0312.0561c2.0528 1.5076 4.0413 2.4228 5.9929 3.0294a.0777.0777 0 00.0842-.0276c.4616-.6304.8731-1.2952 1.226-1.9942a.076.076 0 00-.0416-.1057c-.6528-.2476-1.2743-.5495-1.8722-.8923a.077.077 0 01-.0076-.1277c.1258-.0943.2517-.1923.3718-.2914a.0743.0743 0 01.0776-.0105c3.9278 1.7933 8.18 1.7933 12.0614 0a.0739.0739 0 01.0785.0095c.1202.099.246.1981.3728.2924a.077.077 0 01-.0066.1276 12.2986 12.2986 0 01-1.873.8914.0766.0766 0 00-.0407.1067c.3604.698.7719 1.3628 1.225 1.9932a.076.076 0 00.0842.0286c1.961-.6067 3.9495-1.5219 6.0023-3.0294a.077.077 0 00.0313-.0552c.5004-5.177-.8382-9.6739-3.5485-13.6604a.061.061 0 00-.0312-.0286zM8.02 15.3312c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9555-2.4189 2.157-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419-.0188 1.3332-.9555 2.4189-2.1569 2.4189zm7.9748 0c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9554-2.4189 2.1569-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.9555 2.4189-2.1568 2.4189Z"/>
+                            </svg>
+                            Discord
+                        </a>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Footer -->
+            <div style="background-color: #f6f8fa; padding: 24px; border-top: 1px solid #d0d7de; text-align: center;">
+                <p style="color: #656d76; margin: 0; font-size: 12px;">
+                    © 2025 GitHub Community SRM. All rights reserved.
+                </p>
+                <p style="color: #8b949e; margin: 8px 0 0 0; font-size: 11px;">
+                    This is an automated confirmation email. Please do not reply directly to this message.
+                </p>
+            </div>
+        </div>
+    </body>
+    </html>
+    `;
+};
+
+export const sendmail = async (name, email, query) => {
+    try {
+        const transporter = nodemailer.createTransport({
+            host: "smtp.zoho.in",
+            port: 465,
+            secure: true,
+            auth: {
+                user: process.env.SENDER_EMAIL,
+                pass: process.env.SENDER_PASS
+            }
+        });
+
+        // Enhanced mail options for the team
+        const teamMailOptions = {
+            from: process.env.SENDER_EMAIL,
+            to: process.env.RECIPIENT_EMAIL,
+            replyTo: email, // Enable direct reply to the sender
+            subject: `🔔 New Contact Form Submission from ${name}`,
+            html: createEmailTemplate(name, email, query),
+            // Add plain text version for better compatibility
+            text: `
+New Contact Form Submission
+
+From: ${name} (${email})
+Date: ${new Date().toLocaleString('en-US', { timeZone: 'Asia/Kolkata' })} IST
+
+Message:
+${query}
+
+Reply to this person: ${email}
+            `
+        };
+
+        // Confirmation email for the sender
+        const confirmationMailOptions = {
+            from: process.env.SENDER_EMAIL,
+            to: email,
+            subject: "✅ Thank you for contacting GitHub Community SRM",
+            html: createConfirmationTemplate(name),
+            text: `
+Hi ${name}!
+
+Thank you for reaching out to GitHub Community SRM! We've received your message and our team will get back to you within 24-48 hours.
+
+What happens next?
+Our team will review your message and respond with relevant information, resources, or next steps.
+
+Best regards,
+GitHub Community SRM Team
+            `
+        };
+
+        // Send both emails
+        const [teamEmailResult, confirmationResult] = await Promise.all([
+            transporter.sendMail(teamMailOptions),
+            transporter.sendMail(confirmationMailOptions)
+        ]);
+
+        console.log("Team email sent successfully:", teamEmailResult.response);
+        console.log("Confirmation email sent successfully:", confirmationResult.response);
+
+        return {
+            success: true,
+            message: "Emails sent successfully",
+            details: {
+                teamEmail: teamEmailResult.messageId,
+                confirmationEmail: confirmationResult.messageId
+            }
+        };
+    } catch (err) {
+        console.error("Error sending emails:", err.message);
+        return {
+            success: false,
+            message: `Failed to send email: ${err.message}`
+        };
+    }
+};
\ No newline at end of file
diff --git a/pages/api/v1/sponsers/index.js b/pages/api/v1/sponsers/index.js
index a39729f..a999a90 100644
--- a/pages/api/v1/sponsers/index.js
+++ b/pages/api/v1/sponsers/index.js
@@ -1,4 +1,3 @@
-import Contact from "@/utils/models/sponser.model";
 import DBInstance from "@/utils/db";
 import Sponsor from "@/utils/models/sponser.model";
 DBInstance();
diff --git a/public/Home/12.JPG b/public/Home/12.JPG
new file mode 100644
index 0000000..7849414
Binary files /dev/null and b/public/Home/12.JPG differ
diff --git a/public/Home/13.JPG b/public/Home/13.JPG
new file mode 100644
index 0000000..572a116
Binary files /dev/null and b/public/Home/13.JPG differ
diff --git a/public/sitemap-0.xml b/public/sitemap-0.xml
index e867873..7814164 100644
--- a/public/sitemap-0.xml
+++ b/public/sitemap-0.xml
@@ -1,8 +1,8 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:news="http://www.google.com/schemas/sitemap-news/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1">
-<url><loc>https://githubsrmist.tech</loc><lastmod>2025-03-13T07:22:50.228Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://githubsrmist.tech/about</loc><lastmod>2025-03-13T07:22:50.229Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://githubsrmist.tech/contact</loc><lastmod>2025-03-13T07:22:50.229Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://githubsrmist.tech/events</loc><lastmod>2025-03-13T07:22:50.229Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://githubsrmist.tech/team</loc><lastmod>2025-03-13T07:22:50.229Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://githubsrmist.tech</loc><lastmod>2025-04-05T20:41:37.713Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://githubsrmist.tech/about</loc><lastmod>2025-04-05T20:41:37.714Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://githubsrmist.tech/contact</loc><lastmod>2025-04-05T20:41:37.714Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://githubsrmist.tech/events</loc><lastmod>2025-04-05T20:41:37.714Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://githubsrmist.tech/team</loc><lastmod>2025-04-05T20:41:37.714Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
 </urlset>
\ No newline at end of file
diff --git a/styles/globals.css b/styles/globals.css
index c151f99..e6b8c6f 100644
--- a/styles/globals.css
+++ b/styles/globals.css
@@ -2,3 +2,34 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
+.swiper {
+    position: relative !important;
+}
+
+
+.swiper-pagination {
+    background-color: rgba(0, 0, 0, 0.5);
+    padding: 10px 15px;
+    border-radius: 15px;
+    display: flex !important;
+    justify-content: center;
+    align-items: center;
+    width: fit-content !important;
+    margin: auto !important;
+
+    position: absolute !important;
+    bottom: 15px !important;
+    left: 50% !important;
+    transform: translateX(-50%) !important;
+}
+
+.swiper-pagination-bullet {
+    background: white !important;
+    opacity: 0.7;
+}
+
+.swiper-pagination-bullet-active {
+    background: rgb(13 255 78) !important;
+    opacity: 1;
+}
diff --git a/utils/models/contact.model.js b/utils/models/contact.model.js
index 7d05b67..74f79e4 100644
--- a/utils/models/contact.model.js
+++ b/utils/models/contact.model.js
@@ -15,6 +15,6 @@ const contactSchema = new mongoose.Schema({
     }
 });
 
-const Contact = mongoose.model.Contact || mongoose.model("Contacts", contactSchema);
+const Contact = mongoose.models.Contacts || mongoose.model("Contacts", contactSchema);
 
 export default Contact;
diff --git a/utils/models/sponser.model.js b/utils/models/sponser.model.js
index 351d344..c734af4 100644
--- a/utils/models/sponser.model.js
+++ b/utils/models/sponser.model.js
@@ -11,6 +11,6 @@ const sponsorSchema = new mongoose.Schema({
     }
 });
 
-const Sponsor = mongoose.model.Sponsor || mongoose.model("sponsors", sponsorSchema);
+const Sponsor = mongoose.models.sponsors || mongoose.model("sponsors", sponsorSchema);
 
 export default Sponsor;
\ No newline at end of file
diff --git a/utils/models/team.model.js b/utils/models/team.model.js
index aa5b3f2..30a5a0f 100644
--- a/utils/models/team.model.js
+++ b/utils/models/team.model.js
@@ -18,6 +18,6 @@ const teamSchema = new mongoose.Schema({
     }
 });
 
-const Team = mongoose.model.teams || mongoose.model("teams", teamSchema);
+const Team = mongoose.models.teams || mongoose.model("teams", teamSchema);
 
 export default Team;
diff --git a/yarn.lock b/yarn.lock
index fee4346..1815b36 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4872,6 +4872,13 @@ next@^14.1.0:
     "@next/swc-win32-ia32-msvc" "14.2.5"
     "@next/swc-win32-x64-msvc" "14.2.5"
 
+node-mailer@^0.1.1:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/node-mailer/-/node-mailer-0.1.1.tgz#609e14a9b2c34422540b3a66938163d1d2421500"
+  integrity sha512-L3YwTtPodsYr1sNPW/PxXw0rSOr/ldygaIph2YtXDwLGt9l8km/OjM0Wrr57Yf07JEEnDb3wApjhVdR0k5v0kw==
+  dependencies:
+    nodemailer ">= 0.1.15"
+
 node-abi@^3.3.0:
   version "3.74.0"
   resolved "https://registry.yarnpkg.com/node-abi/-/node-abi-3.74.0.tgz#5bfb4424264eaeb91432d2adb9da23c63a301ed0"
@@ -4896,6 +4903,11 @@ node-releases@^2.0.18:
   resolved "https://registry.npmjs.org/node-releases/-/node-releases-2.0.18.tgz"
   integrity sha512-d9VeXT4SJ7ZeOqGX6R5EM022wpL+eWPooLI+5UpWn2jCT1aosUQEhQP214x33Wkwx3JQMvIm+tIoVOdodFS40g==
 
+"nodemailer@>= 0.1.15":
+  version "6.9.16"
+  resolved "https://registry.yarnpkg.com/nodemailer/-/nodemailer-6.9.16.tgz#3ebdf6c6f477c571c0facb0727b33892635e0b8b"
+  integrity sha512-psAuZdTIRN08HKVd/E8ObdV6NO7NTBY3KsC30F7M4H1OnmLCUNaS56FpYxyb26zWLSyYF9Ozch9KYHhHegsiOQ==
+
 normalize-path@^3.0.0, normalize-path@~3.0.0:
   version "3.0.0"
   resolved "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz"