<?php include 'includes/header.php'; ?>

<section class="section-padding bg-background">
    <div class="container">
        <div class="text-center mb-5">
            <span class="section-subtitle">UPCOMING EVENTS</span>
            <h2 class="section-title">The Race for Humanity 2026</h2>
            <p class="text-muted max-w-2xl mx-auto">Mark your calendars for a day of excitement and charity at the London Regatta Centre.</p>
        </div>
        
        <div class="row g-4 justify-content-center">
            <div class="col-lg-8">
                <div class="card p-4 border-0 shadow-sm mb-4">
                    <div class="row align-items-center">
                        <div class="col-md-2 text-center border-end">
                            <h2 class="fw-bold text-primary mb-0">14</h2>
                            <p class="text-muted uppercase mb-0">June</p>
                        </div>
                        <div class="col-md-7 ps-md-4 py-3 py-md-0">
                            <h4 class="fw-bold mb-1">Main Race Event</h4>
                            <p class="text-muted mb-0"><i data-lucide="map-pin" class="me-1" style="width: 14px;"></i> London Regatta Centre, E16 2QT</p>
                            <p class="text-muted mb-0"><i data-lucide="clock" class="me-1" style="width: 14px;"></i> 09:00 AM - 06:00 PM</p>
                        </div>
                        <div class="col-md-3 text-md-end">
                            <a href="register-event.php" class="btn btn-primary">Register</a>
                        </div>
                    </div>
                </div>
                
                <div class="card p-4 border-0 shadow-sm mb-4">
                    <div class="row align-items-center">
                        <div class="col-md-2 text-center border-end">
                            <h2 class="fw-bold text-primary mb-0">15</h2>
                            <p class="text-muted uppercase mb-0">June</p>
                        </div>
                        <div class="col-md-7 ps-md-4 py-3 py-md-0">
                            <h4 class="fw-bold mb-1">Community Festival & Awards</h4>
                            <p class="text-muted mb-0"><i data-lucide="map-pin" class="me-1" style="width: 14px;"></i> London Regatta Centre, E16 2QT</p>
                            <p class="text-muted mb-0"><i data-lucide="clock" class="me-1" style="width: 14px;"></i> 10:00 AM - 04:00 PM</p>
                        </div>
                        <div class="col-md-3 text-md-end">
                            <a href="activities.php" class="btn btn-outline-primary">Learn More</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<?php include 'includes/footer.php'; ?>
