@props([
    'cards' => [],
    'title' => null,
    'description' => null,
    'includer' => null,
    'component' => null ,
    'icons' => null,
    'links' => null,
    'category' => null, 
    'columns' => $columns ?? 4,
])

<section class="w-full">
    {{-- Category --}}
    <div class="grid grid-rows-[80px_auto]">
        <x-sub-category :category="$category" />

        <div class="grid grid-cols-2 md:grid-cols-{{ $columns }} min-h-48">     
            @foreach ($cards as $card)
                <x-service-card
                    :title="$card['title']"
                    :icons="$card['icon']"
                    :name="$card['name'] ?? null"
                    :alt="$card['alt'] ?? null"
                />
            @endforeach
        </div>
</section>