Medium big counter. In seperate section - Follow Up Deployment

index.html

@@ -25,6 +25,11 @@
         .gradient-bg {
             background: linear-gradient(135deg, #4f46e5 0%, #10b981 100%);
         }
+        #volunteerCounter {
+            font-size: 4rem;
+            line-height: 1;
+            text-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+        }
         .form-shadow {
             box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
         }
@@ -45,7 +50,7 @@
         <div class="container mx-auto px-4">
             <div class="max-w-3xl mx-auto text-center">
                 <h1 class="text-4xl md:text-5xl font-bold mb-4">TruthLens Foundation</h1>
-                <p class="text-xl md:text-2xl font-light"</p>
+                <p class="text-xl md:text-2xl font-light"></p>
                 <p class="text-lg italic mt-2">"Empowered to Question, Inspired to Act."</p>
                 <div class="mt-8">
                     <i class="fas fa-hands-helping text-4xl opacity-80"></i>
@@ -54,6 +59,15 @@
         </div>
     </header>
 
+    <!-- Volunteer Counter Section -->
+    <section class="bg-white py-8 shadow-md">
+        <div class="container mx-auto px-4 text-center">
+            <h2 class="text-2xl font-semibold text-gray-800 mb-2">Join Our Growing Movement</h2>
+            <div class="text-5xl font-bold text-blue-600 my-4" id="volunteerCounter">0</div>
+            <p class="text-lg text-gray-600">people fighting for transparency</p>
+        </div>
+    </section>
+
     <!-- Main Content with ARIA landmark -->
     <main class="container mx-auto px-4 py-12" role="main">
         <div class="flex flex-col lg:flex-row gap-12">
@@ -257,6 +271,10 @@
 
 
     <script>
+        // Initialize and display the volunteer counter
+        let volunteerCount = localStorage.getItem('volunteerCount') || 0;
+        document.getElementById('volunteerCounter').textContent = volunteerCount;
+
         function prepareEmail(event) {
             event.preventDefault();
             
@@ -287,9 +305,14 @@
             // Open mail client
             window.location.href = `mailto:saharshkumar450@gmail.com?subject=${encodeURIComponent(subject)}&body=${encodeURIComponent(body)}`;
             
-            // Show success message
+            // Show success message and update counter
             document.getElementById('successMessage').classList.add('show');
             document.getElementById('successMessage').scrollIntoView({ behavior: 'smooth' });
+            
+            // Increment and save the counter
+            volunteerCount++;
+            localStorage.setItem('volunteerCount', volunteerCount);
+            document.getElementById('volunteerCounter').textContent = volunteerCount;
         }
 
         // For signature upload preview (not implemented in this demo)