@props([
    'cities' => [
        ['name' => 'Campanillas', 'image' => 'images/property/pc1.png', 'count' => 4, 'link' => 'properties-for-sale-in-campanillas','colClass' => 'col-lg-4 col-xl-4'],
        ['name' => 'Benalmadena Costa', 'image' => 'images/property/pc2.png', 'count' => 4, 'link' => 'properties-for-sale-in-benalmadena-costa', 'colClass' => 'col-lg-8 col-xl-8'],
        ['name' => 'Torrequebrada', 'image' => 'images/property/pc3-new.png', 'count' => 3, 'link' => 'properties-for-sale-in-torrequebrada', 'colClass' => 'col-lg-8 col-xl-8'],
        ['name' => 'La Cala Golf', 'image' => 'images/property/pc4-new.png', 'count' => 3, 'link' => 'properties-for-sale-in-la-cala-golf', 'colClass' => 'col-lg-4 col-xl-4'],
    ],
    'title' => __('home.cities.title'),
    'subtitle' => __('home.cities.subtitle')
])

<!-- Property Cities -->
<section id="property-city" class="property-city pb30">
    <div class="container">
        <div class="row">
            <div class="col-lg-6 offset-lg-3">
                <div class="main-title text-center">
                    <h2>{{ $title }}</h2>
                    <p>{{ $subtitle }}</p>
                </div>
            </div>
        </div>
        <div class="row">
            @foreach($cities as $city)
                <div class="{{ $city['colClass'] }}" onclick="window.location.href='{{ $city['link'] }}'">
                    <div class="properti_city">
                        <div class="thumb"><img class="img-fluid w100" src="{{ asset($city['image']) }}" alt="{{ $city['name'] }}"></div>
                        <div class="overlay">
                            <div class="details">
                                <h4>{{ $city['name'] }}</h4>
                                <p>{{ $city['count'] }} {{ __('home.cities.properties_label') }}</p>
                            </div>
                        </div>
                    </div>
                </div>
            @endforeach
        </div>
    </div>
</section>