body{
    box-sizing:border-box;
    margin:0;
    padding:0;
    font-family:'Poppins',sans-serif
}
p,a,span,button{
    font-family:'Poppins',sans-serif
}
h1,h2,h3,h4,h5{
    font-family:'Poppins',sans-serif
}
.topbar{
    background-color:#73870f
}
.topbar a{
    text-decoration:none
}
.topbar i{
    margin-right:5px
}
.main-text-mgin{
    margin-left:10px;
    margin-right:10px
}
.nav-icons{
    font-size:14px
}
.priva-term{
    font-size:14px
}
.divider{
    display:inline-block;
    width:1px;
    height:16px;
    background-color:#fff;
    margin:0 12px;
    vertical-align:middle
}
.nowrap{
    white-space:nowrap
}
.nav-icons{
    white-space:nowrap
}
@media (max-width:390px){
    .divider{
        height:12px;
        margin:0 8px
    }
    .nav-icons span{
        font-size:13px
    }
}
.enquire-btn{
    position:fixed;
    top:60%;
    left:0;
    transform:translateY(-50%);
    writing-mode:vertical-rl;
    text-orientation:mixed;
    background:#73870f;
    color:#fff;
    padding:10px 8px;
    font-size:14px;
    font-weight:700;
    text-decoration:none;
    border-radius:0 5px 5px 0;
    box-shadow:0 2px 6px rgb(0 0 0 / .3);
    transition:all 0.3s ease;
    z-index:9999;
    width:30px;
    height:120px;
    display:flex;
    align-items:center;
    justify-content:center;
    will-change:transform;
    contain:layout style
}
.enquire-btn:hover{
    background:#a67c1a
}
.log-img img{
    height:110px;
    max-width:180px
}
.group-logo img{
    height:100px;
    max-width:500px
}
.cta-box{
    font-size:16px;
    font-weight:600;
    padding:20px 24px;
    background-color:#73870f;
    white-space:nowrap;
    box-shadow:0 4px 10px rgb(0 0 0 / .1);
    min-height:60px
}
.cta-box i{
    font-size:25px;
    margin-right:15px
}
.cta-box strong{
    font-size:15px
}
.cta-box span{
    font-size:12px
}
@media (max-width:991.98px){
    .log-img img{
        height:65px;
        max-width:100px
    }
    .group-logo img{
        height:60px;
        max-width:auto
    }
    .cta-box{
        font-size:14px;
        padding:8px 18px
    }
    .cta-box i{
        font-size:20px
    }
}
@media (max-width:575.98px){
    .log-img img{
        height:40px;
        max-width:60px
    }
    .group-logo img{
        height:40px;
        max-width:150px
    }
    .cta-box{
        font-size:8px;
        padding:5px 10px;
        font-weight:400
    }
    .cta-box i{
        font-size:18px;
        margin-right:8px
    }
    .cta-box strong{
        font-size:10px
    }
    .cta-box span{
        font-size:8px
    }
}
@keyframes slideInLeft{
    0%{
        opacity:0;
        transform:translateX(-90px);
        -webkit-transform:translateX(-90px);
        -moz-transform:translateX(-90px);
        -ms-transform:translateX(-90px);
        -o-transform:translateX(-90px)
    }
    100%{
        opacity:1;
        transform:translateX(0)
    }
}
@keyframes zoomIn{
    0%{
        opacity:0;
        transform:scale(.7)
    }
    100%{
        opacity:1;
        transform:scale(1)
    }
}
@keyframes slideInRight{
    0%{
        opacity:0;
        transform:translateX(90px);
        -webkit-transform:translateX(90px);
        -moz-transform:translateX(90px);
        -ms-transform:translateX(90px);
        -o-transform:translateX(90px)
    }
    100%{
        opacity:1;
        transform:translateX(0)
    }
}
.animate-slide-left{
    animation:slideInLeft 0.9s ease-out forwards;
    -webkit-animation:slideInLeft 0.9s ease-out forwards
}
.animate-fade-up{
    animation:fadeInUp 0.8s ease-out forwards
}
.animate-slide-right{
    animation:slideInRight 0.9s ease-out forwards
}
.navbar{
    margin-left:80px;
    margin-right:80px
}
.navbar-nav .dropdown-menu{
    background-color:#fff;
    border:none;
    border-radius:10px;
    margin-top:0
}
.navbar-nav .dropdown-item{
    color:black!important;
    padding:10px 20px
}
.dropdown-submenu{
    position:relative
}
.dropdown-submenu>.dropdown-menu{
    top:0;
    left:100%;
    margin-left:5px;
    margin-top:-8px;
    background-color:#00879c;
    border-radius:10px;
    display:none;
    min-width:180px
}
.dropdown-submenu:hover>.dropdown-menu{
    display:block
}
.submenu-arrow{
    float:right;
    transition:transform 0.2s ease;
    font-size:1rem;
    opacity:1rem;
    padding-left:1px;
    color:#c7c6c6
}
.dropdown-submenu:hover .submenu-arrow{
    transform:translateX(3px);
    opacity:1;
    -webkit-transform:translateX(3px);
    -moz-transform:translateX(3px);
    -ms-transform:translateX(3px);
    -o-transform:translateX(3px)
}
.navbar-nav li{
    padding-right:15px
}
.navbar-nav li a{
    color:#ffffff!important;
    transition:color 0.3s ease,background-color 0.3s ease
}
.main-nav .dropdown-menu{
    background-color:#fff!important;
    border:none;
    border-radius:10px;
    box-shadow:0 8px 24px rgb(0 0 0 / .15)
}
.main-nav .dropdown-item{
    color:#000!important;
    padding:10px 20px;
    transition:background-color 0.2s ease,color 0.2s ease
}
.main-nav .dropdown-item:hover{
    background-color:#ce9e02;
    color:#fff!important;
    border-radius:6px
}
.mobile-nav .dropdown-menu{
    background-color:#fff!important;
    border:none;
    border-radius:8px;
    margin:5px 0;
    width:100%;
    box-shadow:0 4px 12px rgb(0 0 0 / .08);
    padding:0
}
.mobile-nav .dropdown-submenu{
    position:relative
}
.mobile-nav .dropdown-item{
    color:#000!important;
    padding:12px 18px;
    font-size:15px;
    border-bottom:1px solid #eee;
    transition:background-color 0.2s ease,color 0.2s ease
}
.mobile-nav .dropdown-item:last-child{
    border-bottom:none
}
.mobile-nav .dropdown-item:hover{
    color:#ce9e02!important;
    border-radius:0
}
.mobile-nav .dropdown-submenu>.dropdown-menu{
    position:static!important;
    margin:0;
    box-shadow:none;
    border-left:3px solid #ce9e02;
    border-radius:0
}
.mobile-nav .dropdown-submenu>.dropdown-menu .dropdown-item{
    padding-left:28px;
    font-size:14px
}
.nav-link:hover{
    color:#000!important
}
.navbar-overlay{
    background-color:rgb(0 124 137 / .95);
    top:25%;
    left:0;
    right:0;
    z-index:100;
    padding:1px 0
}
#header-wrapper{
    position:relative;
    z-index:10
}
/* Hero Carousel Style */

.hero-slide{
    height:100%;
    position:relative;
    background-position:center center;
    background-repeat:no-repeat;
    background-size:cover;
    background-attachment:scroll;
    background:url(../images/image.jpeg) no-repeat center center/cover;
    margin-top:0 !important;
    margin-bottom:0 !important;
    padding-bottom:0 !important;
}

#heroCarousel{
    height:60vh;
    overflow:hidden;
    position:relative;
    margin-bottom:0 !important;
    padding-bottom:0 !important;
}
.carousel-inner{
    height:100%;
    margin-bottom:0 !important;
}
.carousel-item{
    height:100%;
    margin-bottom:0 !important;
}
.carousel-item:nth-child(2) .hero-slide{
    background-image:url(../images/96.webp)
}
.carousel-item:nth-child(3) .hero-slide{
    background-image:url(../images/25-min.webp)
}
.hero-slide::before{
    content:"";
    position:absolute;
    inset:0;
    background-color:rgb(0 0 0 / .7);
    z-index:1
}
.hero-text{
    position:relative;
    z-index:2;
    max-width:700px;
    margin-top:0
}
.hero-text .subtitle{
    font-size:1rem;
    letter-spacing:1px;
    opacity:1
}
.hero-text .desc{
    font-size:1.1rem;
    max-width:600px;
    margin-top:10px
}
.slide-indicators{
    position:absolute;
    top:50%;
    right:120px;
    transform:translateY(-50%);
    display:flex;
    flex-direction:column;
    z-index:2
}
.slide-indicators .indicator{
    cursor:pointer;
    padding:8px 5px;
    opacity:.6;
    transition:all 0.3s ease
}
.slide-indicators .indicator.active{
    opacity:1;
    border-right:2px solid #fff
}
@media (max-width:767px){
    #heroCarousel{
        display:none!important
    }
    .navbar-overlay{
        position:relative!important;
        top:unset!important;
        border-radius:0!important;
        background-color:#007c89!important;
        z-index:5;
        margin:0;
        width:100%
    }
    .inquiry-box-wrapper{
        margin-top:10px
    }
    .navbar-overlay .container{
        max-width:100%!important;
        padding:0 15px
    }
    .navbar-overlay .navbar-nav{
        width:100%
    }
    .navbar-overlay .nav-link{
        text-align:left;
        padding:12px 20px
    }
    .navbar-brand.d-lg-none{
        font-weight:700;
        padding-left:10px
    }
}
@media (min-width:768px) and (max-width:967px){
    .hero-slide{
        height:50vh;
    }
    .navbar-overlay{
        position:relative!important;
        top:unset!important;
        border-radius:0!important;
        background-color:#007c89!important;
        margin:0;
        width:100%;
        z-index:5
    }
}
@media(max-width:1280px){
    .navbar-overlay{
        background-color:rgb(0 124 137 / .95);
        position:absolute;
        top:20%;
        left:0;
        right:0;
        z-index:100;
        padding:1px 0
    }
    .hero-slide{
        height:65vh;
    }
}
@media(max-width:1024px){
    .navbar-overlay{
        background-color:rgb(0 124 137 / .95);
        position:absolute;
        top:26%;
        left:0;
        right:0;
        z-index:100;
        padding:1px 0
    }
}
@media only screen and (min-device-width:1024px) and (max-device-width:1024px) and (orientation:portrait) and (-webkit-min-device-pixel-ratio:2){
    .hero-slide{
        height:60vh;
    }
    .navbar-overlay{
        background-color:rgb(0 124 137 / .95);
        position:absolute;
        top:11%;
        left:0;
        right:0;
        z-index:100;
        padding:1px 0
    }
    .navbar{
        margin-left:70px;
        margin-right:70px
    }
    .hero-slide{
        height:50vh;
    }
}
@media(min-width:1281px){
    .navbar-overlay{
        background-color:rgb(0 124 137 / .95);
        position:absolute;
        top:17%;
        left:0;
        right:0;
        z-index:100;
        padding:1px 0
    }
    .hero-slide{
        height:60vh;
    }
}
:root{
    --nav-overlap:40px
}
.navbar-overlay{
    position:absolute!important;
    top:calc(4.4 * var(--nav-overlap));
    left:0;
    right:0;
    z-index:200!important;
    background-color:rgb(0 124 137 / .95);
    border-radius:30px;
    margin:0 auto;
    width:90%
}
.hero-slide{
    margin-top:0!important;
    padding-top:var(--nav-overlap)!important
}
#heroCarousel{
    aspect-ratio:16/9
}
#heroCarousel img{
    width:100%;
    height:100%;
    object-fit:cover
}
@media (max-width:1199.98px){
    .navbar-overlay{
        width:94%
    }
}
@media (max-width:991.98px){
    .navbar-overlay{
        width:100%;
        border-radius:0;
        left:0;
        right:0
    }
}
@media (max-width:767.98px){
    .navbar-overlay{
        position:relative!important;
        top:auto!important;
        width:100%!important;
        border-radius:0!important;
        background-color:#007c89!important
    }
}
@media (max-width:767px){
    .form_who_we{
        margin-top:50px
    }
    .formbox{
        padding-left:0!important;
        padding-right:0!important
    }
}


/* Inquire box Style */
.inquiry-box-wrapper{
    position:relative;
    z-index:10;
    height:50vh;
    width:100%;
    aspect-ratio:16/9
}
.inquiry-box{
    height:100%;
    background-color:#73870f;
    border-radius:10px;
    padding:30px 10px;
    box-shadow:0 3px 7px rgb(0 0 0 / .2);
    color:#fff
}
.inquiry-box input,.inquiry-box select{
    border-radius:6px;
    font-size:14px
}
.inquiry-box h4{
    font-size:1.5rem;
    font-weight:600
}
.who-we-are_main{
    background-color:#f9fafe;
    margin-bottom:30px
}
.form_who_we{
    background-color:#f9fafe
}
.who-we-are{
    background:linear-gradient(rgb(115 135 15 / .85),rgb(115 135 15 / .85)),url(../images/kaba8.webp) no-repeat center center/cover;
    border-radius:20px;
    margin:30px 0
}
.who-we-are h2{
    font-size:25px
}
.who-we-are h5{
    font-size:40px
}
.feature-box i{
    color:#fff;
    font-size:3rem
}
.feature-box h5{
    font-size:1.1rem;
    margin-bottom:10px
}
.feature-box p{
    font-size:.8rem;
    line-height:1.6
}
@keyframes zoomInScroll{
    0%{
        opacity:0;
        transform:scale(.8)
    }
    100%{
        opacity:1;
        transform:scale(1)
    }
}
.animate-zoom-scroll{
    opacity:0;
    transform:scale(.8);
    transition:all 0.7s ease-out;
    -webkit-transform:scale(.8);
    -moz-transform:scale(.8);
    -ms-transform:scale(.8);
    -o-transform:scale(.8);
    -webkit-transition:all 0.7s ease-out;
    -moz-transition:all 0.7s ease-out;
    -ms-transition:all 0.7s ease-out;
    -o-transition:all 0.7s ease-out
}
.animate-zoom-scroll.in-view{
    animation:zoomInScroll 0.6s ease-out forwards;
    -webkit-animation:zoomInScroll 0.6s ease-out forwards
}
@media (max-width:768px){
    .who-we-are{
        padding:20px 15px
    }
    .who-we-are h5{
        font-size:20px!important;
        margin-bottom:8px;
        position:relative;
        display:inline-block
    }
    .who-we-are h2{
        font-size:24px!important;
        line-height:1.3;
        margin-bottom:15px
    }
    .who-we-are p{
        font-size:14px!important;
        margin-bottom:0;
        line-height:1.5
    }
    .who-we-are .col-md-6{
        border-bottom:1px solid #fff;
        margin-bottom:5px;
        padding-bottom:5px
    }
    .who-we-are .col-md-6:last-child{
        border-bottom:none
    }
    .feature-box{
        text-align:left!important;
        margin-bottom:2px!important
    }
    .feature-box h5{
        font-size:15px!important;
        margin-bottom:6px
    }
    .feature-box p{
        font-size:13px!important;
        line-height:1.4;
        margin-bottom:0
    }
    .feature-box i{
        font-size:1.9rem!important
    }
}
.pkg-container1,.pkg-container2,.pkg-container3,.pkg-container4,.pkg-container5,.pkg-container5,.pkg-container6,.pkg-container7,.pkg-container8,.pkg-container9,.pkg-container10,.pkg-container11,.pkg-container12,.pkg-container13,.pkg-container14{
    width:100%;
    max-width:1320px;
    padding-left:15px;
    padding-right:15px;
    margin-left:auto;
    margin-right:auto
}
@media (max-width:991.98px){
    .pkg-container1,.pkg-container2,.pkg-container3,.pkg-container4,.pkg-container5,.pkg-container5,.pkg-container6,.pkg-container7,.pkg-container8,.pkg-container9,.pkg-container10,.pkg-container11,.pkg-container12,.pkg-container13,.pkg-container14{
        width:100%
    }
}
@media (max-width:769px){
    .pkg-container1,.pkg-container2,.pkg-container3,.pkg-container4,.pkg-container5,.pkg-container5,.pkg-container6,.pkg-container7,.pkg-container8,.pkg-container9,.pkg-container10,.pkg-container11,.pkg-container12,.pkg-container13,.pkg-container14{
        width:100%
    }
}
@media (max-width:575.98px){
    .pkg-container1,.pkg-container2,.pkg-container3,.pkg-container4,.pkg-container5,.pkg-container5,.pkg-container6,.pkg-container7,.pkg-container8,.pkg-container9,.pkg-container10,.pkg-container11,.pkg-container12,.pkg-container13,.pkg-container14{
        max-width:100%
    }
}
.umrah-packages{
    background-color:#f9fafe;
    margin-top:-30px
}
.umrah-packages h3{
    font-weight:700;
    font-size:1.8rem;
    margin-bottom:3rem
}
.umrah-packages h3::after{
    content:"";
    display:block;
    width:270px;
    height:3px;
    background-color:#73870f;
    margin:10px auto 0;
    border-radius:2px
}
.package-card{
    position:relative;
    border:none;
    border-radius:10px;
    overflow:hidden;
    background-color:#fff;
    transition:all 0.3s ease;
    box-shadow:0 3px 7px rgb(0 0 0 / .2);
    padding:9px;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
    -ms-border-radius:10px;
    -o-border-radius:10px
}
.package-card:hover{
    transform:translateY(-5px);
    box-shadow:0 12px 32px rgb(0 135 156 / .2)
}
.package-card img{
    height:220px;
    object-fit:cover;
    object-position:center;
    width:100%;
    display:block;
    border-bottom:1px solid #eaeaea
}
.package-card .card-header{
    font-size:1rem;
    padding:8px;
    font-weight:600;
    background-color:#73870f
}
.package-card .card-footer{
    font-size:1rem;
    padding:12px;
    background-color:#73870f
}
.package-card p,.package-card ul{
    font-size:.92rem;
    line-height:1.5
}
.custom-underline{
    position:relative;
    display:inline-block;
    padding-bottom:6px;
    width:100%;
    text-align:center
}
.custom-underline::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    height:1px;
    background-color:#c4c5c7
}
.price-title{
    position:relative;
    margin-top:2px;
    padding-top:0
}
.price-title::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:1px;
    background-color:#c4c5c7
}
.custom-underline{
    font-size:clamp(10px, 2vw, 16px);
    overflow:hidden;
    text-overflow:ellipsis
}
.custom-underline i{
    margin:0 4px;
    font-size:clamp(10px, 2vw, 16px)
}
.package-card .btn{
    flex:1;
    margin:0 5px;
    font-size:clamp(8px, 2vw, 16px)
}
.package-card .btn:hover{
    background-color:#000;
    color:#fff
}
.package-card{
    font-size:clamp(12px, 2vw, 16px)
}
.package-card .d-flex.flex-wrap span{
    font-size:clamp(14px, 2.5vw, 16px);
    font-weight:600
}
.package-card .d-flex.flex-wrap span i{
    font-size:clamp(16px, 2.5vw, 18px);
    margin-right:6px
}
@media screen and (max-width:1199px){
    .package-card .btn{
        margin:0 3px;
        font-size:8px;
        padding:6px 6px
    }
    .custom-underline span{
        font-size:13px
    }
    .custom-underline i{
        margin:0 2px;
        font-size:clamp(10px, 2vw, 12px)
    }
}
.exclusive-offers{
    background-color:#73870f;
    color:#fff
}
.exclusive-offers h2{
    font-size:2rem;
    position:relative
}
.exclusive-offers p{
    font-size:1.05rem;
    line-height:1.6
}
.exclusive-offers .btn-warning{
    border:none;
    font-weight:600
}
.section5-button{
    background-color:#000;
    color:#fff
}
.exclusive-offers-gradient{
    background-color:#73870f;
    color:#fff;
    overflow:hidden
}
.image-gradient-wrapper{
    position:relative;
    width:100%;
    max-height:400px;
    overflow:hidden
}
.gradient-img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:cover;
    display:block;
    mask-image:linear-gradient(to right,transparent 0%,black 7%,black 80%,transparent 100%);
    -webkit-mask-image:linear-gradient(to right,transparent 0%,black 7%,black 80%,transparent 100%)
}
.platinum-packages{
    background-color:#f9fafe
}
.section-title{
    font-size:1.8rem;
    font-weight:700;
    position:relative;
    display:inline-block;
    padding-bottom:8px;
    margin-bottom:1rem
}
.section-title::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    height:4px;
    width:120px;
    background-color:#73870f;
    border-radius:2px
}
:root{
    --card-width:320px;
    --card-height:460px;
    --gap:21px;
    --transition:all 300ms cubic-bezier(0.4, 0, 0.2, 1)
}
.sr-only{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border-width:0
}
.slider-container{
    width:100%;
    overflow-x:hidden;
    overflow-y:visible;
    position:relative;
    padding:1rem 0;
    margin-right:2rem
}
.slider-wrapper{
    width:100%;
    overflow-x:hidden;
    overflow-y:hidden;
    margin:0 auto;
    padding:0 1rem;
    padding-top:5px;
    padding-bottom:10px
}
.slider{
    display:flex;
    transition:transform 0.5s cubic-bezier(.4,0,.2,1);
    gap:var(--gap)
}
.card{
    flex:0 0 100%;
    height:var(--card-height);
    background:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    box-shadow:0 4px 6px rgb(0 0 0 / .1);
    border-radius:8px;
    transition:transform 0.3s ease;
    overflow-y:visible;
    height:auto
}
.card:hover{
    transform:translateY(-5px)
}
.buttons{
    width:100%;
    display:flex;
    justify-content:space-between;
    margin-top:-250px;
    pointer-events:none;
    z-index:50
}
.buttons button{
    background:rgb(51 51 51 / .8);
    color:#fff;
    border:none;
    width:40px;
    height:40px;
    border-radius:50%;
    cursor:pointer;
    pointer-events:auto;
    transition:var(--transition);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:50
}
.buttons button:hover{
    background:rgb(51 51 51)
}
.buttons button:disabled{
    opacity:.5;
    cursor:not-allowed
}
@media screen and (min-width:680px) and (max-width:979.98px){
    .slider-wrapper{
        max-width:100%
    }
    .card{
        flex:0 0 calc(50% - var(--gap)/2)
    }
}
@media screen and (max-width:679.98px){
    .slider-container{
        width:100%
    }
    .slider-wrapper{
        max-width:100%;
        padding:0 .5rem
    }
    .card{
        width:100%;
        min-width:90%
    }
}
@media screen and (max-width:368px){
    .slider-container{
        width:100%
    }
    :root{
        --card-width:280px
    }
    .slider-wrapper{
        max-width:100%
    }
    .card{
        width:calc(100% - 2rem);
        min-width:auto
    }
}
@media screen and (min-width:980px){
    .slider-wrapper{
        max-width:100%
    }
    .card{
        flex:0 0 calc((100% - var(--gap) * 2) / 3)
    }
}
.dots-container{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px
}
.dots-container .dot{
    width:10px;
    height:10px;
    background:#ccc;
    border-radius:50%;
    cursor:pointer;
    transition:background 0.3s ease
}
.dots-container .dot.active{
    background:#333
}
.regions-section{
    background-color:#73870f
}
.section-title{
    font-size:2rem;
    font-weight:700
}
.city-card{
    border-radius:8px;
    overflow:hidden;
    box-shadow:0 8px 20px rgb(0 0 0 / .25);
    transition:transform 0.3s ease,box-shadow 0.3s ease;
    background:#fff;
    height:100%
}
.city-link{
    text-decoration:none;
    color:inherit;
    display:block;
    position:relative;
    height:100%;
    overflow:hidden
}
.city-img{
    height:230px;
    object-fit:cover;
    transition:transform 0.4s ease;
    will-change:transform
}
.city-overlay{
    position:absolute;
    bottom:0;
    top:4%;
    left:0;
    right:0;
    height:100%;
    background:linear-gradient(to top,rgb(0 0 0 / 80%) 0%,rgb(0 73 84 / .3) 40%,transparent 100%);
    transition:background 0.3s ease;
    z-index:2;
    display:flex;
    justify-content:center;
    align-items:end;
    padding:20px
}
.city-name{
    background-color:rgb(255 255 255 / .95);
    color:#73870F;
    font-weight:600;
    padding:5px 18px;
    font-size:1rem;
    border-radius:4px;
    margin-bottom:16px;
    transition:transform 0.3s ease,background-color 0.3s ease;
    display:inline-block;
    z-index:3
}
.city-card:hover{
    transform:translateY(-6px);
    box-shadow:0 12px 28px rgb(0 0 0 / .3)
}
.city-card:hover .city-img{
    transform:scale(1.08)
}
.city-card:hover .city-name{
    background-color:#fff;
    transform:translateY(-4px)
}
.why-choose-us{
    background-color:#f9fafe
}
.why-choose-us .small-text{
    font-size:.9rem;
    letter-spacing:.5px
}
.why-choose-us h2{
    font-weight:700;
    line-height:1.3
}
.why-choose-us .why-list li{
    font-size:.95rem;
    color:#333;
    margin-bottom:8px;
    padding-left:1.2rem;
    position:relative
}
.why-choose-us .why-list li::before{
    content:"✔";
    position:absolute;
    left:0;
    color:#73870f
}
.why-choose-us .btn-info{
    background-color:#000;
    color:#fff;
    border:none;
    padding:.65rem 1.6rem;
    font-weight:600
}
.why-choose-us img{
    width:100%;
    height:500px;
    border-radius:20px;
    -webkit-border-radius:20px;
    -moz-border-radius:20px;
    -ms-border-radius:20px;
    -o-border-radius:20px;
    object-fit:cover
}
.animated-img{
    transition:transform 0.5s ease,box-shadow 0.3s ease;
    will-change:transform;
    border-radius:8px;
    box-shadow:0 10px 25px rgb(0 0 0 / .08)
}
.animated-img:hover{
    transform:scale(1.05) translateY(-5px);
    box-shadow:0 15px 30px rgb(0 0 0 / .1)
}
@media (max-width:767px){
    .why-choose-us img{
        margin-top:2rem;
        max-width:100%
    }
}
.why-book{
    background:#73870f;
    color:#fff;
    overflow:hidden
}
.row .section-title{
    font-size:48px;
    font-weight:800;
    color:#fff
}
.row .section-subtitle{
    font-size:16px;
    font-weight:400;
    color:#f1f1f1;
    text-align:center
}
.why-item{
    display:flex;
    align-items:center
}
.text-box{
    padding:15px;
    border-radius:8px;
    text-align:justify;
    flex:1
}
.why-item .text-box h5.highlight{
    color:#000;
    font-weight:700;
    margin-bottom:8px;
    font-size:18px
}
.why-item .text-box p{
    font-size:14px;
    line-height:1.6;
    color:#f1f1f1;
    margin:0
}
.icon-circle{
    background:#000;
    border-radius:50%;
    padding:15px;
    display:flex;
    justify-content:center;
    align-items:center;
    min-width:55px;
    min-height:55px;
    margin:0 15px
}
.icon-circle i{
    font-size:22px;
    color:#fff
}
.center-image{
    height:100%;
    width:100%
}
.center-image img{
    max-width:100%;
    height:500px;
    display:block;
    margin:0 auto;
    margin-bottom:-80px
}
@media (max-width:1024px){
    .center-image img{
        max-width:100%;
        height:715px;
        display:block
    }
}
@media (max-width:768px){
    .center-image{
        padding-bottom:50px
    }
    .row .section-title{
        font-size:26px
    }
    .center-image img{
        max-width:100%;
        height:400px;
        margin-bottom:10px
    }
}
@media (min-width:768px){
    .why-item{
        display:flex;
        align-items:center;
        justify-content:space-between
    }
    .text-box,.text{
        flex:1
    }
}
.center-image{
    max-width:100%;
    height:auto;
    display:block;
    margin:0 auto;
    margin-bottom:-60px
}
.why-item:last-child{
    margin-bottom:0
}
.qa-image{
    width:570px;
    max-height:600px;
    object-fit:cover;
    border-radius:20px;
    -webkit-border-radius:20px;
    -moz-border-radius:20px;
    -ms-border-radius:20px;
    -o-border-radius:20px
}
.faq-scroll-container{
    max-height:520px;
    overflow-y:auto;
    padding-right:5px
}
.faq-card{
    background-color:#f1f1f1;
    margin-bottom:10px;
    border-radius:8px;
    overflow:hidden;
    box-shadow:0 2px 6px rgb(0 0 0 / .05)
}
.faq-btn{
    width:100%;
    text-align:left;
    background-color:#f1f1f1;
    color:#004954;
    font-weight:600;
    padding:1rem 1.25rem;
    border:none;
    display:flex;
    justify-content:space-between;
    align-items:center
}
.faq-btn:hover{
    background-color:#004954;
    color:#fff
}
.arrow-icon{
    transition:transform 0.3s ease
}
.faq-btn[aria-expanded="true"] .arrow-icon{
    transform:rotate(180deg)
}
.faq-body{
    background-color:#fff;
    padding:1rem 1.25rem;
    font-size:.95rem;
    color:#333
}
.testimonials-section{
    background:#f8f9fa
}
.testimonials-section .subtitle{
    display:inline-flex;
    align-items:center;
    font-size:1rem;
    color:#00879c;
    margin-bottom:.5rem
}
.testimonials-section .subtitle span{
    display:block;
    width:40px;
    height:2px;
    background:#00879c;
    margin-right:.5rem
}
.testimonials-section h2{
    font-size:2rem;
    margin:0
}
.testimonial-card{
    background:#73870f;
    color:#fff;
    border-radius:8px;
    box-shadow:0 4px 20px rgb(0 0 0 / .1);
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    animation:fadeInUp 0.5s ease both
}
.testimonial-card .stars{
    font-size:1.2rem;
    color:gold
}
.testimonial-card blockquote{
    margin:0;
    font-size:1rem;
    line-height:1.5;
    flex-grow:1;
    margin-bottom:1rem
}
.testimonial-card hr{
    border-color:rgb(255 255 255 / .3);
    margin:0 0 1rem
}
.testimonial-footer{
    display:flex;
    justify-content:space-between;
    align-items:center
}
.testimonial-footer h6{
    color:#ffc107;
    margin:0
}
.testimonial-footer small{
    color:rgb(255 255 255 / .8)
}
.testimonial-footer i{
    opacity:.6
}
@keyframes fadeInUp{
    from{
        opacity:0;
        transform:translateY(30px)
    }
    to{
        opacity:1;
        transform:translateY(0)
    }
}
@media (max-width:575.98px){
    .testimonial-card{
        padding:1.5rem 1rem
    }
}
.latest-blogs{
    background-color:#f9f9f9
}
.latest-blogs .small{
    color:#73870f;
    text-transform:uppercase;
    letter-spacing:1px
}
.blog-card{
    border-radius:8px;
    overflow:hidden
}
.blog-card .card-img-top{
    object-fit:cover;
    height:180px
}
.date-badge{
    position:absolute;
    bottom:12px;
    left:12px;
    background-color:#73870f;
    color:#fff;
    padding:6px 12px;
    font-size:.85rem;
    font-weight:700;
    border-radius:50px
}
.blog-card .card-title{
    font-size:1.1rem;
    font-weight:600;
    margin-bottom:.75rem
}
.blog-card .card-text{
    font-size:.9rem;
    line-height:1.4
}
.btn-gold{
    background-color:#73870f;
    color:#fff;
    padding:.5rem 1rem;
    border-radius:4px
}
.btn-gold:hover{
    background-color:#000;
    color:#fff
}
.blog-card{
    display:flex;
    flex-direction:column
}
.blog-card .card-body{
    display:flex;
    flex-direction:column
}
.position-relative{
    width:100%
}
@media(max-width:767.98px){
    .blog-card .card-img-top{
        height:150px
    }
}
.footer{
    background-color:#1e2420;
    color:#e0e6e6
}
.footer-image{
    max-width:160px;
    margin-top:-10px
}
.footer h6{
    color:#fff;
    font-size:1.05rem;
    margin-bottom:1rem
}
.footer a{
    color:#93cfd5;
    text-decoration:none
}
.footer a:hover{
    color:#fff;
    text-decoration:underline
}
.footer ul li{
    color:#fff;
    line-height:30px
}
.footer ul li a{
    color:#b3d11c;
    font-size:15px
}
.footer i{
    color:#12c0d2
}
.footer hr.border-secondary{
    border-color:#0a3337
}
@media (max-width:767.98px){
    .footer .text-md-left{
        text-align:center!important
    }
    .footer-image{
        max-width:220px
    }
}
.footer-note{
    background-color:#f5f4f4;
    color:#333;
    font-size:.875rem
}
.footer-note .cert-logo{
    width:30vw;
    height:auto;
    max-width:550px;
    min-width:200px;
    vertical-align:middle
}
.note-text{
    font-size:11px;
    font-family:'Poppins',sans-serif
}
.contact-btn{
    position:fixed;
    right:20px;
    width:50px;
    height:50px;
    border:none;
    border-radius:50%;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:1000;
    box-shadow:0 2px 8px rgb(0 0 0 / .2);
    transition:transform 0.2s,box-shadow 0.2s
}
.btn-phone{
    bottom:20px;
    background-color:#28a745
}
.btn-whatsapp{
    bottom:80px;
    background-color:#25D366
}
.contact-buttons{
    position:fixed;
    bottom:50px;
    right:20px;
    display:flex;
    flex-direction:column;
    gap:12px;
    z-index:9999
}
.contact-btn{
    width:55px;
    height:55px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 6px 18px rgb(0 0 0 / .15);
    transition:transform 0.2s ease,box-shadow 0.2s ease;
    text-decoration:none
}
.btn-phone{
    background:#02e88c
}
.btn-whatsapp{
    background:#49e670
}
.contact-btn:hover{
    transform:scale(1.1);
    box-shadow:0 8px 22px rgb(0 0 0 / .25)
}
.modal-body p,.modal-body ul{
    font-size:.95rem;
    line-height:1.5
}
.custom-card{
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 4px 12px rgb(0 0 0 / .1);
    padding:10px
}
.custom-card img{
    height:170px;
    object-fit:cover;
    width:100%
}
.card-header-title{
    background-color:#73870f;
    color:#fff;
    font-size:12px;
    font-weight:600;
    padding:8px;
    text-align:center;
    width:100%
}
.days-nights{
    background-color:#73870f;
    color:#fff;
    display:flex;
    justify-content:space-around;
    padding:8px 15px;
    font-size:.9rem;
    width:100%;
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px
}
.text-teal{
    color:teal
}
.card-body{
    width:100%
}
.card-body p{
    font-size:.9rem;
    margin-bottom:5px
}
.price-text{
    font-size:1rem;
    font-weight:500
}
.price{
    font-size:1.6rem;
    font-weight:700;
    color:#73870f
}
.per{
    font-size:1rem;
    font-weight:500
}
.btn-custom{
    border-radius:4px;
    font-size:.9rem;
    padding:6px 12px;
    border:1px solid #00879c
}
.btn-custom:hover{
    background-color:#000;
    color:#fff
}
.me-2{
    margin-right:17px!important
}
.call-btn{
    background-color:#73870f;
    color:#fff;
    border-radius:0
}
@media (max-width:768px){
    .card-header-title{
        font-size:.9rem
    }
    .days-nights{
        font-size:.8rem
    }
    .price{
        font-size:1.4rem
    }
    .btn-custom{
        font-size:.8rem;
        padding:5px 8px
    }
}
@media (max-width:576px){
    .card-header-title{
        font-size:.8rem
    }
    .days-nights{
        font-size:.75rem
    }
    .price{
        font-size:1.2rem
    }
    .btn-custom{
        font-size:.75rem
    }
}
@media (max-width:992px){
    .card-header-title{
        font-size:1rem;
        padding:6px
    }
    .days-nights{
        font-size:.85rem;
        padding:6px 10px
    }
    .card-body p{
        font-size:.85rem
    }
    .price{
        font-size:1.3rem
    }
    .price-text{
        font-size:.9rem
    }
    .btn-custom{
        font-size:.8rem;
        padding:5px 10px
    }
    .call-btn{
        font-size:.9rem;
        padding:8px
    }
    .custom-card{
        padding:8px
    }
}
@media (max-width:768px){
    .card-header-title{
        font-size:.9rem
    }
    .days-nights{
        font-size:.8rem
    }
    .card-body p{
        font-size:.8rem
    }
    .price{
        font-size:1.2rem
    }
    .btn-custom{
        font-size:.75rem;
        padding:4px 8px
    }
    .call-btn{
        font-size:.8rem
    }
}
@media (max-width:576px){
    .card-header-title{
        font-size:.8rem
    }
    .days-nights{
        font-size:.75rem
    }
    .price{
        font-size:1.7rem
    }
    .btn-custom{
        font-size:1rem;
        padding:4px 25px
    }
    .call-btn{
        font-size:.75rem;
        padding:6px
    }
}
@media (max-width:430px){
    .price{
        font-size:1.7rem
    }
    .btn-custom{
        font-size:1.1rem;
        padding:5px 25px
    }
    .call-btn{
        font-size:.75rem;
        padding:6px
    }
}
@media (max-width:912px){
    nav.navbar{
        display:none!important
    }
    .cta-logos,.cat-box-main{
        display:none!important
    }
    .header-mobile-wrapper{
        display:flex;
        align-items:center;
        justify-content:space-between;
        flex-wrap:nowrap;
        padding:0 8px;
        background-color:#fff
    }
    .small-logo img{
        height:auto;
        width:auto;
        max-height:60px;
        max-width:80px;
        object-fit:contain;
        display:block
    }
    .small-group-logo{
        flex:1;
        text-align:center
    }
    .small-group-logo img{
        height:auto;
        max-height:60px;
        width:auto;
        max-width:100%;
        object-fit:contain;
        display:inline-block
    }
    .navbar-toggler{
        border:none;
        background:#fff0;
        padding:0;
        margin:0;
        outline:none;
        flex-shrink:0
    }
    .navbar-toggler-icon{
        width:32px;
        height:32px;
        background-repeat:no-repeat;
        background-position:center;
        background-size:contain;
        background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%23007c89' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")
    }
    @media (max-width:600px){
        .header-mobile-wrapper{
            padding:0 6px
        }
        .small-logo img{
            max-height:50px;
            max-width:60px
        }
        .small-group-logo img{
            max-height:90px;
            max-width:290px
        }
        .navbar-toggler-icon{
            width:36px;
            height:36px
        }
    }
    @media (max-width:400px){
        .header-mobile-wrapper{
            gap:4px;
            padding:0 5px
        }
        .small-logo img{
            height:70px;
            width:70px
        }
        .small-group-logo img{
            height:50px;
            width:245px
        }
        .navbar-toggler-icon{
            width:32px;
            height:32px
        }
    }
    #mainNavbar{
        background:#007c89;
        width:100%!important;
        margin:0;
        padding:0
    }
    #mainNavbar .navbar-nav,#mainNavbar .nav-item,#mainNavbar .nav-link{
        width:100%!important
    }
    #mainNavbar .nav-link{
        display:block;
        padding:12px 15px;
        color:#fff!important;
        text-align:left
    }
    #mainNavbar .dropdown-menu{
        width:100%!important;
        border-radius:0;
        background:#006b76
    }
    #mainNavbar .dropdown-item{
        color:#fff!important;
        padding:10px 15px!important
    }
    .header .container-fluid,.header .row,.header .col-lg-12{
        padding-left:0!important;
        padding-right:0!important;
        margin-left:0!important;
        margin-right:0!important
    }
}
