@php
    use App\Support\HomeSpecialtyGridPresenter;

    $items = HomeSpecialtyGridPresenter::items();
    $lc = ['locale' => app()->getLocale()];
    $servicesUrl = route('site.services.index', $lc);
@endphp

@if ($items->isNotEmpty())
    <section class="site-specialty" aria-label="{{ __('site.specialty_aria') }}">
        <div class="site-specialty__glow" aria-hidden="true"></div>
        <div class="site-container site-specialty__inner">
            <header class="site-specialty__header site-specialty__header--split">
                <div class="site-specialty__header-copy">
                    @php($specialtyCopy = \App\Support\SiteSettings::specialtyCopy())
                    <p class="site-specialty__eyebrow">{{ $specialtyCopy['eyebrow'] }}</p>
                    <h2 class="site-specialty__title">{{ $specialtyCopy['heading'] }}</h2>
                    <p class="site-specialty__subtitle">{{ $specialtyCopy['subtitle'] }}</p>
                </div>
                @if (site_shows_services())
                    <a href="{{ $servicesUrl }}" class="site-btn-outline site-specialty__services-btn">
                        {{ __('site.services_available_cta') }}
                    </a>
                @endif
            </header>

            <ul class="site-specialty__grid">
                @foreach ($items as $item)
                    <li>
                        <a
                            href="{{ $item['url'] }}"
                            class="site-specialty__card"
                            data-accent="{{ $item['accent'] }}">
                            <span class="site-specialty__icon" aria-hidden="true">
                                <x-site.svg-icon :name="$item['icon']" class="h-6 w-6" />
                            </span>
                            <h3 class="site-specialty__card-title">{{ $item['title'] }}</h3>
                            <p class="site-specialty__card-desc">{{ $item['description'] }}</p>
                        </a>
                    </li>
                @endforeach
            </ul>

        
        </div>
    </section>
@endif