@extends('layout.master')

@section('meta')
    @include('layout.partials.seo', [
        'title' => nova_get_setting_translate('about_meta_title') ?? env('APP_NAME'),
        'description' => nova_get_setting('about_meta_description') ?? env('APP_NAME'),
        'keywords' => nova_get_setting('about_meta_keywords') ?? env('APP_NAME'),
        'image' => Storage::url(nova_get_setting('about_banner')),
        'schema' => nova_get_setting('about_schema'),
    ])
@endsection

@section('extraStyles')
@endsection
@section('content')
    <div class="container-fluid bg-breadcrumb"
        style=" position: relative;
background: linear-gradient(#d09d5b30, #cc944e47), url({{ Storage::url(nova_get_setting('about_banner')) }});
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
padding: 60px 0 100px 0;
transition: 0.5s;">
        <div class="container text-center py-5" style="max-width: 900px;">
            <h4 class="text-white display-4 mb-4 wow fadeInDown" data-wow-delay="0.1s">
                {{ nova_get_setting_translate('about_name') }}
            </h4>
        </div>
    </div>
    <div class="container-fluid  py-3 banar">
        <ol class="breadcrumb text-dark mb-0 wow fadeInDown" data-wow-delay="0.3s">
            <li class="breadcrumb-item"><a href="{{ route('home') }}" class="text-dark">{{ __('general.home') }}</a></li>
            <li class="breadcrumb-item active text-secondary"> {{ nova_get_setting_translate('about_page_heading') }}</li>
        </ol>
    </div>




    <div class="about_area mt-5">
        <div class="container">
            <div class="row align-items-center  About_mo">
                <div class="col-lg-6">
                    <div class="about_info_wrap">
                        <h3> {{ nova_get_setting_translate('section_1_about_title') }}</h3>
                        <span class="long_dash"></span>
                        <p>
                            {!! nova_get_setting_translate('section_1_about_description') !!}
                        </p>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="about_img">
                        <div class="img_1">

                            <img src="{{ Storage::url(nova_get_setting('section_1_about_us_image_1')) }}" alt="">
                        </div>
                        <div class="small_img">
                            <img src="{{ Storage::url(nova_get_setting('section_1_about_us_image_2')) }}" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <section class="about-us  " id="about-us">
        <!-- About Start -->
        <div class="container-xxl ">
            <div class="container">
                <div class="row g-5">
                    <div class="col-lg-6  ">
                        <div class="d-flex flex-column about-us-img position-relative">

                            <img class="img-fluid about_big_img "
                                src="{{ Storage::url(nova_get_setting('section_2_about_us_image')) }}" alt="about-big-img">
                        </div>
                    </div>
                    <div class="col-lg-6  ">
                        <div class="row ">
                            <div class="col-12 mb-xl-3">
                                <h2 class="about_heder mb-3">{{ nova_get_setting_translate('section_2_about_sub_title') }}
                                </h2>
                                <h3 class=" about_text mb-4">{{ nova_get_setting_translate('section_2_about_title') }}</h3>
                            </div>

                            <p>
                                {!! nova_get_setting_translate('section_2_about_description') !!}

                            </p>
                            {{-- <div class="about-us-info mb-4">
                                <div class="about-us-points">
                                    <p><i class="far fa-check-circle text-primary me-3 pr-2" aria-hidden="true"></i>Easy
                                        Booking Options</p>
                                    <p><i class="far fa-check-circle text-primary me-3 pr-2" aria-hidden="true"></i>Amazing
                                        Tour Plans</p>
                                    <p><i class="far fa-check-circle text-primary me-3 pr-2" aria-hidden="true"></i>Best
                                        Travel Guide</p>
                                </div>
                                <div class="about-us-points">
                                    <p><i class="far fa-check-circle text-primary me-3 pr-2" aria-hidden="true"></i>Easy
                                        Booking Options</p>
                                    <p><i class="far fa-check-circle text-primary me-3 pr-2" aria-hidden="true"></i>Amazing
                                        Tour Plans</p>
                                    <p><i class="far fa-check-circle text-primary me-3 pr-2" aria-hidden="true"></i>Amazing
                                        Tour Plans</p>
                                </div>
                            </div> --}}

                        </div>
                    </div>
                </div>
                <!-- About End -->
            </div>
        </div>
    </section>
@endsection
@section('extraScripts')
@endsection