@props([
    'cities' => [
        ['name' => 'Miami', 'image' => 'images/property/pc1.jpg', 'count' => 24, 'colClass' => 'col-lg-4 col-xl-4'],
        ['name' => 'Los Angeles', 'image' => 'images/property/pc2.jpg', 'count' => 18, 'colClass' => 'col-lg-8 col-xl-8'],
        ['name' => 'New York', 'image' => 'images/property/pc3.jpg', 'count' => 89, 'colClass' => 'col-lg-8 col-xl-8'],
        ['name' => 'Florida', 'image' => 'images/property/pc4.jpg', 'count' => 47, 'colClass' => 'col-lg-4 col-xl-4'],
    ],
    'title' => 'Find Properties in These Cities',
    'subtitle' => 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.'
])

<!-- 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'] }}">
                    <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'] }} Properties</p>
                            </div>
                        </div>
                    </div>
                </div>
            @endforeach
        </div>
    </div>
</section>