@extends('front.layout')

@section('title')
{{$model->MetaTitle}}
@endsection
@section('description')
{{$model->MetaDescription}}
@endsection

@include('front/common/meta')

@section('content')

@if(!empty($model))

<section class="page-banner bg-overlay" style="background-image: url({{asset(Config("params.media_path.large").$model->bannerImage)}});">
    <div class="page-inner-box col-lg-7 col-md-9 text-center text-white">
        <h1>{{$model->Title}}</h1>
        <h3 class="text-uppercase"><?php echo $model->short_description; ?></h3>
        <p class="mt-lg-5 mt-3 banner-logos">
            <a href="#">
                <img src="{{ asset('/front/images/trustpilot-reviews-logo.png') }}" class="trustpilot-logo img-fluid mr-2" alt="">
            </a>
            <a href="#">
                <img src="{{ asset('/front/images/Gas-Safe-Logo.png') }}" class="img-fluid safe-logo ml-2" alt="Gas Safe Registered">
            </a>
        </p>

    </div>
</section>
<section class="py-lg-5 py-3 mb-lg-0 mb-4">
    <div class="container">
        <div class="row">
            <div class="col-lg-6">
                <?php echo $model->Content; ?>
            </div>
            <div class="col-lg-6 align-self-center">
                <img src="{{asset(Config("params.media_path.large").$model->HeaderImageName)}}" class="img-fluid" alt="{{$model->imageDetail->altText}}">
            </div>
        </div>
    </div>
</section>
@endif
<section class="py-lg-5 py-3">
    <div class="container">
        <div class="row justify-content-center">
            @foreach($products as $product)

            <div class="col-lg-12 text-white mb-4  px-3 py-4 bg-overlay" style="background-image: url({{asset(Config("params.media_path.large").$product->ImageName)}});">
                <?php echo $product->Content; ?>
            </div>

            @endforeach

        </div>

        <div class="row">
            <div class="col-md-12 pt-3 text-center">
                <a href="{{url('get_covered')}}" class="btn btn-lg btn-secondary mr-md-3 mb-md-0 mb-3">Get Covered</a>
                <a href="{{url('contact-us')}}" class="btn btn-lg btn-primary">Request A Call Back</a>
            </div>
        </div>
    </div>
</section>

@include('front/common/google_reviews')
@if(!empty($sec3) )
<section class="how-it-work py-lg-5 bg-overlay text-white py-3" style="background-image: url({{asset(Config("params.media_path.large").$sec3->ImageName)}});">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-lg-10 text-center">
                <h3 class="h1 mb-lg-4">{{$sec3->Title}}</h3>
            </div>
        </div>
        <div class="row">
            <?php echo $sec3->Content; ?>
        </div>
    </div>
</section>
@endif

@if(!empty($sec6) )
<section class="py-lg-5 py-3">
    <div class="container">
        <div class="row">
            <div class="col-md-12 text-center">
                <h2 class="h1 text-primary">{{$sec6->Title}}</h2>
                <?php echo $sec6->Content; ?>
<!--                <img src="{{ asset('/front/images/trustpilot-scroller.jpg') }}" class="img-fluid mt-4" alt="">-->
            </div>
        </div>
    </div>
</section>
@endif
@if(!empty($model))
<section class="faq-section bg-overlay text-white py-3 py-lg-5 mt-0" style="background-image: url({{ asset('/front/images/faq-bg.jpg') }});">
    <div class="container pt-lg-5 position-relative z-index11">
        <div class="accordion wow fadeInUp faq-accordion" id="faqAccordion">
            <div class="row py-5 align-items-center">
                <div class="col-md-6">
                    <h3 class="h2 ff-sinkin-sans text-uppercase mb-lg-4"><?php echo $model->faqTitle; ?></h3>
                    <p><?php echo $model->faqText; ?></p>

                </div>
                <div class="col-md-6">
                    <div class="row">
                        @if (count($faqs) > 0)
                        @foreach($faqs as $faq)
                        <div class="col-md-12">
                            <div class="faq-header bg-primary text-white border-0 p-2">
                                <h4 class="mb-0 collapsed" data-toggle="collapse" data-target="#collapse{{$faq->id}}" aria-expanded="false" aria-controls="collapse{{$faq->id}}">{{$faq->title}}</h4>
                            </div>
                            <div id="collapse{{$faq->id}}" class="collapse faq-body" data-parent="#faqAccordion">
                                <?php echo $faq->description ?>
                            </div>
                        </div>
                        @endforeach
                        @endif

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</section>
@endif
@endsection