can you create a training session for me and a section for registrations - Follow Up Deployment

index.html

@@ -103,6 +103,7 @@
                     <a href="#home" class="hover:text-yellow-400 transition">Home</a>
                     <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</a>
                     <a href="#gallery" class="hover:text-yellow-400 transition">Gallery</a>
                     <a href="#contact" class="hover:text-yellow-400 transition">Contact</a>
                 </div>
@@ -117,6 +118,7 @@
                 <a href="#home" class="block py-2 hover:text-yellow-400 transition">Home</a>
                 <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</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>
@@ -376,6 +378,129 @@
         </div>
     </section>
 
+    <!-- Training Sessions Section -->
+    <section id="training" class="py-16 bg-white">
+        <div class="container mx-auto px-6">
+            <h2 class="logo-font text-4xl mb-12 text-center text-blue-900">Training Sessions</h2>
+            
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-8 mb-12">
+                <div class="bg-gray-100 p-8 rounded-lg">
+                    <h3 class="text-2xl font-bold mb-4 text-blue-900">Youth Academy</h3>
+                    <p class="mb-4 text-gray-700">Our youth program focuses on developing fundamental skills for players aged 6-16.</p>
+                    <ul class="space-y-2 mb-6">
+                        <li class="flex items-start">
+                            <i class="fas fa-check text-yellow-500 mt-1 mr-2"></i>
+                            <span>Monday & Wednesday: 4-6 PM</span>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check text-yellow-500 mt-1 mr-2"></i>
+                            <span>Saturday: 9-11 AM</span>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check text-yellow-500 mt-1 mr-2"></i>
+                            <span>Professional coaching staff</span>
+                        </li>
+                    </ul>
+                    <a href="#register" class="inline-block bg-blue-900 hover:bg-blue-800 text-white px-6 py-2 rounded-lg transition">
+                        Register Now
+                    </a>
+                </div>
+                
+                <div class="bg-gray-100 p-8 rounded-lg">
+                    <h3 class="text-2xl font-bold mb-4 text-blue-900">Adult Training</h3>
+                    <p class="mb-4 text-gray-700">For players 17+ looking to improve their skills and fitness.</p>
+                    <ul class="space-y-2 mb-6">
+                        <li class="flex items-start">
+                            <i class="fas fa-check text-yellow-500 mt-1 mr-2"></i>
+                            <span>Tuesday & Thursday: 7-9 PM</span>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check text-yellow-500 mt-1 mr-2"></i>
+                            <span>Sunday: 10 AM-12 PM</span>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check text-yellow-500 mt-1 mr-2"></i>
+                            <span>Competitive and recreational options</span>
+                        </li>
+                    </ul>
+                    <a href="#register" class="inline-block bg-blue-900 hover:bg-blue-800 text-white px-6 py-2 rounded-lg transition">
+                        Register Now
+                    </a>
+                </div>
+            </div>
+            
+            <div class="bg-blue-900 text-white p-8 rounded-lg">
+                <h3 class="text-2xl font-bold mb-4">Private Coaching</h3>
+                <p class="mb-6 max-w-2xl">Book one-on-one sessions with our professional coaches to focus on specific skills and development areas.</p>
+                <a href="#register" class="inline-block bg-yellow-500 hover:bg-yellow-600 text-blue-900 px-6 py-2 rounded-lg font-semibold transition">
+                    Request Private Session
+                </a>
+            </div>
+        </div>
+    </section>
+
+    <!-- Registration Section -->
+    <section id="register" class="py-16 bg-gray-100">
+        <div class="container mx-auto px-6 max-w-4xl">
+            <h2 class="logo-font text-4xl mb-12 text-center text-blue-900">Registration Form</h2>
+            
+            <form class="bg-white p-8 rounded-lg shadow-md">
+                <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
+                    <div>
+                        <label for="first-name" class="block mb-2 font-medium">First Name*</label>
+                        <input type="text" id="first-name" required class="w-full px-4 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-500">
+                    </div>
+                    <div>
+                        <label for="last-name" class="block mb-2 font-medium">Last Name*</label>
+                        <input type="text" id="last-name" required class="w-full px-4 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-500">
+                    </div>
+                    <div>
+                        <label for="email" class="block mb-2 font-medium">Email*</label>
+                        <input type="email" id="email" required class="w-full px-4 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-500">
+                    </div>
+                    <div>
+                        <label for="phone" class="block mb-2 font-medium">Phone*</label>
+                        <input type="tel" id="phone" required class="w-full px-4 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-500">
+                    </div>
+                </div>
+                
+                <div class="mb-6">
+                    <label class="block mb-2 font-medium">Program*</label>
+                    <div class="space-y-2">
+                        <div class="flex items-center">
+                            <input type="radio" id="youth" name="program" value="youth" class="mr-2" checked>
+                            <label for="youth">Youth Academy (6-16 years)</label>
+                        </div>
+                        <div class="flex items-center">
+                            <input type="radio" id="adult" name="program" value="adult" class="mr-2">
+                            <label for="adult">Adult Training (17+ years)</label>
+                        </div>
+                        <div class="flex items-center">
+                            <input type="radio" id="private" name="program" value="private" class="mr-2">
+                            <label for="private">Private Coaching</label>
+                        </div>
+                    </div>
+                </div>
+                
+                <div class="mb-6">
+                    <label for="experience" class="block mb-2 font-medium">Football Experience</label>
+                    <textarea id="experience" rows="3" class="w-full px-4 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Tell us about your football background..."></textarea>
+                </div>
+                
+                <div class="mb-6">
+                    <div class="flex items-start">
+                        <input type="checkbox" id="terms" required class="mt-1 mr-2">
+                        <label for="terms">I agree to the <a href="#" class="text-blue-600 hover:underline">terms and conditions</a> and understand the <a href="#" class="text-blue-600 hover:underline">privacy policy</a>*</label>
+                    </div>
+                </div>
+                
+                <button type="submit" class="w-full bg-red-600 hover:bg-red-700 text-white py-3 px-6 rounded-lg font-semibold transition">
+                    Submit Registration
+                </button>
+            </form>
+        </div>
+    </section>
+
     <!-- Gallery Section -->
     <section id="gallery" class="py-16 bg-gray-100">
         <div class="container mx-auto px-6">