@extends('layouts.app')

@section('title', 'News & Stories - CHEER MEDICS FOUNDATION')

@section('content')
<!-- NEWS 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">News & Stories</h1><p class="text-2xl max-w-4xl mx-auto">Latest updates and impact stories</p></div></section>
    <section class="py-20 bg-white">
        <div class="max-w-7xl mx-auto px-4">
            <div class="grid md:grid-cols-3 gap-8">
                <article class="bg-white rounded-3xl shadow-2xl overflow-hidden card-hover"><div class="h-56 overflow-hidden"><img src="https://images.unsplash.com/photo-1576091160550-2173dba999ef?w=600" class="w-full h-full object-cover"></div><div class="p-8"><span class="gradient-primary text-white px-4 py-1 rounded-full text-sm font-bold">Dec 2, 2025</span><h3 class="text-xl font-black text-gray-900 mt-4 mb-3">Latest Program Update</h3><p class="text-gray-600 mb-4">Discover how our programs are making a difference in communities across the region...</p><span class="text-cyan-600 font-bold inline-flex items-center">Read More <svg class="w-4 h-4 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg></span></div></article>
                <article class="bg-white rounded-3xl shadow-2xl overflow-hidden card-hover"><div class="h-56 overflow-hidden"><img src="https://images.unsplash.com/photo-1559839734-2b71ea197ec2?w=600" class="w-full h-full object-cover"></div><div class="p-8"><span class="gradient-secondary text-white px-4 py-1 rounded-full text-sm font-bold">Nov 28, 2025</span><h3 class="text-xl font-black text-gray-900 mt-4 mb-3">Student Success Story</h3><p class="text-gray-600 mb-4">Meet Dr. Sarah who completed medical school with our scholarship support...</p><span class="text-cyan-600 font-bold inline-flex items-center">Read More <svg class="w-4 h-4 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg></span></div></article>
                <article class="bg-white rounded-3xl shadow-2xl overflow-hidden card-hover"><div class="h-56 overflow-hidden"><img src="https://api.cheermed.org/public/home/assets/images/resources/gift-bg-1-1.jpg" class="w-full h-full object-cover"></div><div class="p-8"><span class="bg-emerald-500 text-white px-4 py-1 rounded-full text-sm font-bold">Nov 20, 2025</span><h3 class="text-xl font-black text-gray-900 mt-4 mb-3">Community Health Camp</h3><p class="text-gray-600 mb-4">Free health checkups provided to 500+ elderly individuals last weekend...</p><span class="text-cyan-600 font-bold inline-flex items-center">Read More <svg class="w-4 h-4 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg></span></div></article>
            </div>
        </div>
    </section>
</div>
@endsection