@props(['data' => []])

@php $roles = \Apex\Modules\Services\Models\HireRole::query()->where('is_active', true)->orderBy('sort_order')->limit(6)->get(); @endphp

<section class="section-padding bg-white">
    <div class="container-page">
        <span class="home-eyebrow">Talent</span>
        <h2 class="section-heading mt-6">{{ $data['title'] ?? 'Featured Talent' }}</h2>
        <div class="mt-12 grid gap-5 sm:grid-cols-2 lg:grid-cols-3">
            @forelse($roles as $role)
                <a href="{{ route('hire.show', $role->slug) }}" class="hub-card">
                    <h3 class="font-bold text-secondary">{{ $role->title }}</h3>
                </a>
            @empty
                <div class="premium-card p-6 col-span-full"><p class="text-muted">Featured associates coming soon.</p></div>
            @endforelse
        </div>
    </div>
</section>