@extends('web_site.layouts.master')
@section('content')
    @php
        $mainData = getMainData();
    @endphp

    <!-- :: Header -------------------------------------------------------------------------->
    <!--Main Slider video-->
    <section class="main-slider-three banner">
        <video autoplay loop muted playsinline>
            <source src="https://softivuspro.com/rest/online%20education.mp4" type="video/mp4">
        </video>
        <div class="main-slider-three__bg-overly"></div>

    </section>

    <!-- :: About Us --------------------------------------------------------------------------->
    @if (isset($about) && !empty($about))

        <section class="about-three">
            <div class="container">
                <div class="row flex-direction">
                    <div class="col-xl-7">
                        <div class="about-three__right wow slideInLeft" data-wow-delay="200ms"
                             data-wow-duration="2500ms">
                            <div class="section-title text-left">
                                <div class="section-title__tagline-box">
                                    <div class="section-title__shape"></div>
                                    <span class="section-title__tagline">{{trans('web_site.Who_We_Are')}}</span>
                                </div>
                                <h2 class="section-title__title"> {{getDefultheader(optional($about)->title)}}</h2>
                            </div>
                            <div class="about-three__text">
                                {{getDefultText(optional($about)->description)}}
                            </div>


                            <div class="about-three__btn-box">
                                <a href="{{route('about_us')}}"
                                   class="about-three__btn thm-btn">{{trans('web_site.load_more')}} <i
                                            class="fas fa-arrow-right ms-2"></i></a>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-5">
                        <div class=" wow slideInRight" data-wow-delay="200ms" data-wow-duration="2500ms">
                            <img src="{{optional($about)->image_url}}" class="border-radius15" width="100%" alt="img about" loading="lazy">
                        </div>
                    </div>

                </div>
            </div>
        </section>

    @endif

    @if($statistics)
        <!--Counter  -->
        <section class="counter-one">
            <div class="container">
                <div class="row">
                    <!--Counter One Single Start -->
                    <div class="col-xl-3 col-lg-6 col-md-6 col-6 wow fadeInLeft" data-wow-delay="100ms">
                        <div class="counter-one__single">
                            <div class="counter-one__title-box">
                                <h5 class="counter-one__title">{{trans('dash_site.statistic1')}} </h5>
                            </div>
                            <div class="counter-one__content-box">
                                <div class="counter-one__icon">
                                    <img src="{{asset('assets_web/img/task.png')}}" loading="lazy" alt="img">
                                </div>
                                <div class="counter-one__content">
                                    <div class="counter-one__count count-box">
                                        <h3 class="count-text" data-stop="{{$statistics->statistic1}}"
                                            data-speed="1500">00</h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--Counter One Single Start -->
                    <div class="col-xl-3 col-lg-6 col-md-6 col-6 wow fadeInLeft" data-wow-delay="300ms">
                        <div class="counter-one__single">
                            <div class="counter-one__title-box">
                                <h5 class="counter-one__title"> {{trans('dash_site.statistic2')}}</h5>
                            </div>
                            <div class="counter-one__content-box">
                                <div class="counter-one__icon">
                                    <img src="{{asset('assets_web/img/rating.png')}}" loading="lazy" alt="img">
                                </div>
                                <div class="counter-one__content">
                                    <div class="counter-one__count count-box">
                                        <h3 class="count-text" data-stop="{{$statistics->statistic2}}"
                                            data-speed="1500">00</h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--Counter One Single Start -->
                    <div class="col-xl-3 col-lg-6 col-md-6 col-6 wow fadeInRight" data-wow-delay="600ms">
                        <div class="counter-one__single">
                            <div class="counter-one__title-box">
                                <h5 class="counter-one__title"> {{trans('dash_site.statistic3')}}</h5>
                            </div>
                            <div class="counter-one__content-box">
                                <div class="counter-one__icon">
                                    <img src="{{asset('assets_web/img/team.png')}}" loading="lazy" alt="img">
                                </div>
                                <div class="counter-one__content">
                                    <div class="counter-one__count count-box">
                                        <h3 class="count-text" data-stop="{{$statistics->statistic3}}"
                                            data-speed="1500">00</h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--Counter One Single Start -->
                    <div class="col-xl-3 col-lg-6 col-md-6 col-6 wow fadeInRight" data-wow-delay="900ms">
                        <div class="counter-one__single">
                            <div class="counter-one__title-box">
                                <h5 class="counter-one__title">{{trans('dash_site.statistic4')}}</h5>
                            </div>
                            <div class="counter-one__content-box">
                                <div class="counter-one__icon">
                                    <img src="{{asset('assets_web/img/trophy.png')}}" loading="lazy" alt="img">
                                </div>
                                <div class="counter-one__content">
                                    <div class="counter-one__count count-box">
                                        <h3 class="count-text" data-stop="{{$statistics->statistic4}}"
                                            data-speed="1500">00</h3><h3  >+</h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <!--Counter One Single Start -->
                    <div class="col-xl-3 col-lg-6 col-md-6 col-6 wow fadeInLeft" data-wow-delay="100ms">
                        <div class="counter-one__single">
                            <div class="counter-one__title-box">
                                <h5 class="counter-one__title">{{trans('dash_site.statistic5')}} </h5>
                            </div>
                            <div class="counter-one__content-box">
                                <div class="counter-one__icon">
                                    <img src="{{asset('assets_web/img/task.png')}}" loading="lazy" alt="img">
                                </div>
                                <div class="counter-one__content">
                                    <div class="counter-one__count count-box">
                                        <h3 class="count-text" data-stop="{{$statistics->statistic5}}"
                                            data-speed="1500">00</h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--Counter One Single Start -->
                    <div class="col-xl-3 col-lg-6 col-md-6 col-6 wow fadeInLeft" data-wow-delay="300ms">
                        <div class="counter-one__single">
                            <div class="counter-one__title-box">
                                <h5 class="counter-one__title"> {{trans('dash_site.statistic6')}}</h5>
                            </div>
                            <div class="counter-one__content-box">
                                <div class="counter-one__icon">
                                    <img src="{{asset('assets_web/img/rating.png')}}" loading="lazy" alt="img">
                                </div>
                                <div class="counter-one__content">
                                    <div class="counter-one__count count-box">
                                        <h3 class="count-text" data-stop="{{$statistics->statistic6}}"
                                            data-speed="1500">00</h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--Counter One Single Start -->
                    <div class="col-xl-3 col-lg-6 col-md-6 col-6 wow fadeInRight" data-wow-delay="600ms">
                        <div class="counter-one__single">
                            <div class="counter-one__title-box">
                                <h5 class="counter-one__title"> {{trans('dash_site.statistic7')}}</h5>
                            </div>
                            <div class="counter-one__content-box">
                                <div class="counter-one__icon">
                                    <img src="{{asset('assets_web/img/team.png')}}" loading="lazy" alt="img">
                                </div>
                                <div class="counter-one__content">
                                    <div class="counter-one__count count-box">
                                        <h3 class="count-text" data-stop="{{$statistics->statistic7}}"
                                            data-speed="1500">00</h3><h3  >%</h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--Counter One Single Start -->
                    <div class="col-xl-3 col-lg-6 col-md-6 col-6 wow fadeInRight" data-wow-delay="900ms">
                        <div class="counter-one__single">
                            <div class="counter-one__title-box">
                                <h5 class="counter-one__title">{{trans('dash_site.statistic8')}}</h5>
                            </div>
                            <div class="counter-one__content-box">
                                <div class="counter-one__icon">
                                    <img src="{{asset('assets_web/img/trophy.png')}}" loading="lazy" alt="img">
                                </div>
                                <div class="counter-one__content">
                                    <div class="counter-one__count count-box">
                                        <h3 class="count-text" data-stop="{{$statistics->statistic8}}"
                                            data-speed="1500">00</h3><h3  >%</h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    @endif
    {{--    {{dd($Services)}}--}}
    @if(isset($Services)&&(!empty($Services)))
        <!--Services-->
        <section class="services-carousel-page">
            <div class="container wow fadeInUp" data-wow-delay="300ms">
                <div class="section-title text-center">
                    <div class="section-title__tagline-box">
                        <div class="section-title__shape"></div>
                        <span class="section-title__tagline">{{trans('web_site.OurServices')}}</span>
                    </div>
                    <h2 class="section-title__title">{{trans('web_site.We_offer_you_the_best_services')}}</h2>
                </div>
                <div class="services-carousel thm-owl__carousel owl-theme owl-carousel carousel-dot-style"
                     data-owl-options='{
            "items": 1,
            "margin": 20,
            "smartSpeed": 700,
            "loop":false,
            "autoplay": 2000,
            "nav":false,
            "dots":true,
            "navText": ["<span class=\"fa fa-angle-left\"></span>","<span class=\"fa fa-angle-right\"></span>"],
            "responsive":{
                "0":{
                    "items":1
                },
                "768":{
                    "items":2
                },
                "992":{
                    "items": 2
                },
                "1200":{
                    "items": 3
                }
            }
        }'>
                @foreach($Services as $Service)
                    <!--Services -->
                        <div class="item">
                            <div class="services-two__single high">
                                <div class="services-two__img-box">
                                    <a href="{{route('service.Details',$Service->id)}}">
                                        <div class="services-two__img servimg"
                                             style="background-image: url({{$Service->image_url}});"
                                             alt="services img" loading="lazy"></div>
                                    </a>
                                </div>
                                <div class="services-two__content">
                                    <div class="services-two__icon-and-title"><h3 class="services-two__title"><a
                                                    href="{{route('service.Details',$Service->id)}}">{{getDefultheader($Service->title)}}</a>
                                        </h3></div>
                                    <div class="services-two__text">
                                        {{getDefultText($Service->details)}}
                                    </div>
                                    <div><a href="{{route('service.Details',$Service->id)}}"
                                            class=" btnserv thm-btn">{{trans('web_site.read_more')}} <i
                                                    class="fas fa-arrow-right ms-2"></i></a></div>
                                </div>
                            </div>
                        </div>
                    @endforeach

                </div>
            </div>
        </section>
    @endif
    @if(isset($staff)&&(!empty($staff)))

        <!-- our teams-->
        {{--<section class="  clientback">
            <div class="container wow fadeInUp" data-wow-delay="400ms">
                <div class="section-title text-center">
                    <div class="section-title__tagline-box text-white">
                        <span class="section-title__tagline text-white">{{trans('web_site.Our_Teamms')}}</span>
                    </div>
                    <h2 class="section-title__title text-white">{{trans('web_site.Meet_Our_Team')}} </h2>
                </div>
                <div class="services-carousel thm-owl__carousel owl-theme owl-carousel carousel-dot-style"
                     data-owl-options='{
            "items": 1,
            "margin": 20,
            "smartSpeed": 700,
            "loop":false,
            "autoplay": 2000,
            "nav":false,
            "dots":true,
            "navText": ["<span class=\"fa fa-angle-left\"></span>","<span class=\"fa fa-angle-right\"></span>"],
            "responsive":{
                "0":{
                    "items":1
                },
                "768":{
                    "items":2
                },
                "992":{
                    "items": 2
                },
                "1200":{
                    "items": 4
                }
            }
        }'>
                @foreach($staff as $item)
                    <!--item-->
                        <div class="item">
                            <div class="services-two__single tmsingle">
                                <div class="services-two__img-box">
                                    <div class="services-two__img testmonialimg"
                                         style="background-image: url({{$item->image_url}});"
                                         alt="Testimonials img" loading="lazy"></div>
                                </div>
                                <div class="services-two__content content2">
                                    <div class="services-two__icon-and-title"><h3 class="services-two__title cmpnametm">
                                            {{$item->name}} </h3></div>
                                    <div class="services-two__icon-and-title"><h3
                                                class="services-two__title text-white fnnametm"> {{$item->jop_title}} </h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endforeach

                </div>
            </div>
        </section>--}}
    @endif
    @if(isset($Case_Studies)&&(!empty($Case_Studies)))
        <!--Case Studies -->
        <section class="blog-two blog-page wow fadeInRight" data-wow-delay="200ms">
            <div class="container">
                <div class="project-one__top">
                    <div class="section-title text-left">
                        <div class="section-title__tagline-box">
                            <div class="section-title__shape"></div>
                            <span class="section-title__tagline">{{trans('web_site.Case_Studies')}}</span>
                        </div>
                        <h2 class="section-title__title">{{trans('web_site.Our_Case_Studies')}}</h2>
                    </div>
                    <div class="project-one__btn-box">
                        <a href="{{route('case_Studies')}}"
                           class="project-one__btn thm-btn">{{trans('web_site.View_more')}} <i
                                    class="fas fa-arrow-right ms-2"></i></a>
                    </div>
                </div>


                <!-----------row 3 item-->
                <div class="row">
                @foreach($Case_Studies as $Case_Study)
                    <!--item-->
                        <div class="col-xl-4 col-lg-4 col-md-4">
                            <div class="blog-two__single">
                                <div class="blog-two__img-box">
                                    <a href="{{route('one_case_Studies',$Case_Study->id)}}">
                                        <div class="blog-two__img "
                                             style="background-image: url({{$Case_Study->image_path}});" loading="lazy" alt="case img"></div>
                                    </a>
                                </div>
                                <div class="blog-two__content">
                                    <h2 class="blog-two__title mt-0 font-weight"><a
                                                href="{{route('one_case_Studies',$Case_Study->id)}}">{{getDefultheader($Case_Study->title)}}</a>
                                    </h2>
                                    <div class="services-two__text">
                                        {{getDefultText($Case_Study->details)}}
                                    </div>
                                    <div class="mb-20btn"><a href="{{route('one_case_Studies',$Case_Study->id)}}"
                                                             class=" btnserv thm-btn">{{trans('web_site.load_more')}} <i
                                                    class="fas fa-arrow-right ms-2"></i></a></div>
                                </div>
                            </div>
                        </div>
                    @endforeach

                </div>

            </div>
        </section>
    @endif
    @if($partners)
        <!--Clients-->
        <section class="brand-one">
            <div class="container  wow fadeInUp" data-wow-delay="500ms">
                <div class="section-title text-center">
                    <div class="section-title__tagline-box">
                        <div class="white"></div>
                        <span class="section-title__tagline text-white">{{trans('web_site.Our_Clients')}}</span>
                    </div>
                    <h2 class="section-title__title text-white">{{trans('web_site.Trusted_by_Leading_Organizations')}}</h2>
                </div>
                <div class="brand-one__inner">
                    <div class="thm-swiper__slider swiper-container" data-swiper-options='{"spaceBetween": 100,
            "slidesPerView": 1,
        "slidesPerGroup": 1,
            "spaceBetween": 0,
            "speed": 2000,
            "loop": true,
            "pagination": {
                "el": ".swiper-dot-style1",
                "type": "bullets",
                "clickable": true
            },
        "navigation": {
            "nextEl": "#brand-one__swiper-button-next",
            "prevEl": "#brand-one__swiper-button-prev"
        },
        "autoplay": { "delay": 2000 },
        "breakpoints": {
            "0": {
                "spaceBetween": 20,
                "slidesPerView": 2,
                "slidesPerGroup": 2
            },
            "375": {
                "spaceBetween": 30,
                "slidesPerView": 2,
                "slidesPerGroup": 2
            },
            "575": {
                "spaceBetween": 30,
                "slidesPerView": 2,
                "slidesPerGroup": 2
            },
            "767": {
                "spaceBetween": 30,
                "slidesPerView": 2,
                "slidesPerGroup": 2
            },
            "991": {
                "spaceBetween": 30,
                "slidesPerView": 3,
                "slidesPerGroup": 3
            },
            "1199": {
                "spaceBetween": 30,
                "slidesPerView": 5,
                "slidesPerGroup": 5
            },
            "1290": {
                "spaceBetween": 30,
                "slidesPerView": 5,
                "slidesPerGroup": 5
            }
        }}'>
                        <div class="swiper-wrapper">
                            @foreach($partners as $partner)
                                <div class="swiper-slide">
                                    <div class="brand-one__img">
                                        <a href="{{ $partner->link ?? '#' }}" target="_blank">
                                            <img src="{{ $partner->image_url }}"
                                                 alt="{{ $partner->getTranslation('title', app()->getLocale()) }}" loading="lazy">
                                        </a>
                                    </div>
                                </div>
                            @endforeach
                        </div>

                        <div class="testimonial-two__dot-style">
                            <div class="swiper-dot-style1"></div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    @endif
    <!--Blog -->
    <section class="blog-two blog-page wow fadeInRight" data-wow-delay="200ms">
        <div class="container">
            <div class="project-one__top">
                <div class="section-title text-left">
                    <div class="section-title__tagline-box">
                        <div class="section-title__shape"></div>
                        <span class="section-title__tagline">{{trans('web_site.Our_Blog')}}</span>
                    </div>
                    <h2 class="section-title__title">{{trans('web_site.Latest_Our_Articles_and_Updates')}}</h2>
                </div>
                <div class="project-one__btn-box">
                    <a href="{{route('blogs')}}" class="project-one__btn thm-btn">{{trans('web_site.View_blogs')}} <i
                                class="fas fa-arrow-right ms-2"></i></a>
                </div>
            </div>

            <div class="row">
                @foreach ($blogs as $item)

                    @if (!empty($item->main_image))
                        @php
                            $image_path = Storage::disk('images')->url($item->main_image);

                            $img_url = asset((Storage::disk('images')->exists($item->main_image)) ? $image_path :'assets/images/blank.png');
                        @endphp
                    @else
                        @php $img_url = asset('assets/images/blank.png'); @endphp

                    @endif
                    <div class="col-xl-4 col-lg-4 col-md-6">
                        <div class="blog-two__single">
                            <div class="blog-two__img-box">
                                <a href="{{route('one_blog',$item->id)}}">
                                    <div class="blog-two__img" style="background-image: url()" loading="lazy" alt="blog img"></div>
                                </a>
                            </div>
                            <div class="blog-two__content">
                                <ul class="blog-two__meta list-unstyled">
                                    <li><i class="fas fa-calendar-alt"></i> {{ formatDateDayDisplay($item->date_at) }} </li>
                                </ul>
                                <h3 class="blog-two__title"><a href="{{route('one_blog',$item->id)}}">{{getDefultheader($item->title)}} </a></h3>
                                <p class="text">
                                    <!--{{\Illuminate\Support\Str::words(strip_tags($item->details), 30, '...')}}-->
                                    {{getDefultText($item->details)}}
                                </p>
                                <div><a href="{{route('one_blog',$item->id)}}"
                                        class=" btnblog2 thm-btn"> {{trans('web_site.read_more')}}<i
                                                class="fas fa-arrow-right ms-2"></i></a></div>

                            </div>
                        </div>
                    </div>

                @endforeach



            </div>
        </div>
    </section>
    @if($feedbacks)
        <!--Testimonial Two Start-->
        <section class="testimonial-two">
            <div class="container wow fadeInUp" data-wow-delay="400ms">
                <div class="section-title text-center">
                    <div class="section-title__tagline-box">
                        <div class="section-title__shape"></div>
                        <span class="section-title__tagline">{{trans('web_site.Our_Testimonial')}}</span>
                    </div>
                    <h2 class="section-title__title">{{trans('web_site.Customer_Reviews')}}</h2>
                </div>
                <div class="testimonial-two__bottom">
                    <div class="thm-swiper__slider swiper-container" data-swiper-options='{
                "slidesPerView": 1,
        "slidesPerGroup": 1,
                "spaceBetween": 0,
                "speed": 2000,
                "loop": true,
                "pagination": {
                    "el": ".swiper-dot-style1",
                    "type": "bullets",
                    "clickable": true
                },

                "navigation": {
                    "nextEl": ".swiper-button-prev1",
                    "prevEl": ".swiper-button-next1"
                },
                "autoplay": { "delay": 2000 },
                "breakpoints": {
                        "0": {
                            "spaceBetween": 0,
                            "slidesPerView": 1,
                "slidesPerGroup": 1
                        },
                        "375": {
                            "spaceBetween": 0,
                            "slidesPerView": 1,
                "slidesPerGroup": 1
                        },
                        "575": {
                            "spaceBetween": 0,
                            "slidesPerView": 1,
                "slidesPerGroup": 1
                        },
                        "768": {
                            "spaceBetween": 20,
                            "slidesPerView": 2,
                "slidesPerGroup": 2
                        },
                        "992": {
                            "spaceBetween": 20,
                            "slidesPerView": 3,
                "slidesPerGroup": 3
                        },
                        "1200": {
                            "spaceBetween": 20,
                            "slidesPerView":3,
                "slidesPerGroup": 3
                        },
                        "1320": {
                            "spaceBetween": 20,
                            "slidesPerView":3,
                "slidesPerGroup": 3
                        }
                    }
            }'>

                        <div class="swiper-wrapper">
                            @foreach($feedbacks as $feedback)
                                <div class="swiper-slide">
                                    <div class="testimonial-two__single">
                                        <div class="testimonial-two__quote"><i class="fas fa-quote-left"></i></div>
                                        <div class="testimonial-two__text">
                                            {!! $feedback->feedback !!}
                                        </div>

                                        <div class="testimonial-two__client-box">
                                            <div class="testimonial-two__client-content">
                                                <h3>{{ $feedback->name }}</h3>
                                                <p>{{ $feedback->jop_title }}</p>
                                            </div>
                                            <div class="testimonial-two__client-img">
                                                <img src="{{ $feedback->image_url }}" alt="{{ $feedback->name }}" loading="lazy">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    <!-- If we need navigation buttons -->
                        <div class="testimonial-two__dot-style">
                            <div class="swiper-dot-style1"></div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    @endif
    <!--------------------------------------------------------------------------------------->
@endsection