/*=========================================================
            LARGE DEVICES
=========================================================*/

@media (max-width:1399px){

.container{

    max-width:1140px;

}

.hero-content h1{

    font-size:68px;

}

.main-menu{

    gap:28px;

}

.header-wrapper{

    padding:0 25px;

}

}


/*=========================================================
            LAPTOP
=========================================================*/

@media (max-width:1199px){

.container{

    max-width:960px;

}



.hero-content{

    max-width:620px;

}

.hero-content h1{

    font-size:58px;

}

.hero-content p{

    font-size:17px;

}

.main-menu{

    gap:20px;

}

.main-menu>li>a{

    font-size:14px;

}

.logo img{

    max-width:150px;

}

.header-right .theme-btn{

    display:none;

}

}


/*=========================================================
            TABLET
=========================================================*/

@media (max-width:991px){
  

.hero-item {
  height: 320px;
}

.topbar{

    display:block;

}

.topbar-wrapper{

    min-height:44px;

    padding:8px 0;

    justify-content:center;

    gap:10px;

}

.topbar-left{

    width:100%;
    justify-content:center;
    gap:18px;

}

.topbar-wrapper{

    flex-direction:column;

    padding:10px 0;

}

.topbar-left,
.topbar-right{

    justify-content:center;

}

.topbar-left a{

    font-size:13px;

}

.main-header{

    margin-top:-35px;

}

.header-wrapper{

    min-height:80px;

    padding:0 20px;

    border-radius:0;

}

.logo img{

    max-width:145px;

}

.main-menu{

    display:none;

}

.menu-toggle{

    display:flex;

}



.hero-content{

    max-width:100%;

}

.hero-content h1{

    font-size:48px;

}

.hero-content p{

    max-width:100%;

    font-size:16px;

}

.hero-btn{

    gap:15px;

}

.hero-btn .theme-btn,

.hero-btn .border-btn{

    min-width:180px;

}

.hero-slider .owl-prev{

    left:20px;

}

.hero-slider .owl-next{

    right:20px;

}

.hero-slider .owl-prev,

.hero-slider .owl-next{

    width:55px;

    height:55px;

}

}


/*=========================================================
            MOBILE
=========================================================*/

@media (max-width:767px){

.container{

    padding:0 20px;

}



.hero-content{

    text-align:center;

}

.hero-content span{

    justify-content:center;

}

.hero-content span::before{

    display:none;

}

.hero-content h1{

    font-size:38px;

    line-height:1.2;

}

.hero-content p{

    font-size:15px;

    margin-bottom:35px;

}

.hero-btn{

    justify-content:center;

}

.hero-btn .theme-btn,

.hero-btn .border-btn{

    width:100%;

}

.hero-slider .owl-nav{

    display:none;

}

.hero-slider .owl-dots{

    bottom:20px;

}

.header-wrapper{

    min-height:75px;
    padding:0 18px;
  border-radius: 10px;
}

.logo img{

    max-width:130px;

}

.menu-toggle{

    width:48px;

    height:48px;

}

.mobile-menu{

    width:340px;

}
.mobile-logo img {
  max-width: 110px;
}
.mobile-menu-list > li > a{
  padding: 10px 0;
}

}


/*=========================================================
            SMALL MOBILE
=========================================================*/

@media (max-width:575px){

.container{

    padding:0 15px;

}



.hero-content h1{

    font-size:30px;

}

.hero-content p{

    font-size:14px;

    line-height:1.8;

}

.hero-content span{

    font-size:13px;

    letter-spacing:2px;

}

.theme-btn,

.border-btn{

    height:50px;

    font-size:14px;

}

.logo img{

    max-width:115px;

}

.header-wrapper{

    min-height:70px;

    padding:0 15px;

}

.menu-toggle{

    width:44px;

    height:44px;

}

.menu-toggle span{

    width:20px;

}

.mobile-menu{

    width:100%;

}

  .mobile-body {
    padding: 0 20px;
  }

.mobile-body{

    padding:20px;

}

.hero-slider .owl-dots{

    bottom:15px;

}

}


/*=========================================================
            EXTRA SMALL
=========================================================*/

@media (max-width:380px){

.hero-content h1{

    font-size:26px;

}

.hero-content p{

    font-size:13px;

}



}








/*=========================================================
            MOBILE NAVIGATION
=========================================================*/

@media (max-width:991px){

.main-header{

    margin-top:0;
    position:relative;

}

.header-wrapper{
    margin-top: -40px;
    min-height:75px;
    padding:0 18px;
    border-radius:10px;

}

.logo img{

    max-width:140px;

}

.header-right{

    gap:15px;

}

.header-right .theme-btn{

    display:none;

}

.menu-toggle{

    display:flex;

}

/*==========================
        MOBILE MENU
==========================*/

.main-menu{

    position:absolute;

    top:100%;
    left:0;

    width:100%;

    display:none;
    flex-direction:column;

    background:#fff;

    border-radius:0 0 18px 18px;

    box-shadow:
    0 20px 45px rgba(0,0,0,.12);

    overflow:hidden;

    z-index:999;

    animation:menuFade .35s ease;

}

.main-menu.active{

    display:flex;

}

@keyframes menuFade{

    from{

        opacity:0;
        transform:translateY(-15px);

    }

    to{

        opacity:1;
        transform:translateY(0);

    }

}

/*==========================
        MENU ITEM
==========================*/

.main-menu>li{

    width:100%;

    border-bottom:1px solid #ececec;

}

.main-menu>li:last-child{

    border-bottom:none;

}

.main-menu>li>a{

    display:flex;

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

    width:100%;

    height:auto;

    padding: 10px 15px;

    color:#222;

    font-size:15px;

    font-weight:700;

}

.main-menu>li>a:hover{

    color:var(--primary);

    background:#fff6f8;

    padding-left:30px;

}

/*==========================
      SUB MENU
==========================*/

.sub-menu{

    position:static;

    display:none;

    opacity:1;

    visibility:visible;

    transform:none;

    width:100%;

    min-width:100%;

    border-radius:0;

    box-shadow:none;

    background:#fafafa;

}

.menu-item-has-children.active>.sub-menu{

    display:block;

}

.sub-menu li{

    border-top:1px solid #ececec;

}

.sub-menu li a{

    display:block;

    padding:14px 40px;

    color:#666;

    font-size:14px;

    font-weight:600;

}

.sub-menu li a:hover{

    background:#fff;

    color:var(--primary);

    padding-left:50px;

}

/*==========================
      DROPDOWN ICON
==========================*/

.menu-item-has-children>a::after{

    content:"\f107";

    font-family:"Font Awesome 6 Free";

    font-weight:900;

    transition:.35s;

}

.menu-item-has-children.active>a::after{

    transform:rotate(180deg);

}

/*==========================
      STICKY HEADER
==========================*/

  .main-header.fixed {
    padding: 0;
    top: 50px;
  }
.main-header.fixed .header-wrapper{

    min-height:70px;

}

.main-header.fixed .main-menu > li > a {
  height: 100%;
}

/* Active */

.menu-toggle.active span:nth-child(1){

    transform:translateY(8px) rotate(45deg);

}

.menu-toggle.active span:nth-child(2){

    opacity:0;
    transform:scaleX(0);

}

 .menu-toggle.active span:nth-child(3) {
    transform: translateY(-8px) rotate(-46deg);
  }

}


@media(max-width:991px){

.booking-wrapper{

    flex-direction:column-reverse;

}

.booking-content,
.booking-image{

    width:100%;

}

.section-heading h2{

    font-size:34px;

}

.experience-card{

    left:20px;

    bottom:20px;

}

}

@media(max-width:575px){

.booking-experience{

    padding:80px 0;

}

.section-heading h2{

    font-size:28px;

}

.booking-features{

    flex-direction:column;

}

.feature-box{

    width:100%;

}

.experience-card{

    position:relative;

    left:0;

    bottom:0;

    margin-top:20px;

}

}



@media(max-width:1200px){

.room-card{

    min-width:calc(50% - 15px);

}

}

@media(max-width:768px){

.rooms-section{

    padding:80px 0;

}

.rooms-grid{

    gap:25px;

}

.room-card{

    min-width:100%;

}

.room-image img{

    height:300px;

}

.room-content h3{

    font-size:24px;

}

}

@media(max-width:575px){

.room-image img{

    height:250px;

}

.theme-btn{

    width:100%;

}

}



/*==================================
    DESTINATION RESPONSIVE
==================================*/

@media(max-width:991px){

.destination-section{

    padding:80px 0;

}

.destination-wrapper{

    flex-direction:column;

    gap:45px;

}

.destination-left{

    text-align:center;

}

.title-border{

    margin:0 auto 30px;

}

.destination-left h2{

    font-size:36px;

}

.destination-right{

    width:100%;

    max-width:420px;

}

}

@media(max-width:575px){

.destination-left h2{

    font-size:28px;

}

.destination-left p{

    font-size:15px;

    line-height:1.9;

}

.info-card{

    padding:35px 25px;

}

.info-card h3{

    font-size:28px;

}

.info-card i{

    width:75px;

    height:75px;

    font-size:28px;

}

}
/*======================================
    RESERVE CTA RESPONSIVE
======================================*/

@media(max-width:991px){

.reserve-cta{

    padding:80px 0;

}

.reserve-box{

    flex-direction:column;

    text-align:center;

    padding:40px 30px;

    gap:30px;

}

.reserve-content h2{

    font-size:34px;

}

}

@media(max-width:767px){

.reserve-content h2{

    font-size:28px;

}

.reserve-content br{

    display:none;

}

.reserve-call{

    width:220px;

    height:58px;

    font-size:15px;

}

}

@media(max-width:575px){

.reserve-box{

    padding:30px 20px;

}

.reserve-content h2{

    font-size:24px;

    line-height:1.5;

}

.reserve-call{

    width:100%;

    max-width:260px;

}

.reserve-box::before,

.reserve-box::after{

    display:none;

}

}

@media(max-width:991px){

.discover-wrapper{

    flex-direction:column-reverse;

}

.discover-content,
.discover-image{

    width:100%;

}

.discover-badge{

    right:20px;

    bottom:20px;

}

}

@media(max-width:767px){

.discover-section{

    padding:80px 0;

}

.info-item{

    width:100%;

}

}

@media(max-width:575px){

.discover-badge{

    position:relative;

    right:0;

    bottom:0;

    margin-top:20px;

    width:100%;

}

.discover-content p{

    font-size:15px;

}

}

@media(max-width:991px){

.explore-card{

    width:calc(50% - 15px);

}

}

@media(max-width:767px){

.explore-section{

    padding:80px 0;

}

.explore-card{

    width:100%;

}

.explore-img img{

    height:240px;

}

.explore-content{

    padding:22px;

}

.explore-content h3{

    font-size:24px;

}

}
/*==========================================
 Responsive
==========================================*/

@media (max-width:1199px){

.info-wrapper{
    gap:25px;
}

.info-card{
    padding:40px 28px;
}

.section-heading h2{
    font-size:38px;
}

}

@media (max-width:991px){

.lodge-info-section{
    padding:80px 0;
}

.info-wrapper{
    display:flex;
    flex-wrap:wrap;
    gap:25px;
}

.info-card{
    flex:0 0 calc(50% - 13px);
}

.featured{
    transform:none;
}

.featured:hover{
    transform:translateY(-10px);
}

.section-heading h2{
    font-size:34px;
}

}

@media (max-width:767px){
html,
body{
    width:100%;
    overflow-x:hidden;
}
.lodge-info-section{
    padding:70px 0;
}

.section-heading{
    margin-bottom:30px;
    padding:0 10px;
}

.section-heading span{
    font-size:13px;
    letter-spacing:1.5px;
}

.section-heading h2{
    font-size:28px;
    line-height:1.3;
}

.section-heading p{
    font-size:15px;
}

.info-wrapper{
    display:block;
}

.info-card{
    width:100%;
    margin-bottom:25px;
    padding:35px 25px;
    border-radius:20px;
}

.info-card:last-child{
    margin-bottom:0;
}

.icon{
    width:75px;
    height:75px;
    font-size:28px;
    margin-bottom:20px;
}

.info-card h3{
    font-size:22px;
    margin-bottom:18px;
}

.info-card p{
    font-size:15px;
    line-height:1.8;
}

}

@media (max-width:575px){

.lodge-info-section{
    padding:60px 0;
}

.section-heading h2{
    font-size:24px;
}

.section-heading p{
    font-size:14px;
}

.info-card{
    padding:30px 20px;
}

.icon{
    width:68px;
    height:68px;
    font-size:24px;
}

.info-card h3{
    font-size:20px;
}

.info-card p{
    font-size:14px;
    line-height:1.7;
}

}

@media (max-width:400px){

.section-heading h2{
    font-size:22px;
}

.info-card{
    padding:25px 18px;
}

.icon{
    width:60px;
    height:60px;
    font-size:22px;
}

.info-card h3{
    font-size:18px;
}

.info-card p{
    font-size:13px;
}

}

/*==========================================
   RESPONSIVE
==========================================*/

@media (max-width:1200px){

.direction-wrapper{
    gap:50px;
}

.direction-text h3{
    font-size:28px;
}

.direction-card{
    padding:30px;
}

.direction-icon{
    width:70px;
    height:70px;
    min-width:70px;
    font-size:28px;
}

.info-box{
    padding:20px;
}

}

/*============================*/

@media (max-width:991px){

.direction-wrapper{
    flex-direction:column;
}

.direction-image,
.direction-content{
    width:100%;
}

.direction-image{
    order:1;
}

.direction-content{
    order:2;
}

.direction-img{
    max-width:720px;
    margin:auto;
}

.direction-card{
    padding:28px;
}

.direction-info{
    flex-direction:column;
}

.info-box{
    width:100%;
}

.direction-text h3{
    font-size:26px;
}

.direction-text p{
    font-size:15px;
    line-height:1.8;
}

}

/*============================*/

@media (max-width:767px){

.direction-section{
    padding:80px 0;
}

.direction-wrapper{
    gap:40px;
}

.direction-card{
    flex-direction:column;
    text-align:center;
    padding:25px;
}

.direction-icon{
    margin:auto;
}

.direction-text .mini-title{
    display:block;
    margin-bottom:8px;
}

.direction-text h3{
    font-size:24px;
}

.direction-info{
    gap:15px;
}

.info-box{
    flex-direction:column;
    text-align:center;
    padding:20px;
}

.info-box i{
    margin-bottom:8px;
}

.direction-badge{
    left:20px;
    bottom:20px;
    padding:12px 18px;
}

.direction-badge i{
    width:40px;
    height:40px;
    font-size:16px;
}

.direction-badge span{
    font-size:14px;
}

}

/*============================*/

@media (max-width:575px){

.direction-section{
    padding:70px 0;
}

.direction-wrapper{
    gap:30px;
}

.direction-img{
    border-radius:18px;
}

.direction-img::after{
    inset:10px;
    border-radius:12px;
}

.direction-card{
    border-radius:18px;
    padding:20px;
}

.direction-text h3{
    font-size:22px;
    margin-bottom:15px;
}

.direction-text p{
    font-size:14px;
    line-height:1.75;
}

.direction-icon{
    width:65px;
    height:65px;
    min-width:65px;
    font-size:24px;
    border-radius:18px;
}

.info-box{
    border-radius:18px;
    padding:18px;
}

.info-box i{
    width:55px;
    height:55px;
    min-width:55px;
    font-size:22px;
    border-radius:15px;
}

.info-box h5{
    font-size:17px;
}

.info-box span{
    font-size:14px;
}

.direction-badge{
    width:calc(100% - 30px);
    left:15px;
    right:15px;
    bottom:15px;
    justify-content:center;
}

}