@extends('layouts.frontend.master')

@section('title', 'Home')

@push('styles')
    <style>
        .main-hero {
            height: 86vh !important;
        }
    </style>
@endpush

@section('hero_content')
    <section id="hero" class="d-flex align-items-center main-hero">
        <div class="container" data-aos="zoom-out" data-aos-delay="100">
            @foreach ($contents as $section)
                @if ($section->slug == 'slide-1')
                    {!! $section->description !!}
                @endif
            @endforeach
        </div>
    </section>
@endsection

@section('content')
    <section id="about" class="about section-bg">
        <div class="container" data-aos="fade-up" id="vision">
            <div class="row">
                <div class="col-lg-6" data-aos="zoom-out" data-aos-delay="100">
                    @foreach ($contents as $section)
                        @if ($section->slug == 'vision-1')
                            {!! $section->description !!}
                        @endif
                    @endforeach
                </div>
                <div class="col-lg-6 pt-4 pt-lg-0 content d-flex flex-column justify-content-center" data-aos="fade-up"
                    data-aos-delay="100">
                    @foreach ($contents as $section)
                        @if ($section->slug == 'vision-2')
                            {!! $section->description !!}
                        @endif
                    @endforeach
                </div>
            </div>
        </div>
    </section>

    <section id="hero" class="d-flex align-items-center classsix">


        <div class="container classseven" data-aos="zoom-out" data-aos-delay="100" id="solutions">
            <div class="row">
                <div class="col-lg-6 pt-4 pt-lg-0 content d-flex flex-column justify-content-center" data-aos="fade-up"
                    data-aos-delay="100">
                    @foreach ($contents as $section)
                        @if ($section->slug == 'solutions​-1')
                            {!! $section->description !!}
                        @endif
                    @endforeach
                </div>
                <div class="col-lg-6" data-aos="zoom-out" data-aos-delay="100">
                    @foreach ($contents as $section)
                        @if ($section->slug == 'solutions​-2')
                            {!! $section->description !!}
                        @endif
                    @endforeach
                </div>
            </div>

        </div>

    </section>

    <section id="team" class="team section-bg">
        <div class="container" data-aos="fade-up" id="principles">
            <div class="elementor-widget-container classd3">
                <p><strong>CSR</strong> Principles</p>
            </div>
            <div class="row mt-7">
                <div class="col-lg-4 col-md-6 d-flex align-items-stretch">
                    <div class="member">
                        <div class="member-img">
                            @foreach ($contents as $sectionImg)
                                @if ($sectionImg->slug == 'principles-1-image')
                                    <img style="" src="{{ asset($sectionImg->image) }}" class="img-fluid"
                                        alt="image">
                                @endif
                            @endforeach
                        </div>

                        @foreach ($contents as $section)
                            @if ($section->slug == 'principles-1')
                                {!! $section->description !!}
                            @endif
                        @endforeach
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 d-flex align-items-stretch">
                    <div class="member">
                        <div class="member-img ">
                            <div class="member-img">
                                @foreach ($contents as $sectionImg)
                                    @if ($sectionImg->slug == 'principles-2-image')
                                        <img style="" src="{{ asset($sectionImg->image) }}" class="img-fluid"
                                            alt="image">
                                    @endif
                                @endforeach
                            </div>
                        </div>
                        @foreach ($contents as $section)
                            @if ($section->slug == 'principles-2')
                                {!! $section->description !!}
                            @endif
                        @endforeach
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 d-flex align-items-stretch">
                    <div class="member">
                        <div class="member-img">
                            <div class="member-img">
                                @foreach ($contents as $sectionImg)
                                    @if ($sectionImg->slug == 'principles-3-image')
                                        <img style="" src="{{ asset($sectionImg->image) }}" class="img-fluid"
                                            alt="image">
                                    @endif
                                @endforeach
                            </div>
                        </div>
                        @foreach ($contents as $section)
                            @if ($section->slug == 'principles-3')
                                {!! $section->description !!}
                            @endif
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </section>


    <section id="hero" class="d-flex align-items-center classs34">
        <div class="container classd35" data-aos="zoom-out" data-aos-delay="100" id="approach">
            <div class="row">
                <div class="col-lg-6 pt-4 pt-lg-0 content d-flex flex-column justify-content-center" data-aos="fade-up"
                    data-aos-delay="100">
                    @foreach ($contents as $section)
                        @if ($section->slug == 'approach-1')
                            {!! $section->description !!}
                        @endif
                    @endforeach
                </div>
                <div class="col-lg-6" data-aos="zoom-out">
                    @foreach ($contents as $section)
                        @if ($section->slug == 'approach-2')
                            {!! $section->description !!}
                        @endif
                    @endforeach
                </div>
            </div>
        </div>
    </section>
@endsection