{{-- Amenities Section - Círculos --}}
<section class="bg-[#fdf2e4] pt-16 p-footer">
    <div class="container mx-auto px-4">
        
        <div class="grid grid-cols-2 lg:grid-cols-4 gap-8">
            
            {{-- Amenity 1 --}}
            <div class="flex justify-center">
                <div class="w-full max-w-[280px] aspect-square rounded-full bg-[#c64c3b] 
                            flex flex-col items-center justify-center 
                            text-white p-6">
                    <x-local-sala class="h-16 md:h-20 fill-white mb-3" />
                    <h3 class="font-bold text-center text-sm md:text-base">
                        Espacios para<br>tu confort
                    </h3>
                </div>
            </div>

            {{-- Amenity 2 --}}
            <div class="flex justify-center">
                <div class="w-full max-w-[280px] aspect-square rounded-full bg-[#c64c3b] 
                            flex flex-col items-center justify-center 
                            text-white p-6">
                    <x-local-supermercado class="h-16 md:h-20 fill-white mb-3" />
                    <h3 class="font-bold text-center text-sm md:text-base">
                        Todo a tu<br>alcance
                    </h3>
                </div>
            </div>

            {{-- Amenity 3 --}}
            <div class="flex justify-center">
                <div class="w-full max-w-[280px] aspect-square rounded-full bg-[#c64c3b] 
                            flex flex-col items-center justify-center 
                            text-white p-6">
                    <x-local-conchas class="h-16 md:h-20 fill-white mb-3" />
                    <h3 class="font-bold text-center text-sm md:text-base">
                        Clima<br>Cálido
                    </h3>
                </div>
            </div>

            {{-- Amenity 4 --}}
            <div class="flex justify-center">
                <div class="w-full max-w-[280px] aspect-square rounded-full bg-[#c64c3b] 
                            flex flex-col items-center justify-center 
                            text-white p-6">
                    <x-local-padres class="h-16 md:h-20 fill-white mb-3" />
                    <h3 class="font-bold text-center text-sm md:text-base">
                        Vida en<br>armonía
                    </h3>
                </div>
            </div>

        </div>

    </div>
</section>