@props(['category', 'description', 'projects'])

<section class="mb-20" data-aos="fade-up">
    <x-section-heading :title="$category" :subtitle="$description" align="left" />

    <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8 mt-8">
        @foreach ($projects as $project)
            <x-project-card :project="$project" />
        @endforeach
    </div>
</section>