@include('website.header')
 <!-- main-area -->
    <main>

        <!--==============================
    Breadcrumb Area
    ==============================-->
        <section class="breadcrumb__area fix" data-background="assets/img/bg/breadcrumb-bg.png">
            <div class="breadcrumb__bg-shape"></div>
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-xl-6">
                        <div class="breadcrumb__content">
                            <h3 class="title">Contact Us</h3>
                        </div>
                    </div>
                    <div class="col-xl-6">
                        <div class="breadcrumb-wrap">
                            <nav class="breadcrumb">
                                <span property="itemListElement" typeof="ListItem">
                                    <a href="/">Home</a>
                                </span>
                                <span class="breadcrumb-separator">/</span>
                                <span property="itemListElement" typeof="ListItem">Contact Us</span>
                            </nav>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- breadcrumb-area-end -->

        <!--==============================
    Contact Area
    ==============================-->
        <section class="contact-page-area overflow-hidden pt-120">
            <div class="container">
                <div class="contact-wrap2 pt-120 pb-120 smoke5-bg text-center">
                    <div class="row justify-content-end">
                        <div class="col-xl-12">
                            <div class="contact-form-wrap2">
                                <div class="section__title mb-30">
                                    <span class="sub-title">Get In Touch</span>
                                    <h2 class="title">Needs Help? Let’s Get in Touch</h2>
                                </div>
                                <form  method="POST" class="contact__form ajax-contact">
                                    <div class="row gy-4">
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <input type="text" class="form-control style-white" name="name" id="name" placeholder="Your Name">
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <input type="text" class="form-control style-white" name="email" id="email" placeholder="Email Address">
                                            </div>
                                        </div>
                                        <div class="col-12">
                                            <div class="form-group">
                                                <select name="subject" id="subject" class="form-select style-white">
                                                    <option value="" disabled selected hidden>Select Service</option>
                                                    <option value="Business">Business</option>
                                                    <option value="Managment">Managment</option>
                                                    <option value="Analysis">Analysis</option>
                                                </select>
                                                <label class="form-icon-right2">
                                                    <svg width="16" height="8" viewBox="0 0 16 8" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                        <path d="M1.125 0.6875C1.21875 0.5625 1.34375 0.5 1.5 0.5C1.59375 0.5 1.71875 0.53125 1.8125 0.625L7.96875 6.28125L14.1562 0.625C14.3438 0.4375 14.6562 0.4375 14.8438 0.65625C15.0312 0.84375 15.0312 1.15625 14.8125 1.34375L8.3125 7.34375C8.125 7.53125 7.84375 7.53125 7.65625 7.34375L1.15625 1.34375C0.9375 1.1875 0.9375 0.875 1.125 0.6875Z" fill="currentColor" />
                                                    </svg>
                                                </label>
                                            </div>
                                        </div>

                                        <div class="col-12">
                                            <div class="form-group">
                                                <textarea name="message" placeholder="Type Your Message" id="contactForm" class="form-control style-white"></textarea>
                                            </div>
                                        </div>
                                    </div>
                                    <button type="button" class="btn mt-30">
                                        <span class="btn-text" data-text="Send Message"></span>
                                    </button>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!--======== / Contact Section ========-->

        <!-- contact-map -->
        <div class="contact-map-area pt-120 pb-120">
            <iframe src=https://maps.google.com/maps?q=LOCATION&z=ZOOM&output=embed&amp;t=&amp;z=14&amp;ie=UTF8&amp;iwloc=B&amp;output=embed" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"><a href="https://www.gps.ie/collections/personal-trackers/">Personal GPS</a></iframe>
            <div class="container">
                <div class="contact-info-wrap">
                    <div class="contact-info-thumb">
                        <img src="{{asset('webassets/img/others/contact-page1-1.jpg')}}" alt="img">
                    </div>
                    <ul class="list-wrap">
                        <li>
                            <div class="contact-info-card">
                                <div class="contact-info-icon">
                                    <i class="fas fa-phone-alt"></i>
                                </div>
                                <div class="media-body">
                                    <p>Call Us 24/7</p>
                                    <h4>{{$phone}}</h4>
                                </div>
                            </div>
                        </li>
                        <li>
                            <div class="contact-info-card">
                                <div class="contact-info-icon">
                                    <i class="fas fa-envelope-open-text"></i>
                                </div>
                                <div class="media-body">
                                    <p>Make a Quote</p>
                                    <h4>{{$email}}</h4>
                                </div>
                            </div>
                        </li>
                        <li>
                            <div class="contact-info-card">
                                <div class="contact-info-icon">
                                    <i class="fas fa-map-marked-alt"></i>
                                </div>
                                <div class="media-body">
                                    <p>Service Station</p>
                                    <h4>{{$address}}</h4>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- contact-map-end -->

    </main>
    <!-- main-area-end -->


      @include('website.footer')