@extends('public.layout')

@section('title', 'Tentang Kami')

@section('content')

<h1 class="text-3xl font-bold mb-2">Tentang Persegi</h1>
<p class="text-gray-500 mb-10">Organisasi Pemuda Independen Desa Karangdadap</p>

<div class="bg-white rounded-xl shadow p-8 mb-10 prose max-w-none">
    <p>
        <strong>Persegi</strong> adalah organisasi pemuda independen yang berdiri di Desa Karangdadap,
        Kecamatan Kalibagor, Kabupaten Banyumas. Kami berkomitmen untuk mendorong partisipasi aktif
        pemuda dalam pembangunan desa melalui kegiatan sosial, pendidikan, olahraga, dan budaya.
    </p>
    <p>
        Dengan prinsip <em>transparansi, gotong royong, dan inovasi</em>, Persegi hadir sebagai
        wadah bagi pemuda desa untuk berkontribusi nyata bagi masyarakat.
    </p>
</div>

<h2 class="text-2xl font-bold mb-6">Divisi Organisasi</h2>
<div class="grid md:grid-cols-2 gap-6">
    @foreach($divisi as $div)
    <div class="bg-white rounded-xl shadow p-6">
        <h3 class="font-bold text-green-700 text-lg mb-1">{{ $div->name }}</h3>
        <p class="text-sm text-gray-500 mb-3">{{ $div->description }}</p>
        <span class="text-xs bg-green-100 text-green-700 px-2 py-1 rounded-full">
            {{ $div->members_count }} anggota
        </span>
    </div>
    @endforeach
</div>

@endsection