diff --git a/Projects/Smart Waste Management Platform/README.md b/Projects/Smart Waste Management Platform/README.md
new file mode 100644
index 00000000..e9041db1
--- /dev/null
+++ b/Projects/Smart Waste Management Platform/README.md	
@@ -0,0 +1,20 @@
+# Smart Waste Management Platform
+
+An eco-friendly digital platform designed to optimize urban waste collection by connecting citizens directly with municipal sanitation departments.
+
+## Features
+- **Citizen Dashboard**: A clean interface for residents to check their neighborhood's waste collection schedule, report illegal dumping, and schedule special bulk pickups.
+- **Sanitation Dept Portal**: A secure dashboard for city workers to monitor smart bin fill levels, track active collection routes, and manage citizen reports.
+- **Interactive Role Switcher**: Seamlessly toggle between the Citizen View and the Sanitation Dept View to experience both sides of the platform.
+- **Responsive Design**: Built with pure CSS for a clean, accessible layout on mobile and desktop screens.
+
+## Run It
+No backend or build process required. Simply open `index.html` in your web browser.
+
+## Tech Stack
+- HTML5
+- CSS3 (Vanilla, CSS Grid & Flexbox)
+- Vanilla JavaScript
+
+## Credits
+Developed by MistryVishwa.
diff --git a/Projects/Smart Waste Management Platform/index.html b/Projects/Smart Waste Management Platform/index.html
new file mode 100644
index 00000000..8fb41fc4
--- /dev/null
+++ b/Projects/Smart Waste Management Platform/index.html	
@@ -0,0 +1,183 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Smart Waste Management</title>
+  <link rel="stylesheet" href="style.css">
+  <script src="https://unpkg.com/@phosphor-icons/web"></script>
+</head>
+<body>
+
+  <!-- Top Navigation -->
+  <nav class="global-nav">
+    <div class="brand">
+      <i class="ph-fill ph-recycle text-primary"></i> <span>EcoCity</span>
+    </div>
+    
+    <div class="nav-links">
+      <button class="nav-tab active" data-tab="schedule">Collection Schedule</button>
+      <button class="nav-tab" data-tab="report">Report Issue</button>
+      <button class="nav-tab" data-tab="dept" style="display: none;" id="dept-tab-btn">Sanitation Dept</button>
+    </div>
+
+    <div class="nav-actions">
+      <!-- Role Switcher -->
+      <div class="role-selector">
+        <select id="role-select">
+          <option value="citizen">Citizen View</option>
+          <option value="dept">Sanitation Dept</option>
+        </select>
+      </div>
+
+      <button class="icon-btn"><i class="ph ph-bell"></i></button>
+      <img src="https://ui-avatars.com/api/?name=Local+Citizen&background=10b981&color=fff" alt="Avatar" id="user-avatar" class="avatar">
+    </div>
+  </nav>
+
+  <!-- Mobile Nav -->
+  <div class="mobile-nav">
+    <button class="nav-tab active" data-tab="schedule"><i class="ph ph-calendar"></i></button>
+    <button class="nav-tab" data-tab="report"><i class="ph ph-warning-circle"></i></button>
+    <button class="nav-tab" data-tab="dept" id="mobile-dept-tab-btn" style="display: none;"><i class="ph ph-truck"></i></button>
+  </div>
+
+  <main class="main-content">
+    
+    <!-- ================= SCHEDULE TAB (CITIZEN) ================= -->
+    <section id="schedule" class="tab-content active">
+      <div class="page-heading">
+        <h1>Neighborhood Collection Schedule</h1>
+        <p class="text-muted">Stay up to date with your local trash, recycling, and compost pickup dates.</p>
+      </div>
+
+      <div class="split-layout mt-3">
+        <!-- Upcoming Pickups -->
+        <div class="panel col-span-2">
+          <div class="panel-header flex-between">
+            <h3>Upcoming Pickups for Zone 4A</h3>
+            <button class="btn outline-btn btn-sm"><i class="ph ph-map-pin"></i> Change Zone</button>
+          </div>
+          <div class="panel-body p-0">
+            <table class="custom-table">
+              <thead>
+                <tr><th>Waste Type</th><th>Next Collection Date</th><th>Instructions</th><th>Status</th></tr>
+              </thead>
+              <tbody id="citizen-schedule-tbody">
+                <!-- Injected via JS -->
+              </tbody>
+            </table>
+          </div>
+        </div>
+
+        <!-- Request Bulk Pickup -->
+        <div class="panel">
+          <div class="panel-header">
+            <h3>Special Services</h3>
+          </div>
+          <div class="panel-body flex-column flex-center text-center">
+            <i class="ph ph-couch text-primary mb-2" style="font-size: 3rem;"></i>
+            <h3 class="mb-1">Bulk Item Pickup</h3>
+            <p class="text-muted" style="font-size: 0.9rem; margin-bottom: 1.5rem;">Have old furniture or large appliances? Schedule a special pickup directly from your curb.</p>
+            <button class="btn primary-btn" style="width:100%">Schedule Now</button>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- ================= REPORT ISSUE TAB (CITIZEN) ================= -->
+    <section id="report" class="tab-content hidden">
+      <div class="page-heading">
+        <h1>Report Illegal Dumping</h1>
+        <p class="text-muted">Help keep our streets clean. Report overflowing bins or illegal dumping sites.</p>
+      </div>
+
+      <div class="split-layout mt-3">
+        <div class="panel col-span-2">
+          <div class="panel-header">
+            <h3>Submit a Report</h3>
+          </div>
+          <div class="panel-body">
+            <form class="report-form" onsubmit="event.preventDefault(); alert('Report Submitted to Sanitation Dept!');">
+              <div class="form-group">
+                <label>Issue Type</label>
+                <select class="form-input">
+                  <option>Illegal Dumping</option>
+                  <option>Overflowing Public Bin</option>
+                  <option>Missed Collection</option>
+                  <option>Hazardous Waste Spill</option>
+                </select>
+              </div>
+              <div class="form-group">
+                <label>Location (Street Address or Intersection)</label>
+                <input type="text" class="form-input" placeholder="e.g. 123 Main St">
+              </div>
+              <div class="form-group">
+                <label>Description</label>
+                <textarea class="form-input" rows="4" placeholder="Provide any helpful details..."></textarea>
+              </div>
+              <div class="form-group">
+                <label>Upload Photo</label>
+                <div class="upload-box flex-center">
+                  <div class="text-center text-muted">
+                    <i class="ph ph-camera" style="font-size: 2rem;"></i>
+                    <p>Click to attach an image</p>
+                  </div>
+                </div>
+              </div>
+              <button class="btn primary-btn" type="submit" style="width: 100%;">Submit Report</button>
+            </form>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- ================= SANITATION DEPT PORTAL ================= -->
+    <section id="dept" class="tab-content hidden">
+      <div class="page-heading flex-between">
+        <div>
+          <h1>Sanitation Dept Dashboard</h1>
+          <p class="text-muted">Monitor smart bin capacities, active routes, and citizen reports.</p>
+        </div>
+        <button class="btn outline-btn"><i class="ph ph-truck"></i> Fleet Status</button>
+      </div>
+
+      <div class="metrics-grid mt-2">
+        <div class="metric-card">
+          <div class="metric-icon bg-orange-light text-orange"><i class="ph-fill ph-trash"></i></div>
+          <div class="metric-data"><h3>Critical Bins (>90%)</h3><h2>24</h2></div>
+        </div>
+        <div class="metric-card">
+          <div class="metric-icon bg-blue-light text-blue"><i class="ph-fill ph-map-pin-line"></i></div>
+          <div class="metric-data"><h3>Active Routes</h3><h2>18</h2></div>
+        </div>
+        <div class="metric-card">
+          <div class="metric-icon bg-red-light text-red"><i class="ph-fill ph-warning-circle"></i></div>
+          <div class="metric-data"><h3>Pending Citizen Reports</h3><h2>12</h2></div>
+        </div>
+      </div>
+
+      <div class="split-layout mt-3">
+        <div class="panel col-span-2">
+          <div class="panel-header">
+            <h3>Smart Bin Capacity Alerts</h3>
+          </div>
+          <div class="panel-body p-0">
+            <table class="custom-table">
+              <thead>
+                <tr><th>Bin ID</th><th>Location</th><th>Waste Type</th><th>Fill Level</th><th>Action</th></tr>
+              </thead>
+              <tbody id="dept-bins-tbody">
+                 <!-- Injected via JS -->
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+    </section>
+
+  </main>
+
+  <script src="script.js"></script>
+</body>
+</html>
diff --git a/Projects/Smart Waste Management Platform/project.json b/Projects/Smart Waste Management Platform/project.json
new file mode 100644
index 00000000..85621206
--- /dev/null
+++ b/Projects/Smart Waste Management Platform/project.json	
@@ -0,0 +1,14 @@
+{
+  "title": "Smart Waste Management Platform",
+  "description": "An eco-friendly dashboard connecting citizens with waste collection services to track bins, report illegal dumping, and schedule special pickups.",
+  "author": {
+    "name": "MistryVishwa",
+    "github": "MistryVishwa"
+  },
+  "tags": [
+    "eco",
+    "management",
+    "vanilla-js"
+  ],
+  "entry": "index.html"
+}
diff --git a/Projects/Smart Waste Management Platform/script.js b/Projects/Smart Waste Management Platform/script.js
new file mode 100644
index 00000000..52e68f33
--- /dev/null
+++ b/Projects/Smart Waste Management Platform/script.js	
@@ -0,0 +1,122 @@
+// --- Mock Data ---
+const citizenSchedule = [
+  { type: "General Trash", date: "Every Tuesday", instructions: "Place bin at curb by 6:00 AM.", status: "Upcoming" },
+  { type: "Recycling", date: "Every Friday", instructions: "Break down cardboard boxes.", status: "Upcoming" },
+  { type: "Yard Waste", date: "Oct 25 (Monthly)", instructions: "Use biodegradable bags only.", status: "Pending" }
+];
+
+const deptBins = [
+  { id: "BIN-442", loc: "Central Park Entrance", type: "General Waste", fill: 95 },
+  { id: "BIN-108", loc: "Main St & 5th Ave", type: "Recycling", fill: 82 },
+  { id: "BIN-559", loc: "Community Center", type: "Compost", fill: 45 },
+  { id: "BIN-312", loc: "Downtown Plaza", type: "General Waste", fill: 12 }
+];
+
+// --- Core Logic ---
+document.addEventListener('DOMContentLoaded', () => {
+  const navTabs = document.querySelectorAll('.nav-tab');
+  const views = document.querySelectorAll('.tab-content');
+  const roleSelect = document.getElementById('role-select');
+  const deptTabBtn = document.getElementById('dept-tab-btn');
+  const mobileDeptTabBtn = document.getElementById('mobile-dept-tab-btn');
+
+  // Initialization
+  renderSchedule();
+  renderDeptBins();
+
+  // Role Switching Logic
+  roleSelect.addEventListener('change', (e) => {
+    const role = e.target.value;
+    
+    if (role === 'dept') {
+      deptTabBtn.style.display = 'block';
+      if(mobileDeptTabBtn) mobileDeptTabBtn.style.display = 'block';
+      document.querySelector('[data-tab="dept"]').click();
+      
+      // Update Avatar
+      document.getElementById('user-avatar').src = "https://ui-avatars.com/api/?name=City+Worker&background=3b82f6&color=fff";
+    } else {
+      deptTabBtn.style.display = 'none';
+      if(mobileDeptTabBtn) mobileDeptTabBtn.style.display = 'none';
+      document.querySelector('[data-tab="schedule"]').click();
+      
+      // Update Avatar
+      document.getElementById('user-avatar').src = "https://ui-avatars.com/api/?name=Local+Citizen&background=10b981&color=fff";
+    }
+  });
+
+  // Tab Switching
+  navTabs.forEach(tab => {
+    tab.addEventListener('click', () => {
+      const targetId = tab.getAttribute('data-tab');
+      
+      // Update Active Classes
+      navTabs.forEach(t => t.classList.remove('active'));
+      document.querySelectorAll(`[data-tab="${targetId}"]`).forEach(t => t.classList.add('active'));
+
+      // Switch Content
+      views.forEach(v => {
+        v.classList.add('hidden');
+        if (v.id === targetId) {
+          v.classList.remove('hidden');
+        }
+      });
+    });
+  });
+
+  function getStatusBadge(status) {
+    if (status === 'Upcoming') return `<span class="badge success">${status}</span>`;
+    return `<span class="badge warning">${status}</span>`;
+  }
+
+  function getFillColor(fill) {
+    if(fill >= 90) return 'red';
+    if(fill >= 70) return 'orange';
+    return 'green';
+  }
+
+  function renderSchedule() {
+    const tbody = document.getElementById('citizen-schedule-tbody');
+    if(!tbody) return;
+
+    tbody.innerHTML = citizenSchedule.map(s => `
+      <tr>
+        <td><strong>${s.type}</strong></td>
+        <td>${s.date}</td>
+        <td class="text-muted">${s.instructions}</td>
+        <td>${getStatusBadge(s.status)}</td>
+      </tr>
+    `).join('');
+  }
+
+  function renderDeptBins() {
+    const tbody = document.getElementById('dept-bins-tbody');
+    if(!tbody) return;
+
+    tbody.innerHTML = deptBins.map(b => {
+      const color = getFillColor(b.fill);
+      return `
+      <tr>
+        <td><strong>${b.id}</strong></td>
+        <td><i class="ph-fill ph-map-pin text-muted"></i> ${b.loc}</td>
+        <td>${b.type}</td>
+        <td>
+          <div class="flex-between" style="font-size:0.85rem; font-weight:bold;">
+            <span>${b.fill}% Full</span>
+            ${b.fill >= 90 ? '<i class="ph-fill ph-warning text-red"></i>' : ''}
+          </div>
+          <div class="progress-bar-container">
+            <div class="progress-bar ${color}" style="width: ${b.fill}%"></div>
+          </div>
+        </td>
+        <td>
+          ${b.fill >= 90 
+            ? `<button class="btn primary-btn btn-sm" style="background:var(--red);">Dispatch</button>`
+            : `<button class="btn outline-btn btn-sm">Monitor</button>`
+          }
+        </td>
+      </tr>
+      `;
+    }).join('');
+  }
+});
diff --git a/Projects/Smart Waste Management Platform/style.css b/Projects/Smart Waste Management Platform/style.css
new file mode 100644
index 00000000..065fb39f
--- /dev/null
+++ b/Projects/Smart Waste Management Platform/style.css	
@@ -0,0 +1,140 @@
+:root {
+  --primary: #10b981; /* Emerald Green */
+  --primary-hover: #059669;
+  --bg-page: #f8fafc;
+  --surface: #ffffff;
+  
+  --text-dark: #0f172a;
+  --text-main: #334155;
+  --text-muted: #64748b;
+  --border: #e2e8f0;
+
+  --blue: #3b82f6;
+  --green: #10b981;
+  --orange: #f59e0b;
+  --red: #ef4444;
+
+  --primary-light: rgba(16, 185, 129, 0.15);
+  --blue-light: rgba(59, 130, 246, 0.15);
+  --green-light: rgba(16, 185, 129, 0.15);
+  --orange-light: rgba(245, 158, 11, 0.15);
+  --red-light: rgba(239, 68, 68, 0.15);
+}
+
+* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Inter', system-ui, sans-serif; }
+body { background-color: var(--bg-page); color: var(--text-main); display: flex; flex-direction: column; height: 100vh; overflow: hidden; }
+h1, h2, h3, h4 { color: var(--text-dark); }
+.hidden { display: none !important; }
+
+/* Utilities */
+.text-primary { color: var(--primary); }
+.text-blue { color: var(--blue); }
+.text-green { color: var(--green); }
+.text-orange { color: var(--orange); }
+.text-red { color: var(--red); }
+.text-muted { color: var(--text-muted); }
+.text-2xl { font-size: 1.5rem; }
+.text-center { text-align: center; }
+.font-bold { font-weight: bold; }
+
+.bg-blue-light { background-color: var(--blue-light); }
+.bg-green-light { background-color: var(--green-light); }
+.bg-orange-light { background-color: var(--orange-light); }
+.bg-red-light { background-color: var(--red-light); }
+
+.flex-between { display: flex; justify-content: space-between; align-items: center; }
+.flex-center { display: flex; justify-content: center; align-items: center; }
+.flex-column { display: flex; flex-direction: column; }
+.p-0 { padding: 0 !important; }
+.mt-2 { margin-top: 1rem; }
+.mt-3 { margin-top: 1.5rem; }
+.mb-1 { margin-bottom: 0.5rem; }
+.mb-2 { margin-bottom: 1rem; }
+
+.badge { padding: 0.3rem 0.6rem; border-radius: 4px; font-size: 0.75rem; font-weight: bold; background: var(--bg-page); color: var(--text-main); border: 1px solid var(--border); }
+.badge.success { background: var(--green-light); color: var(--green); border: none; }
+.badge.warning { background: var(--orange-light); color: var(--orange); border: none; }
+.badge.danger { background: var(--red-light); color: var(--red); border: none; }
+.badge.primary { background: var(--primary-light); color: var(--primary); border: none; }
+
+.btn { padding: 0.6rem 1.2rem; border: none; border-radius: 6px; cursor: pointer; font-weight: 500; font-size: 0.95rem; transition: 0.2s; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; }
+.btn-sm { padding: 0.4rem 0.8rem; font-size: 0.85rem; }
+.primary-btn { background: var(--primary); color: white; box-shadow: 0 2px 4px rgba(16, 185, 129, 0.3); }
+.primary-btn:hover { background: var(--primary-hover); transform: translateY(-1px); }
+.outline-btn { background: transparent; border: 1px solid var(--border); color: var(--text-main); }
+.outline-btn:hover { background: var(--bg-page); }
+
+.icon-btn { background: var(--surface); border: 1px solid var(--border); color: var(--text-main); width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; cursor: pointer; transition: 0.2s; }
+.icon-btn:hover { background: var(--bg-page); }
+
+/* Top Navigation */
+.global-nav { height: 75px; background: var(--surface); border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; padding: 0 2rem; z-index: 100; box-shadow: 0 1px 3px rgba(0,0,0,0.02); }
+.brand { display: flex; align-items: center; gap: 0.5rem; font-size: 1.4rem; font-weight: bold; color: var(--text-dark); letter-spacing: -0.5px; }
+.brand i { font-size: 1.8rem; }
+
+.nav-links { display: flex; gap: 1rem; }
+.nav-tab { background: transparent; border: none; padding: 0.5rem 1rem; cursor: pointer; font-weight: 500; color: var(--text-muted); font-size: 0.95rem; transition: 0.2s; position: relative; }
+.nav-tab:hover { color: var(--text-dark); }
+.nav-tab.active { color: var(--primary); }
+.nav-tab.active::after { content: ''; position: absolute; bottom: -21px; left: 0; width: 100%; height: 3px; background: var(--primary); border-radius: 3px 3px 0 0; }
+
+.nav-actions { display: flex; align-items: center; gap: 1.2rem; }
+
+.role-selector select { padding: 0.5rem 1rem; border-radius: 6px; border: 1px solid var(--border); background: var(--bg-page); font-weight: 500; color: var(--text-main); cursor: pointer; outline: none; }
+.avatar { width: 42px; height: 42px; border-radius: 50%; border: 2px solid var(--border); }
+
+.mobile-nav { display: none; }
+
+/* Main Content */
+.main-content { flex-grow: 1; padding: 2rem; overflow-y: auto; }
+
+.page-heading { margin-bottom: 1.5rem; }
+.page-heading h1 { font-size: 1.8rem; margin-bottom: 0.4rem; letter-spacing: -0.5px; }
+
+/* Forms */
+.form-group { margin-bottom: 1.5rem; }
+.form-group label { display: block; font-weight: 500; color: var(--text-dark); margin-bottom: 0.5rem; font-size: 0.95rem; }
+.form-input { width: 100%; padding: 0.8rem 1rem; border: 1px solid var(--border); border-radius: 6px; background: var(--bg-page); font-size: 1rem; color: var(--text-dark); outline: none; transition: 0.2s; }
+.form-input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
+.upload-box { border: 2px dashed var(--border); border-radius: 8px; padding: 2rem; background: var(--bg-page); cursor: pointer; transition: 0.2s; }
+.upload-box:hover { border-color: var(--primary); background: var(--primary-light); }
+
+/* Progress Bar (Fill Level) */
+.progress-bar-container { width: 100%; height: 8px; background: var(--border); border-radius: 4px; overflow: hidden; margin-top: 0.5rem; }
+.progress-bar { height: 100%; border-radius: 4px; }
+.progress-bar.red { background: var(--red); }
+.progress-bar.orange { background: var(--orange); }
+.progress-bar.green { background: var(--green); }
+
+/* Grid Layouts */
+.split-layout { display: grid; grid-template-columns: 2fr 1fr; gap: 1.5rem; }
+.col-span-2 { grid-column: span 2; }
+@media (max-width: 1100px) { .split-layout { grid-template-columns: 1fr; } .col-span-2 { grid-column: span 1; } }
+
+/* Metrics Grid */
+.metrics-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; }
+.metric-card { background: var(--surface); border: 1px solid var(--border); padding: 1.5rem; border-radius: 10px; display: flex; align-items: center; gap: 1.2rem; box-shadow: 0 1px 3px rgba(0,0,0,0.02); }
+.metric-icon { width: 54px; height: 54px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 1.8rem; }
+.metric-data h3 { font-size: 0.85rem; color: var(--text-muted); font-weight: 500; margin-bottom: 0.3rem; text-transform: uppercase; letter-spacing: 0.5px; }
+.metric-data h2 { font-size: 1.6rem; color: var(--text-dark); }
+
+/* Panels & Tables */
+.panel { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 1px 3px rgba(0,0,0,0.02); overflow: hidden; display: flex; flex-direction: column; }
+.panel-header { padding: 1.25rem 1.5rem; border-bottom: 1px solid var(--border); background: var(--surface); }
+.panel-header h3 { font-size: 1.1rem; font-weight: 600; color: var(--text-dark); }
+.panel-body { padding: 1.5rem; flex-grow: 1; }
+
+.custom-table { width: 100%; border-collapse: collapse; }
+.custom-table th, .custom-table td { padding: 1.2rem 1.5rem; text-align: left; border-bottom: 1px solid var(--border); }
+.custom-table th { background: #fafafa; color: var(--text-muted); font-weight: 500; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.5px; }
+.custom-table tbody tr { transition: background 0.2s; }
+.custom-table tbody tr:hover { background: var(--bg-page); }
+
+/* Responsive */
+@media (max-width: 768px) {
+  .global-nav { padding: 0 1rem; }
+  .nav-links { display: none; }
+  .mobile-nav { display: flex; justify-content: space-around; background: var(--surface); padding: 0.8rem; border-bottom: 1px solid var(--border); }
+  .mobile-nav .nav-tab { padding: 0.5rem; font-size: 1.5rem; }
+  .mobile-nav .nav-tab.active::after { bottom: -10px; }
+}