<section id="services" class="services section light-background">
    <div class="container section-title" data-aos="fade-up">
        <h2>Layanan Desa</h2>
        <p>Kantor Desa Pelem melayani setulus hati para warganya, ayo datang untuk mengurus administrasi</p>
    </div>

    <div class="container" data-aos="fade-up" data-aos-delay="100">
        <div class="row g-4">
            @php
                $items = [
                    [
                        'icon' => 'bi-file-earmark-text',
                        'title' => 'Pengurusan Administrasi',
                        'delay' => 100,
                        'text' =>
                            'Layanan administrasi desa seperti pembuatan surat keterangan, pengurusan KTP, KK, akta kelahiran, dan dokumen resmi lainnya dengan proses yang cepat dan mudah.',
                    ],
                    [
                        'icon' => 'bi-people',
                        'title' => 'Kegiatan PKK',
                        'delay' => 200,
                        'text' =>
                            'Berbagai kegiatan pemberdayaan keluarga melalui program PKK, seperti pelatihan keterampilan, penyuluhan kesehatan, dan penguatan ekonomi keluarga.',
                    ],
                    [
                        'icon' => 'bi-building',
                        'title' => 'Pembangunan Desa',
                        'delay' => 300,
                        'text' =>
                            'Program pembangunan infrastruktur dan fasilitas umum desa, termasuk perbaikan jalan, pembangunan jembatan, dan pengadaan sarana publik.',
                    ],
                    [
                        'icon' => 'bi-calendar-event',
                        'title' => 'Acara Desa',
                        'delay' => 400,
                        'text' =>
                            'Informasi dan jadwal acara desa seperti peringatan hari besar, lomba desa, musyawarah warga, dan kegiatan sosial masyarakat.',
                    ],
                ];

            @endphp
            @foreach ($items as $it)
                <div class="col-lg-6" data-aos="fade-up" data-aos-delay="{{ $it['delay'] }}">
                    <div class="service-card d-flex">
                        <div class="icon flex-shrink-0"><i class="bi {{ $it['icon'] }}"></i></div>
                        <div>
                            <h3>{{ $it['title'] }}</h3>
                            <p>{{ $it['text'] }}</p>
                            {{-- <a href="service-details.html" class="read-more">Read More <i class="bi bi-arrow-right"></i></a> --}}
                        </div>
                    </div>
                </div>
            @endforeach
        </div>
    </div>
</section>
