/* Keeps longer rewritten CTA labels on one line without oversized pills. */
.banner_btns,
.getInBtns,
.menu__btns,
.service__btns {
    flex-wrap: nowrap;
}

.banner_btns .themebtn,
.getInBtns .themebtn,
.menu__btns .themebtn,
.service__btns .themebtn {
    white-space: nowrap;
    font-size: 14px;
    line-height: 1.2;
    padding: 10px 22px;
}

@media only screen and (min-width: 992px) and (max-width: 1365px) {
    .banner_btns {
        gap: 12px;
    }

    .banner_btns .themebtn {
        font-size: 12px;
        padding: 9px 16px;
    }
}

@media only screen and (max-width: 991px) {
    .banner_btns .themebtn,
    .getInBtns .themebtn,
    .menu__btns .themebtn,
    .service__btns .themebtn {
        font-size: 12px;
        padding: 8px 14px;
    }
}

/* Mobile CTA overflow fix */
*, *::before, *::after { box-sizing: border-box; }

.themebtn {
    max-width: 100%;
    box-sizing: border-box;
    overflow-wrap: anywhere;
    word-break: normal;
    text-align: center;
}

@media (max-width: 767px) {
    .banner_btns,
    .service__btns,
    .getInBtns,
    .menu__btns {
        width: 100%;
        max-width: 100%;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap !important;
        align-items: stretch;
        gap: 10px;
    }

    .banner_btns .themebtn,
    .service__btns .themebtn,
    .getInBtns .themebtn,
    .menu__btns .themebtn {
        display: flex;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100%;
        min-height: 44px;
        height: auto;
        margin: 0 !important;
        padding: 11px 14px !important;
        align-items: center;
        justify-content: center;
        white-space: normal !important;
        overflow-wrap: anywhere;
        word-break: normal;
        line-height: 1.3;
    }
}

@media (max-width: 380px) {
    .banner_btns .themebtn,
    .service__btns .themebtn,
    .getInBtns .themebtn,
    .menu__btns .themebtn {
        font-size: 12px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

/* Final mobile responsive fixes */
@media (max-width: 767px) {
    .banner_btns {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        width: 100% !important;
        gap: 10px !important;
        margin: 14px 0 0 !important;
    }

    .banner_btns > a,
    .banner_btns > a.themebtn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 12px 16px !important;
        min-height: 46px !important;
        height: auto !important;
        white-space: normal !important;
        overflow: hidden !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
        text-overflow: clip !important;
        line-height: 1.3 !important;
        font-size: 13px !important;
        text-align: center !important;
    }

    /* Keep the phone number inside its CTA instead of allowing a text node to overflow. */
    .banner_btns > a br { display: none !important; }

    /* Consultation CTAs used throughout the site: give long labels comfortable space. */
    .themebtn {
        max-width: 100% !important;
        white-space: normal !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
        line-height: 1.35 !important;
    }

    /* Services hero background must cover the complete mobile section. */
    .services {
        position: relative !important;
        overflow: hidden !important;
        isolation: isolate !important;
        min-height: 0 !important;
        margin: 0 0 45px !important;
        padding: 70px 0 45px !important;
    }

    .service_banner {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
        z-index: -2 !important;
        overflow: hidden !important;
    }

    .service_banner img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    .services > .container {
        position: relative !important;
        z-index: 1 !important;
    }

    .services > .container > .row > .col-md-10:first-child {
        width: 100% !important;
    }

    .services > .container > .row > .col-md-10:first-child .heading,
    .services .heading--white {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        color: #fff !important;
        text-align: center !important;
        font-size: clamp(25px, 7.5vw, 34px) !important;
        line-height: 1.2 !important;
        margin: 0 0 22px !important;
        position: relative !important;
        z-index: 2 !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.55) !important;
    }

    .services .service_boxMain {
        position: relative !important;
        z-index: 2 !important;
    }
}

@media (max-width: 380px) {
    .banner_btns > a,
    .banner_btns > a.themebtn {
        font-size: 12px !important;
        padding: 11px 12px !important;
        min-height: 44px !important;
    }
}
