@extends('layouts.app')

@section('title', 'What We Do - CHEER MEDICS FOUNDATION')

@section('content')
<!-- WHAT WE DO 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">What We Do</h1><p class="text-2xl max-w-4xl mx-auto">Comprehensive programs addressing healthcare and educational challenges</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-16 mb-16">
                <div class="h-96 rounded-3xl overflow-hidden shadow-2xl"><img src="https://images.unsplash.com/photo-1573497019940-1c28c88b4f3e?w=600" class="w-full h-full object-cover"></div>
                <div><h2 class="text-4xl font-black text-gray-900 mb-8">Mental Health Support</h2><p class="text-gray-600 text-lg leading-relaxed mb-6">We recognize the importance of mental well-being in overall health outcomes. Our mental health support programs provide counseling services, support groups, and wellness resources for medical students facing academic stress and elderly individuals dealing with isolation or depression.</p><p class="text-gray-600 text-lg leading-relaxed">Through partnerships with licensed mental health professionals, we ensure that our beneficiaries have access to quality psychological support when they need it most.</p></div>
            </div>
            <div class="grid md:grid-cols-2 gap-8 mb-16">
                <div class="gradient-primary rounded-3xl p-10 text-white shadow-2xl card-hover"><div class="feature-icon mb-6"><svg class="w-10 h-10 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"></path></svg></div><h3 class="text-2xl font-black mb-4">Student Mental Wellness</h3><p class="text-white/90">Counseling services and stress management programs for medical students facing academic pressures</p></div>
                <div class="gradient-secondary rounded-3xl p-10 text-white shadow-2xl card-hover"><div class="feature-icon mb-6"><svg class="w-10 h-10 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"></path></svg></div><h3 class="text-2xl font-black mb-4">Elderly Support Groups</h3><p class="text-white/90">Community gatherings and social activities to combat loneliness and isolation among seniors</p></div>
            </div>
            <div class="bg-gray-50 rounded-3xl p-12 text-center">
                <h2 class="text-4xl font-black text-gray-900 mb-6">Our Core Programs</h2>
                <div class="grid md:grid-cols-3 gap-8 mt-10">
                    <div class="bg-white rounded-2xl p-8 shadow-lg card-hover"><div class="w-16 h-16 gradient-primary rounded-full flex items-center justify-center mx-auto mb-4"><svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"></path></svg></div><h3 class="text-xl font-black text-gray-900 mb-2">Education Support</h3><p class="text-gray-600">Scholarships and educational resources for medical students</p></div>
                    <div class="bg-white rounded-2xl p-8 shadow-lg card-hover"><div class="w-16 h-16 gradient-primary rounded-full flex items-center justify-center mx-auto mb-4"><svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"></path></svg></div><h3 class="text-xl font-black text-gray-900 mb-2">Healthcare Access</h3><p class="text-gray-600">Medical services for underserved elderly populations</p></div>
                    <div class="bg-white rounded-2xl p-8 shadow-lg card-hover"><div class="w-16 h-16 gradient-primary rounded-full flex items-center justify-center mx-auto mb-4"><svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"></path></svg></div><h3 class="text-xl font-black text-gray-900 mb-2">Community Building</h3><p class="text-gray-600">Creating connections and support networks</p></div>
                </div>
            </div>
        </div>
    </section>
</div>
@endsection