@extends('layouts.default')
@section('title'){{ trans('virtual.meta_title', ['agency' => trans('virtual.' . $agency . '.heading')]) }}@stop
@section('description'){{ trans('virtual.meta_desc', ['agency' => trans('virtual.' . $agency . '.heading')]) }}@stop
@section('canonical'){{ request()->url() }}@stop
@section('styles')
    <link rel="stylesheet" type="text/css" href="{{ url('css/agence.css') }}?v={{ env('ASSET_VERSION') }}">
    <link rel="stylesheet" type="text/css" href="{{ url('css/slick.css') }}">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.5.8/slick-theme.css" rel="stylesheet" />

@stop
@section('content')
    <main class="agence_page">
        <section>
            <div class="agance_container">
                <div class="agence_banner">
                    <div class="main-banner">
                        <!-- <div class="eterbik-images">
                                                             @if ($agency == 'etterbeek')
    <video width="100%" height="auto" autoplay muted loop playsInline>
                                        <source src="{{ url('/videos/Vertical.mp4') }}" type="video/mp4">
                                       </video>
@else
    <img src="{{ url('/images/etterbik.png') }}" alt="banner">
    @endif
                                                            <img src="{{ url('/images/etterbik.png') }}" alt="banner">
                                                        </div>
                                                        <div class="mobile-view-images">
                                                            @if ($agency == 'etterbeek')
    <video width="100%" height="auto" autoplay muted loop playsInline>
                                        <source src="{{ url('/videos/Cinquantenaire.mp4') }}" type="video/mp4">
                                       </video>
@else
    <img src="{{ url('/images/etrmbl.png') }}" alt="banner">
    @endif
                                                            <img src="{{ url('/images/etrmbl.png') }}" alt="banner">
                                                        </div> -->
                        <div class="content-expertiso">
                            <h5>{{ trans('virtual.subheading') }}</h5>
                            <h1>{{ trans('virtual.' . $agency . '.heading') }}</h1>
                            <p>{{ trans('virtual.text_1') . trans('virtual.' . $agency . '.heading') . trans('virtual.text_2') }}
                            </p>
                            <div class="sub-content-exper">
                                <div class="exper-text">
                                    @lang('virtual.desc_left')
                                </div>
                                <div class="exper-text">
                                    <p>{{ trans('virtual.desc_right_1') }}</p>
                                    <p>{{ trans('virtual.desc_right_2') . trans('virtual.' . $agency . '.heading') }}</p>
                                </div>
                            </div>
                            <a class="legence"
                                href="{{ route($near_agency . '_' . app()->getLocale()) }}">{{ trans('virtual.agnecy_btn') }}</a>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="agence_info_section">
            <span class="bg_img"></span>
            <div class="agence_info_container">
                <div class="agence_info_wrapper">
                    <h2 class="heading_main">
                        {{ trans('virtual.agence_info_1') . trans('virtual.' . $agency . '.heading') }}
                        @lang('virtual.agence_info_2')</h2>
                    <p class="info_txt">{{ trans('virtual.' . $agency . '.heading') . trans('virtual.agence_info_text') }}
                    </p>
                    <ul>
                        <li>{{ trans('virtual.agence_info_text_1') }}</li>
                        <li>{{ trans('virtual.agence_info_text_2') }}</li>
                    </ul>
                    <div class="btn_grid">
                        <p class="txt">{{ trans('agence.agence_info_btn') }}</p>
                        <div class="btn_box">
                            <a href="{{ route('estimat_' . app()->getLocale()) }}"
                                class="btn_block">{{ trans('agence.agence_info_free') }}</a>
                            <a href="{{ route('sale_' . app()->getLocale()) }}"
                                class="btn_block">{{ trans('agence.agence_info_sale') }}</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="agence-map-container">
                <div class="google-map">
                    <div class="contact_map" id="contact_map" data-icon="{{ url('/images/new-agency-logo.png') }}"
                        data-agency="{{ $agency }}">
                        <div id="map"></div>
                    </div>
                </div>
            </div>
        </section>
        <section>
            <div class="satisfaction_section">
                <h2 class="heading_main center">@lang('home.satisfy_title')</h2>
                <div class="satisfaction_wrapper">
                    <div class="content testimonial">
                        <div>
                            <h3>{{ trans('home.testimonial_client_1') }}</h3>
                            <p>{{ trans('home.testimonial_review_1') }}</p>
                        </div>
                        <div>
                            <h3>{{ trans('home.testimonial_client_2') }}</h3>
                            <p>{{ trans('home.testimonial_review_2') }}</p>
                        </div>
                        <div>
                            <h3>{{ trans('home.testimonial_client_3') }}</h3>
                            <p>{{ trans('home.testimonial_review_3') }}</p>
                        </div>
                        <div>
                            <h3>{{ trans('home.testimonial_client_4') }}</h3>
                            <p>{{ trans('home.testimonial_review_4') }}</p>
                        </div>
                    </div>

                    <div class="view_grid">
                        <div class="view_box">
                            <div class="grid_box">
                                <a href="{{ trans('agence.evere.reviews_link') }}" target="_blank">
                                    <ul>
                                        @foreach (range(1, 5) as $i)
                                            <li>
                                                <img src="{{ url('images/star_yellow.svg') }}" alt="Star"
                                                    width="16" height="16" loading="lazy">
                                            </li>
                                        @endforeach
                                    </ul>
                                </a>
                                <a href="{{ trans('agence.evere.reviews_link') }}" target="_blank">
                                    <x-optimized-image src="images/google-review.png" alt="Google review" class="img" />
                                </a>
                            </div>
                            <div class="grid_box">
                                <p class="view_txt"><a href="{{ trans('agence.' . $near_agency . '.reviews_link') }}"
                                        target="_blank">{{ trans('agence.' . $near_agency . '.reviews') }}
                                        {{ trans('home.avis') }}</a></p>
                                <p class="view_no"><a href="{{ trans('agence.evere.reviews_link') }}"
                                        target="_blank">{{ trans('agence.' . $near_agency . '.rating') }}</a></p>
                            </div>
                        </div>
                        <div class="view_box">
                            <div class="grid_box">
                                <a href="https://satisfaction.realadvice.be/avis/Expertissimmo/" target="_blank">
                                    <ul>
                                        @foreach (range(1, 5) as $i)
                                            <li>
                                                <img src="{{ url('images/star_yellow.svg') }}" alt="Star"
                                                    width="16" height="16" loading="lazy">
                                            </li>
                                        @endforeach
                                    </ul>
                                </a>
                                <a href="https://satisfaction.realadvice.be/avis/Expertissimmo/" target="_blank">
                                    <x-optimized-image src="images/realadvice_new.png" alt="advice" class="img" />
                                </a>
                            </div>
                            <div class="grid_box">
                                <p class="view_txt"><a href="https://satisfaction.realadvice.be/avis/Expertissimmo/"
                                        target="_blank">2409 {{ trans('home.avis') }}</a></p>
                                <p class="view_no"><a href="https://satisfaction.realadvice.be/avis/Expertissimmo/"
                                        target="_blank">4.7/5</a></p>
                            </div>
                        </div>
                        <div class="view_box">
                            <div class="grid_box">
                                <a href="https://www.opinionsystem.fr/fr-fr/certificate/12083" target="_blank">
                                    <ul>
                                        @foreach (range(1, 5) as $i)
                                            <li>
                                                <img src="{{ url('images/star_yellow.svg') }}" alt="Star"
                                                    width="16" height="16" loading="lazy">
                                            </li>
                                        @endforeach
                                    </ul>
                                </a>
                                <a href="https://www.opinionsystem.fr/fr-fr/certificate/12083" target="_blank">
                                    <x-optimized-image src="images/opinion_system_new.png" alt="opinion"
                                        class="img" />
                                </a>
                            </div>
                            <div class="grid_box">
                                <p class="view_txt"><a href="https://www.opinionsystem.fr/fr-fr/certificate/12083"
                                        target="_blank">355 {{ trans('home.avis') }}</a></p>
                                <p class="view_no"><a href="https://www.opinionsystem.fr/fr-fr/certificate/12083"
                                        target="_blank">4.7/5</a></p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="team_section">
            @include('sections.team-members')
        </section>
    </main>
@stop
@section('scripts')
    <script type="text/javascript" src="{{ url('js/slick.js') }}" defer></script>
    <script async type="text/javascript" src="{{ url('./js/about.min.js') }}" defer></script>
    <script>
        setTimeout(function() {
            var head = document.getElementsByTagName('footer')[0];
            var script = document.createElement('script');
            script.type = 'text/javascript';
            script.async = 'async';
            script.src =
                "https://maps.googleapis.com/maps/api/js?key=AIzaSyASGuJdL2QoExIs5yBgswwGBQA-h-R2hkA&callback=initMap";
            script.defer = 'defer';
            head.appendChild(script);
        }, 500);
    </script>
    <script src="{{ url('/js/virtual-map.js') }}?v={{ env('ASSET_VERSION') }}"></script>

@stop