From 8cd137b8296e4f38e58c659d3dad37fdd0cd3b04 Mon Sep 17 00:00:00 2001
From: "dhanush.s" <dhanush.s@opsmonsters.in>
Date: Tue, 23 Sep 2025 09:18:12 +0530
Subject: [PATCH] feat: index

---
 index.html | 204 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 204 insertions(+)
 create mode 100644 index.html
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..560142f
--- /dev/null
+++ b/index.html
@@ -0,0 +1,204 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Kodepilot Clone</title>
+    <style>
+        body {
+            margin: 0;
+            font-family: Arial, sans-serif;
+            background: #fff;
+            color: #333;
+        }
+
+        /* Navbar */
+        .navbar {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            padding: 12px 30px;
+            background: #fff;
+            border-bottom: 1px solid #eee;
+        }
+
+        .logo {
+            font-size: 22px;
+            font-weight: bold;
+            color: #003366;
+        }
+
+        .search {
+            flex: 1;
+            margin: 0 20px;
+            padding: 8px 12px;
+            border: 1px solid #ddd;
+            border-radius: 20px;
+        }
+
+        nav a {
+            margin: 0 10px;
+            text-decoration: none;
+            color: #333;
+        }
+
+        .buttons button {
+            margin-left: 10px;
+            padding: 8px 15px;
+            border: none;
+            border-radius: 20px;
+            cursor: pointer;
+        }
+
+        .host {
+            background: #eee;
+        }
+
+        .business {
+            background: #ffcc00;
+        }
+
+        .login {
+            background: #007bff;
+            color: #fff;
+        }
+
+        /* Hero */
+        .hero {
+            text-align: center;
+            padding: 50px 20px;
+        }
+
+        .hero h1 {
+            font-size: 42px;
+        }
+
+        .hero h1 .blue {
+            color: #007bff;
+        }
+
+        .hero p {
+            font-size: 18px;
+            color: #666;
+            margin: 15px 0 40px;
+        }
+
+        /* Cards */
+        .cards {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+            gap: 20px;
+            max-width: 1000px;
+            margin: auto;
+        }
+
+        .card {
+            padding: 25px;
+            border-radius: 12px;
+            font-size: 18px;
+            color: #fff;
+            font-weight: bold;
+        }
+
+        .card small {
+            display: block;
+            margin-top: 10px;
+            font-weight: normal;
+        }
+
+        /* Colors */
+        .green {
+            background: #2ecc71;
+        }
+
+        .orange {
+            background: #e67e22;
+        }
+
+        .blue {
+            background: #3498db;
+        }
+
+        .purple {
+            background: #9b59b6;
+        }
+
+        .yellow {
+            background: #f1c40f;
+            color: #333;
+        }
+
+        .pink {
+            background: #e84393;
+        }
+
+        /* Users */
+        .users {
+            padding: 60px 20px;
+            text-align: center;
+        }
+
+        .user-cards {
+            display: flex;
+            justify-content: center;
+            gap: 20px;
+            margin-top: 30px;
+            flex-wrap: wrap;
+        }
+
+        .user-card {
+            background: #f9f9f9;
+            padding: 20px;
+            border-radius: 12px;
+            width: 280px;
+            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+        }
+    </style>
+</head>
+
+<body>
+    <header class="navbar">
+        <div class="logo">Kodepilot</div>
+        <input type="text" class="search" placeholder="Search Opportunities">
+        <nav>
+            <a href="#">Internships</a>
+            <a href="#">Jobs</a>
+            <a href="#">Competitions</a>
+            <a href="#">Mentorships</a>
+            <a href="#">Practice</a>
+            <a href="#">More ▾</a>
+        </nav>
+        <div class="buttons">
+            <button class="host">+ Host</button>
+            <button class="business">For Business</button>
+            <button class="login">Login</button>
+        </div>
+    </header>
+
+    <section class="hero">
+        <h1><span class="blue">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>
+
+        <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>
+    </section>
+
+    <section class="users">
+        <h2>Who's using Kodepilot?</h2>
+        <div class="user-cards">
+            <div class="user-card">Students and Professionals<br><small>Compete, Build Resume & Get Hired</small></div>
+            <div class="user-card">Companies and Recruiters<br><small>Hire, Engage & Brand</small></div>
+            <div class="user-card">Colleges<br><small>Empower Students with Opportunities</small></div>
+        </div>
+    </section>
+</body>
+
+</html>
\ No newline at end of file
