diff --git a/home.html b/home.html
new file mode 100644
index 0000000..91159af
--- /dev/null
+++ b/home.html
@@ -0,0 +1,851 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Kodepilot</title>
+    <link rel="stylesheet" href="main.css">
+    <link rel="stylesheet" href="main.css">
+    <link rel="icon" type="image/x-icon" href="assets/images/logo/favicon.ico">
+    <style>
+        .center-container {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            height: 100vh;
+            position: relative;
+        }
+
+        .scene {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            height: 100%;
+            width: 100%;
+        }
+
+
+        .cube-wrapper {
+            transform-style: preserve-3d;
+            animation: bouncing 2s infinite;
+        }
+
+        .cube {
+            transform-style: preserve-3d;
+            transform: rotateX(45deg) rotateZ(45deg);
+            animation: rotation 2s infinite;
+        }
+
+        .cube-faces {
+            transform-style: preserve-3d;
+            height: 80px;
+            width: 80px;
+            position: relative;
+            transform-origin: 0 0;
+            transform: translateX(0) translateY(0) translateZ(-40px);
+        }
+
+        .cube-face {
+            position: absolute;
+            inset: 0;
+            background: #003366;
+            border: solid 1px rgb(255, 255, 255);
+        }
+
+        .cube-face.shadow {
+            transform: translateZ(-80px);
+            animation: bouncing-shadow 2s infinite;
+        }
+
+        .cube-face.top {
+            transform: translateZ(80px);
+        }
+
+        .cube-face.front {
+            transform-origin: 0 50%;
+            transform: rotateY(-90deg);
+        }
+
+        .cube-face.back {
+            transform-origin: 0 50%;
+            transform: rotateY(-90deg) translateZ(-80px);
+        }
+
+        .cube-face.right {
+            transform-origin: 50% 0;
+            transform: rotateX(-90deg) translateY(-80px);
+        }
+
+        .cube-face.left {
+            transform-origin: 50% 0;
+            transform: rotateX(-90deg) translateY(-80px) translateZ(80px);
+        }
+
+        @keyframes rotation {
+            0% {
+                transform: rotateX(45deg) rotateY(0) rotateZ(45deg);
+                animation-timing-function: cubic-bezier(0.17, 0.84, 0.44, 1);
+            }
+
+            50% {
+                transform: rotateX(45deg) rotateY(0) rotateZ(225deg);
+                animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
+            }
+
+            100% {
+                transform: rotateX(45deg) rotateY(0) rotateZ(405deg);
+                animation-timing-function: cubic-bezier(0.17, 0.84, 0.44, 1);
+            }
+        }
+
+        @keyframes bouncing {
+            0% {
+                transform: translateY(-40px);
+                animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
+            }
+
+            45% {
+                transform: translateY(40px);
+                animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
+            }
+
+            100% {
+                transform: translateY(-40px);
+                animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
+            }
+        }
+
+        @keyframes bouncing-shadow {
+            0% {
+                transform: translateZ(-80px) scale(1.3);
+                animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
+                opacity: 0.05;
+            }
+
+            45% {
+                transform: translateZ(0);
+                animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
+                opacity: 0.3;
+            }
+
+            100% {
+                transform: translateZ(-80px) scale(1.3);
+                animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
+                opacity: 0.05;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div id="msg" style="font-size: largest;" class="center-container">
+        <div class="scene">
+            <div class="cube-wrapper">
+                <div class="cube">
+                    <div class="cube-faces">
+                        <div class="cube-face shadow"></div>
+                        <div class="cube-face bottom"></div>
+                        <div class="cube-face top"></div>
+                        <div class="cube-face left"></div>
+                        <div class="cube-face right"></div>
+                        <div class="cube-face back"></div>
+                        <div class="cube-face front"></div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div id="body" style="display: none;">
+        <header class="navbar">
+            <div class="logo">Kodepilot</div>
+            <input type="text" class="search" placeholder="Search Opportunities">
+            <div class="buttons">
+                <a href="/login">Log in</a>
+                <button class="business" onclick="getInTouch()">Let's Talk</button>
+                <button class="login" onclick="goToApplay()">Request a call</button>
+            </div>
+        </header>
+
+        <section class="hero">
+            <div class="hero_container">
+                <div class="cards_box">
+                    <h1><span class="blue_text">Unlock</span> Your Career</h1>
+                    <p>Explore opportunities from across the globe to grow, showcase skills, gain CV points & get hired
+                        by
+                        your
+                        dream company.</p>
+                    <button class="button_blue_box">
+                        <img src="https://d8it4huxumps7.cloudfront.net/uploads/images/655edc8c1fab9_diamond_1.png?d=82x84"
+                            width="41" height="42" alt="diamond" loading="lazy">
+                        <span>
+                            <span class="nameContainer">Aditya</span>
+                            <strong class="descContainer"> Just Went Kodepilot!</strong>
+                        </span>
+                    </button>
+                    <style>
+                        .nameContainer,
+                        .descContainer {
+                            transition: opacity 0.5s;
+                        }
+
+                        .fade-out {
+                            opacity: 0;
+                        }
+
+                        .fade-in {
+                            opacity: 1;
+                        }
+                    </style>
+                    <script>
+                        const data = [
+                            { name: "Ben", text: "Just Went HCL!" },
+                            { name: "Rakul", text: "Just Went Accenture!" },
+                            { name: "Anjali", text: "Joined a Ebmpapst!" },
+                            { name: "Sneha", text: "joined a Infosys!" },
+                            { name: "Amit", text: "Just Went JBL!" },
+                            { name: "Vikram", text: "Just Went UST!" },
+                            { name: "Priya", text: "Just Went Serviceplaingroup!" }
+                        ];
+                        let index1 = 0;
+                        const nameEl1 = document.querySelector(".nameContainer");
+                        const descEl1 = document.querySelector(".descContainer");
+                        setInterval(() => {
+                            nameEl1.classList.add("fade-out");
+                            descEl1.classList.add("fade-out");
+                            setTimeout(() => {
+                                index1 = (index1 + 1) % data.length;
+                                nameEl1.textContent = data[index1].name;
+                                descEl1.textContent = " " + data[index1].text;
+                                nameEl1.classList.remove("fade-out");
+                                descEl1.classList.remove("fade-out");
+                                nameEl1.classList.add("fade-in");
+                                descEl1.classList.add("fade-in");
+                                setTimeout(() => {
+                                    nameEl1.classList.remove("fade-in");
+                                    descEl1.classList.remove("fade-in");
+                                }, 500);
+                            }, 500);
+                        }, 5000);
+                    </script>
+                </div>
+                <div class="cards">
+                    <div class="card green">Internships<br><small>Gain Practical Experience</small></div>
+                    <div class="card orange">Mentorships<br><small>Guidance From Top Mentors</small></div>
+                    <div class="card blue">Jobs<br><small>Explore Diverse Careers</small></div>
+                    <div class="card purple">Practice<br><small>Refine Skills Daily</small></div>
+                    <div class="card yellow">Competitions<br><small>Battle For Excellence</small></div>
+                    <div class="card pink">More<br><small>Explore More Options</small></div>
+                </div>
+            </div>
+        </section>
+
+        <section class="users">
+            <div class="users_box">
+                <h2>Who's using Kodepilot?</h2>
+                <div class="know-cards">
+                    <div>
+                        <div class="crd">
+                            <div class="d-flex flex-column">
+                                <div class="h4">Students and Professionals</div>
+                                <p><strong>Unlock
+                                        Your
+                                        Potential:</strong> Compete, Build Resume, Grow and get Hired! </p>
+                            </div><img
+                                src="https://d8it4huxumps7.cloudfront.net/uploads/images/67724b0c0d0f7_img1.png?d=211x163"
+                                alt="Students and Professionals" width="105" height="81" loading="lazy">
+                        </div>
+                    </div>
+                    <div>
+                        <div class="crd">
+                            <div class="d-flex flex-column">
+                                <div class="h4">Companies and Recruiters</div>
+                                <p><strong>Discover
+                                        Right
+                                        Talent:</strong> Hire, Engage, and Brand Like Never Before! </p>
+                            </div><img
+                                src="https://d8it4huxumps7.cloudfront.net/uploads/images/67727626b861a_img2.png?d=211x163"
+                                alt="Companies and Recruiters" width="105" height="81" loading="lazy">
+                        </div>
+                    </div>
+                    <div>
+                        <div class="crd">
+                            <div class="d-flex flex-column">
+                                <div class="h4">Colleges</div>
+                                <p><strong>Bridge
+                                        Academia
+                                        and Industry:</strong> Empower Students with Real-World Opportunities! </p>
+                            </div><img
+                                src="https://d8it4huxumps7.cloudfront.net/uploads/images/67724b2a99511_img3.png?d=211x163"
+                                alt="ridge Academia and Industry" width="105" height="81" loading="lazy">
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <section class="mnc">
+            <div class="mnc-box">
+                <div class="mnc-row">
+                    <h2>
+                        <span class="gray"> Top Industries </span>
+                        <span class="blue_text">We Placed</span>
+                    </h2>
+                    <div class="mnc-logos">
+                        <div class="mnc-logos-track">
+                            <img class="image-hcl" src="https://repo.dhanu.cloud/ico/hcl.svg" alt="hcl">
+                            <img src="https://repo.dhanu.cloud/ico/ebmpapst.svg" alt="ebmpapst">
+                            <img src="https://repo.dhanu.cloud/ico/infosys.svg" alt="infosys">
+                            <img src="https://repo.dhanu.cloud/ico/jbl.svg" alt="jbl">
+                            <img src="https://repo.dhanu.cloud/ico/ust.svg" alt="ust">
+                            <img src="https://repo.dhanu.cloud/ico/accenture.svg" alt="accenture">
+                            <img class="image-hcl" src="https://repo.dhanu.cloud/ico/hcl.svg" alt="hcl">
+                            <img src="https://repo.dhanu.cloud/ico/ebmpapst.svg" alt="ebmpapst">
+                            <img src="https://repo.dhanu.cloud/ico/infosys.svg" alt="infosys">
+                            <img src="https://repo.dhanu.cloud/ico/jbl.svg" alt="jbl">
+                            <img src="https://repo.dhanu.cloud/ico/ust.svg" alt="ust">
+                            <img src="https://repo.dhanu.cloud/ico/accenture.svg" alt="accenture">
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <section id="slider">
+            <div class="slide1r-container">
+                <div class="slide1r-wrapper">
+                    <div class="slide1r-track" id="slide1rTrack">
+                        <!-- Slide 1 -->
+                        <div class="slide1">
+                            <div class="slide1-box">
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/qa.jpg" alt="Business Meeting">
+                                    <div class="image-overlay">
+                                        <h4>QA & Testing</h4>
+                                        <p>A close-up of a developer's screen showing a green 'Tests Passed' status and
+                                            a successful performance report graph.</p>
+                                    </div>
+                                </div>
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/hai12.jpg" alt="Architecture">
+                                    <div class="image-overlay">
+                                        <h4>Software Dev</h4>
+                                        <p>A sleek image of a professional wireframe/design on a large monitor, with a
+                                            split view showing the finished product on a mobile phone.</p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Slide 2 -->
+                        <div class="slide1">
+                            <div class="slide1-box">
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/ai.jpg" alt="Analytics">
+                                    <div class="image-overlay">
+                                        <h4>AI & Data</h4>
+                                        <p>A stunning, large-scale data visualization or chart (like a complex network
+                                            graph) displayed on a screen, hinting at discovery and high-level strategy.
+                                        </p>
+                                    </div>
+                                </div>
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/cyber.jpg" alt="Technology">
+                                    <div class="image-overlay">
+                                        <h4>Cybersecurity</h4>
+                                        <p>A digital shield or lock icon overlaid on a dark, technical background with
+                                            green/blue code lines, symbolizing protection.</p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="slide1">
+                            <div class="slide1-box">
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/qa.jpg" alt="Analytics">
+                                    <div class="image-overlay">
+                                        <h4>QA & Testing</h4>
+                                        <p>A close-up of a developer's screen showing a green 'Tests Passed' status and
+                                            a successful performance report graph.</p>
+                                    </div>
+                                </div>
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/cyber.jpg" alt="Technology">
+                                    <div class="image-overlay">
+                                        <h4>Cybersecurity</h4>
+                                        <p>A digital shield or lock icon overlaid on a dark, technical background with
+                                            green/blue code lines, symbolizing protection.</p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="slide1">
+                            <div class="slide1-box">
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/hai12.jpg" alt="Analytics">
+                                    <div class="image-overlay">
+                                        <h4>Software Dev</h4>
+                                        <p>A sleek image of a professional wireframe/design on a large monitor, with a
+                                            split view showing the finished product on a mobile phone.</p>
+                                    </div>
+                                </div>
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/qa.jpg" alt="Technology">
+                                    <div class="image-overlay">
+                                        <h4>QA & Testing</h4>
+                                        <p>A close-up of a developer's screen showing a green 'Tests Passed' status and
+                                            a successful performance report graph.</p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="slide1">
+                            <div class="slide1-box">
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/ai.jpg" alt="Analytics">
+                                    <div class="image-overlay">
+                                        <h4>AI & Data</h4>
+                                        <p>A stunning, large-scale data visualization or chart (like a complex network
+                                            graph) displayed on a screen, hinting at discovery and high-level strategy.
+                                        </p>
+                                    </div>
+                                </div>
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/aws..jpg" alt="Technology">
+                                    <div class="image-overlay">
+                                        <h4>Cloud & DevOps</h4>
+                                        <p>An abstract, interconnected graphic of servers and data pipelines with subtle
+                                            logos (AWS/Azure/GCP-style icons, if usage is permitted) to symbolize
+                                            powerful infrastructure.</p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="slide1">
+                            <div class="slide1-box">
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/ai.jpg" alt="Analytics">
+                                    <div class="image-overlay">
+                                        <h4>AI & Data</h4>
+                                        <p>A stunning, large-scale data visualization or chart (like a complex network
+                                            graph) displayed on a screen, hinting at discovery and high-level strategy.
+                                        </p>
+                                    </div>
+                                </div>
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/cyber.jpg" alt="Technology">
+                                    <div class="image-overlay">
+                                        <h4>Cybersecurity</h4>
+                                        <p>A digital shield or lock icon overlaid on a dark, technical background with
+                                            green/blue code lines, symbolizing protection.</p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <div class="slide1">
+                            <div class="slide1-box">
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/hai12.jpg" alt="Creativity">
+                                    <div class="image-overlay">
+                                        <h4>Software Dev</h4>
+                                        <p>A sleek image of a professional wireframe/design on a large monitor, with a
+                                            split view showing the finished product on a mobile phone.</p>
+                                    </div>
+                                </div>
+                                <div class="image-container">
+                                    <img src="assets/images/hai1/aws..jpg" alt="Beach">
+                                    <div class="image-overlay">
+                                        <h4>Cloud & DevOps</h4>
+                                        <p>An abstract, interconnected graphic of servers and data pipelines with subtle
+                                            logos (AWS/Azure/GCP-style icons, if usage is permitted) to symbolize
+                                            powerful infrastructure.</p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <button class="nav-button prev-btn" id="prevBtn" aria-label="Previous slide"></button>
+                <button class="nav-button next-btn" id="nextBtn" aria-label="Next slide"></button>
+            </div>
+        </section>
+        <section class="opportunity-section">
+            <div class="container">
+                <div class="header">
+                    <h2 class="title">
+                        Pick <span class="highlight">The Right Opportunity!</span>
+                    </h2>
+                    <div class="header-content">
+                        <p class="subtitle">Explore opportunities that best suits your skills and interests!</p>
+                    </div>
+                </div>
+
+                <div class="cards-grid">
+                    <div class="card-add  card-quizzes">
+                    </div>
+
+                    <div class="card-add  card-hackathons">
+                    </div>
+
+                    <div class="card-add  card-scholarships">
+                    </div>
+
+                    <div class="card-add  card-conferences">
+                    </div>
+
+                    <div class="card-add  card-festivals">
+                    </div>
+                </div>
+            </div>
+        </section>
+        <section class="move-slider-ruby">
+            <div class="move-slider-container">
+                <div class="move-slider-box-static">
+                    <div class="slide-content-static">
+                        <h1 class="slide-static-h1"> Kodepilot </h1>
+                        <p class="slide-static-text">
+                            Helping the world with career success
+                        </p>
+                        </p>
+                        <p class="slide-static-footer">
+                            100% Placement Success
+                        </p>
+                    </div>
+                </div>
+                <div class="move-slider-animation-box">
+                    <div class="move-slider-box">
+                        <div class="slide-content">
+                            <p class="slide-text-cot">
+                                "
+                            </p>
+                            <p class="slide-text">
+                                "The Kodepilot curriculum is laser-focused on job placement. I mastered the required
+                                skills and secured my position at GBL with confidence."
+                            </p>
+                            <div class="slide-logo-box">
+                                <div class="profile-box">
+                                    <img src="assets/images/hai1/user-icon.svg" alt="Client Logo" class="slide-logo">
+                                    <div class="profile-info">
+                                        <p class="slide-name">Dhanush</p>
+                                        <p class="slide-role">Rust Developer</p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="move-slider-box">
+                        <div class="slide-content">
+                            <p class="slide-text-cot">
+                                "
+                            </p>
+                            <p class="slide-text">
+                                "After taking the QA and DevOps courses, Kodepilot made me ready for the global stage. I
+                                was immediately placed with a top-tier company: Accenture."
+                            </p>
+                            <div class="slide-logo-box">
+                                <div class="profile-box">
+                                    <img src="assets/images/hai1/user-icon.svg" alt="Client Logo" class="slide-logo">
+                                    <div class="profile-info">
+                                        <p class="slide-name">Amit</p>
+                                        <p class="slide-role">QA Tester</p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="move-slider-box">
+                        <div class="slide-content">
+                            <p class="slide-text-cot">
+                                "
+                            </p>
+                            <p class="slide-text">
+                                "Kodepilot's training in AWS and DevOps was the key to my career breakthrough. I went
+                                from learning the skills to successfully landing a role at Infosys."
+                            </p>
+                            <div class="slide-logo-box">
+                                <div class="profile-box">
+                                    <img src="assets/images/hai1/user-icon.svg" alt="Client Logo" class="slide-logo">
+                                    <div class="profile-info">
+                                        <p class="slide-name">John Doe</p>
+                                        <p class="slide-role">AWS</p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+        <section>
+            <!-- <div class="practice-cards-container"> -->
+            <div class="practice-container">
+                <div class="practice-container-box">
+                    <div class="practice-container-text-box">
+                        <h1 class="practice-title">Practice Coding & Ace Hiring Assessments</h1>
+                        <p class="practice-subtitle">Level up your coding skills by practicing the hiring assessments of
+                            your
+                            dream companies & ace your placement game!</p>
+                    </div>
+                    <div class="practice-cards-wrapper">
+                        <div class="practice-card active">
+                            <div class="practice-card-content">
+                                <div>
+                                    <div class="practice-card-icon">💻</div>
+                                    <h3>Coding Practice</h3>
+                                    <p>Level up your coding skills by practicing the hiring Questions.</p>
+                                    <div class="practice-footer-text">400+ Questions</div>
+                                </div>
+                                <a href="#" class="practice-cta-btn">Start Now ➤</a>
+                            </div>
+                            <div class="practice-card-svg">
+                                <img src="assets/images/codinghiringassesments/nope_1.png" alt="Coding Practice">
+                            </div>
+                        </div>
+
+                        <!-- Interview Preparation Card -->
+                        <div class="practice-card">
+                            <div class="practice-card-content">
+                                <div>
+                                    <div class="practice-card-icon">📋</div>
+                                    <h3>Interview Preparation</h3>
+                                    <p>Crack Top companies in just 5 days with unbelivable learning</p>
+                                    <div class="practice-footer-text">20+ Companies</div>
+                                </div>
+                                <a href="#" class="practice-cta-btn">Start Now ➤</a>
+                            </div>
+                            <div class="practice-card-svg">
+                                <img src="assets/images/codinghiringassesments/nope_2.png" alt="Coding Practice">
+                            </div>
+                        </div>
+
+                        <!-- Projects Card -->
+                        <div class="practice-card">
+                            <div class="practice-card-content">
+                                <div>
+                                    <div class="practice-card-icon">📂</div>
+                                    <h3>Projects</h3>
+                                    <p>Projects epitomize perfect synergy for success.</p>
+                                    <div class="practice-footer-text">15+ Projects</div>
+                                </div>
+                                <a href="#" class="practice-cta-btn">Start Now ➤</a>
+                            </div>
+                            <div class="practice-card-svg">
+                                <img src="assets/images/codinghiringassesments/nope_3.webp" alt="Coding Practice">
+                            </div>
+                        </div>
+
+                        <!-- Skill Based Assessments Card -->
+                        <div class="practice-card">
+                            <div class="practice-card-content">
+                                <div>
+                                    <div class="practice-card-icon">📝</div>
+                                    <h3>Skill Based Assessments</h3>
+                                    <p>Assess your skills and get ahead of the curve.</p>
+                                    <div class="practice-footer-text">2000+ Questions</div>
+                                </div>
+                                <a href="#" class="practice-cta-btn">Start Now ➤</a>
+                            </div>
+                            <div class="practice-card-svg">
+                                <img src="assets/images/codinghiringassesments/nope_4.webp" alt="Coding Practice">
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+        </section>
+
+
+
+        <section class="card-simple">
+            <div class="card-easy">
+                <div class="card-easy-left">
+                    <img src="assets/images/learn/learn.png" alt="Student Image">
+                </div>
+                <div class="card-easy-right">
+                    <h2>The Future of Your Career Starts Now. Learn, Grow, Achieve</h2>
+                    <p>Stop waiting for opportunity—create it. Dive into our extensive library to level up your
+                        expertise and unlock your next big career move.</p>
+                    <div class="features">
+                        <div class="feature"><span>✓</span>50+ Courses</div>
+                        <div class="feature"><span>✓</span>Certificate</div>
+                        <div class="feature"><span>✓</span>Projects & Assignments</div>
+                    </div>
+                </div>
+        </section>
+
+        <section class="move-slider" style="display: none;">
+            <div class="container-slider">
+                <div class="container-slider-baby container-slider-1"></div>
+                <div class="container-slider-baby container-slider-2"></div>
+                <div class="container-slider-baby container-slider-3"></div>
+                <div class="container-slider-baby container-slider-4"></div>
+            </div>
+        </section>
+
+        <section class="our-numbers">
+            <div class="stats-grid">
+                <div class="stat-item">
+                    <span class="stat-number">100<span class="highlight">+</span></span>
+                    <span class="stat-label">Active Users</span>
+                </div>
+
+                <div class="stat-item">
+                    <span class="stat-number">16<span class="highlight">+</span></span>
+                    <span class="stat-label">Assessments</span>
+                </div>
+
+                <div class="stat-item">
+                    <span class="stat-number">1000<span class="highlight">+</span></span>
+                    <span class="stat-label">Opportunities</span>
+                </div>
+
+                <div class="stat-item">
+                    <span class="stat-number">500<span class="highlight">+</span></span>
+                    <span class="stat-label">Brands trust us</span>
+                </div>
+
+                <div class="stat-item">
+                    <span class="stat-number">30<span class="highlight">+</span></span>
+                    <span class="stat-label">Organisations</span>
+                </div>
+
+                <div class="stat-item">
+                    <span class="stat-number">5<span class="highlight">+</span></span>
+                    <span class="stat-label">Countries</span>
+                </div>
+            </div>
+        </section>
+        <section class="corces-s">
+            <div class="corces"></div>
+        </section>
+        <footer class="footer">
+            <div class="footer-container">
+                <div class="footer-section company-section">
+                    <div class="logo" style="text-align: left; margin-left: 0; padding-left: 0;">KodePilot</div>
+                    <p class="tagline">Built with <span class="heart">❤</span> in India for the world</p>
+                    <div class="contact-info">
+                        <h4>Stay Connected</h4>
+
+                        <!-- <div style="margin-bottom: 20px; line-height: 23px;"> -->
+                        <div style="margin-bottom: 20px; line-height: 23px; margin-left: -27px;">
+
+                            <div class="contact-item">
+                                <i class="fas fa-envelope"></i>
+                                careers@kodepilot.com
+                            </div>
+                            <div class="contact-item">
+                                <i class="fas fa-phone"></i>
+                                +91 88707 60431<span style="font-size: 12px;"> </span>
+                            </div>
+                        </div>
+
+                        <div>
+                            <strong style="color: white; font-size: 14px; line-height: 30px;">Support Inquiries</strong>
+                            <div style="margin-bottom: 20px; line-height: 23px; margin-left: -27px;">
+                                <div class="contact-item">
+                                    <i class="fas fa-envelope"></i>
+                                    support@kodepilot.com
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="social-icons">
+                        <a href="#"><i class="fab fa-instagram"></i></a>
+                        <a href="#"><i class="fab fa-linkedin"></i></a>
+                        <a href="#"><i class="fab fa-facebook"></i></a>
+                        <a href="#"><i class="fab fa-telegram"></i></a>
+                        <a href="#"><i class="fab fa-discord"></i></a>
+                        <a href="#"><i class="fab fa-twitter"></i></a>
+                        <a href="#"><i class="fab fa-youtube"></i></a>
+                    </div>
+
+                    <div class="newsletter-section">
+                        <h4>Stay Updated</h4>
+                        <p>We'll send you updates on the latest courses and coding opportunities to enhance your skills
+                            and
+                            advance your career.</p>
+
+                        <div class="newsletter-form">
+                            <input type="email" placeholder="Subscribe to our newsletter!">
+                            <button type="submit">></button>
+                        </div>
+
+                        <div class="action-buttons">
+                            <a href="#" class="btn btn-primary">Start Learning Now</a>
+                            <a href="#" class="btn btn-secondary"><i class="fas fa-code"></i> View Courses</a>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="footer-section">
+                    <h3>Courses</h3>
+                    <ul>
+                        <li><a href="#">Software Development</a></li>
+                        <li><a href="#">Cloud & DevOps</a></li>
+                        <li><a href="#">AI & Data</a></li>
+                        <li><a href="#">Cybersecurity</a></li>
+                        <li><a href="#">Quality & Testing</a></li>
+                        <li><a href="#">Enterprise Tech</a></li>
+                    </ul>
+
+                    <h3 style="margin-top: 30px;">Learning Paths</h3>
+                    <ul>
+                        <li><a href="#">Beginner to Pro</a></li>
+                        <li><a href="#">Career Switcher</a></li>
+                        <li><a href="#">Skill Enhancement</a></li>
+                        <li><a href="#">Project-Based Learning</a></li>
+                    </ul>
+                </div>
+
+                <div class="footer-section">
+                    <h3>Resources</h3>
+                    <ul>
+                        <li><a href="#">Coding Tutorials</a></li>
+                        <li><a href="#">Blog Articles</a></li>
+                        <li><a href="#">Code Challenges</a></li>
+                        <li><a href="#">Live Workshops</a></li>
+                        <li><a href="#">Student Projects</a></li>
+                        <li><a href="#">Career Guidance</a></li>
+                        <li><a href="#">Interview Preparation</a></li>
+                    </ul>
+
+                    <h3 style="margin-top: 30px;">Community</h3>
+                    <ul>
+                        <li><a href="#">Forums & Study Groups</a></li>
+                        <li><a href="#">Code Reviews</a></li>
+                        <li><a href="#">Mentorship & Alumni</a></li>
+                    </ul>
+                </div>
+            </div>
+
+            <div class="footer-bottom">
+                <div style="max-width: 1200px; margin: 0 auto; padding: 0 20px;">
+                    <p style="margin-top: 20px 0px; padding: 10px 0px; font-size: 15px; margin-bottom : 30px">
+                        Copyright © 2025 <a href="#" style="color: #120ee2;">Kodepilot</a> - All
+                        rights
+                        reserved.
+                    </p>
+                </div>
+            </div>
+        </footer>
+    </div>
+    <script src="main.js"></script>
+    <script src="main.js"></script>
+    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
+    <script type="text/javascript">
+        $(window).on("load", function () {
+            $('#msg').show();
+            setTimeout(function () {
+                $('#body').show();
+                $('#msg').hide();
+            }, 1000);
+        });
+    </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/index.html b/index.html
index dbf03ca..90b9e72 100644
--- a/index.html
+++ b/index.html
@@ -1,858 +1,2 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Kodepilot</title>
-    <link rel="stylesheet" href="main.css">
-    <link rel="stylesheet" href="templateapi/main.css">
-    <link rel="icon" type="image/x-icon" href="templateapi/assets/images/logo/favicon.ico">
-    <style>
-        .center-container {
-            display: flex;
-            flex-direction: column;
-            align-items: center;
-            justify-content: center;
-            height: 100vh;
-            position: relative;
-        }
-
-        .scene {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            height: 100%;
-            width: 100%;
-        }
-
-
-        .cube-wrapper {
-            transform-style: preserve-3d;
-            animation: bouncing 2s infinite;
-        }
-
-        .cube {
-            transform-style: preserve-3d;
-            transform: rotateX(45deg) rotateZ(45deg);
-            animation: rotation 2s infinite;
-        }
-
-        .cube-faces {
-            transform-style: preserve-3d;
-            height: 80px;
-            width: 80px;
-            position: relative;
-            transform-origin: 0 0;
-            transform: translateX(0) translateY(0) translateZ(-40px);
-        }
-
-        .cube-face {
-            position: absolute;
-            inset: 0;
-            background: #003366;
-            border: solid 1px rgb(255, 255, 255);
-        }
-
-        .cube-face.shadow {
-            transform: translateZ(-80px);
-            animation: bouncing-shadow 2s infinite;
-        }
-
-        .cube-face.top {
-            transform: translateZ(80px);
-        }
-
-        .cube-face.front {
-            transform-origin: 0 50%;
-            transform: rotateY(-90deg);
-        }
-
-        .cube-face.back {
-            transform-origin: 0 50%;
-            transform: rotateY(-90deg) translateZ(-80px);
-        }
-
-        .cube-face.right {
-            transform-origin: 50% 0;
-            transform: rotateX(-90deg) translateY(-80px);
-        }
-
-        .cube-face.left {
-            transform-origin: 50% 0;
-            transform: rotateX(-90deg) translateY(-80px) translateZ(80px);
-        }
-
-        @keyframes rotation {
-            0% {
-                transform: rotateX(45deg) rotateY(0) rotateZ(45deg);
-                animation-timing-function: cubic-bezier(0.17, 0.84, 0.44, 1);
-            }
-
-            50% {
-                transform: rotateX(45deg) rotateY(0) rotateZ(225deg);
-                animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
-            }
-
-            100% {
-                transform: rotateX(45deg) rotateY(0) rotateZ(405deg);
-                animation-timing-function: cubic-bezier(0.17, 0.84, 0.44, 1);
-            }
-        }
-
-        @keyframes bouncing {
-            0% {
-                transform: translateY(-40px);
-                animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
-            }
-
-            45% {
-                transform: translateY(40px);
-                animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-            }
-
-            100% {
-                transform: translateY(-40px);
-                animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
-            }
-        }
-
-        @keyframes bouncing-shadow {
-            0% {
-                transform: translateZ(-80px) scale(1.3);
-                animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
-                opacity: 0.05;
-            }
-
-            45% {
-                transform: translateZ(0);
-                animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-                opacity: 0.3;
-            }
-
-            100% {
-                transform: translateZ(-80px) scale(1.3);
-                animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
-                opacity: 0.05;
-            }
-        }
-    </style>
-</head>
-
-<body>
-    <div id="msg" style="font-size: largest;" class="center-container">
-        <div class="scene">
-            <div class="cube-wrapper">
-                <div class="cube">
-                    <div class="cube-faces">
-                        <div class="cube-face shadow"></div>
-                        <div class="cube-face bottom"></div>
-                        <div class="cube-face top"></div>
-                        <div class="cube-face left"></div>
-                        <div class="cube-face right"></div>
-                        <div class="cube-face back"></div>
-                        <div class="cube-face front"></div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-    <div id="body" style="display: none;">
-        <header class="navbar">
-            <div class="logo">Kodepilot</div>
-            <input type="text" class="search" placeholder="Search Opportunities">
-            <div class="buttons">
-                <a href="/login">Log in</a>
-                <button class="business" onclick="getInTouch()">Let's Talk</button>
-                <button class="login" onclick="goToApplay()">Request a call</button>
-            </div>
-        </header>
-
-        <section class="hero">
-            <div class="hero_container">
-                <div class="cards_box">
-                    <h1><span class="blue_text">Unlock</span> Your Career</h1>
-                    <p>Explore opportunities from across the globe to grow, showcase skills, gain CV points & get hired
-                        by
-                        your
-                        dream company.</p>
-                    <button class="button_blue_box">
-                        <img src="https://d8it4huxumps7.cloudfront.net/uploads/images/655edc8c1fab9_diamond_1.png?d=82x84"
-                            width="41" height="42" alt="diamond" loading="lazy">
-                        <span>
-                            <span class="nameContainer">Aditya</span>
-                            <strong class="descContainer"> Just Went Kodepilot!</strong>
-                        </span>
-                    </button>
-                    <style>
-                        .nameContainer,
-                        .descContainer {
-                            transition: opacity 0.5s;
-                        }
-
-                        .fade-out {
-                            opacity: 0;
-                        }
-
-                        .fade-in {
-                            opacity: 1;
-                        }
-                    </style>
-                    <script>
-                        const data = [
-                            { name: "Ben", text: "Just Went HCL!" },
-                            { name: "Rakul", text: "Just Went Accenture!" },
-                            { name: "Anjali", text: "Joined a Ebmpapst!" },
-                            { name: "Sneha", text: "joined a Infosys!" },
-                            { name: "Amit", text: "Just Went JBL!" },
-                            { name: "Vikram", text: "Just Went UST!" },
-                            { name: "Priya", text: "Just Went Serviceplaingroup!" }
-                        ];
-                        let index1 = 0;
-                        const nameEl1 = document.querySelector(".nameContainer");
-                        const descEl1 = document.querySelector(".descContainer");
-                        setInterval(() => {
-                            nameEl1.classList.add("fade-out");
-                            descEl1.classList.add("fade-out");
-                            setTimeout(() => {
-                                index1 = (index1 + 1) % data.length;
-                                nameEl1.textContent = data[index1].name;
-                                descEl1.textContent = " " + data[index1].text;
-                                nameEl1.classList.remove("fade-out");
-                                descEl1.classList.remove("fade-out");
-                                nameEl1.classList.add("fade-in");
-                                descEl1.classList.add("fade-in");
-                                setTimeout(() => {
-                                    nameEl1.classList.remove("fade-in");
-                                    descEl1.classList.remove("fade-in");
-                                }, 500);
-                            }, 500);
-                        }, 5000);
-                    </script>
-                </div>
-                <div class="cards">
-                    <div class="card green">Internships<br><small>Gain Practical Experience</small></div>
-                    <div class="card orange">Mentorships<br><small>Guidance From Top Mentors</small></div>
-                    <div class="card blue">Jobs<br><small>Explore Diverse Careers</small></div>
-                    <div class="card purple">Practice<br><small>Refine Skills Daily</small></div>
-                    <div class="card yellow">Competitions<br><small>Battle For Excellence</small></div>
-                    <div class="card pink">More<br><small>Explore More Options</small></div>
-                </div>
-            </div>
-        </section>
-
-        <section class="users">
-            <div class="users_box">
-                <h2>Who's using Kodepilot?</h2>
-                <div class="know-cards">
-                    <div>
-                        <div class="crd">
-                            <div class="d-flex flex-column">
-                                <div class="h4">Students and Professionals</div>
-                                <p><strong>Unlock
-                                        Your
-                                        Potential:</strong> Compete, Build Resume, Grow and get Hired! </p>
-                            </div><img
-                                src="https://d8it4huxumps7.cloudfront.net/uploads/images/67724b0c0d0f7_img1.png?d=211x163"
-                                alt="Students and Professionals" width="105" height="81" loading="lazy">
-                        </div>
-                    </div>
-                    <div>
-                        <div class="crd">
-                            <div class="d-flex flex-column">
-                                <div class="h4">Companies and Recruiters</div>
-                                <p><strong>Discover
-                                        Right
-                                        Talent:</strong> Hire, Engage, and Brand Like Never Before! </p>
-                            </div><img
-                                src="https://d8it4huxumps7.cloudfront.net/uploads/images/67727626b861a_img2.png?d=211x163"
-                                alt="Companies and Recruiters" width="105" height="81" loading="lazy">
-                        </div>
-                    </div>
-                    <div>
-                        <div class="crd">
-                            <div class="d-flex flex-column">
-                                <div class="h4">Colleges</div>
-                                <p><strong>Bridge
-                                        Academia
-                                        and Industry:</strong> Empower Students with Real-World Opportunities! </p>
-                            </div><img
-                                src="https://d8it4huxumps7.cloudfront.net/uploads/images/67724b2a99511_img3.png?d=211x163"
-                                alt="ridge Academia and Industry" width="105" height="81" loading="lazy">
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <section class="mnc">
-            <div class="mnc-box">
-                <div class="mnc-row">
-                    <h2>
-                        <span class="gray"> Top Industries </span>
-                        <span class="blue_text">We Placed</span>
-                    </h2>
-                    <div class="mnc-logos">
-                        <div class="mnc-logos-track">
-                            <img class="image-hcl" src="https://repo.dhanu.cloud/ico/hcl.svg" alt="hcl">
-                            <img src="https://repo.dhanu.cloud/ico/ebmpapst.svg" alt="ebmpapst">
-                            <img src="https://repo.dhanu.cloud/ico/infosys.svg" alt="infosys">
-                            <img src="https://repo.dhanu.cloud/ico/jbl.svg" alt="jbl">
-                            <img src="https://repo.dhanu.cloud/ico/ust.svg" alt="ust">
-                            <img src="https://repo.dhanu.cloud/ico/accenture.svg" alt="accenture">
-                            <img class="image-hcl" src="https://repo.dhanu.cloud/ico/hcl.svg" alt="hcl">
-                            <img src="https://repo.dhanu.cloud/ico/ebmpapst.svg" alt="ebmpapst">
-                            <img src="https://repo.dhanu.cloud/ico/infosys.svg" alt="infosys">
-                            <img src="https://repo.dhanu.cloud/ico/jbl.svg" alt="jbl">
-                            <img src="https://repo.dhanu.cloud/ico/ust.svg" alt="ust">
-                            <img src="https://repo.dhanu.cloud/ico/accenture.svg" alt="accenture">
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <section id="slider">
-            <div class="slide1r-container">
-                <div class="slide1r-wrapper">
-                    <div class="slide1r-track" id="slide1rTrack">
-                        <!-- Slide 1 -->
-                        <div class="slide1">
-                            <div class="slide1-box">
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/qa.jpg" alt="Business Meeting">
-                                    <div class="image-overlay">
-                                        <h4>QA & Testing</h4>
-                                        <p>A close-up of a developer's screen showing a green 'Tests Passed' status and
-                                            a successful performance report graph.</p>
-                                    </div>
-                                </div>
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/hai12.jpg" alt="Architecture">
-                                    <div class="image-overlay">
-                                        <h4>Software Dev</h4>
-                                        <p>A sleek image of a professional wireframe/design on a large monitor, with a
-                                            split view showing the finished product on a mobile phone.</p>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-
-                        <!-- Slide 2 -->
-                        <div class="slide1">
-                            <div class="slide1-box">
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/ai.jpg" alt="Analytics">
-                                    <div class="image-overlay">
-                                        <h4>AI & Data</h4>
-                                        <p>A stunning, large-scale data visualization or chart (like a complex network
-                                            graph) displayed on a screen, hinting at discovery and high-level strategy.
-                                        </p>
-                                    </div>
-                                </div>
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/cyber.jpg" alt="Technology">
-                                    <div class="image-overlay">
-                                        <h4>Cybersecurity</h4>
-                                        <p>A digital shield or lock icon overlaid on a dark, technical background with
-                                            green/blue code lines, symbolizing protection.</p>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                        <div class="slide1">
-                            <div class="slide1-box">
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/qa.jpg" alt="Analytics">
-                                    <div class="image-overlay">
-                                        <h4>QA & Testing</h4>
-                                        <p>A close-up of a developer's screen showing a green 'Tests Passed' status and
-                                            a successful performance report graph.</p>
-                                    </div>
-                                </div>
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/cyber.jpg" alt="Technology">
-                                    <div class="image-overlay">
-                                        <h4>Cybersecurity</h4>
-                                        <p>A digital shield or lock icon overlaid on a dark, technical background with
-                                            green/blue code lines, symbolizing protection.</p>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                        <div class="slide1">
-                            <div class="slide1-box">
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/hai12.jpg" alt="Analytics">
-                                    <div class="image-overlay">
-                                        <h4>Software Dev</h4>
-                                        <p>A sleek image of a professional wireframe/design on a large monitor, with a
-                                            split view showing the finished product on a mobile phone.</p>
-                                    </div>
-                                </div>
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/qa.jpg" alt="Technology">
-                                    <div class="image-overlay">
-                                        <h4>QA & Testing</h4>
-                                        <p>A close-up of a developer's screen showing a green 'Tests Passed' status and
-                                            a successful performance report graph.</p>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                        <div class="slide1">
-                            <div class="slide1-box">
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/ai.jpg" alt="Analytics">
-                                    <div class="image-overlay">
-                                        <h4>AI & Data</h4>
-                                        <p>A stunning, large-scale data visualization or chart (like a complex network
-                                            graph) displayed on a screen, hinting at discovery and high-level strategy.
-                                        </p>
-                                    </div>
-                                </div>
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/aws..jpg" alt="Technology">
-                                    <div class="image-overlay">
-                                        <h4>Cloud & DevOps</h4>
-                                        <p>An abstract, interconnected graphic of servers and data pipelines with subtle
-                                            logos (AWS/Azure/GCP-style icons, if usage is permitted) to symbolize
-                                            powerful infrastructure.</p>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                        <div class="slide1">
-                            <div class="slide1-box">
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/ai.jpg" alt="Analytics">
-                                    <div class="image-overlay">
-                                        <h4>AI & Data</h4>
-                                        <p>A stunning, large-scale data visualization or chart (like a complex network
-                                            graph) displayed on a screen, hinting at discovery and high-level strategy.
-                                        </p>
-                                    </div>
-                                </div>
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/cyber.jpg" alt="Technology">
-                                    <div class="image-overlay">
-                                        <h4>Cybersecurity</h4>
-                                        <p>A digital shield or lock icon overlaid on a dark, technical background with
-                                            green/blue code lines, symbolizing protection.</p>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-
-                        <div class="slide1">
-                            <div class="slide1-box">
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/hai12.jpg" alt="Creativity">
-                                    <div class="image-overlay">
-                                        <h4>Software Dev</h4>
-                                        <p>A sleek image of a professional wireframe/design on a large monitor, with a
-                                            split view showing the finished product on a mobile phone.</p>
-                                    </div>
-                                </div>
-                                <div class="image-container">
-                                    <img src="templateapi/assets/images/hai1/aws..jpg" alt="Beach">
-                                    <div class="image-overlay">
-                                        <h4>Cloud & DevOps</h4>
-                                        <p>An abstract, interconnected graphic of servers and data pipelines with subtle
-                                            logos (AWS/Azure/GCP-style icons, if usage is permitted) to symbolize
-                                            powerful infrastructure.</p>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-                <button class="nav-button prev-btn" id="prevBtn" aria-label="Previous slide"></button>
-                <button class="nav-button next-btn" id="nextBtn" aria-label="Next slide"></button>
-            </div>
-        </section>
-        <section class="opportunity-section">
-            <div class="container">
-                <div class="header">
-                    <h2 class="title">
-                        Pick <span class="highlight">The Right Opportunity!</span>
-                    </h2>
-                    <div class="header-content">
-                        <p class="subtitle">Explore opportunities that best suits your skills and interests!</p>
-                    </div>
-                </div>
-
-                <div class="cards-grid">
-                    <div class="card-add  card-quizzes">
-                    </div>
-
-                    <div class="card-add  card-hackathons">
-                    </div>
-
-                    <div class="card-add  card-scholarships">
-                    </div>
-
-                    <div class="card-add  card-conferences">
-                    </div>
-
-                    <div class="card-add  card-festivals">
-                    </div>
-                </div>
-            </div>
-        </section>
-        <section class="move-slider-ruby">
-            <div class="move-slider-container">
-                <div class="move-slider-box-static">
-                    <div class="slide-content-static">
-                        <h1 class="slide-static-h1"> Kodepilot </h1>
-                        <p class="slide-static-text">
-                            Helping the world with career success
-                        </p>
-                        </p>
-                        <p class="slide-static-footer">
-                            100% Placement Success
-                        </p>
-                    </div>
-                </div>
-                <div class="move-slider-animation-box">
-                    <div class="move-slider-box">
-                        <div class="slide-content">
-                            <p class="slide-text-cot">
-                                "
-                            </p>
-                            <p class="slide-text">
-                                "The Kodepilot curriculum is laser-focused on job placement. I mastered the required
-                                skills and secured my position at GBL with confidence."
-                            </p>
-                            <div class="slide-logo-box">
-                                <div class="profile-box">
-                                    <img src="templateapi/assets/images/hai1/user-icon.svg" alt="Client Logo"
-                                        class="slide-logo">
-                                    <div class="profile-info">
-                                        <p class="slide-name">Dhanush</p>
-                                        <p class="slide-role">Rust Developer</p>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="move-slider-box">
-                        <div class="slide-content">
-                            <p class="slide-text-cot">
-                                "
-                            </p>
-                            <p class="slide-text">
-                                "After taking the QA and DevOps courses, Kodepilot made me ready for the global stage. I
-                                was immediately placed with a top-tier company: Accenture."
-                            </p>
-                            <div class="slide-logo-box">
-                                <div class="profile-box">
-                                    <img src="templateapi/assets/images/hai1/user-icon.svg" alt="Client Logo"
-                                        class="slide-logo">
-                                    <div class="profile-info">
-                                        <p class="slide-name">Amit</p>
-                                        <p class="slide-role">QA Tester</p>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="move-slider-box">
-                        <div class="slide-content">
-                            <p class="slide-text-cot">
-                                "
-                            </p>
-                            <p class="slide-text">
-                                "Kodepilot's training in AWS and DevOps was the key to my career breakthrough. I went
-                                from learning the skills to successfully landing a role at Infosys."
-                            </p>
-                            <div class="slide-logo-box">
-                                <div class="profile-box">
-                                    <img src="templateapi/assets/images/hai1/user-icon.svg" alt="Client Logo"
-                                        class="slide-logo">
-                                    <div class="profile-info">
-                                        <p class="slide-name">John Doe</p>
-                                        <p class="slide-role">AWS</p>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-        <section>
-            <!-- <div class="practice-cards-container"> -->
-            <div class="practice-container">
-                <div class="practice-container-box">
-                    <div class="practice-container-text-box">
-                        <h1 class="practice-title">Practice Coding & Ace Hiring Assessments</h1>
-                        <p class="practice-subtitle">Level up your coding skills by practicing the hiring assessments of
-                            your
-                            dream companies & ace your placement game!</p>
-                    </div>
-                    <div class="practice-cards-wrapper">
-                        <div class="practice-card active">
-                            <div class="practice-card-content">
-                                <div>
-                                    <div class="practice-card-icon">💻</div>
-                                    <h3>Coding Practice</h3>
-                                    <p>Level up your coding skills by practicing the hiring Questions.</p>
-                                    <div class="practice-footer-text">400+ Questions</div>
-                                </div>
-                                <a href="#" class="practice-cta-btn">Start Now ➤</a>
-                            </div>
-                            <div class="practice-card-svg">
-                                <img src="templateapi/assets/images/codinghiringassesments/nope_1.png"
-                                    alt="Coding Practice">
-                            </div>
-                        </div>
-
-                        <!-- Interview Preparation Card -->
-                        <div class="practice-card">
-                            <div class="practice-card-content">
-                                <div>
-                                    <div class="practice-card-icon">📋</div>
-                                    <h3>Interview Preparation</h3>
-                                    <p>Crack Top companies in just 5 days with unbelivable learning</p>
-                                    <div class="practice-footer-text">20+ Companies</div>
-                                </div>
-                                <a href="#" class="practice-cta-btn">Start Now ➤</a>
-                            </div>
-                            <div class="practice-card-svg">
-                                <img src="templateapi/assets/images/codinghiringassesments/nope_2.png"
-                                    alt="Coding Practice">
-                            </div>
-                        </div>
-
-                        <!-- Projects Card -->
-                        <div class="practice-card">
-                            <div class="practice-card-content">
-                                <div>
-                                    <div class="practice-card-icon">📂</div>
-                                    <h3>Projects</h3>
-                                    <p>Projects epitomize perfect synergy for success.</p>
-                                    <div class="practice-footer-text">15+ Projects</div>
-                                </div>
-                                <a href="#" class="practice-cta-btn">Start Now ➤</a>
-                            </div>
-                            <div class="practice-card-svg">
-                                <img src="templateapi/assets/images/codinghiringassesments/nope_3.webp"
-                                    alt="Coding Practice">
-                            </div>
-                        </div>
-
-                        <!-- Skill Based Assessments Card -->
-                        <div class="practice-card">
-                            <div class="practice-card-content">
-                                <div>
-                                    <div class="practice-card-icon">📝</div>
-                                    <h3>Skill Based Assessments</h3>
-                                    <p>Assess your skills and get ahead of the curve.</p>
-                                    <div class="practice-footer-text">2000+ Questions</div>
-                                </div>
-                                <a href="#" class="practice-cta-btn">Start Now ➤</a>
-                            </div>
-                            <div class="practice-card-svg">
-                                <img src="templateapi/assets/images/codinghiringassesments/nope_4.webp"
-                                    alt="Coding Practice">
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-
-        </section>
-
-
-
-        <section class="card-simple">
-            <div class="card-easy">
-                <div class="card-easy-left">
-                    <img src="templateapi/assets/images/learn/learn.png" alt="Student Image">
-                </div>
-                <div class="card-easy-right">
-                    <h2>The Future of Your Career Starts Now. Learn, Grow, Achieve</h2>
-                    <p>Stop waiting for opportunity—create it. Dive into our extensive library to level up your
-                        expertise and unlock your next big career move.</p>
-                    <div class="features">
-                        <div class="feature"><span>✓</span>50+ Courses</div>
-                        <div class="feature"><span>✓</span>Certificate</div>
-                        <div class="feature"><span>✓</span>Projects & Assignments</div>
-                    </div>
-                </div>
-        </section>
-
-        <section class="move-slider" style="display: none;">
-            <div class="container-slider">
-                <div class="container-slider-baby container-slider-1"></div>
-                <div class="container-slider-baby container-slider-2"></div>
-                <div class="container-slider-baby container-slider-3"></div>
-                <div class="container-slider-baby container-slider-4"></div>
-            </div>
-        </section>
-
-        <section class="our-numbers">
-            <div class="stats-grid">
-                <div class="stat-item">
-                    <span class="stat-number">100<span class="highlight">+</span></span>
-                    <span class="stat-label">Active Users</span>
-                </div>
-
-                <div class="stat-item">
-                    <span class="stat-number">16<span class="highlight">+</span></span>
-                    <span class="stat-label">Assessments</span>
-                </div>
-
-                <div class="stat-item">
-                    <span class="stat-number">1000<span class="highlight">+</span></span>
-                    <span class="stat-label">Opportunities</span>
-                </div>
-
-                <div class="stat-item">
-                    <span class="stat-number">500<span class="highlight">+</span></span>
-                    <span class="stat-label">Brands trust us</span>
-                </div>
-
-                <div class="stat-item">
-                    <span class="stat-number">30<span class="highlight">+</span></span>
-                    <span class="stat-label">Organisations</span>
-                </div>
-
-                <div class="stat-item">
-                    <span class="stat-number">5<span class="highlight">+</span></span>
-                    <span class="stat-label">Countries</span>
-                </div>
-            </div>
-        </section>
-        <section class="corces-s">
-            <div class="corces"></div>
-        </section>
-        <footer class="footer">
-            <div class="footer-container">
-                <div class="footer-section company-section">
-                    <div class="logo" style="text-align: left; margin-left: 0; padding-left: 0;">KodePilot</div>
-                    <p class="tagline">Built with <span class="heart">❤</span>  in India for the world</p>
-                    <div class="contact-info">
-                        <h4>Stay Connected</h4>
-
-                        <!-- <div style="margin-bottom: 20px; line-height: 23px;"> -->
-                        <div style="margin-bottom: 20px; line-height: 23px; margin-left: -27px;">
-
-                            <div class="contact-item">
-                                <i class="fas fa-envelope"></i>
-                                careers@kodepilot.com
-                            </div>
-                            <div class="contact-item">
-                                <i class="fas fa-phone"></i>
-                                +91 88707 60431<span style="font-size: 12px;"> </span>
-                            </div>
-                        </div>
-
-                        <div>
-                            <strong style="color: white; font-size: 14px; line-height: 30px;">Support Inquiries</strong>
-                            <div style="margin-bottom: 20px; line-height: 23px; margin-left: -27px;">
-                                <div class="contact-item">
-                                    <i class="fas fa-envelope"></i>
-                                    support@kodepilot.com
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="social-icons">
-                        <a href="#"><i class="fab fa-instagram"></i></a>
-                        <a href="#"><i class="fab fa-linkedin"></i></a>
-                        <a href="#"><i class="fab fa-facebook"></i></a>
-                        <a href="#"><i class="fab fa-telegram"></i></a>
-                        <a href="#"><i class="fab fa-discord"></i></a>
-                        <a href="#"><i class="fab fa-twitter"></i></a>
-                        <a href="#"><i class="fab fa-youtube"></i></a>
-                    </div>
-
-                    <div class="newsletter-section">
-                        <h4>Stay Updated</h4>
-                        <p>We'll send you updates on the latest courses and coding opportunities to enhance your skills
-                            and
-                            advance your career.</p>
-
-                        <div class="newsletter-form">
-                            <input type="email" placeholder="Subscribe to our newsletter!">
-                            <button type="submit">></button>
-                        </div>
-
-                        <div class="action-buttons">
-                            <a href="#" class="btn btn-primary">Start Learning Now</a>
-                            <a href="#" class="btn btn-secondary"><i class="fas fa-code"></i> View Courses</a>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="footer-section">
-                    <h3>Courses</h3>
-                    <ul>
-                        <li><a href="#">Software Development</a></li>
-                        <li><a href="#">Cloud & DevOps</a></li>
-                        <li><a href="#">AI & Data</a></li>
-                        <li><a href="#">Cybersecurity</a></li>
-                        <li><a href="#">Quality & Testing</a></li>
-                        <li><a href="#">Enterprise Tech</a></li>
-                    </ul>
-
-                    <h3 style="margin-top: 30px;">Learning Paths</h3>
-                    <ul>
-                        <li><a href="#">Beginner to Pro</a></li>
-                        <li><a href="#">Career Switcher</a></li>
-                        <li><a href="#">Skill Enhancement</a></li>
-                        <li><a href="#">Project-Based Learning</a></li>
-                    </ul>
-                </div>
-
-                <div class="footer-section">
-                    <h3>Resources</h3>
-                    <ul>
-                        <li><a href="#">Coding Tutorials</a></li>
-                        <li><a href="#">Blog Articles</a></li>
-                        <li><a href="#">Code Challenges</a></li>
-                        <li><a href="#">Live Workshops</a></li>
-                        <li><a href="#">Student Projects</a></li>
-                        <li><a href="#">Career Guidance</a></li>
-                        <li><a href="#">Interview Preparation</a></li>
-                    </ul>
-
-                    <h3 style="margin-top: 30px;">Community</h3>
-                    <ul>
-                        <li><a href="#">Forums & Study Groups</a></li>
-                        <li><a href="#">Code Reviews</a></li>
-                        <li><a href="#">Mentorship & Alumni</a></li>
-                    </ul>
-                </div>
-            </div>
-
-            <div class="footer-bottom">
-                <div style="max-width: 1200px; margin: 0 auto; padding: 0 20px;">
-                    <p style="margin-top: 20px 0px; padding: 10px 0px; font-size: 15px; margin-bottom : 30px">
-                        Copyright © 2025 <a href="#" style="color: #120ee2;">Kodepilot</a> - All
-                        rights
-                        reserved.
-                    </p>
-                </div>
-            </div>
-        </footer>
-    </div>
-    <script src="main.js"></script>
-    <script src="templateapi/main.js"></script>
-    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
-    <script type="text/javascript">
-        $(window).on("load", function () {
-            $('#msg').show();
-            setTimeout(function () {
-                $('#body').show();
-                $('#msg').hide();
-            }, 1000);
-        });
-    </script>
-</body>
-
-</html>
\ No newline at end of file
+<iframe src="home.html" style="width:100%; height:100%; border:none;"></iframe>
+<iframe src="templateapi/home.html" style="width:100%; height:100%; border:none;"></iframe>
\ No newline at end of file
