{{-- Homepage Collaborators Section — Partner logos grid --}}
@php
$partners = __('home.collaborators_section.partners');

// Logo file mappings — ordered to match the partner list in translation file
$partnerLogos = [
'citeo.png',
'paal.png',
'sydom_aveyron.svg',
'sytraival.png',
'decabfc.png',
'robotics_valley.png',
'creusot_montceau.png',
'polymeris.png',
'imvia.png',
'bpifrance.png',
'neos.png',
'ministere_enseignement_superieur_recherche.png',
'bourgogne_franche_comte.png',
'universite_bourgogne_europe.png',
'hub_and_go.PNG',
'reseau_entreprendre.png',
'usinerie_chalon_bourgogne.png',
'ciad.png',
'bfc_angels.png',
];
@endphp

<section class="w-full px-4 mb-10">
    <div class="w-full h-full px-4 py-20 bg-background rounded-lg">
        <div class="w-full max-w-7xl mx-auto">
            <x-atoms.title
                :subject="__('home.collaborators_section.subject')"
                :title="__('home.collaborators_section.title')"
                align="left" />
            <ul class="grid grid-cols-3 md:grid-cols-6 lg:grid-cols-7 gap-4 mb-10">
                @foreach($partners as $index => $partner)
                <li class="w-full h-full rounded-md aspect-[170/130] items-center justify-center flex px-2 lg:px-7 lg:py-2 bg-white/80 backdrop-blur-[10px] border border-white/10"
                    data-display-wrapped>
                    <span class="sr-only">{{ $partner['label'] }}</span>
                    <img
                        loading="lazy"
                        src="{{ asset('images/collaborators/' . ($partnerLogos[$index] ?? '')) }}"
                        alt="{{ $partner['alt'] }}"
                        width="170"
                        height="130"
                        class="max-h-20 md:max-h-30 object-contain">
                </li>
                @endforeach
            </ul>
        </div>
    </div>
</section>