@extends('web.layouts.container')

@section('content')
<main>
    <!-- Start pg-header -->
    <section class="pg-header section">
        <div class="container">
            <div class="bread mb-4">
                <a  href="{{ route('home') }}" class="pg_link"><img src="{{ asset('assets/web/images/icon.png')}}" alt="" class="icon"/></a> /
                <span class="pg_link active">{{$page->currentDescription->page_title}}</span>
            </div>
            <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/pg-header-3.png')}}" alt="" class="bg"/>
    </section>
    
    <!-- Start services-do -->
    <section class="our-impact section">
        <div class="container">
            <div class="row">
                <div class="col-lg-5">
                    <img src="{{ asset($page->image ?? 'assets/web/images/impact_2.png')}}" alt="" class="sec-img"/>
                </div>
                <div class="col-lg-6">
                    <div class="text-box">
                        <h1 class="title fw-bold mb-5 text-capitalize">
                            {!! footerLink($page->currentDescription->title) !!}
                        </h1>
                        <div class="p">
                            {!! $page->currentDescription->description !!} <br/>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Start mbc-environment -->
    <section class="mbc-environment section">
        <div class="container">
            <h1 class="title text-center text-white fw-bold mb-5 text-capitalize">
                {{-- MBC &    <span class="line_prim">THE ENVIRONMENT .</span> --}}
                {{ $envs[0]->category_name ?? ''}}
            </h1>
            <div class="swiper-container environment_swiper pb-5">
                <div class="swiper-wrapper">
                    @foreach ($envs as $item)
                    <div class="swiper-slide">
                        <div class="environment_item">
                            <div class="flip-card-inner">
                                <div class="front">
                                    <div class="label text-white">
                                        <h2 class="">
                                            {{ $item->currentDescription->title}}
                                        </h2>
                                        <p class="p">
                                            {!! nl2br($item->currentDescription->description) !!}
                                        </p>
                                    </div>
                                    <img src="{{ asset($item->image?: 'assets/web/images/enviro-1.png')}}" alt="" class="bg"/>
                                </div>
                            </div>
                        </div>
                    </div>
                    @endforeach
                    
                </div>
                <div class="swiper-pagination"></div>
            </div>
        </div>
    </section>

    <!-- Start services-do -->
    <section class="mbc-partners section">
        <div class="container">
            <h1 class="title text-center fw-bold mb-5 text-capitalize">
                {!! footerLink(__('main.mbc_our_partners')) !!}
            </h1>
            <p class="desc mb-5">
                {{ $partners_1[0]->category_name ?? ''}}
            </p>
            <div class="row mb-5">
                @foreach ($partners_1 as $item)
                <div class="col-lg-4">
                    <div class="partner_card">
                        <img src="{{ asset($item->image?: 'assets/web/images/logos/1.svg')}}" alt="" class="company_logo"/>
                        <h5 class="label color-primary fw-bold text-center mb-0">{{ $item->currentDescription->title}}</h5>
                    </div>
                </div>
                @endforeach
            </div>
            <p class="desc mb-5">
                {{ $partners_2[0]->category_name ?? ''}}
            </p>
            <div class="row">
                @foreach ($partners_2 as $item)
                <div class="col-lg-4">
                    <div class="partner_card">
                        <img src="{{ asset($item->image?: 'assets/web/images/logos/1.svg')}}" alt="" class="company_logo"/>
                        <h5 class="label color-primary fw-bold text-center mb-0">{{ $item->currentDescription->title}}</h5>
                    </div>
                </div>
                @endforeach
            </div>
        </div>
    </section>
</main>

@endsection

@section('inner_js')
@endsection