@extends('layouts.website')

@section('title', config('organization.short_name') . ' | Empowering People. Strengthening Communities. Transforming Futures.')

@section('content')

<x-website.hero-slider
    :images="[
        '/images/camps/camp1.jpg',
        '/images/camps/camp2.jpg',
        '/images/camps/camp3.jpg',
        '/images/camps/camp4.jpg',
        '/images/camps/camp5.jpg'
    ]"
    title="Empowering People. Strengthening Communities. Transforming Futures."
    subtitle="{{ config('organization.name') }} works alongside communities, volunteers, development partners, healthcare professionals and institutions to advance health, education, livelihoods and sustainable community development across Uganda.">

    <div class="flex flex-wrap justify-center gap-4">

        <a href="{{ route('volunteer.index') }}"
           class="bg-green-600 hover:bg-green-700 px-8 py-4 rounded-lg font-medium">

            Become A Volunteer

        </a>

        <a href="{{ route('partnerships') }}"
           class="bg-white text-black hover:bg-gray-100 px-8 py-4 rounded-lg font-medium">

            Partner With Us

        </a>

        <a href="{{ route('donate') }}"
           class="bg-amber-500 hover:bg-amber-600 px-8 py-4 rounded-lg font-medium">

            Support Our Work

        </a>

    </div>

</x-website.hero-slider>

@include('website.partials.home-video')

<section class="py-24 bg-white">

    <div class="max-w-6xl mx-auto px-6 text-center">

        <h2 class="text-4xl font-bold mb-10">

            Building Stronger Communities Through Integrated Development

        </h2>

        <div class="max-w-4xl mx-auto text-lg leading-8 text-gray-700">

            <p>

                {{ config('organization.short_name') }} is a community-based development organization committed to improving quality of life through community health programs, education, skills development, economic empowerment, volunteer engagement and sustainable development initiatives.

            </p>

            <p class="mt-6">

                Guided by the belief that lasting transformation begins within communities themselves, we work to strengthen local capacity, promote resilience and create opportunities that enable individuals and families to thrive.

            </p>

        </div>

    </div>

</section>

<x-website.stats-section
    title="Community Impact"
    subtitle="Every number represents lives reached, communities served and opportunities created."
    :stats="[
        ['value' => '493', 'label' => 'Beneficiaries Reached'],
        ['value' => '107', 'label' => 'Malaria Cases Treated'],
        ['value' => '200', 'label' => 'TB Screenings Conducted'],
        ['value' => '43', 'label' => 'Volunteers Mobilized']
    ]"
/>

<section class="py-24 bg-white">

    <div class="max-w-7xl mx-auto px-6">

        <div class="text-center mb-16">

            <h2 class="text-4xl font-bold">

                Our Strategic Program Areas

            </h2>

        </div>

        <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8">

            <x-website.program-card
                title="Community Health & Wellbeing"
                description="Medical outreach, disease prevention, health education, screening services, referrals and health system strengthening." />

            <x-website.program-card
                title="Education & Skills Development"
                description="Learning opportunities, mentorship, health literacy, youth empowerment and skills development initiatives." />

            <x-website.program-card
                title="Economic Empowerment"
                description="Livelihood development, entrepreneurship promotion, household resilience and sustainable income generation." />

            <x-website.program-card
                title="Volunteerism & Community Service"
                description="Mobilizing professionals, students and community members to contribute skills, expertise and service." />

        </div>

    </div>

</section>

<section class="py-24 bg-green-50">

    <div class="max-w-6xl mx-auto px-6">

        <div class="text-center mb-16">

            <h2 class="text-4xl font-bold">

                Our Development Philosophy

            </h2>

        </div>

        <div class="bg-white rounded-2xl shadow-sm p-10">

            <p class="text-lg leading-8 text-gray-700">

                Our work is inspired by the principles of human development, community participation and empowerment. We believe people are not merely beneficiaries of development but active agents of change capable of shaping their own futures when provided with opportunity, knowledge and support.

            </p>

            <p class="mt-6 text-lg leading-8 text-gray-700">

                EPDFU aligns its work with Uganda's development priorities, the Sustainable Development Goals (SDGs), Agenda 2063: The Africa We Want, and community-centered approaches that promote dignity, equity, inclusion and resilience.

            </p>

        </div>

    </div>

</section>

<x-website.featured-outreach
    image="/images/outreach/featured.jpg"
    title="Community Medical Outreach Initiative"
    description="Through collaboration with healthcare professionals, volunteers, community leaders and development partners, EPDFU delivered integrated health services, health education, disease screening and referrals to hundreds of community members.">

    <div class="grid grid-cols-2 gap-8 mt-10">

        <div>

            <h3 class="text-3xl font-bold text-green-700">
                493
            </h3>

            <p>
                Beneficiaries Served
            </p>

        </div>

        <div>

            <h3 class="text-3xl font-bold text-green-700">
                43
            </h3>

            <p>
                Volunteers Mobilized
            </p>

        </div>

    </div>

</x-website.featured-outreach>

<x-website.partner-logos />

<x-website.success-story
    title="Changing Lives Through Community Action"
    quote="The outreach program brought healthcare services closer to our community and helped many families receive treatment, information and hope."
    author="Community Beneficiary"
/>

<x-website.cta
    title="Join The Movement"
    subtitle="Whether you are a volunteer, donor, healthcare professional, development partner, institution or community champion, you can help create lasting impact and sustainable change.">

    <a href="{{ route('volunteer.index') }}"
       class="bg-green-600 hover:bg-green-700 px-8 py-4 rounded-lg">

        Become A Volunteer

    </a>

    <a href="{{ route('partnerships') }}"
       class="bg-white text-black px-8 py-4 rounded-lg">

        Partner With Us

    </a>

    <a href="{{ route('donate') }}"
       class="bg-amber-500 hover:bg-amber-600 px-8 py-4 rounded-lg">

        Support Our Work

    </a>

</x-website.cta>

@endsection