create me a part for the statistics - Follow Up Deployment

index.html

@@ -110,6 +110,7 @@
                     <a href="#team" class="hover:text-yellow-400 transition">Team</a>
                     <a href="#matches" class="hover:text-yellow-400 transition">Matches</a>
                     <a href="#training" class="hover:text-yellow-400 transition">Training Programs</a>
+                    <a href="#stats" class="hover:text-yellow-400 transition">Statistics</a>
                     <a href="#gallery" class="hover:text-yellow-400 transition">Gallery</a>
                     <a href="#contact" class="hover:text-yellow-400 transition">Contact</a>
                 </div>
@@ -125,6 +126,7 @@
                 <a href="#team" class="block py-2 hover:text-yellow-400 transition">Team</a>
                 <a href="#matches" class="block py-2 hover:text-yellow-400 transition">Matches</a>
                 <a href="#training" class="block py-2 hover:text-yellow-400 transition">Training Programs</a>
+                <a href="#stats" class="block py-2 hover:text-yellow-400 transition">Statistics</a>
                 <a href="#gallery" class="block py-2 hover:text-yellow-400 transition">Gallery</a>
                 <a href="#contact" class="block py-2 hover:text-yellow-400 transition">Contact</a>
             </div>
@@ -299,6 +301,94 @@
         </div>
     </section>
 
+    <!-- Statistics Section -->
+    <section id="stats" class="py-16 bg-blue-900 text-white">
+        <div class="container mx-auto px-6">
+            <h2 class="logo-font text-4xl mb-12 text-center text-yellow-400">Team Statistics</h2>
+            
+            <div class="grid grid-cols-2 md:grid-cols-4 gap-6 mb-12">
+                <!-- Stat 1 -->
+                <div class="bg-blue-800 p-6 rounded-lg text-center">
+                    <div class="text-4xl font-bold mb-2">24</div>
+                    <div class="text-sm uppercase tracking-wider">Matches Played</div>
+                </div>
+                
+                <!-- Stat 2 -->
+                <div class="bg-blue-800 p-6 rounded-lg text-center">
+                    <div class="text-4xl font-bold mb-2">18</div>
+                    <div class="text-sm uppercase tracking-wider">Wins</div>
+                </div>
+                
+                <!-- Stat 3 -->
+                <div class="bg-blue-800 p-6 rounded-lg text-center">
+                    <div class="text-4xl font-bold mb-2">4</div>
+                    <div class="text-sm uppercase tracking-wider">Draws</div>
+                </div>
+                
+                <!-- Stat 4 -->
+                <div class="bg-blue-800 p-6 rounded-lg text-center">
+                    <div class="text-4xl font-bold mb-2">2</div>
+                    <div class="text-sm uppercase tracking-wider">Losses</div>
+                </div>
+            </div>
+            
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
+                <!-- Top Scorers -->
+                <div class="bg-blue-800 p-6 rounded-lg">
+                    <h3 class="text-xl font-bold mb-4 text-yellow-400">Top Scorers</h3>
+                    <div class="space-y-4">
+                        <div class="flex justify-between">
+                            <span>Andrea Ventrice</span>
+                            <span class="font-bold">14 goals</span>
+                        </div>
+                        <div class="flex justify-between">
+                            <span>Marco Menichelli</span>
+                            <span class="font-bold">8 goals</span>
+                        </div>
+                        <div class="flex justify-between">
+                            <span>Daniele Conti</span>
+                            <span class="font-bold">6 goals</span>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- Clean Sheets -->
+                <div class="bg-blue-800 p-6 rounded-lg">
+                    <h3 class="text-xl font-bold mb-4 text-yellow-400">Clean Sheets</h3>
+                    <div class="space-y-4">
+                        <div class="flex justify-between">
+                            <span>Alessandro Sabia</span>
+                            <span class="font-bold">9 clean sheets</span>
+                        </div>
+                        <div class="flex justify-between">
+                            <span>Team Total</span>
+                            <span class="font-bold">12 clean sheets</span>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- Discipline -->
+                <div class="bg-blue-800 p-6 rounded-lg">
+                    <h3 class="text-xl font-bold mb-4 text-yellow-400">Discipline</h3>
+                    <div class="space-y-4">
+                        <div class="flex justify-between">
+                            <span>Yellow Cards</span>
+                            <span class="font-bold">24</span>
+                        </div>
+                        <div class="flex justify-between">
+                            <span>Red Cards</span>
+                            <span class="font-bold">2</span>
+                        </div>
+                        <div class="flex justify-between">
+                            <span>Fair Play Rank</span>
+                            <span class="font-bold">3rd</span>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
     <!-- Team Section -->
     <section id="team" class="py-16 bg-gray-100">
         <div class="container mx-auto px-6">