@extends('frontend::layouts.app')
@section('title')
    {{ $data['title'] }}
@endsection
@section('meta_keywords')
    {{ $data['meta_keywords'] }}
@endsection
@section('meta_description')
    {{ $data['meta_description'] }}
@endsection

@section('content')
    <!-- about us section start -->
    @php
        $aboutUsContents = \App\Models\LandingContent::where('type', 'about')
            ->where('locale', app()->getLocale())
            ->get();

        $page = \App\Models\LandingPage::where('code', 'about')
            ->where('locale', app()->getLocale())
            ->first();
        $pageData = json_decode($page->data, true);
    @endphp

    <section class="td-terms-conditions section_space has-sticky">
        <div class="breadcrumb-text">
            <h2>{{ $data['title'] }}</h2>
        </div>
    </section>
    <section class="td-about-us">
        <div class="td-about-us-wrapper">
            <div class="td-about-us-wrapper-left">
                <div class="td-about-us-wrapper-left-content">
                    <div class="td-about-us-wrapper-left-content-mainImg">
                        <img src="{{ asset($pageData['first_image']) }}" alt="">
                    </div>
                    <div class="td-about-us-wrapper-left-content-bottomImg">
                        <img src="{{ asset($pageData['second_image']) }}" alt="">
                    </div>
                    <div class="td-about-us-wrapper-left-content-rightImg">
                        <img class="d-xxl-block d-none" src="{{ asset($pageData['third_image']) }}" alt="">
                    </div>
                </div>
            </div>
            <div class="td-about-us-wrapper-right">
                <div class="td-about-us-wrapper-right-content">
                    <h3 class="wow img-custom-anim-left" data-wow-duration="1.5s" data-wow-delay="0.1s">
                        {{ $pageData['about_us_title'] }}</h3>
                    @foreach ($aboutUsContents as $content)
                        <div class="td-about-us-wrapper-right-content-card wow img-custom-anim-left"
                            data-wow-duration="1.5s" data-wow-delay="0.2s">
                            <div class="td-about-us-wrapper-right-content-card-icon">
                                <img src="{{ asset($content->photo) }}" alt="">
                            </div>
                            <div class="td-about-us-wrapper-right-content-card-text">
                                <h6>{{ $content->title }}</h6>
                                <p>{{ $content->description }}</p>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>
            <div class="td-about-us-wrapper-elememt">
                <img src="{{ asset('frontend/default/img/about/about-right-side-element.png') }}" alt="">
            </div>
        </div>
    </section>
    <!-- about us section end -->

    <!-- our vision section start -->
    @php
        $vision = \App\Models\Page::where('code', 'about')
            ->where('theme', 'default')
            ->where('locale', app()->getLocale())
            ->first();

        $visionContents = json_decode($vision->data, true);
    @endphp
    <section class="td-our-vision">
        <div class="container td-our-vision-wrapper">
            <div class="row align-items-center">
                <div class="col-lg-6">
                    <div class="td-our-vision-wrapper-left">
                        <span>{{ $visionContents['vision_small_title'] }}</span>
                        <div class="section-title section-title-left td-our-vision-wrapper-left-title img-custom-anim-left"
                            data-wow-duration="1.5s" data-wow-delay="0.5s">
                            <h2>{{ $visionContents['vision_big_title'] }}</h2>
                        </div>
                        <p class="wow img-custom-anim-right" data-wow-duration="1.5s" data-wow-delay="0.6s">
                            {!! $visionContents['vision_description'] !!}</p>
                        <div class="td-our-vision-wrapper-left-button wow img-custom-anim-top" data-wow-duration="1.5s"
                            data-wow-delay="0.7s">

                            <a href="{{ route('dynamic.page', ['section' => $visionContents['vision_button_link']]) }}"
                                class="td-btn td-btn-xl"> <span class="td-btn-wrap">
                                    <span class="td-btn-y-1">{{ $visionContents['vision_button_title'] }}</span>
                                    <span class="td-btn-y-2">{{ $visionContents['vision_button_title'] }}</span>
                                </span>
                                <i></i>
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="td-our-vision-wrapper-right">
                        <div class="td-our-vision-wrapper-right-imgCircle">
                            <img class="d-none d-md-block" src="{{ asset($visionContents['galleries1']) }}" alt="">
                        </div>
                        <div class="td-our-vision-wrapper-right-imgMiddle">
                            <img src="{{ asset($visionContents['galleries2']) }}" alt="">
                        </div>
                        <div class="td-our-vision-wrapper-right-imgLeft">
                            <img class="d-none d-md-block d-lg-none d-xl-block"
                                src="{{ asset($visionContents['galleries3']) }}" alt="">
                        </div>
                        <div class="td-our-vision-wrapper-right-imgRight">
                            <img src="{{ asset($visionContents['galleries4']) }}" alt="">
                        </div>
                        <div class="td-our-vision-wrapper-right-imgDot">
                            <img src="{{ asset('frontend/default/img/about/about-img-dot.svg') }}" alt="">
                        </div>
                        <div class="td-our-vision-wrapper-right-imgRectangle">
                            <img src="{{ asset('frontend/default/img/about/about-img-rectangle.svg') }}" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- our vision section end -->

    <!-- add banner section start -->
    <section class="td-add-banner">
        <div class="td-add-banner-wrapper jarallax" data-background="{{ asset($visionContents['banner_image']) }}">
            <div class="td-add-banner-wrapper-card">
                <div class="td-add-banner-wrapper-card-content">
                    <div class="section-title section-title-white mb-2 wow img-custom-anim-left" data-wow-duration="1.5s"
                        data-wow-delay="0.1s">
                        <h2>{{ $visionContents['banner_title'] }}</h2>
                    </div>
                    <p class="wow img-custom-anim-right" data-wow-duration="1.5s" data-wow-delay="0.4s">
                        {!! $visionContents['banner_description'] !!}</p>
                    <div class="td-add-banner-wrapper-card-content-button wow img-custom-anim-top" data-wow-duration="1.5s"
                        data-wow-delay="0.6s">

                        <a href="{{ route('dynamic.page', ['section' => $visionContents['banner_button_link']]) }}"
                            class="td-btn td-btn-xl">
                            <span class="td-btn-wrap">
                                <span class="td-btn-y-1">{{ $visionContents['banner_button_title'] }}</span>
                                <span class="td-btn-y-2">{{ $visionContents['banner_button_title'] }}</span>
                            </span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- add banner section end -->

    <!-- space overview section start -->
    <?php
    $overviews = \App\Models\LandingContent::where('type', 'overview')
        ->where('locale', app()->getLocale())
        ->where('theme', site_theme())
        ->get();
    $page = \App\Models\LandingPage::where('code', 'overview')
        ->where('locale', app()->getLocale())
        ->where('theme', site_theme())
        ->first();
    $overview_data = json_decode($page->data, true);
    ?>
    <section class="td-space-overview">
        <div class="td-space-overview-wrapper">
            <div class="section-title">
                <h2>{{ $overview_data['overview_title'] }}</h2>
            </div>
            <div class="td-space-overview-slider">
                <div class="owl-carousel owl-theme space-overview-carousel">
                    @foreach ($overviews as $overview)
                        <div class="td-space-overview-card wow img-custom-anim-top" data-wow-duration="1.5s"
                            data-wow-delay="0.1s">
                            <img src="{{ asset($overview->photo) }}" alt="">
                            <h3>{{ $overview->title }}</h3>
                        </div>
                    @endforeach
                </div>
            </div>
        </div>
        <div class="td-space-overview-element">
            <div class="td-space-overview-element-1">
                <img class="d-none d-md-block"
                    src="{{ asset('frontend/default/img/space-overview/space-overview-roundCube.png') }}" alt="">
            </div>
            <div class="td-space-overview-element-2">
                <img class="d-none d-lg-block"
                    src="{{ asset('frontend/default/img/space-overview/space-overview-sphere.png') }}" alt="">
            </div>
        </div>
    </section>
    <!-- space overview section end -->
@endsection
