<!DOCTYPE html>
<html lang="en">
<!--<< Header Area >>-->


<head>
    <!-- ========== Meta Tags ========== -->
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="author" content="iamlabib">
    <meta name="description" content="Laxary- Hotel & Resort Booking HTML Template">
    <!-- ======== Page title ============ -->
    <style>
        /* CONTACT BOX LAYOUT */
        .gt-contact-list {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            margin-top: 30px;
            padding: 0;
            list-style: none;
        }

        /* EACH BOX */
        .gt-contact-list li {
            flex: 1 1 32%;
            max-width: 32%;
            background: #fff;
            padding: 30px 20px;
            border-radius: 12px;
            text-align: center;
            transition: 0.3s;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
        }

        /* HOVER EFFECT */
        .gt-contact-list li:hover {
            transform: translateY(-6px);
            box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1);
        }

        /* ICON */
        .gt-contact-list .icon {
            width: 60px;
            height: 60px;
            margin: 0 auto 15px;
            background: #f47c1c20;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .gt-contact-list .icon i {
            font-size: 24px;
            color: #f47c1c;
        }

        /* TEXT */
        .gt-contact-list .content p {
            margin-bottom: 6px;
            font-weight: 600;
            color: #777;
        }

        .gt-contact-list .content h4 {
            font-size: 16px;
            line-height: 1.6;
        }

        .gt-contact-list .content a {
            color: #000;
            text-decoration: none;
        }

        .gt-contact-list .content a:hover {
            color: #f47c1c;
        }

        /* RESPONSIVE */
        @media (max-width: 991px) {
            .gt-contact-list li {
                flex: 1 1 48%;
                max-width: 48%;
            }
        }

        @media (max-width: 576px) {
            .gt-contact-list li {
                flex: 1 1 100%;
                max-width: 100%;
            }
        }



        .contact-title {
            text-align: center;
            margin: 0 auto;
            display: block;
        }

        .contact-title h6,
        .contact-title h2 {
            text-align: center;
            width: 100%;
        }

        /* Optional: center with max width (better design) */
        .contact-title {
            max-width: 600px;
            margin-left: auto;
            margin-right: auto;
        }






        /* TABLET */
        @media (max-width: 991px) {
            .contact-image {
                margin-top: 25px;
            }

            .contactimg {
                height: auto;
                /* prevent stretch */
                max-height: 400px;
                /* control size */
            }
        }

        /* MOBILE */
        @media (max-width: 576px) {
            .contactimg {
                width: 100%;
                height: auto;
                max-height: 280px;
                border-radius: 10px;
            }
        }

        .contactimg {
            border-radius: 8px !important;
        }
    </style>
    <?php include("head.php"); ?>
</head>

<body>

    <?php include("menu.php"); ?>

    <!-- Breadcrumb Section Start -->
    <div class="gt-breadcrumb-wrapper bg-cover" style="background-color:#1F6F4A;">
        <div class="container">
            <div class="gt-page-heading">
                <div class="gt-breadcrumb-sub-title">
                    <h1 class=" text-white wow fadeInUp" data-wow-delay=".3s">Contact Us</h1>
                </div>
                <ul class="gt-breadcrumb-items wow fadeInUp" data-wow-delay=".5s">
                    <li>
                        <a href="index">
                            Home
                        </a>
                    </li>
                    <li>
                        <i class="fa-solid fa-chevron-right"></i>
                    </li>
                    <li>
                        Contact Us
                    </li>
                </ul>
            </div>
        </div>
    </div>

    <!-- GT Contacts Section Start -->
    <section class="gt-contacts-section section-padding fix" style="margin-top: -50px;">
        <div class="container">
            <div class="gt-contact-wrapper">

                <!-- ROW 1 -->
                <div class="row g-4">
                    <div class="col-lg-12">
                        <div class="gt-contact-left-items">

                            <!-- <div class="gt-section-title text-center contact-title">
                                <h6 class="wow fadeInUp" style="display: block !important;">CONTACT US</h6>
                                <h2 class="wow fadeInUp" data-wow-delay=".2s">
                                    Ready to Contact Us
                                </h2>
                            </div> -->

                            <!-- CONTACT BOXES -->
                            <ul class="gt-contact-list">

                                <li>
                                    <div class="icon">
                                        <i class="fa-solid fa-location-dot"></i>
                                    </div>
                                    <div class="content">
                                        <p>Location</p>
                                        <h4>
                                            Godsland Resorts<br>
                                            Near Wayanad, Cherambadi<br>
                                            Tamil Nadu – 643205,<br> India
                                        </h4>
                                    </div>
                                </li>

                                <li>
                                    <div class="icon">
                                        <i class="fa-solid fa-envelope"></i>
                                    </div>
                                    <div class="content">
                                        <p>Email Address</p>
                                        <h4>
                                            <a href="mailto:supportinfo@gmail.com" style="text-transform: lowercase;">supportinfo@gmail.com</a>
                                        </h4>
                                    </div>
                                </li>

                                <li>
                                    <div class="icon">
                                        <i class="fa-solid fa-phone"></i>
                                    </div>
                                    <div class="content">
                                        <p>Phone No</p>
                                        <h4>
                                            <a href="tel:+919605665605">+91 96056 65605</a>
                                        </h4>
                                    </div>
                                </li>

                            </ul>

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

                <!-- ROW 2: FORM + IMAGE -->
                <div class="row g-4 mt-5 align-items-center">

                    <!-- LEFT SIDE: FORM -->
                    <div class="col-lg-6">
                        <div class="gt-contact-right-items">
                            <h2>Send Us Message</h2>
                            <p>Have a question or need assistance? Drop us a message and we’ll be happy to help you plan your perfect stay.</p>

                            <form action="#" id="contact-form" class="contact-form-box">
                                <div class="row g-4">

                                    <div class="col-md-6">
                                        <h4>Your Name</h4>
                                        <div class="form-clt">
                                            <input type="text" name="name" placeholder="Your Name">
                                        </div>
                                    </div>

                                    <div class="col-md-6">
                                        <h4>Your Email</h4>
                                        <div class="form-clt">
                                            <input type="text" name="email" placeholder="Your Email">
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <h4>Your Phone Number</h4>
                                        <div class="form-clt">
                                            <input type="text" name="phone" placeholder="Your phone number">
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <h4>Your Message</h4>
                                        <div class="form-clt">
                                            <textarea name="message" placeholder="Type your message"></textarea>
                                        </div>
                                    </div>

                                    <div class="col-12">
                                        <button type="submit" class="gt-theme-btn">SEND MESSAGE</button>
                                    </div>

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

                    <!-- RIGHT SIDE: IMAGE -->
                    <div class="col-lg-6 col-md-12">
                        <div class="contact-image">
                            <img src="gallery/contactus.jpg" alt="Contact Image" class="contactimg">
                        </div>
                    </div>

                </div>

            </div>
        </div>
    </section>
    <!-- Map Section Start -->
    <div class="googpemap-2" style="margin-bottom: -7px;">
        <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3909.410909648861!2d76.28546927358451!3d11.52235324499531!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3ba61a8dc4d311b5%3A0x879824802097a840!2sGod&#39;s%20Land%20Resorts!5e0!3m2!1sen!2sin!4v1774340691500!5m2!1sen!2sin" width="100%" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
    </div>

    <?php include("footer.php"); ?>
</body>

</html>