/* Masala Travel mobile menu v2. Desktop and tablet are intentionally untouched. */
@media (max-width: 767px) {
    html.masala-menu-v2-open,
    body.masala-menu-v2-open {
        overflow: hidden !important;
        overscroll-behavior: none;
        touch-action: none;
    }

    .masala-mobile-menu-overlay {
        position: fixed;
        inset: 0;
        z-index: 2147483000;
        display: block;
        background: rgba(5, 16, 12, .58);
        -webkit-backdrop-filter: blur(2px);
        backdrop-filter: blur(2px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 280ms ease, visibility 0s linear 280ms;
        -webkit-tap-highlight-color: transparent;
    }

    .masala-mobile-menu-overlay.is-visible {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition-delay: 0s;
    }

    .mobile-menu-wrapper#mobile-menu {
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        bottom: auto !important;
        left: auto !important;
        z-index: 2147483001 !important;
        display: block !important;
        width: min(88vw, 390px) !important;
        max-width: calc(100vw - 36px) !important;
        height: 100vh !important;
        height: 100dvh !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: calc(22px + env(safe-area-inset-top, 0px)) 20px calc(18px + env(safe-area-inset-bottom, 0px)) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        box-sizing: border-box !important;
        border-left: 1px solid rgba(255, 255, 255, .25) !important;
        border-radius: 34px 0 0 34px !important;
        background-color: #123d2e !important;
        background-image:
            linear-gradient(180deg, rgba(9, 44, 31, .82), rgba(8, 39, 29, .88)),
            url('/images/news/masalatravel-header-bg-user-mobile-india-goa.webp?v=20260718-menu-v2') !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
        background-size: cover !important;
        box-shadow: -18px 0 42px rgba(0, 0, 0, .34) !important;
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
        transform: translate3d(105%, 0, 0) !important;
        transition: transform 280ms cubic-bezier(.22, .61, .36, 1) !important;
        visibility: hidden;
        pointer-events: none;
        -webkit-overflow-scrolling: touch;
    }

    .mobile-menu-wrapper#mobile-menu::before,
    .mobile-menu-wrapper#mobile-menu::after,
    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu::before,
    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu::after {
        display: none !important;
        content: none !important;
        background: none !important;
    }

    .mobile-menu-wrapper#mobile-menu[aria-hidden="false"],
    .mobile-menu-wrapper#mobile-menu.active,
    .mobile-menu-wrapper#mobile-menu.is-active,
    .mobile-menu-wrapper#mobile-menu.open,
    .mobile-menu-wrapper#mobile-menu.opened,
    .mobile-menu-wrapper#mobile-menu.show,
    .mobile-menu-wrapper#mobile-menu.is-open,
    .mobile-menu-wrapper#mobile-menu[data-masala-open="true"] {
        transform: translate3d(0, 0, 0) !important;
        visibility: visible;
        pointer-events: auto;
    }

    .mobile-menu-wrapper#mobile-menu *,
    .mobile-menu-wrapper#mobile-menu *::before,
    .mobile-menu-wrapper#mobile-menu *::after {
        box-sizing: border-box;
    }

    .mobile-menu-wrapper#mobile-menu .masala-mobile-menu-brand {
        position: relative;
        min-height: 76px;
        padding: 8px 66px 13px 2px;
        color: #fff;
    }

    .masala-mobile-menu-brand__name {
        display: block;
        margin: 0 0 5px;
        font-size: clamp(23px, 6vw, 30px);
        font-weight: 800;
        line-height: 1.08;
        letter-spacing: .025em;
    }

    .masala-mobile-menu-brand__meta {
        display: block;
        color: #79dc99;
        font-size: clamp(14px, 3.8vw, 18px);
        font-weight: 700;
        line-height: 1.25;
        letter-spacing: .065em;
    }

    .mobile-menu-wrapper#mobile-menu .masala-mobile-menu-close {
        position: absolute;
        top: calc(20px + env(safe-area-inset-top, 0px));
        right: 20px;
        z-index: 5;
        display: grid;
        width: 54px;
        height: 54px;
        padding: 0;
        place-items: center;
        color: #149548;
        background: #fff;
        border: 0;
        border-radius: 50%;
        box-shadow: 0 7px 20px rgba(0, 0, 0, .22);
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }

    .masala-mobile-menu-close svg {
        width: 27px;
        height: 27px;
    }

    .masala-mobile-menu-close:active {
        color: #fff;
        background: #149548;
        transform: scale(.96);
    }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 4px 0 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        background: transparent !important;
        border: 0 !important;
    }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu > ul {
        display: grid !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: clamp(8px, 1.35vh, 12px) !important;
        list-style: none !important;
    }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu li {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
        opacity: 0;
        transform: translateX(18px);
    }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu li::before,
    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu li::after,
    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu a.nav-pill::before,
    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu a.nav-pill::after {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        content: none !important;
    }

    .mobile-menu-wrapper#mobile-menu[data-masala-open="true"] .mobile-menu.anchor-menu li {
        opacity: 1;
        transform: translateX(0);
        transition: opacity 240ms ease, transform 240ms ease;
    }

    .mobile-menu-wrapper#mobile-menu[data-masala-open="true"] .mobile-menu.anchor-menu li:nth-child(1) { transition-delay: 35ms; }
    .mobile-menu-wrapper#mobile-menu[data-masala-open="true"] .mobile-menu.anchor-menu li:nth-child(2) { transition-delay: 55ms; }
    .mobile-menu-wrapper#mobile-menu[data-masala-open="true"] .mobile-menu.anchor-menu li:nth-child(3) { transition-delay: 75ms; }
    .mobile-menu-wrapper#mobile-menu[data-masala-open="true"] .mobile-menu.anchor-menu li:nth-child(4) { transition-delay: 95ms; }
    .mobile-menu-wrapper#mobile-menu[data-masala-open="true"] .mobile-menu.anchor-menu li:nth-child(5) { transition-delay: 115ms; }
    .mobile-menu-wrapper#mobile-menu[data-masala-open="true"] .mobile-menu.anchor-menu li:nth-child(6) { transition-delay: 135ms; }
    .mobile-menu-wrapper#mobile-menu[data-masala-open="true"] .mobile-menu.anchor-menu li:nth-child(7) { transition-delay: 155ms; }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu a.nav-pill {
        position: relative;
        display: grid !important;
        grid-template-columns: 46px minmax(0, 1fr) 24px;
        align-items: center;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 68px !important;
        margin: 0 !important;
        padding: 11px 16px !important;
        gap: 13px;
        color: #fff !important;
        font-size: clamp(15px, 4.05vw, 18px) !important;
        font-weight: 800 !important;
        line-height: 1.12 !important;
        text-align: left !important;
        text-decoration: none !important;
        text-transform: uppercase !important;
        white-space: normal !important;
        background: linear-gradient(135deg, #2cc55e, #16a344) !important;
        border: 1px solid rgba(255, 255, 255, .08) !important;
        border-radius: 16px !important;
        box-shadow: 0 8px 20px rgba(0, 0, 0, .22) !important;
        transition: background 180ms ease, box-shadow 180ms ease, transform 180ms ease !important;
        -webkit-tap-highlight-color: transparent;
    }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu a.nav-pill:hover,
    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu a.nav-pill:focus-visible {
        background: linear-gradient(135deg, #55d877, #25b552) !important;
        box-shadow: 0 10px 24px rgba(0, 0, 0, .26) !important;
        outline: 2px solid rgba(255, 255, 255, .8);
        outline-offset: 2px;
    }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu a.nav-pill:active {
        background: linear-gradient(135deg, #15933f, #087934) !important;
        transform: translateY(1px) scale(.99);
    }

    .masala-mobile-menu-item__icon,
    .masala-mobile-menu-item__arrow {
        display: grid;
        place-items: center;
        color: #fff;
    }

    .masala-mobile-menu-item__icon svg {
        width: 32px;
        height: 32px;
    }

    .masala-mobile-menu-item__arrow svg {
        width: 19px;
        height: 19px;
    }

    .masala-mobile-menu-item__label {
        min-width: 0;
    }

    .masala-mobile-menu-socials {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        margin: clamp(13px, 2vh, 20px) 0 0;
        padding: clamp(13px, 2vh, 18px) 2px 0;
        gap: 8px;
        border-top: 1px solid rgba(255, 255, 255, .24);
    }

    .masala-mobile-menu-socials a {
        display: grid;
        justify-items: center;
        gap: 6px;
        color: #fff !important;
        font-size: 12px;
        line-height: 1.15;
        text-align: center;
        text-decoration: none !important;
    }

    .masala-mobile-menu-socials__icon {
        display: grid;
        width: clamp(43px, 12vw, 50px);
        height: clamp(43px, 12vw, 50px);
        place-items: center;
        color: #fff;
        border-radius: 50%;
        box-shadow: 0 6px 16px rgba(0, 0, 0, .22);
        transition: transform 180ms ease, filter 180ms ease;
    }

    .masala-mobile-menu-socials a:active .masala-mobile-menu-socials__icon {
        transform: scale(.94);
        filter: brightness(.9);
    }

    .masala-mobile-menu-socials__icon svg {
        width: 28px;
        height: 28px;
    }

    .masala-mobile-menu-socials__icon--whatsapp { background: #1fb956; }
    .masala-mobile-menu-socials__icon--telegram { background: #229ed9; }
    .masala-mobile-menu-socials__icon--max { background: linear-gradient(145deg, #476cff, #2542d6); }

    .masala-mobile-menu-socials__max-mark {
        display: grid;
        width: 27px;
        height: 27px;
        place-items: center;
        color: #3156df;
        background: #fff;
        border-radius: 9px;
        font: 800 17px/1 Arial, sans-serif;
    }

    body.masala-menu-v2-open .menu-button,
    body.masala-menu-v2-open .menu-btn,
    body.masala-menu-v2-open .mobile-menu-button,
    body.masala-menu-v2-open .hamburger,
    body.masala-menu-v2-open .nav-toggle,
    body.masala-menu-v2-open .mobile-toggle,
    body.masala-menu-v2-open [aria-controls="mobile-menu"] {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

@media (max-width: 359px) {
    .mobile-menu-wrapper#mobile-menu {
        width: calc(100vw - 30px) !important;
        max-width: calc(100vw - 30px) !important;
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    .mobile-menu-wrapper#mobile-menu .masala-mobile-menu-brand {
        min-height: 68px;
        padding-right: 57px;
    }

    .mobile-menu-wrapper#mobile-menu .masala-mobile-menu-close {
        right: 15px;
        width: 47px;
        height: 47px;
    }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu a.nav-pill {
        grid-template-columns: 38px minmax(0, 1fr) 20px;
        min-height: 62px !important;
        padding-right: 12px !important;
        padding-left: 12px !important;
        gap: 10px;
    }

    .masala-mobile-menu-item__icon svg {
        width: 27px;
        height: 27px;
    }
}

/* Keep the menu compact above mobile browser chrome on shorter screens. */
@media (max-width: 767px) and (max-height: 900px) {
    .mobile-menu-wrapper#mobile-menu {
        padding: calc(12px + env(safe-area-inset-top, 0px)) 16px max(12px, env(safe-area-inset-bottom, 0px)) !important;
        scroll-padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    }

    .mobile-menu-wrapper#mobile-menu .masala-mobile-menu-brand {
        min-height: 60px;
        padding: 3px 56px 7px 1px;
    }

    .masala-mobile-menu-brand__name {
        margin-bottom: 3px;
        font-size: clamp(21px, 5.5vw, 25px);
    }

    .masala-mobile-menu-brand__meta {
        font-size: clamp(12px, 3.35vw, 15px);
    }

    .mobile-menu-wrapper#mobile-menu .masala-mobile-menu-close {
        top: calc(12px + env(safe-area-inset-top, 0px));
        right: 16px;
        width: 46px;
        height: 46px;
    }

    .masala-mobile-menu-close svg {
        width: 24px;
        height: 24px;
    }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu {
        margin-top: 0 !important;
    }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu > ul {
        gap: 6px !important;
    }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu a.nav-pill {
        grid-template-columns: 38px minmax(0, 1fr) 20px;
        min-height: 58px !important;
        padding: 6px 13px !important;
        gap: 10px;
        font-size: clamp(14px, 3.75vw, 16px) !important;
    }

    .masala-mobile-menu-item__icon svg {
        width: 26px;
        height: 26px;
    }

    .masala-mobile-menu-item__arrow svg {
        width: 17px;
        height: 17px;
    }

    .masala-mobile-menu-socials {
        margin-top: 9px;
        padding-top: 9px;
        gap: 6px;
    }

    .masala-mobile-menu-socials a {
        gap: 4px;
        font-size: 11px;
    }

    .masala-mobile-menu-socials__icon {
        width: 40px;
        height: 40px;
    }

    .masala-mobile-menu-socials__icon svg {
        width: 24px;
        height: 24px;
    }
}

@media (max-width: 767px) and (max-height: 680px) {
    .mobile-menu-wrapper#mobile-menu .masala-mobile-menu-brand {
        min-height: 54px;
    }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu > ul {
        gap: 5px !important;
    }

    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu a.nav-pill {
        min-height: 56px !important;
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }

    .masala-mobile-menu-socials {
        margin-top: 7px;
        padding-top: 7px;
    }

    .masala-mobile-menu-socials__icon {
        width: 36px;
        height: 36px;
    }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
    .masala-mobile-menu-overlay,
    .mobile-menu-wrapper#mobile-menu,
    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu li,
    .mobile-menu-wrapper#mobile-menu .mobile-menu.anchor-menu a.nav-pill {
        transition: none !important;
        animation: none !important;
    }
}

/* MASALA MOBILE MENU VERTICAL GAP FIX 20260719 */
@media (max-width: 767px) {
    #mobile-menu .mobile-menu > ul,
    #mobile-menu nav.mobile-menu > ul,
    #mobile-menu .anchor-menu > ul {
        display: grid !important;
        gap: 12px !important;
        row-gap: 12px !important;
    }

    #mobile-menu .mobile-menu > ul > li,
    #mobile-menu nav.mobile-menu > ul > li,
    #mobile-menu .anchor-menu > ul > li {
        margin: 0 !important;
    }

    #mobile-menu .mobile-menu > ul > li > a.nav-pill,
    #mobile-menu nav.mobile-menu > ul > li > a.nav-pill,
    #mobile-menu .anchor-menu > ul > li > a.nav-pill {
        margin: 0 !important;
        box-shadow:
            0 6px 14px rgba(0, 0, 0, 0.18),
            inset 0 1px 0 rgba(255, 255, 255, 0.10) !important;
    }

    #mobile-menu .masala-mobile-menu-socials {
        margin-top: 30px !important;
        padding-top: 18px !important;
        border-top: 1px solid rgba(255, 255, 255, 0.22) !important;
    }
}

@media (max-width: 360px) {
    #mobile-menu .mobile-menu > ul,
    #mobile-menu nav.mobile-menu > ul,
    #mobile-menu .anchor-menu > ul {
        gap: 9px !important;
        row-gap: 9px !important;
    }
}
/* END MASALA MOBILE MENU VERTICAL GAP FIX 20260719 */
