{{-- <section>
    <div class="container mb-5">
        <div class="section-heading mb-4 text-center mt-5 center-heading">
            <h2>Country Focus – Japan</h2>
        </div>
        <div class="owl-carousel international highlight">
            @foreach ($focusJapans as $japan)
                @if (!empty($japan->img_src))
                    @php
                        $webpImage = preg_replace('/\.\w+$/', '.webp', $japan->img_src);
                    @endphp
                    <div class="item card">

                        <img src="{{ asset('images/cureted-section/' . $webpImage) }}" alt="image"
                            class="img-fluid" loading="lazy">
                        <div class="International-competition">
                            <p>{{ $japan->title }}</p>
                        </div>
                    </div>
                @else
                    <div class="item card">
                        <img src="{{ $japan->img_url }}" alt="image" class="img-fluid" loading="lazy">
                        <div class="International-competition">
                            <p>{{ $japan->title }}</p>
                        </div>
                    </div>
                @endif
            @endforeach
        </div>
    </div>
</section> --}}


<section class="country-focus-section py-5">
    <div class="container">
        <div class="row align-items-center g-4">
            <!-- Left Side -->
            <div class="col-lg-3 title-page ">
                <div class="country-title">
                    <span class="section-chip">Country Focus</span>
                    <h2>Japan</h2>
                    <p>
                        Discover award-winning Japanese cinema showcasing
                        powerful storytelling and artistic excellence.
                    </p>
                </div>
            </div>
            <!-- Right Side -->
            <div class="col-lg-9 ">
                {{-- <div class="country-focus ">
                    <div class="item">
                        <div class="movie-card">
                            <img src="https://iffigoa.org/images/cureted-section/Seaside-Serendipity.webp">
                            <div class="movie-overlay">
                                <h5>Seaside Serendipity</h5>
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="movie-card">
                            <img src="https://iffigoa.org/images/cureted-section/Tiger.webp">
                            <div class="movie-overlay">
                                <h5>Tiger</h5>
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="movie-card">
                            <img src="https://iffigoa.org/images/cureted-section/Two-Seasons.webp">
                            <div class="movie-overlay">
                                <h5>Two Seasons, Two Strangers</h5>
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="movie-card">
                            <img src="https://iffigoa.org/images/cureted-section/Dear-Stranger.webp">
                            <div class="movie-overlay">
                                <h5>Dear Stranger</h5>
                            </div>
                        </div>
                    </div>
                </div> --}}

                <div class="country-focus">
                    @foreach ($focusJapans as $japan)
                        @if (!empty($japan->img_src))
                            @php
                                $webpImage = preg_replace('/\.\w+$/', '.webp', $japan->img_src);
                            @endphp
                            <div class="item card">

                                <img src="{{ asset('images/cureted-section/' . $webpImage) }}" alt="image"
                                    class="img-fluid" loading="lazy">
                                <div class="International-competition">
                                    <p>{{ $japan->title }}</p>
                                </div>
                            </div>
                        @else
                            <div class="item card">
                                <img src="{{ $japan->img_url }}" alt="image" class="img-fluid" loading="lazy">
                                <div class="International-competition">
                                    <p>{{ $japan->title }}</p>
                                </div>
                            </div>
                        @endif
                    @endforeach
                </div>
            </div>
        </div>
    </div>
</section>