@extends('frontend.layout.master')
@section('content')
    <div class="container">
        <div class="breadcrumb-wrapper">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">


                    <li class="breadcrumb-item"><a href="{{route('home')}}">Home</a></li>


                    <li class="breadcrumb-item active" aria-current="page">about us</li>


                </ol>
            </nav>
        </div>
    </div>

    <!-- about us page -->

    <!-- about us area  -->
    <section class="about-us" data-aos="fade-up" data-aos-offset="200" data-aos-easing="ease-in-sine"
             data-aos-duration="700">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-md-12 col-lg-6">
                    <div class="leftArea">
                        @if(!empty($aboutus['image']))
                            <img src="{{url('/')}}/{{$aboutus->image}}" alt="" loading="lazy">
                        @endif

                        <div class="row counterAll">
                            <div class="col-12 col-lg-8">
                                <div class="counter">
                                    <div class="h2">People Trust</div>
                                    <div class="h2" data-max="99">+</div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="col-md-12 col-lg-6">
                    <div class="rightArea">
                        <div class="headingArea">
                                                        @if(!empty($aboutus->header))
                                <h2 class="h2">{{$aboutus->header}}</h2>
                            @endif
                        </div>
                        @if(!empty($aboutus->description))
                            <p>

                                {!! $aboutus->description !!}

                            </p>
                        @endif
                        {{--                        <ul>--}}
                        {{--                            <li><i data-feather="cpu"></i> Integrity</li>--}}
                        {{--                            <li><i data-feather="cpu"></i> Customer Success</li>--}}
                        {{--                            <li><i data-feather="cpu"></i> Teamwork</li>--}}
                        {{--                            <li><i data-feather="cpu"></i> Transparency</li>--}}
                        {{--                        </ul>--}}

                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- about us area  -->

    <!-- mission vission area -->
    <section class="mission-vission">
        <div class="container">
            <div class="row" style="justify-content: center;">
                @if(!empty($first))
                    <div class="col-md-4">
                        <div class="mission m-v cardHeight" data-aos="fade-up" data-aos-offset="0"
                             data-aos-easing="ease-in-sine" data-aos-duration="700" data-aos-delay="300">
                            <i class="las la-bullseye"></i>
                            <div class="left">
                                @if(!empty($first->title))
                                    <h4>{{$first->title}} : </h4>
                                @endif
                                <p>
                                    @if(!empty($first->description))
                                        {{$first->description}}
                                    @endif
                                </p>
                            </div>
                        </div>
                    </div>
                @endif
                @if(!empty($second))
                    <div class="col-md-4">
                        <div class="vission m-v cardHeight" data-aos="fade-down" data-aos-offset="0"
                             data-aos-easing="ease-in-sine" data-aos-duration="700" data-aos-delay="300">
                            <i class="las la-eye"></i>
                            <div class="right">
                                <h4>{{$second->title??""}}</h4>

                                @if(!empty($second->description))
                                    <p>
                                        {{$second->description}}
                                    </p>
                                @endif
                            </div>
                        </div>
                    </div>
                @endif

                @if(!empty($third))
                    <div class="col-md-4">
                        <div class="vission m-v" data-aos="fade-up" data-aos-offset="0" data-aos-easing="ease-in-sine"
                             data-aos-duration="700" data-aos-delay="300">
                            <i class="las la-star"></i>
                            <div class="right">
                                @if(!empty($third->title))
                                    <h4>{{$third->title}} </h4>
                                @endif

                                @if(!empty($third->description))
                                    <p>
                                        {{$third->description}}
                                    </p>
                                @endif
                            </div>
                        </div>
                    </div>
                @endif
            </div>
        </div>
    </section>
    <br>

    <!-- core value area  -->
    <section class="core-value section-gap" data-aos="fade-up" data-aos-offset="0" data-aos-easing="ease-in-sine"
             data-aos-duration="700" data-aos-delay="300">
        <div class="container">
            <div class="headingArea">
                <h2 class="h2">our core value</h2>
            </div>
            <div class="row">
                @if(!empty($corevalues))
                    @foreach($corevalues as $value)
                        <div class="col-lg-4 col-md-6">
                            <div class="c-value">
                                <img src="{{url('/')}}/{{$value->image}}" alt="" loading="lazy">
                                <div class="h4">{{$value->name}}</div>
                            </div>
                        </div>
                    @endforeach
                @endif
                {{--                <div class="col-lg-4 col-md-6">--}}
                {{--                    <div class="c-value">--}}
                {{--                        <img src="{{url('/')}}/frontend/assets/images/responsibility.webp" alt="" loading="lazy">--}}
                {{--                        <div class="h4">Social Responsibility</div>--}}
                {{--                    </div>--}}
                {{--                </div>--}}
                {{--                <div class="col-lg-4 col-md-6">--}}
                {{--                    <div class="c-value">--}}
                {{--                        <img src="{{url('/')}}/frontend/assets/images/success.webp" alt="" loading="lazy">--}}
                {{--                        <div class="h4">Customer Success</div>--}}
                {{--                    </div>--}}
                {{--                </div>--}}
                {{--                <div class="col-lg-4 col-md-6">--}}
                {{--                    <div class="c-value">--}}
                {{--                        <img src="{{url('/')}}/frontend/assets/images/transparency.webp" alt="" loading="lazy">--}}
                {{--                        <div class="h4">Transparency</div>--}}
                {{--                    </div>--}}
                {{--                </div>--}}
                {{--                <div class="col-lg-4 col-md-6">--}}
                {{--                    <div class="c-value">--}}
                {{--                        <img src="{{url('/')}}/frontend/assets/images/teamwork.webp" alt="" loading="lazy">--}}
                {{--                        <div class="h4">Teamwork</div>--}}
                {{--                    </div>--}}
                {{--                </div>--}}
            </div>
        </div>
    </section>
    <!-- core value area end -->
    <!-- mission vission area -->


    <!-- why choose us area  -->
    <section class="about-us choose-us">
        <div class="container">
            <div class="row align-items-center" data-aos="zoom-in" data-aos-offset="200" data-aos-easing="ease-in-sine"
                 data-aos-duration="900">
                <div class="col-md-6">
                    <div class="rightArea">
                        <div class="headingArea">
                            @if(!empty($choose->header))
                                <h2 class="h2">{{$choose->header}}</h2>
                            @endif
                        </div>
                        @if(!empty($choose->description))
                            <p>

                                {!! $choose->description !!}

                            </p>
                        @endif

                    </div>
                </div>
                <div class="col-md-6">
                    <div class="leftArea">
                        @if(!empty($choose->image))
                            <img src="{{$choose->image}}" alt="" loading="lazy">
                        @endif
                        <div class="bgImg"></div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- why choose us area  -->



    <!-- advisory board section  -->
    <section class="advisory-board section-gap" data-aos="fade-right" data-aos-offset="0" data-aos-easing="ease-in-sine"
             data-aos-duration="700" data-aos-delay="300">
        <div class="container">
            <div class="headingArea">
                <h2 class="h2">advisory board</h2>
            </div>
            <div class="row" style="justify-content: center;">
                @if(!empty($advisory))
                    @foreach($advisory as $advise)
                        <div class="col-lg-3 col-md-4">
                            <div class="advisory-member">
                                <img src="{{$advise->image}}" alt="" loading="lazy">
                                <ul class="advisory-ul">

                                    <li><h4>{{$advise->name}}</h4></li>

                                    <li><h6>{{$advise->position}}</h6></li>
                                    <li><a href="{{$advise->linkdin}}" target="_blank"><i
                                                data-feather="linkedin"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    @endforeach
                @endif
                {{--                <div class="col-lg-3 col-md-4">--}}
                {{--                    <div class="advisory-member">--}}
                {{--                        <img src="{{url('/')}}/frontend/assets/images/member.webp" alt="" loading="lazy">--}}
                {{--                        <ul class="advisory-ul">--}}
                {{--                            <li><h4>Amy Frederick</h4></li>--}}
                {{--                            <li><h6>position</h6></li>--}}
                {{--                            <li><a href="#"><i data-feather="linkedin"></i></a></li>--}}
                {{--                        </ul>--}}
                {{--                    </div>--}}
                {{--                </div>--}}
                {{--                <div class="col-lg-3 col-md-4">--}}
                {{--                    <div class="advisory-member">--}}
                {{--                        <img src="{{url('/')}}/frontend/assets/images/member-3.webp" alt="" loading="lazy">--}}
                {{--                        <ul class="advisory-ul">--}}
                {{--                            <li><h4>Shelly Nelson</h4></li>--}}
                {{--                            <li><h6>position</h6></li>--}}
                {{--                            <li><a href="#"><i data-feather="linkedin"></i></a></li>--}}
                {{--                        </ul>--}}
                {{--                    </div>--}}
                {{--                </div>--}}
                {{--                <div class="col-lg-3 col-md-4">--}}
                {{--                    <div class="advisory-member">--}}
                {{--                        <img src="{{url('/')}}/frontend/assets/images/member.webp" alt="" loading="lazy">--}}
                {{--                        <ul class="advisory-ul">--}}
                {{--                            <li><h4>Stacey Lopez</h4></li>--}}
                {{--                            <li><h6>position</h6></li>--}}
                {{--                            <li><a href="#"><i data-feather="linkedin"></i></a></li>--}}
                {{--                        </ul>--}}
                {{--                    </div>--}}
                {{--                </div>--}}
            </div>
        </div>
    </section>

    <!-- advisory board section end -->



    <!-- about us page end -->
@endsection