@aware(['page'])
<div>
    <div class="theme-max-w mx-auto my-4 px-5">
        <div class="flex items-center space-x-4 mb-10">
            <div class="w-12 h-[2px] bg-black"></div>
            <h2 class="text-3xl font-bold theme-text-blue">{{$title}}</h2>
        </div>

        <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-10">
            @foreach($services as $service)
                <div class="flex items-start space-x-4">
                    <i class="{{$service['icon']}} text-3xl"></i>
                    <div>
                        <h3 class="text-lg font-semibold text-gray-900">{{$service['title']}}</h3>
                        <p class="text-gray-600 text-sm">{{$service['description']}}</p>
                    </div>
                </div>
            @endforeach
        </div>
    </div>
</div>