<x-main.header />
<section class="opposite" style="background-image: url({{ asset('storage/images/'.$banner->banner_image)}});">
    <div class="container">
        <div class="row">
            <div class="col-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 col-xxl-6 pe-xl-6">
                <div class="about About-2">
                    <h2>{{$banner->banner_heading}}</h2>
                    <div class="moral">
                        <a class="wave" href="/">HOME</a>
                        <span class="leay"><i class="fas fa-arrows-alt-h"></i></span>
                        <a class="bcc" href="custom">{{$banner->banner_heading}}</a>
                    </div>

                </div>
            </div>
            <div class="col-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 col-xxl-6 pe-xl-6">

            </div>
        </div>
    </div>



</section>
<section class="intel">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 col-xxl-6 pe-xl-6">
                <div class="STRATEGIES">
                    <h2>{{$sec_1->cms_heading}}</h2>
                    {!! $sec_1->cms_description !!}
                </div>
                <a class="book" style="color:black;" href="contact_us">
                    Submit RFP
                    <i class="fa-solid fa-chevron-right"></i>
                </a>
                <a href="https://calendly.com/daniellenicoleroy/30min" class="book-1">
                    Strategy Session
                    <i class="fa-solid fa-chevron-right"></i>
                </a>
            </div>

            <div class="col-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 col-xxl-6 pe-xl-6">
                <div class="balic">
                    <img src="{{ asset('storage/images/'.$sec_1->cms_image)}}" class="img-fluid" alt="img">
                </div>

            </div>
        </div>
    </div>




</section>
<section class="customs">
    <div class="dots">
        <h2 style="margin-bottom:10px;" data-aos="fade-down" data-aos-duration="1200" data-aos-delay="300"
            data-aos-offset="0">
            {{$sec_2->cms_heading}}</h2>
        <div class="container">
            <div class="row gy-3">
                @foreach($services as $key => $service)
                    <div class="col-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 col-xxl-6">
                        <div class="cards-silder" data-aos="fade-up" data-aos-duration="1200" data-aos-delay="300"
                            data-aos-offset="0">
                            <div class="silder-images">
                                <img src="{{ asset('storage/images/'.$service->service_image) }}" class="img-fluid" alt="img">
                            </div>
                            <div class="center-img">
                                <img src="{{ asset('storage/images/'.$service->service_icon_image) }}" class="img-fluid" alt="img">
                            </div>
                         
                            <div class="medison">
                                <h3>{{ $service->service_heading }}</h3>
                                <div class="madison-txt-wrap" data-txt="{!! $service->service_long_description !!}">
                                    {!! $service->service_short_description !!}
                                    <a class="service-read-more" href="javascript:;">Read more</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    @endforeach


            </div>

        </div>
    </div>
</section>
<section class="glasses">
    <div class="container">
        <div class="row">
            <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 col-xxl-12">

                <div class="work">

                    <h2>{{$sec_3->cms_heading}}</h2>
                    {!! $sec_3->cms_description !!}
                </div>


            </div>
        </div>
        <div class="row ">
            <div class="col-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 col-xxl-6">
                <div class="master">
                    {!! $sec_4->cms_description !!}

                    <a class="book-8" href="contact_us">Let’s Get Started
                        <i class="fa-solid fa-chevron-right"></i>
                    </a>
                    <p style="font-style:italic; padding-bottom:20px; font-size:18px; font-weight: 600;">{{$sec_4->cms_sub_heading}}</p>
                </div>
            </div>

            <div class="col-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 col-xxl-6">
                <div class="motar">
                    <h6>{{$sec_5->cms_heading}}</h6>
                    <img src="{{ asset('storage/images/'.$sec_5->cms_image)}}" class="img-fluid" alt="img">

                </div>


            </div>
        </div>
    </div>
</section>
<section class="leader">

    <div class="container">
        <div class="row align-items-center">
            <div class="col-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 col-xxl-6">
                <div class="sitting" style="margin-top:40px;">
                    <h2>{{$sec_6->cms_heading}}</h2>
                    <h5>{{$sec_6->cms_sub_heading}}</h5>
                    {!! $sec_6->cms_description !!}
                </div>
            </div>
            <div class="col-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 col-xxl-6">
                <div class="barnch">
                    <img src="{{ asset('storage/images/'.$sec_6->cms_image)}}" class="img-fluid" alt="img">
                </div>
            </div>
            <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 col-xxl-12">
                <div class="sitting">
                    {!! $sec_7->cms_description !!}
                </div>
                <a class="book" style="margin-bottom:40px; color:#000;"href="contact_us">Learn More
                    <i class="fa-solid fa-chevron-right"></i>
                </a>

            </div>
        </div>
    </div>

</section>

<x-main.footer />