@extends('web.layouts.container')

@section('content')
<main>
    <!-- Start pg-header -->
    <section class="pg-header section">
        <div class="container">
            <h1 class="title text-white text-uppercase fw-bold text-center">{{$page->currentDescription->page_title}}</h1>
        </div>
        <img src="{{ asset($page->image ?? 'assets/web/images/header-1.png')}}" alt="{{$page->currentDescription->page_title}}" class="bg"/>
    </section>
    <!-- Start features-pg -->
    <section class="features-pg section">
        <div class="container-fluid  px-0">
            <div class="row">
                <div class="col-lg-6 px-0">
                    <div class="text_box">
                        <h1 class="title text-white fw-bold mb-5">
                            {{-- Our <span class=" line_prim">Story.</span> --}}
                            {{ $page->currentDescription->title }}
                        </h1>
                        <div class="p txt_p">
                            {!! $page->currentDescription->description !!}
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 px-0 order_md_1">
                    <img src="{{ asset($page->image ?? 'assets/web/images/about-2.png')}}" alt="" class="sec-img"/>
                </div>
                <!--<div class="col-lg-7 px-0">-->
                <!--    <div class="vid_box">-->
                <!--        <div class="row align-items-center">-->
                <!--            <div class="col-lg-12">-->
                <!--                <h3 class="box_title mb-0 border-0">-->
                <!--                    {{ $video->currentDescription->title }}-->
                <!--                </h3>-->
                <!--            </div>-->
                <!--            <div class="col-lg-5">-->
                <!--                <div class="vid_inner d-flex align-items-center">-->
                <!--                    <div class="icon_box">-->
                <!--                        <a class="button is-play" data-fancybox href="{{ $video->video_url }}">-->
                <!--                            <div class="button-outer-circle has-scale-animation"></div>-->
                <!--                            <div class="button-outer-circle has-scale-animation has-delay-short"></div>-->
                <!--                            <div class="button-icon is-play">-->
                <!--                                <svg height="100%" width="100%" fill="#fff"><polygon class="triangle" points="5,0 30,15 5,30" viewBox="0 0 30 15"></polygon><path class="path" d="M5,0 L30,15 L5,30z" fill="none" stroke="#fff" stroke-width="1"></path></svg>-->
                <!--                            </div>-->
                <!--                        </a>-->
                <!--                    </div>-->
                <!--                    <div class="txt">-->
                <!--                        <h5 class="txt_title fw-bold mb-1">{{ __('videos.watch') }}</h5>-->
                <!--                        {{-- <p class="p mb-0">Sed do eiusmod tempor</p> --}}-->
                <!--                    </div>-->
                <!--                </div>-->
                <!--            </div>-->
                <!--        </div>-->
                <!--    </div>-->
                <!--</div>-->
            </div>
        </div>
    </section>

    <!-- Start story-pg -->
    <section class="story-pg section ">
        <div class="container">
            <div class="row">
                @foreach ($partners as $item)
                <div class="col-lg-4 col-md-6 px-0">
                    <div class="company_card">
                        <img src="{{ asset($item->image?: 'assets/web/images/logos/1.svg')}}" alt="" class="company_logo"/>
                        <div class="content">
                            <h5 class="title">{{ $item->currentDescription->title}}</h5>
                            <p class="data">{!! nl2br($item->currentDescription->description) !!}</p>
                        </div>
                    </div>
                </div>
                @endforeach
                
            </div>
        </div>
    </section>

    <!-- Start timeline-sec -->
    <section class="section  ">
        <h1 class="title text-center sec_head mb-0 pb-3">
            {!! footerLink(__('main.key_miles')) !!}
        </h1>
        @include('web.layouts.timeline')
    </section>


    <!-- Start downloading-sec -->
    @include('web.layouts.downloading')
    
    
    <!-- Start contact-sec -->
    {{-- @include('web.layouts.contactus') --}}

</main>
@endsection

@section('inner_js')
@endsection