@extends('layouts.front_layout')
@section('content')
@section('title', 'Service')

@section('meta_title', $service->meta_title ?? App\Helpers\Helper::getSetting('default_meta_title'))
@section('meta_description',$service->meta_description ?? App\Helpers\Helper::getSetting('default_meta_description'))
@section('meta_keywords',$service->meta_keyword ?? App\Helpers\Helper::getSetting('default_meta_keywords'))


 <section class="form-12" id="home">
	<div class="form-12-content" style="background: url({{URL::asset($service->bg_image)}}) no-repeat center; background-size: cover; padding: 5rem 0px; background-attachment: fixed;">
		<div class="container">
			<div class="grid grid-column-2 ">
				<div class="column2">
					</div>
				<div class="column1">
					<h3 class="tagline mb-3">Request Quote</h3>
					
						<form action="#" method="Get">
							<div class="">
								<input type="text" name="name" class="form-input" placeholder="Name" />
							</div>
							
							<div class="">
								<input type="tel" name="phone" class="form-input" placeholder="Whatsapp Number" />
							</div>
							<div class="">
								<input type="text" name="email" class="form-input" placeholder="Location" />
							</div>
							
							<div class="">
								<input type="text" name="name" class="form-input" placeholder="Wedding Date" />
							</div>
							
							
							<button type="submit" class="btn" style="background-color: #ffba00;">Submit</button>
						</form>
					</div>
				
			</div>
		</div>
	</div>
</section>

<!-- features-4 block -->
<section class="w3l-index1">
	<div class="calltoaction-20 py-5 editContent">
		<div class="container py-md-3">
			<div class="calltoaction-20-content row mt-5 pt-3">
				<div class="column ccont-left col-lg-4">
					<img src="{{URL::asset($service->image)}}" class="img-responsive" alt="{{$service->title}}">
				</div>
				<div class="column center-align-self col-lg-8 mt-lg-0 mt-4 pl-lg-5 pl-3">
					<h5 class="editContent">{{$service->title}}</h5>
					<p align="justify">{{ $service->short_desc }}</p>
				</div>
				<div class="col-lg-12">
					
					<div align="justify" id="descriptions" style="display: none;">
						{!!$service->descriptions!!}
					</div>
					
					<a class="rd" id="rdMore" href="javascript:void(0);">Read More..</a>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- features-4 block -->


<section class="w3l-features-8" style="background-image:url('img1/service-ban.jpg');">
       <!-- /features -->
           <div class="features py-5" id="services">
			<div class="container py-md-3">
				 <div class="heading text-center mx-auto">
		   <h3 class="head">Our Services</h3>
		   
		 </div>
					
			   <div class="fea-gd-vv text-center row mt-5 pt-3">
				   	
					<div class="float-top col-lg-4 col-md-6">	
							<a href=""><img src="{{URL::asset($service->sub_service_image1)}}" class="img-responsive" alt=""></a>
							<div class="float-lt feature-gd">	
									<h3><a href="#">{{ $service->sub_service_title1 }}</a></h3>
									<!--<p>Wedding is the most important day for a couple, and it is important.</p>-->
									{{--	<a href="#" target="_blank" class="red mt-3">Know More <span class="fa fa-angle-right pl-1"></span></a> --}}
									</div>
					</div>
					<div class="float-top col-lg-4 col-md-6 mt-md-0 mt-5">	
							<a href="#"><img src="{{URL::asset($service->sub_service_image2)}}"class="img-responsive" alt=""></a>
							<div class="float-lt feature-gd">	
									<h3><a href="">{{ $service->sub_service_title2 }}</a> </h3>
									<!--<p>Wedding is the most important day for a couple, and it is important.</p>-->
								{{--	<a href="#" target="_blank" class="red mt-3">Know More <span class="fa fa-angle-right pl-1"></span></a> --}}
									</div>
						</div>
						<div class="float-top col-lg-4 col-md-6 mt-lg-0 mt-5">	
								<a href="">
								    <img src="{{URL::asset($service->sub_service_image3)}}" class="img-responsive" alt=""></a>
								<div class="float-lt feature-gd">	
								    <h3><a href="">{{ $service->sub_service_title3 }}</a></h3>
									<!--<p>Wedding is the most important day for a couple, and it is important.</p>-->
									{{--<a href="#" target="_blank" class="red mt-3">Know More <span class="fa fa-angle-right pl-1"></span></a>--}}
									</div>
						</div>
						
					
												 				 
		     	</div>  
		    </div>
          </div>
      <!-- //features -->
</section>

<div class="products-4" id="portfolio">
    <!-- Products4 block -->
    <div id="products4-block" class="text-center">
        <div class="container-fluid">
            <div class="heading text-center mx-auto">
                <h3 class="head">Portfolio</h3>
                
              </div>
            <input id="tab1" type="radio" name="tabs" checked>
            <label class="tabtle" for="tab1">All</label>

            <input id="tab2" type="radio" name="tabs">
            <label class="tabtle" for="tab2">Air Freight</label>

            <input id="tab3" type="radio" name="tabs">
            <label class="tabtle" for="tab3">Cargo Service</label>

            <input id="tab4" type="radio" name="tabs">
            <label class="tabtle" for="tab4">Goods</label>

            <section id="content1" class="tab-content text-left">
                <div class="d-grid grid-col-3">
				
				
				
				@foreach($service->gallery as $gallery_img)
				      <div class="product">
                        <a href="{{URL::asset($gallery_img->image_path)}}" data-lightbox="example-set"
                            data-title="{{$service->title}}">
                            <figure>
                                <img src="{{URL::asset($gallery_img->image_path)}}" class="img-responsive" alt="Saraswat Film" />
                            </figure>
                        </a>
                    </div>
                    @endforeach
  
					
					
                </div>
            </section>

      
        </div>
    </div>
    <!-- Products4 block -->
</div>




  


<!-- contact -->
<section class="w3l-contacts-12" id="contact">
    <div class="contact-top pt-5">
        <div class="container py-md-3">
            <div class="heading text-center mx-auto">
                <h3 class="head">Contact us</h3>
               
              </div>
            <div class="row cont-main-top mt-5 pt-3">
               
                <!-- contact address -->
               
                <!-- //contact address -->
                 <!-- contact form -->
                 <div class="contacts12-main col-lg-7 pr-lg-5 pr-3">
                   
                   <!-- map -->
       
             <form action="" method="post" class="main-input">
                        <div class="top-inputs">
                            <input type="text" placeholder="Name" name="w3lName" id="w3lName" required="">
                            
                        </div>
                        <div class="top-inputs">
                           
                            <input type="email" name="email" placeholder="Email" id="w3lSender" required="">
                        </div>
                        <input type="text" placeholder="Phone Number" name="w3lName" id="w3lName" required="">
                        <textarea placeholder="Message" name="w3lMessage" id="w3lMessage" required=""></textarea>
                        <div class="text-right">
                            <button type="submit" class="btn btn-theme2" style="background-color: #ffba00;">Submit Now</button>
                        </div>
                    </form>
      
                </div>
                <!-- //contact form -->
                <div class="contact col-lg-5 mt-lg-0 mt-5">
                    <div class="cont-subs">
                        <h5>Need Help? Contact Us</h5>
                        {{---<p class="mt-3">Available to our business customers 24 hours a day.</p> --}}
                        <div class="cont-add mt-4">
                            <div class="cont-add-lft">
                                <span class="fa fa-map-marker" aria-hidden="true"></span>
                           </div>
                           <div class="cont-add-rgt">
                           <h4>Our Location:</h4>
                            <p class="contact-text-sub">Saraswat Film & Entertainment, Surya Enclave, D-504, UPSIDC Site C, Housing, Greater Noida, Tilpata Karanwas, Uttar Pradesh 201306</p>
                        </div>
                    </div>
				
					<div class="cont-add my-4">
                            <div class="cont-add-lft">
                                 <span class="fa fa-phone" aria-hidden="true"></span>
                            </div>
                            <div class="cont-add-rgt">
                                 <h4>24/7 Support:</h4>
                                 <a href="tel:+91 98107 57062">
                                     <p class="contact-text-sub">+91 98107 57062</p>
                                 </a>
                            </div>
                        </div>
                        	<div class="cont-add my-4">
                            <div class="cont-add-lft">
                                 <span class="fa fa-envelope" aria-hidden="true"></span>
                            </div>
                            <div class="cont-add-rgt">
                                     <h4>Email:</h4>
                                 <a href="#">
                                 <p class="contact-text-sub">saraswatfilm@gmail.com</p>
                                 </a>
                            </div>
                        </div>
                        
                       
                    </div>
                </div>
            </div>
        </div>
     <!-- map -->
        <div class="map">
              <iframe
                                src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d112104.47859912316!2d77.3738564!3d28.5918272!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x390ceb22545ceb67%3A0xfe3932f918ffdbda!2sSaraswat%20Film%20%26%20Entertainment!5e0!3m2!1sen!2sin!4v1726682209236!5m2!1sen!2sin"
                                width="100%" height="450" style="border:0;" allowfullscreen="" loading="lazy"
                                referrerpolicy="no-referrer-when-downgrade"></iframe></div>
        <!-- //map -->
    </div>
</section>
<!-- //contact -->

  



    </div>
    
    
    <script>
$(document).ready(function () {
	$('#rdMore').click(function () {
		$('#descriptions').toggle();
		// Optionally, toggle the text between "Read More.." and "Read Less.."
		let text = $(this).text() === 'Read More..' ? 'Read Less..' : 'Read More..';
		$(this).text(text);
	});
});
</script>

@stop