                                <div class="card border-0 shadow-lg mb-34">

                                    <div class="card-body">
                                        <h5 class="card-title">
                                            <a class="text-decoration-none fw-bold"
                                                href="{{ route('home.country.post', ['country' => $country_locale->country_iso, 'post_slug' => $post->slug]) }}">{{ $post->title }}</a>
                                        </h5>

                                        @if (!is_empty($post->cliffhanger))
                                            <div class="mb-3">
                                                <small class="text-secondary">{{ $post->cliffhanger }}</small>
                                            </div>
                                        @else
                                            <div class="mb-3">
                                                <small class="text-secondary">{{ $post->excerpt }}</small>
                                            </div>
                                        @endif

                                        <p class="card-text">
                                            in
                                            @foreach ($post->post_categories as $post_category)
                                                <small><a class="text-decoration-none"
                                                        href="{{ route('home.country.category', ['country' => $country_locale->country_iso, 'category' => $post_category->category->slug]) }}">{{ $post_category->category->name }}</a>
                                                </small>
                                            @endforeach
                                            <small
                                                class="text-body-secondary ms-2">{{ $post->publish_date->timezone(session()->get('timezone'))->format('j F Y') }}</small>
                                            {{-- <small class="text-body-secondary ms-2">3 min read</small> --}}
                                        </p>

                                    </div>
                                    <a class="card-img-top"
                                        href="{{ route('home.country.post', ['country' => $country_locale->country_iso, 'post_slug' => $post->slug]) }}">
                                        <div class="img-fluid rounded-start ratio ratio-16x9">
                                            <div class="lqip-loader">
                                                <!-- Use the LQIP image with the appropriate URL -->
                                                <img class="img-fluid rounded-bottom" src="{{ $post->featured_image }}"
                                                    alt="Photo of {{ $post->name }}">

                                                <!-- Use the final JPEG image with the appropriate URL -->
                                                <img class="lqip-frozen img-fluid rounded-bottom"
                                                    src="{{ $post->featured_image_lqip }}"
                                                    alt="Placeholder image of {{ $post->name }}">
                                            </div>
                                        </div>
                                    </a>

                                </div>
