/* =====================================================
   CONTACT PAGE
   NEW CSS ONLY
===================================================== */


/* =========================================
   CONTACT HERO
========================================= */
a{text-decoration: none !important;}
.contact-page {
    background: #f7f7f4;
}

.contact-hero {
    padding: 105px 0 45px;
    background: #f7f7f4;
}

.contact-intro {
    padding: 35px 0 15px;
}

.contact-eyebrow {
    display: inline-block;
    font-family: "Manrope", sans-serif;
    background: #d7f2e6;
    color: #075c38;

    border-radius: 20px;

    padding: 6px 12px;

    font-size: 18px;
    letter-spacing: 1px;
    text-transform: uppercase;

    margin-bottom: 15px;
}
.contact-number-row a{
    color: #004e2e;
}
.contact-intro h1 {
    font-size: 44px;
    line-height: 1.02;
    color: #075c38;

    max-width: 620px;

    margin-bottom: 12px;
}

.contact-intro p {
    max-width: 630px;

    color: #68756e;

    font-size: 11px;
    line-height: 1.65;
}


/* =========================================
   CONTACT FORM
========================================= */

.contact-form-card {
    background: #ffffff;

    border-radius: 10px;

    padding: 22px;

    box-shadow: 0 8px 25px rgba(0, 0, 0, .07);

    margin-top: 5px;
}

.contact-form-card label {
    display: block;
     font-family: "Manrope", sans-serif;
    font-size: 18px;
    color: #4c5c54;

    margin-bottom: 6px;
}

.contact-input-wrap {
    height: 40px;

    background: #f4f5f2;

    border-radius: 7px;

    display: flex;
    align-items: center;

    padding: 0 11px;

    color: #8c9891;
}

.contact-input-wrap span {
    font-size: 11px;

    margin-right: 8px;

    color: #718078;
}

.contact-input-wrap input,
.contact-input-wrap select {
    width: 100%;

    border: none;
    outline: none;

    background: transparent;

    font-family: "Manrope", sans-serif;

    font-size: 12px;

    color: #536158;
}

.contact-input-wrap input::placeholder {
    color: #a4ada7;
}

.contact-input-wrap select {
    cursor: pointer;
}

.contact-form-card textarea {
    width: 100%;

    height: 78px;

    resize: none;

    border: none;
    outline: none;

    border-radius: 7px;

    background: #f4f5f2;

    padding: 12px;

    font-family: "Manrope", sans-serif;

    font-size: 12px;

    color: #536158;
}

.contact-form-card textarea::placeholder {
    color: #a4ada7;
}


/* =========================================
   WHATSAPP CHECKBOX
========================================= */

.whatsapp-option {
    display: flex !important;

    align-items: flex-start;

    gap: 8px;

    padding: 9px;

    background: #f0f8f4;

    border-radius: 7px;

    cursor: pointer;
}

.whatsapp-option input {
    margin-top: 2px;

    accent-color: #075c38;
}

.whatsapp-option span {
    display: flex;

    flex-direction: column;

    gap: 3px;
}

.whatsapp-option strong {
    font-size: 18px;

    color: #075c38;
}

.whatsapp-option small {
    font-size: 16px;

    font-weight: 400;

    color: #7c8881;
}


/* =========================================
   SUBMIT BUTTON
========================================= */

.contact-submit-btn {
    width: 100%;

    height: 42px;

    border: none;

    border-radius: 7px;

    background: #006039;

    color: white;

     font-family: "Manrope", sans-serif;

    font-size: 14px;

    cursor: pointer;

    transition: .2s ease;
}

.contact-submit-btn:hover {
    background: #004e2e;
}


/* =========================================
   FORM NOTE
========================================= */

.contact-form-note {
    display: flex;

    justify-content: center;

    gap: 25px;

    font-size: 16px;

    color: #7c8881;

    padding-top: 1px;
}


/* =========================================
   CONTACT STATS
========================================= */

.contact-stats {
    display: flex;

    gap: 8px;

    margin-top: 12px;
}

.contact-stat {
    flex: 1;

    background: #ffffff;

    border-radius: 8px;

    padding: 13px 10px;

    box-shadow: 0 4px 12px rgba(0, 0, 0, .03);
}

.contact-stat strong {
    display: block;

     font-family: "Manrope", sans-serif;

    font-size: 17px;

    color: #075c38;

    margin-bottom: 3px;
}

.contact-stat span {
    display: block;

    font-size: 16px;

    letter-spacing: .6px;

    color: #77837b;
}


/* =========================================
   RIGHT SIDEBAR
========================================= */

.contact-sidebar {
    padding-top: 145px;
}

.contact-badges {
    display: flex;

    justify-content: flex-end;

    gap: 5px;

    margin-bottom: 5px;
}

.contact-badges span {
    background: #ffffff;

    border-radius: 20px;

    padding: 5px 9px;

    font-size: 16px;

    color: #68766e;

    box-shadow: 0 3px 10px rgba(0, 0, 0, .04);
}


/* =========================================
   WHATSAPP CARD
========================================= */

.contact-whatsapp-card {
    background: #bcebdc;

    border-radius: 9px;

    min-height: 72px;

    padding: 12px;

    display: flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 10px;
}

.contact-circle-icon {
    width: 27px;
    height: 27px;

    flex-shrink: 0;

    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #006039;

    color: white;

    font-size: 11px;
}

.contact-whatsapp-card div:nth-child(2) {
    flex: 1;
}

.contact-whatsapp-card small {
    display: block;

    font-size: 16px;

    color: #2f6d59;

    letter-spacing: .8px;
}

.contact-whatsapp-card h4 {
    margin: 2px 0;

     font-family: "Manrope", sans-serif;

    font-size: 14px;

    color: #075c38;
}

.contact-whatsapp-card p {
    margin: 0;

    font-size: 16px;

    color: #658278;
}

.contact-whatsapp-card > strong {
    color: #075c38;

    font-size: 17px;
}


/* =========================================
   GENERAL INFO CARDS
========================================= */

.contact-info-card {
    background: #ffffff;

    border-radius: 9px;

    padding: 14px;

    margin-bottom: 10px;

    box-shadow: 0 3px 15px rgba(0, 0, 0, .04);
}

.contact-card-eyebrow {
    font-size: 16px;
    font-family: "Manrope", sans-serif;
    letter-spacing: 1px;

    color: #76847c;

    text-transform: uppercase;

    margin-bottom: 8px;
}
.distance-row span{
    font-family: "Manrope", sans-serif;
}
.contact-number-row {
    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 5px 0;

    border-bottom: 1px solid #eeeeeb;
}

.contact-number-row:last-child {
    border-bottom: none;
}

.contact-number-row span {
    display: block;

    font-size: 16px;

    color: #7d8982;

    margin-bottom: 2px;
}

.contact-number-row strong {
    display: block;

     font-family: "Manrope", sans-serif;

    font-size: 13px;

    color: #075c38;
}

.contact-number-row small {
    font-size: 16px;

    color: #7d8982;
}


/* =========================================
   EMAIL
========================================= */

.contact-email {
    font-size: 18px;

    color: #53635a;

    margin: 7px 0;
}


/* =========================================
   LOCATION CARD
========================================= */

.contact-location-card {
    position: relative;

    overflow: hidden;

    background: #006039;

    border-radius: 9px;

    padding: 16px;

    margin-bottom: 10px;

    color: white;
}

.contact-location-card::after {
    content: "";

    position: absolute;

    width: 110px;
    height: 110px;

    right: -35px;
    bottom: -50px;

    border-radius: 50%;

    border: 1px solid rgba(255, 255, 255, .12);
}

.contact-location-card .contact-card-eyebrow {
    color: #b3ddc9;
}

.contact-location-card h3 {
    font-size: 16px;

    margin-bottom: 6px;

    color: white;
}

.contact-location-card p {
    position: relative;

    z-index: 2;

    font-size: 18px;

    line-height: 1.55;

    color: rgba(255, 255, 255, .78);

    max-width: 350px;
}

.coordinates {
    display: inline-block;

    position: relative;
    z-index: 2;

    padding: 4px 7px;

    border-radius: 20px;

    background: rgba(255, 255, 255, .15);

    font-size: 16px;
}


/* =========================================
   DISTANCE MATRIX
========================================= */

.contact-distance-card {
    background: #ffffff;

    border-radius: 9px;

    padding: 15px;

    box-shadow: 0 3px 15px rgba(0, 0, 0, .04);
}

.contact-distance-card h3 {
    font-size: 16px;

    color: #273d32;

    margin-bottom: 8px;
}

.distance-row {
    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: 6px 5px;

    background: #f4f5f2;

    border-bottom: 1px solid #e7e9e5;

    font-size: 18px;

    color: #596860;
}

.distance-row strong {
    font-size: 18px;
    font-family: "Manrope", sans-serif;
    color: #075c38;
}

.contact-distance-card > small {
    display: block;

    font-size: 16px;

    color: #909b95;

    padding: 2px 5px 6px;
}

.distance-note {
    margin-top: 7px;

    padding: 9px;

    border-radius: 6px;

    background: #e3f5ed;

    color: #547568;

    font-size: 16px;

    line-height: 1.5;
}


/* =========================================
   MAP SECTION
========================================= */

.contact-map-section {
    background: #f1f1ed;

    padding-top: 65px;
}

.contact-map-header {
    display: flex;

    justify-content: space-between;

    align-items: flex-end;

    margin-bottom: 20px;
}

.contact-map-header p {
    font-size: 12px;

    color: #78837d;

    line-height: 1.6;

    margin: 0;
}

.contact-map {
    position: relative;

    height: 350px;

    overflow: hidden;

    border-radius: 9px;

    background: #a9d8c3;

    box-shadow: 0 8px 20px rgba(0, 0, 0, .06);
}

.contact-map > img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    display: block;
}


/*
    Map markers
*/

.map-marker {
    position: absolute;

    background: #ffffff;

    padding: 6px 10px;

    border-radius: 20px;

    box-shadow: 0 3px 10px rgba(0, 0, 0, .12);

    font-size: 16px;

    color: #40564b;
}

.marker-hotel {
    left: 48%;
    top: 48%;

    background: #006039;

    color: white;
}

.marker-bamni {
    left: 30%;
    top: 43%;
}

.marker-lake {
    left: 56%;
    top: 38%;
}

.marker-dam {
    left: 45%;
    top: 65%;
}


/* =========================================
   MAP LOCATION CARDS
========================================= */

.contact-map-cards {
    margin-top: 12px;
}

.map-location-card {
    display: flex;

    

    gap: 10px;

    background: #ffffff;

    border-radius: 7px;

    padding: 8px;

    min-height: 67px;
}

.map-location-card img {
    width: 43px;
    height: 43px;

    object-fit: cover;

    border-radius: 5px;

    flex-shrink: 0;
}

.map-location-card h4 {
    font-family: "Manrope", sans-serif;

    font-weight: 700;

    font-size: 16px;

    color: #075c38;

    margin: 0 0 3px;
}

.map-location-card p {
    font-size: 12px !important;

    color: #7b857f;

    line-height: 1.4;

    margin: 0;
}


/* =========================================
   FAQ
========================================= */

.contact-faq-section {
    background: #f7f7f4;

    padding: 75px 0;
}

.contact-faq-heading {
    text-align: center;

    margin-bottom: 28px;
}

.contact-faq-heading .section-title {
    margin-bottom: 5px;
}

.contact-faq-heading p {
    font-size: 18px;

    color: #7d8781;

    max-width: 450px;

    margin: auto;

    line-height: 1.6;
}

.contact-faq-list {
    width: 75%;

    margin: auto;
}

.contact-faq-item {
    min-height: 48px;

    background: #ffffff;

    border-radius: 8px;

    margin-bottom: 6px;

    padding: 0 16px;

    display: block;

   

    box-shadow: 0 2px 8px rgba(0, 0, 0, .02);

    cursor: pointer;
}

.contact-faq-item span {
     font-family: "Manrope", sans-serif;

    font-size: 16px;

    color: #293e34;
}

.contact-faq-item strong {
    font-size: 14px;

    color: #075c38;
}


/* =========================================
   EVENT CTA
========================================= */

.contact-event-cta {
    background: #005b35;

    color: white;

    padding: 45px 0;
}

.contact-cta-eyebrow {
    color: #b8dfca;
}

.contact-event-cta h2 {
    color: white;

    font-size: 29px;

    line-height: 1.05;

    max-width: 450px;

    margin-bottom: 10px;
}

.contact-event-cta p {
    font-size: 12px;

    line-height: 1.6;

    color: rgba(255, 255, 255, .72);

    max-width: 480px;

    margin: 0;
}

.contact-cta-buttons {
    display: flex;

    justify-content: flex-end;

    gap: 10px;
}

.contact-cta-buttons .white-btn {
    white-space: nowrap;
}

.contact-cta-buttons .outline-btn {
    white-space: nowrap;

    border-color: rgba(255, 255, 255, .25);

    background: rgba(255, 255, 255, .12);
}
.contact-map iframe{
    width: 100%;
}

/* =========================================
   FAQ ACCORDION
========================================= */

.contact-faq-item {
    display: block !important;
    padding: 0 !important;
}

.faq-question {
    width: 100%;
    min-height: 48px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 14px 16px;

    cursor: pointer;
}

.faq-answer {
    display: none;

    width: 100%;

    padding: 0 45px 16px 16px;
}

.faq-answer p {
    margin: 0;

    font-family: "Manrope", sans-serif;
    font-size: 12px;
    line-height: 1.7;

    color: #78847d;
}

/* =========================================
   CONTACT FOOTER
========================================= */

/*
    The footer itself uses the CSS from the
    previous Hotel Ajodhya View page.

    No footer CSS needs to be duplicated here.
*/