@extends('web.layouts.layout')
@section('content')







     <!-- start home banner area -->
     <div id="home" class="home-banner-area home-banner-two"  style='background: url("{!! asset($settings[63]) !!}") no-repeat center; background-size: cover;'>
        <div class="container">
            <div class="row align-items-center">
                <div class="col-lg-10 m-auto">
                    <div class="banner-content">
                        <h1>
                            {!! $settings[85] !!}                      
                          </h1>
                        <div class="btn-group">
                            <a href="{{ route('dpage', ['lang' => 'en', 'page' => 'projects']) }}" class="primary-btn">Projects</a>
                            <a href="{!! $settings[129] !!}" class="youtube-popup video-btn">
                                <i class='bx bx-right-arrow'></i>
                            </a>

                          

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- end home banner area -->
    
    <!-- start promo section -->
    <section class="promo-section">
        <div class="container">
            <div class="row">
                <div class="col-lg-4 col-md-6 col-sm-6">
                    <div class="item-single mb-30">
                        <img src="{!! asset($settings[133]) !!}"/>
                        {{-- <i class='flaticon flaticon-'></i> --}}
                        <h3><a href="area-coverage.html">{!! $settings[86] !!}</a></h3> 
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 col-sm-6">
                    <div class="item-single mb-30">
                        <img src="{!! asset($settings[132]) !!}"/>
                        <h3><a href="appointment.html">{!! $settings[87] !!}</a></h3>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 col-sm-6 m-auto">
                    <div class="item-single mb-30">
                        <img src="{!! asset($settings[134]) !!}"/>
                        <h3><a href="emergency.html">{!! $settings[88] !!}</a></h3>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- end promo section -->

    <!-- start about section -->
    <section id="about" class="about-section-two pb-70">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-lg-6">
                    <div class="about-image mb-30">
                        <img src="{!! asset($settings[66]) !!}" alt="Demo Image">
                        <div class="overlay-img">
                            <img src="{!! asset($settings[65]) !!}" alt="Demo Image" class="img1">
                            <img src="{!! asset($settings[64]) !!}" alt="Demo Image" class="img2">
                        </div>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="about-content mb-30">
                        <h2>
                            About Us
                        </h2>
                      
                        <p> {!! $settings[67] !!} </p>

                        <div class="content-list">
                            <i class='bx bx-category-alt' ></i>
                            <h6>{!! $settings[70] !!}</h6>
                        </div>
                        <div class="content-list">
                            <i class='bx bx-category-alt' ></i>
                            <h6>{!! $settings[71] !!}</h6>
                        </div>
                        <div class="content-list">
                            <i class='bx bx-category-alt'></i>
                            <h6>{!! $settings[72] !!}</h6>
                        </div>
                        <div class="content-list">
                            <i class='bx bx-category-alt' ></i>
                            <h6>{!! $settings[73] !!}</h6>
                        </div>
                        <div class="content-list">
                            <i class='bx bx-category-alt'></i>
                            <h6>{!! $settings[74] !!}</h6>
                        </div>
                        <blockquote class="blockquote">
                            <p><q>{!! $settings[75] !!}</q> </p>
                        </blockquote>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- end about section -->


    <!-- start service section -->
    <section class="service-section-two pb-70">
        <div class="container">
            <div class="row no-wrap align-items-center">
                <div class="col-lg-4 col-md-12">
                    <div class="content mb-30">
                        <h2>
                            {!! $settings[76] !!} 
                        </h2>
                 
                        <p>
                            {!! $settings[77] !!} 
                         </p>
                        <a href="{{ route('dpage', ['lang' => 'en', 'page' => 'services']) }}" class="primary-btn">{!! $settings[78] !!}</a>
                        <div id="serviceSlider" class="custom-owl-nav"></div>
                    </div>
                </div>
                <div class="col col-md-12">
                    <div class="services-slider-two owl-carousel">
                        @foreach($services as $service)

                        <div class="item-single mb-30">
                            <div class="image">
                                <a href="services-details.html"><img src="{{asset($service->image_lang)}}"  style="height: 300px; object-fit: cover;" alt="Demo Image"></a>
                            </div>
                            <div class="content">
                                <h3><a href="services-details.html">  {{$service->title_lang}}</a></h3>
                                <p>  {{$service->describtion_lang}}</p>
                                <div class="cta-btn">
                                    <a href="services-details.html" class="btn-text">Read More</a>
                                </div>
                            </div>
                            <div class="spacer"></div>
                        </div>
                        @endforeach
                 
                   
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- end service section -->
    

    <!-- start projects section -->
    <section id="projects" class="projects-section-two pb-70">
        <div class="container">
            <div class="row align-items-center justify-content-center">

                @foreach($projects->take(2) as $project)

                <div class="col-lg-4 col-md-6">
                    <div class="item-single mb-30">
                        <div class="image">
                            <a href="projects-details.html"><img src="{{asset($project->image_lang)}}" style="height: 300px" alt="Demo Image"></a>
                        </div>
                        <div class="content">
                            {{-- <h3><a href="projects-details.html">{{$project_describtion_lang}}</a></h3> --}}
                            <span>{{$project->type_lang}}</span>
                        </div>
                    </div>
                </div>

                @endforeach


                <div class="col-lg-4 col-md-12">
                    <div class="content mb-30">
                        <h2>
                            {!! $settings[79] !!}
                        </h2>
                   
                        <p>
                            {!! $settings[80] !!}
                        </p>
                        <a href="{{ route('dpage', ['lang' => 'en', 'page' => 'services']) }}" class="primary-btn">{!! $settings[81] !!}</a>
                    </div>
                </div>
                @foreach($projects->skip(2) as $project)

                <div class="col-lg-4 col-md-6">
                    <div class="item-single mb-30">
                        <div class="image">
                            <a href="projects-details.html"><img src="{{asset($project->image_lang)}}" style="height: 300px" alt="Demo Image"></a>
                        </div>
                        <div class="content">
                            {{-- <h3><a href="projects-details.html">{{$project_describtion_lang}}</a></h3> --}}
                            <span>{{$project->type_lang}}</span>
                        </div>
                    </div>
                </div>

                @endforeach
               
          
            </div>
        </div>
    </section>
    <!-- end projects section -->




    <!-- start promo service section -->
    <section class="promo-service-section-two ptb-70">
        <div class="container">

            <div class="top-content-two">
                <h2>{!! $settings[82] !!}</h2>
               
                {{-- <div id="teamSlider" class="custom-owl-nav"></div> --}}
            </div>
            <p style="font-size: 28; margin-bottom: 40px;">{!! $settings[83] !!}</p>
            

            <div class="row justify-content-center">



                @foreach($safety as $s)

                <div class="col-lg-3 col-md-6">
                    <div class="item-single mb-30" style="height: 700px">
                        {{-- <i class='flaticon flaticon-oil-pumps'></i> --}}
                        <h3><a href="services-details.html">{{$s->title_lang}}</a></h3>
                        <p>{{$s->describtion_lang}}</p>
                        <div class="cta-btn">
                            {{-- <a href="services-details.html" class="btn-text">Read More</a> --}}
                        </div>  
                    </div>
                </div>

                @endforeach


          
         
            </div>
        </div>
    </section>
    <!-- end promo service section -->

    {{-- <p style="font-size: 28; margin-bottom: 40px;">{!! $settings[83] !!}</p> --}}


 
    <div class="container">
        
    <div class="top-content-two">
        <h2>{!! $settings[127] !!}</h2>
       
        {{-- <div id="teamSlider" class="custom-owl-nav"></div> --}}
    </div>
    <div class="customer-logos" style="margin-bottom: 100px ;padding:20px">
        @foreach($clients as $client)

        <div class="slide"><img src="{{asset($client->image_lang)}} " style="width: 100% ;height: 100px;object-fit:cover"></div>
        @endforeach
      </div>
    </div>









    <!-- start testimonials section -->
    {{-- <section id="testimonials" class="testimonials-section-two pb-70">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-lg-6 col-md-12">
                    <div class="image mb-30">
                        <img src="assets/img/testimonial.jpg" alt="Demo Image">
                    </div>
                </div>
                <div class="col-lg-6 col-md-12">
                    <div class="content">
                        <h2>
                            Testimonials
                        </h2>
                        <h5>
                            What're Our Clients Say About Us
                        </h5>
                        <div class="quote">
                            <i class='bx bxs-quote-right'></i>
                        </div>
                    </div>
                    <div class="testimonial-slider-two owl-carousel mb-30">
                        <div class="slider-item">
                            <div class="content">
                                <p>
                                   <q>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal</q>
                                </p>
                                <div class="client">
                                    <div class="client-img">
                                        <img src="assets/img/client/client2.jpg" alt="client-1" />
                                    </div>
                                    <div class="client-info">
                                        <h5>Jordan Alin</h5>
                                        <div class="review">
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                        </div> 
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="slider-item">
                            <div class="content">
                                <p>
                                   <q>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC making it over 2000 years old. Richard McClintock, a Latin</q>
                                </p>
                                <div class="client">
                                    <div class="client-img">
                                        <img src="assets/img/client/client1.jpg" alt="client-1" />
                                    </div>
                                    <div class="client-info">
                                        <h5>Edward Howells</h5>
                                        <div class="review">
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                        </div> 
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="slider-item">
                            <div class="content">
                                <p>
                                   <q>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomized words which don't look even slightly</q>
                                </p>
                                <div class="client">
                                    <div class="client-img">
                                        <img src="assets/img/client/client3.jpg" alt="client-1" />
                                    </div>
                                    <div class="client-info">
                                        <h5>David Lee</h5>
                                        <div class="review">
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                        </div> 
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="slider-item">
                            <div class="content">
                                <p>
                                   <q>Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still have 'lorem ipsum'</q>
                                </p>
                                <div class="client">
                                    <div class="client-img">
                                        <img src="assets/img/client/client4.jpg" alt="client-1" />
                                    </div>
                                    <div class="client-info">
                                        <h5>John Doe</h5>
                                        <div class="review">
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                            <i class='bx bxs-star'></i>
                                        </div> 
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section> --}}
    <!-- end testimonials section -->

    <!-- start team section -->
    {{-- <section id="team" class="team-section-two pb-70">
        <div class="container">
            <div class="top-content-two">
                <h2>Team</h2>
                <div id="teamSlider" class="custom-owl-nav"></div>
            </div>
            <div class="team-slider owl-carousel">
                <div class="item-single mb-30">
                    <div class="image">
                        <a href="#"><img src="assets/img/team/team4.jpg" alt="Demo Image"></a>
                    </div>
                    <div class="content">
                        <h3><a href="team.html">Logan Hunter</a></h3>
                        <span>Mechanical Engineer</span>
                        <div class="social-link">
                            <a href="#" target="_blank"><i class='bx bxl-facebook'></i></a>
                            <a href="#" target="_blank"><i class='bx bxl-twitter'></i></a>
                            <a href="#" target="_blank"><i class='bx bxl-linkedin' ></i></a>
                            <a href="#" target="_blank"><i class='bx bxl-instagram' ></i></a>
                        </div>
                    </div>
                </div>
                <div class="item-single mb-30">
                    <div class="image">
                        <a href="#"><img src="assets/img/team/team5.jpg" alt="Demo Image"></a>
                    </div>
                    <div class="content">
                        <h3><a href="team.html">Mich Thomson</a></h3>
                        <span>Site Contractor</span>
                        <div class="social-link">
                            <a href="#" target="_blank"><i class='bx bxl-facebook'></i></a>
                            <a href="#" target="_blank"><i class='bx bxl-twitter'></i></a>
                            <a href="#" target="_blank"><i class='bx bxl-linkedin' ></i></a>
                            <a href="#" target="_blank"><i class='bx bxl-instagram' ></i></a>
                        </div>
                    </div>
                </div>
                <div class="item-single mb-30">
                    <div class="image">
                        <a href="#"><img src="assets/img/team/team6.jpg" alt="Demo Image"></a>
                    </div>
                    <div class="content">
                        <h3><a href="team.html">Christina Freeman </a></h3>
                        <span>Chemical Engineer</span>
                        <div class="social-link">
                            <a href="#" target="_blank"><i class='bx bxl-facebook'></i></a>
                            <a href="#" target="_blank"><i class='bx bxl-twitter'></i></a>
                            <a href="#" target="_blank"><i class='bx bxl-linkedin' ></i></a>
                            <a href="#" target="_blank"><i class='bx bxl-instagram' ></i></a>
                        </div>
                    </div>
                </div><div class="item-single mb-30">
                    <div class="image">
                        <a href="#"><img src="assets/img/team/team7.jpg" alt="Demo Image"></a>
                    </div>
                    <div class="content">
                        <h3><a href="team.html">Thomas Baldwin</a></h3>
                        <span>Mechanical Engineer</span>
                        <div class="social-link">
                            <a href="#" target="_blank"><i class='bx bxl-facebook'></i></a>
                            <a href="#" target="_blank"><i class='bx bxl-twitter'></i></a>
                            <a href="#" target="_blank"><i class='bx bxl-linkedin' ></i></a>
                            <a href="#" target="_blank"><i class='bx bxl-instagram' ></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section> --}}
    <!-- end team section -->
    
    <!-- start quote section -->
    {{-- <section id="quote" class="quote-section pt-100 pb-70">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-lg-5">
                    <div class="content mb-30">
                        <h2>
                            Get A Quote
                        </h2>
                        <h5>
                            Get In Touch Now
                        </h5>
                        <p>
                            It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less distribution.
                        </p>
                        <ul class="info-list">
                            <li><i class='bx bxs-map'></i><a href="#">6890 Blvd, The Bronx, USA</a></li>
                            <li><i class='bx bx-phone'></i><a href="tel:+44-45789-5789">(+44) - 45789 - 5789</a></li>
                            <li><i class='bx bx-envelope'></i><a href="mailto:support@facty.com">support@facty.com</a></li>
                        </ul>
                    </div>
                </div>
                <div class="col-lg-7 mb-30">
                    <form id="contactForm">
                        <div class="row">
                            <div class="col-lg-6 col-md-6">
                                <div class="form-group">
                                    <input type="text" name="name" class="form-control" id="name" required="" data-error="Enter your name" placeholder="Your Name" />
                                    <div class="help-block with-errors"></div>
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6">
                                <div class="form-group">
                                    <input type="email" name="email" class="form-control" id="email" required="" data-error="Enter your email" placeholder="Email Address" />
                                    <div class="help-block with-errors"></div>
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6">
                                <div class="form-group">
                                    <input type="text" name="phone_number" class="form-control" id="phone_number" required="" data-error="Enter your number" placeholder="Phone Number" />
                                    <div class="help-block with-errors"></div>
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6">
                                <div class="form-group">
                                    <input type="text" name="msg_subject" class="form-control" id="msg_subject" required="" data-error="Enter your subject" placeholder="Subject" />
                                    <div class="help-block with-errors"></div>
                                </div>
                            </div>
                            <div class="col-lg-12 col-md-12">
                                <div class="form-group">
                                    <textarea name="message" id="message" class="form-control" cols="30" rows="8" required="" data-error="Please enter your message" placeholder="Your Message..."></textarea>
                                    <div class="help-block with-errors"></div>
                                </div>
                            </div>
                            <div class="col-lg-12 col-md-12">
                                <button type="submit" class="primary-btn">submit</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </section> --}}
    <!-- end quote section -->

    <!-- start blog section -->
    {{-- <section id="blog" class="blog-section-two pt-100">
        <div class="container">
            <div class="top-content-two">
                <h2>Blog</h2>
            </div>
            <div class="row justify-content-center">
                <div class="col-lg-4 col-md-6">
                    <div class="item-single mb-30">
                        <div class="image">
                            <a href="blog-details.html"><img src="assets/img/blog/blog4.jpg" alt="Demo Image"/></a>
                        </div>
                        <div class="content">
                            <ul class="info-list">
                                <li><i class='bx bx-user'></i>By Dylan Graham</li>
                                <li><i class='bx bx-calendar-alt'></i>03 Oct, 2020</li>
                            </ul>
                            <h3>
                                <a href="blog-details.html">Industrial Evolution</a>
                            </h3>
                            <p>It is a long established fact that a reader will be distracted by the readable content.</p>
                            <hr>
                            <div class="cta-btn">
                                <a href="blog-details.html" class="btn-text">Read More</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6">
                    <div class="item-single mb-30">
                        <div class="image">
                            <a href="blog-details.html"><img src="assets/img/blog/blog5.jpg" alt="Demo Image"/></a>
                        </div>
                        <div class="content">
                            <ul class="info-list">
                                <li><i class='bx bx-user'></i>By J. Robinson</li>
                                <li><i class='bx bx-calendar-alt'></i>09 Nov, 2020</li>
                            </ul>
                            <h3>
                                <a href="blog-details.html">Smart Factory Solutions</a>
                            </h3>
                            <p>It is a long established fact that a reader will be distracted by the readable content.</p>
                            <hr>
                            <div class="cta-btn">
                                <a href="blog-details.html" class="btn-text">Read More</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6">
                    <div class="item-single mb-30">
                        <div class="image">
                            <a href="blog-details.html"><img src="assets/img/blog/blog6.jpg" alt="Demo Image"/></a>
                        </div>
                        <div class="content">
                            <ul class="info-list">
                                <li><i class='bx bx-user'></i>By Mark McLaren</li>
                                <li><i class='bx bx-calendar-alt'></i>13 Oct, 2020</li>
                            </ul>
                            <h3>
                                <a href="blog-details.html">Future of Manufacturing</a>
                            </h3>
                            <p>It is a long established fact that a reader will be distracted by the readable content.</p>
                            <hr>
                            <div class="cta-btn">
                                <a href="blog-details.html" class="btn-text">Read More</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section> --}}
    <!-- end blog section -->

    <!-- start newsletter area -->
    <div class="newsletter-area">
        <div class="container">
            <div class="wrapper">
                <div class="row">
                    <div class="col-md-6">
                        <div class="info-item">
                            <i class='flaticon flaticon-telephone'></i>
                            <div class="info-content">
                                <span>Call Us Now</span>
                                <h3><a href="tel:+44-45789-5789"> {!! $settings[12] !!}</a></h3>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <form class="newsletter-form">
                            <div class="input-group">
                                <input class="form-control" placeholder="E-mail" type="text" name="EMAIL" required=""
                                autocomplete="off">
                                <button class="primary-btn" type="submit">
                                    Subscribe
                                </button>
                            </div>
                            <div id="validator-newsletter" class="form-result"></div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- end newsletter area -->




@endsection