@media only screen and (max-width:1470px) {
    .banner-content .content {
        position: absolute;
        top: 150px;
        left: 46%;
        transform: translateX(-50%);
    }
    .search-bar .search-content {
        width: 123%;
    }
}

/* Desktop nav (shown at >=992px) — compact spacing on smaller desktops/laptops
   so the full horizontal menu fits without wrapping. Below 992px the menu is
   hidden and the hamburger/mobile menu takes over. */
@media only screen and (min-width:992px) and (max-width:1300px) {
    header .logo img {
        max-width: 160px;
    }
    /* flex + nowrap removes inter-item whitespace and keeps the menu on one
       row; justify-content:flex-end hugs the outer edge in both LTR and RTL */
    header .menubar ul {
        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-end;
        align-items: center;
    }
    header .menubar ul li a {
        padding: 7px 7px;
        margin: 0;
        font-size: 13.5px;
    }
    header .menubar .bell-wrap {
        width: 32px;
        height: 32px;
        margin: 0 4px;
    }
    header .menubar .login-menu {
        padding: 7px 12px;
        font-size: 13.5px;
    }
}

@media only screen and (max-width:1200px) {

    h5 {
        font-weight: 600;
        font-size: 15px;
    }

    .section-title h2 {
        font-size: 30px;
        line-height: 40px;
    }

    .view-btn a {
        font-size: 11px;
        padding: 6px 12px;
        border-radius: 15px;
    }

}

@media only screen and (max-width:991px) {

    /* Hero (mobile): keep the desktop look — text + search bar overlaid on the
       banner image — but robustly. Instead of pinning the content to the
       viewport (which collapses onto the wrapping mobile header), paint the
       banner image onto the hero section itself and let the content flow over
       it. Header-height independent, works in both LTR and RTL. */
    .banner {
        display: none;
    }
    .banner-content {
        position: relative;
        background:
            linear-gradient(rgba(46, 0, 68, .45), rgba(46, 0, 68, .55)),
            url("../img/photos/Top-banner-choice---01.png") center / cover no-repeat;
        padding: 3rem 0;
    }
    .banner-content .content {
        position: static;
        top: auto;
        left: auto;
        right: auto;
        transform: none;
        width: 100%;
        max-width: 100%;
    }
    .search-bar .search-content {
        width: 100%;
        margin-top: 12px;
    }
    .section-title h2 {
        font-size: 26px;
        line-height: 36px;
    }

    .subscribe-part .image {
        display: none;
    }

    .subscribe-part .text {
        padding: 15px 9px;
        width: 100%;
        border-radius: 10px;
    }

    .subscribe-part .text .custom-control {
        width: 70%;
        margin-bottom: 20px;
    }

}


@media only screen and (max-width:767px) {
    .section-title h2 {
        font-size: 20px;
        line-height: 24px;
        font-weight: 700px;
        text-transform: capitalize;
    }
    .banner-content .content {
        position: static;
        top: auto;
        left: auto;
        right: auto;
        transform: none;
    }

    .subscribe-part .image {
        display: none;
    }
    .subscribe-part .text {
        padding: 15px 9px;
        width: 100%;
        border-radius: 10px;
    }
    .subscribe-part .text .custom-control {
        width: 70%;
        margin-bottom: 20px;
    }

}

@media only screen and (max-width:576px) {
    h3 {
        font-weight: 500;
        font-size: 18px;
    }

    h5 {
        font-weight: 500;
        font-size: 15px;
    }

    .section-title h2 {
        font-size: 17px;
        line-height: 24px;
    }

    .banner-content .content {
        position: static;
        top: auto;
        left: auto;
        right: auto;
        transform: none;
    }

    .banner-overlay {
        padding: 90px 0px;
    }

    .custom-btn {
        font-weight: 400;
        font-size: 14px;
        margin-left: 0px !important;
        letter-spacing: 0px;
    }
    .top-destination-image ul li {
        font-size: 10px;
    }

    .ticket-banner-slide img {
        min-height: 110px;
    }

    .view-btn a {
        font-size: 12px;
        padding: 6px 14px;
    }

    .own-banner-overlay {
        padding: 70px 0px;
    }

    .own-banner h3 {
        font-size: 24px;
    }

    .subscribe-part .image {
        display: none;
    }
    .subscribe-part .text {
        padding: 15px 9px;
        width: 100%;
        border-radius: 10px;
    }
    .subscribe-part .text .custom-control {
        width: 70%;
        margin-bottom: 20px;
    }

    .address .section-content h3 {
        font-weight: 500;
        font-size: 22px;
        line-height: 28px;
    }
    h4 {
        font-weight: 500;
        font-size: 15px;
    }

    .address .contact button {
        font-weight: 500;
        font-size: 15px;
        line-height: 18px;
        padding: 12px 20px;
        margin-top: 20px;
    }



}

@media only screen and (max-width: 400px) {

    h3 {
        font-weight: 500;
        font-size: 18px;
    }
    h5 {
        font-weight: 500;
        font-size: 15px;
    }
    .section-title h2 {
        font-size: 17px;
        line-height: 24px;
    }
    .banner-content .content {
        position: static;
        top: auto;
        left: auto;
        right: auto;
        transform: none;
    }
    .banner-overlay {
        padding: 90px 0px;
    }

    .custom-btn {
        font-weight: 400;
        font-size: 14px;
        margin-left: 0px !important;
        letter-spacing: 0px;
    }

    .ticket-banner-slide img{
        min-height: 110px;
    }
    .view-btn a {
        font-size: 12px;
        padding: 6px 14px;
    }

    .own-banner-overlay {
        padding: 70px 0px;
    }
    .own-banner h3 {
        font-size: 24px;
    }

    .subscribe-part .image{
        display: none;
    }
    .subscribe-part .text {
        padding: 15px 9px;
        width: 100%;
        border-radius: 10px;
    }
    .subscribe-part .text .custom-control {
        width: 70%;
        margin-bottom: 20px;
    }

    .address .section-content h3 {
        font-weight: 500;
        font-size: 22px;
        line-height: 28px;
    }
    h4 {
        font-weight: 500;
        font-size: 15px;
    }
    .address .contact button {
        font-weight: 500;
        font-size: 15px;
        line-height: 18px;
        padding: 12px 20px;
        margin-top: 20px;
    }




}
