@extends('layouts.app')

@section('title', 'Events - CHEER MEDICS FOUNDATION')

@section('content')
<!-- EVENTS PAGE -->
<div class="pt-20">
    <section class="relative py-32 animated-bg text-white overflow-hidden"><div class="absolute inset-0 bg-black/30"></div><div class="relative max-w-7xl mx-auto px-4 text-center"><h1 class="text-6xl md:text-7xl font-black mb-6">Events</h1><p class="text-2xl max-w-4xl mx-auto">Join us at upcoming events and programs</p></div></section>
    <section class="py-20 bg-white">
        <div class="max-w-7xl mx-auto px-4">
            <div class="grid lg:grid-cols-2 gap-8">
                <div class="bg-white rounded-3xl shadow-2xl overflow-hidden card-hover"><div class="h-64 overflow-hidden"><img src="https://images.unsplash.com/photo-1582213782179-e0d53f98f2ca?w=600" class="w-full h-full object-cover"></div><div class="p-10"><div class="flex items-center gap-6 mb-6"><div class="gradient-primary text-white px-6 py-4 rounded-2xl font-black text-center"><div class="text-2xl">15</div><div class="text-sm">DEC</div></div><div><h3 class="text-2xl font-black text-gray-900">Annual Fundraising Gala</h3><p class="text-cyan-600 font-bold">7:00 PM - 10:00 PM</p></div></div><p class="text-gray-600 mb-6">Join us for an evening of celebration and support for our mission. Network with supporters and learn about our impact.</p><button class="gradient-primary text-white px-8 py-4 rounded-xl font-bold hover:shadow-xl transition-all">Register Now</button></div></div>
                <div class="bg-white rounded-3xl shadow-2xl overflow-hidden card-hover"><div class="h-64 overflow-hidden"><img src="https://images.unsplash.com/photo-1576091160399-112ba8d25d1d?w=600" class="w-full h-full object-cover"></div><div class="p-10"><div class="flex items-center gap-6 mb-6"><div class="gradient-secondary text-white px-6 py-4 rounded-2xl font-black text-center"><div class="text-2xl">22</div><div class="text-sm">DEC</div></div><div><h3 class="text-2xl font-black text-gray-900">Health Workshop</h3><p class="text-cyan-600 font-bold">10:00 AM - 4:00 PM</p></div></div><p class="text-gray-600 mb-6">Free health workshop for medical students covering mental wellness and professional development.</p><button class="gradient-primary text-white px-8 py-4 rounded-xl font-bold hover:shadow-xl transition-all">Register Now</button></div></div>
            </div>
        </div>
    </section>
</div>
@endsection