.gallery-box {
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}


    /* Ảnh/video */
    .gallery-box img,
    .gallery-box video {
        width: 100%;
        height: 250px; /* chiều cao mặc định */
        object-fit: cover;
        display: block;
        transition: transform 0.3s ease;
    }

    /* Icon Play trên video */
    .gallery-box .play-icon {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 48px;
        color: rgba(255, 255, 255, 0.9);
        pointer-events: none;
        text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
        transition: transform 0.3s ease, opacity 0.3s ease;
    }

    .gallery-box:hover .play-icon {
        transform: translate(-50%, -50%) scale(1.2);
        opacity: 1;
    }
#page{

}
.bg-pagein{}

.section-header {
    padding-bottom: 10px;
}

.section-header.swidth{
    width: 60%;
    margin: 0 auto;
}

.section-header h2 {
    color: #000;
    font-size: 48px;
    font-weight: 600;
    text-transform: uppercase;
    font-family: "Cormorant Upright", serif;
}
.section-header p {
    color: #848484;
    font-size:16px;
}

.btn-themes{
    color: #000;
    text-align: center;
    font-size: 16px;
    background: #E1B876;
    padding: 10px 26px;
    box-shadow: none;
    text-transform: uppercase;
    border-radius: 36px;
}

.bg-section{
    background: #fff5e9;
    padding: 30px 0;
    margin: 48px 0;
    position:relative;
}
.bg-section::before{
    content:'';
    background: url(../images/bg-wave.png) repeat-x;
    height: 29px;
    display: block;
    position: absolute;
    width: 100%;
    top: -29px;
    left: 0;
}

.bg-section::after{
    content:'';
    background: url(../images/bg-wave-2.png) repeat-x;
    height: 29px;
    display: block;
    position: absolute;
    width: 100%;
    bottom: -29px;
    left: 0;
}

#header{
    background: #363A43;
    color: #fff;
}
.fixed-menu {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;
    padding: 10px 0;
    background:#fff;
}

#logo{ text-align: center;}
#logo img{ height: 52px;}

.logo-menu img{ height: 78px;}

#title-page{ background:#F1ECF8; padding:40px 0;}
#title-page h2{ text-align: center; color:#E1B876; font-size: 48px;}

#banner {
    height: 600px;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#banner #description{
    margin-left: 120px;
}

#banner.banner-pagein #description{
    width: 480px;
}

#banner #description h2{
    color: #000;
    font-family: "Cormorant Upright", serif;
    font-size: 52px;
    font-weight: 600;
    line-height: 53px;
    text-transform: uppercase;
}
#banner #description .desc{
    color: #000;
    font-size: 20px;
    font-weight: 300;
}
#banner #description .desc span{
    color: #A8782D;
    font-size: 20px;
    font-weight: 600;
}

#carouselBanner .carousel-indicators button {
    width: 10px;
    height: 10px;
    border-radius: 100%;
}

#banner .carousel-caption{
    color: #000;
    top: 30%;
    left: 15%;
    padding: 0;
    text-align: left;
    width: 620px;
}

#banner .carousel-caption h5{
    font-size: 50px;
    font-weight: 600;
    color: #E1B876;
    margin-bottom: 35px;
}
.banner-caption {
    position: absolute;
    top: 50%;
    transform: translateY(-50%); /* Giúp căn giữa theo chiều dọc */
    left: 10%;
    z-index: 2;
}

    .banner-caption h2 {
        color: #000;
        font-family: "Cormorant Upright", serif;
        font-size: 52px;
        font-weight: 600;
        line-height: 53px;
        text-transform: uppercase;
    }

    .banner-caption .desc {
        color: #000;
        font-size: 20px;
        font-weight: 300;
    }

    .banner-caption span {
        color: #A8782D;
        font-size: 20px;
        font-weight: 600;
    }
#banner .section-header h2{
    color: #fff;
}
#header-booking{
    margin: 0 20px;
}
#header-booking a {
    color: #000;
    font-size: 14px;
    font-weight: 400;
    text-align: center;
    border-radius: 20px;
    background: #E1B876;
    padding: 8px 16px;
    box-shadow: none;
    text-transform: uppercase;
}

@media screen and (max-width: 768px) {

    .section-header.swidth{
        width: 100%;
    }
    #banner {
        height: 400px;
        background-size: auto 100%;
        background-repeat: no-repeat;
        background-position: center center;
    }
    #banner.banner-pagein #description{
        width: 100%;
    }
    #banner #description {
        margin-left: 0px;
    }
    #banner #description h2 {
        font-size: 40px;
        font-weight: 600;
        line-height: 53px;
    }
    #banner #description .desc {
        font-size: 18px;
    }

    .section-header h2 {
        font-size: 38px;
    }
    #logo{ text-align: left;}
    #banner{ margin-top: 20px; }
    #header-language{ margin-right: 60px;}
}

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/* Desktop Navigation */
@media (min-width: 1200px) {
    .navmenu {
        padding: 0;
    }

    .navmenu ul {
        margin: 0;
        padding: 0;
        display: flex;
        list-style: none;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }

    .navmenu li {
        position: relative;
    }

    .navmenu a, .navmenu a:focus {
        color: #fff;
        font-size: 15px;
        padding: 0 20px;
        font-weight: 400;
        display: flex;
        align-items: center;
        justify-content: space-between;
        white-space: nowrap;
        transition: 0.3s;
        text-transform: uppercase;
    }

    .navmenu a i,
    .navmenu a:focus i {
        font-size: 12px;
        line-height: 0;
        margin-left: 5px;
        transition: 0.3s;
    }

    .navmenu li:hover>a,
    .navmenu .active,
    .navmenu .active:focus {
        color: #E1B876;
    }

    .navmenu .dropdown ul {
        margin: 0;
        padding: 0;
        background: #fff;
        display: block;
        position: absolute;
        visibility: hidden;
        left: 0px;
        top: 130%;
        opacity: 0;
        transition: 0.3s;
        border-radius: 4px;
        z-index: 99;
    }

    .navmenu .dropdown ul li {
        min-width: 200px;
    }

    .navmenu .dropdown ul a {
        padding: 10px 20px;
        font-size: 15px;
        text-transform: none;
    }

    .navmenu .dropdown ul a i {
        font-size: 12px;
    }

    .navmenu .dropdown ul a:hover,
    .navmenu .dropdown ul .active:hover,
    .navmenu .dropdown ul li:hover>a {
        color: #fff;
    }

    .navmenu .dropdown:hover>ul {
        opacity: 1;
        top: 100%;
        visibility: visible;
    }

    .navmenu .dropdown .dropdown ul {
        top: 0;
        left: -90%;
        visibility: hidden;
    }

    .navmenu .dropdown .dropdown:hover>ul {
        opacity: 1;
        top: 0;
        left: -100%;
        visibility: visible;
    }

    .navmenu .megamenu {
        position: static;
    }

    .navmenu .megamenu ul {
        margin: 0;
        padding: 10px;
        box-shadow: 0px 0px 20px rgba(0,0,0, 0.1);
        display: block;
        position: absolute;
        top: 130%;
        left: 0;
        right: 0;
        visibility: hidden;
        opacity: 0;
        display: flex;
        transition: 0.3s;
        border-radius: 4px;
        z-index: 99;
    }

    .navmenu .megamenu ul li {
        flex: 1;
    }

    .navmenu .megamenu ul li a,
    .navmenu .megamenu ul li:hover>a {
        padding: 10px 20px;
        font-size: 15px;
        color: #E1B876;
    }

    .navmenu .megamenu ul li a:hover,
    .navmenu .megamenu ul li .active,
    .navmenu .megamenu ul li .active:hover {
        color: #E1B876;
    }

    .navmenu .megamenu:hover>ul {
        opacity: 1;
        top: 100%;
        visibility: visible;
    }

    .navmenu .dd-box-shadow {
        box-shadow: 0px 0px 30px rgba(0,0,0, 0.15);
    }
}

/* Mobile Navigation */
@media (max-width: 1199px) {

    #icon-menu{ position: absolute; top: 19px; right: 5px; }
    .mobile-nav-active #icon-menu{top: 30px;  right: 10px; }
    .mobile-nav-toggle {
        color: #E1B876;
        font-size: 36px;
        line-height: 0;
        margin-right: 10px;
        cursor: pointer;
        transition: color 0.3s;
    }

    .navmenu {
        padding: 0;
        z-index: 9997;
    }

    .navmenu ul {
        display: none;
        position: absolute;
        inset: 60px 20px 20px 20px;
        padding: 10px 0;
        margin: 0;
        border-radius: 6px;
        overflow-y: auto;
        transition: 0.3s;
        z-index: 9998;
        box-shadow: 0px 0px 30px rgba(0,0,0, 0.1);
    }

    .navmenu a,
    .navmenu a:focus {
        color: #E1B876;
        padding: 10px 20px;
        font-size: 17px;
        font-weight: 500;
        display: flex;
        align-items: center;
        justify-content: space-between;
        white-space: nowrap;
        transition: 0.3s;
    }

    .navmenu a i,
    .navmenu a:focus i {
        font-size: 12px;
        line-height: 0;
        margin-left: 5px;
        width: 30px;
        height: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        transition: 0.3s;
        background-color: rgba(0,0,0, 0.1);
        color: #fff;
    }

    .navmenu a i:hover,
    .navmenu a:focus i:hover {
        color: #fff;
    }

    .navmenu a:hover,
    .navmenu .active,
    .navmenu .active:focus {
        color: #E1B876;
    }

    .navmenu .active i,
    .navmenu .active:focus i {
        color: #fff;
        transform: rotate(180deg);
    }

    .navmenu .dropdown ul,
    .navmenu .megamenu ul {
        position: static;
        display: none;
        z-index: 99;
        padding: 0;
        margin: 0px 20px;
        background-color: #fff;
        transition: all 0.5s ease-in-out;
    }

    .navmenu .dropdown ul ul,
    .navmenu .megamenu ul ul {
        background-color: rgba(33, 37, 41, 0.1);
    }

    .navmenu .dropdown>.dropdown-active,
    .navmenu .megamenu>.dropdown-active {
        display: block;
        background-color: rgba(33, 37, 41, 0.03);
    }

    .mobile-nav-active {
        overflow: hidden;
    }
    .mobile-nav-active .mobile-nav-toggle.bi-x {
        color: #fff;
        position: absolute;
        font-size: 48px;
        top: -10px;
        right: 20px;
        margin-right: 0;
        z-index: 9999;
    }

    .mobile-nav-active .navmenu {
        position: fixed;
        overflow: hidden;
        inset: 0;
        background: rgba(0, 0, 0, 0.9);
        transition: 0.3s;
    }

    .mobile-nav-active .navmenu>ul {
        display: block;
    }
    .mobile-nav-active .navmenu>ul>li a {
        color: #fff;
    }
}

#sec_content img{ max-width: 100%!important;}

#about-us{
    position: relative; padding: 80px 0;
}
#about-us .inner{
    margin-left: 50px;
}

#about-us .inner .content{
    text-align: justify;
}

#about-us .viewmore a{
    color: #F5931E;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}

@media screen and (max-width: 768px) {
    #about-us{ padding-top: 0;}
    #header-about{ text-align: center;}
    #about-us .inner{
        margin-left: 0px;
    }
}

#about-us-detail{
    background: #d5effb;
    color: #fff;
    padding: 50px 0;
    font-weight: 300;
}

#about-us-detail h2{
    font-size: 36px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

#about-us-mission{
    margin-top: 30px;
}

#about-us-target{
    margin-top: 80px;
    padding:60px 0;
    background: #F8F0E7;
    overflow: hidden;
}

/*--------------------------------------------------------------
# Home Services
--------------------------------------------------------------*/

.home-services{  }
.home-services .bg-section{
    padding-top: 80px;
    padding-bottom: 80px;
}

#services.home-services #serviceTab{
    padding-left: 25px;
    padding-right: 25px;
}
.home-services .box-service{ text-align: center;}
.home-services .box-service .img{}
.home-services .box-service .title{
    color: #E1B876;
    font-size: 20px;
    font-weight: 600;
    margin: 15px 0;
}
.home-services .box-service .desc{}
.home-services .box-service .more{ margin-top: 15px;}
.home-services .box-service .more a{color: #2A2A2A; text-decoration-line: underline;}

/*--------------------------------------------------------------
#  Services Page
--------------------------------------------------------------*/
#services .note{
    margin-top:15px;
    margin-bottom:25px;
    color: #4B4B4B;
    text-align: justify;
    font-size: 16px;
    font-weight: 300;
    line-height: 21px;
    padding: 5px 25px;
}
#services .services-tabs{
    background: #E1B876;
}
#services #serviceTab{
}

#services #serviceTab .nav-item{

}

#services #serviceTab .nav-item .nav-link{
    color: #000;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    background: none;
    border: none;
    width: 140px;
    height: 70px;
    padding: 20px 0;
    border-bottom: 3px solid #E1B876!important;
}

#services #serviceTab .nav-item .nav-link:hover, #services #serviceTab .nav-item .nav-link.active{
    border-bottom: 3px solid #000!important;
}

#services .services-box {
    border-radius: 6px;
    border: 1px solid #BEBEBE;
    padding: 15px 35px;
    background: #fff;
    margin-bottom: 8px;
}
#services .services-box .name h3{
    text-transform: uppercase;
    font-size: 16px;
    font-weight:600;
}
#services .services-box .name .price{
    text-transform: uppercase;
}
#services .services-box .book a{
    border:1px solid #BEBEBE ;
    border-radius: 20px;
    padding: 8px 20px;
}

    #services .services-box .book a:hover {
        border: 1px solid #E1B876;
        background: #fff5e9;
    }

@media screen and (max-width: 768px) {
    #services .services-tabs{
        overflow: hidden;
        height: 113px;
        position: relative;
    }
    #services .services-tabs:after{
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        background: #fff;
        height: 20px;
    }
    #services.services .services-tabs:after{
        background: #fff;
    }

    #services .note{
        margin-top: 5px;
        padding-left: 0;
    }
    #services #serviceTab {
        overflow: auto;
        overflow-y: hidden;
        position: relative;
        width: 100%;
        height: 100%;
        display: flex;
        flex-wrap: nowrap;
        padding: 0!important;
        border-bottom: none!important;
    }

    #services #serviceTab .nav-item{
       margin: 0 10px;
    }

    #services .services-box {
        padding: 15px;
    }

}

/*--------------------------------------------------------------
# Gallery Home
--------------------------------------------------------------*/

.gallery-item{
    margin-bottom: 26px;
}

.gallery-item img{
    border-radius: 30px;
    width: 100%;
    height: 280px;
    object-fit: cover;
}

@media screen and (max-width: 768px) {
    .gallery-item img{
        height: 200px;
    }
}

/*--------------------------------------------------------------
#  Gallery Page
--------------------------------------------------------------*/

#gallery{
    position: relative;
    padding: 50px 0;
}

#gallery #galleryTab{
    border-bottom: none;
    padding-bottom: 30px;
}
#gallery #galleryTab .nav-item{
    width: 14.2%;

}
#gallery #galleryTab .nav-item .nav-link{
    color: #000;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    border: 0;
    height: 70px;
}

#gallery #galleryTab .nav-item .nav-link:hover, #gallery #galleryTab .nav-item .nav-link.active{
    border-bottom: 3px solid #E1B876!important;
}
#gallery .gallery-box{
    margin-bottom: 20px;
}
#gallery .gallery-box img{
    width: 100%;
    height: 280px;
    object-fit: cover;
    border-radius: 30px;
}

@media screen and (max-width: 768px) {
    #gallery .gallery-tabs{
        overflow: hidden;
        position: relative;
        height: 113px;
    }
    #gallery .gallery-tabs:after{
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        background: #fff;
        height: 20px;
    }

    #gallery .note{
        margin-top: 5px;
    }
    #gallery #galleryTab {
        overflow: auto;
        overflow-y: hidden;
        position: relative;
        width: 100%;
        height: 100%;
        display: flex;
        flex-wrap: nowrap;
        padding: 0!important;
        border-bottom: none!important;
    }
    #gallery #galleryTab .nav-item {
        width: unset;
    }
    #gallery #galleryTab .nav-item .nav-link {
        width: 120px;
        height: 60px;
        padding-top: 0;
        padding-bottom: 0;
    }

    #gallery .gallery-box img{
        height: 200px;
    }

}


/*--------------------------------------------------------------
# Experience Home
--------------------------------------------------------------*/
#experience{
    background: url(../images/bg-newsletter.png) no-repeat;
    height: 450px;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top:40px;
    margin-top: 50px;
}
#experience .section-header{
    width: 60%;
    color: #000;
}
#experience .section-header h2{
    font-size: 40px;
    font-weight: 700;
    line-height: 44px; /* 110% */
    text-transform: uppercase;
}
#experience .section-header p{
    color: #000;
}
#experience .section-header p span{
    font-size: 20px;
    font-weight: 500;
}
#experience .btn-themes{
    color: #000;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    border-radius: 36px;
    background: linear-gradient(90deg, #C39653 0%, #E1B876 38.46%, #C49754 97.6%);
}

@media screen and (max-width: 768px) {
    #experience .section-header{
        width: 100%;
        color: #000;
    }
    #experience .section-header h2{
        font-size: 30px;
        line-height: 36px;
    }
}

/*--------------------------------------------------------------
# Discount About Section
--------------------------------------------------------------*/
#discount{
    background: url(../images/bg-discount.png) no-repeat;
    height: 450px;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top:40px;
    text-align: center;
    margin-top: 50px;
}
#discount .section-header h2{
    color: #000;
    text-transform: uppercase;
    font-size: 38px;
    line-height: 48px;
}
#discount .section-header p{
    color: #000;
}
@media screen and (max-width: 768px) {
    #discount .section-header h2{
        font-size: 30px;
        line-height: 46px;
    }
}
/*--------------------------------------------------------------
# Why us
--------------------------------------------------------------*/

#why-us{}
#why-us .box-whyus{
    padding: 10px 20px;
    text-align: center;
    width: 260px;
    margin: 0 auto;
}
#why-us .box-whyus .img img{ width: 58px;}
#why-us .box-whyus .title{
    margin-top: 8px;
    color: #000;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 15px;
}

#why-us .box-whyus .desc{
    color: #232023;
    text-align: center;
    font-size: 12px;
    font-weight: 300;
    line-height: 19px; /* 158.333% */
}

#why-us  hr {
    margin: 3rem 0;
    color: #E1B876;
    background: #E1B876;
    border-color: #E1B876!important;
}

@media screen and (max-width: 768px) {
    #why-us .box-whyus{ padding: 10px 0;}
}

/*--------------------------------------------------------------
# Teams
--------------------------------------------------------------*/

#teams .teamSwiper .imgbox{
    height: 234px;
}

#teams .teamSwiper .imgbox img{
    border-radius: 20px;
}

#teams .teamSwiper .info{
    text-align: center;
    margin-top: 20px;
}
#teams .teamSwiper .info .user-title{
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 5px;
}
#teams .teamSwiper .info div{
    font-size: 12px;
    color: #848484;
}

#teams .swiper-button-next-01, #teams  .swiper-button-prev-01 {
    top: 90px;
}

#teams .swiper-button-next-01 {
    right: 0;
}

#teams  .swiper-button-prev-01 {
    left: 0;
}
/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/
#contact{
    margin-top: 30px;
}

#contact .section-header h2{

}
#contact .section-header p{
    color: #210000;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    margin-top: 0;
    margin-bottom: 0;
}
#frmContact{
    margin: 0 auto;
    padding: 0px 60px;
    flex-direction: column;
    align-items: center;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.20);
    backdrop-filter: blur(2.5px);
}
#frmContact input, #frmContact textarea{
    border: 1px solid #C0C0C0;
    border-radius: 0;
}

#frmContact input::placeholder, #frmContact textarea::placeholder {
    color: #000;
    font-size: 16px;
    font-weight: 300;
}

#frmContact #btnContact{
    color: #000;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    padding: 14px 45px;
    border-radius: 36px;
    background: #E1B876;
    margin: 0 auto;
    border: none;
}

#contact-about{

}
#contact-about .warp{
    width: 70%;
    margin: 0 auto;
}

#contact-about .title{
    font-size: 24px;
    font-weight: 500;
}
#contact-about #info-hour{
    font-size: 14px;
}

#contact-about .info-item i {
    font-size: 18px;
    margin-right: 18px;
}
#contact-social{
    margin-top: 20px;
}
#contact-social a{
    margin-right: 15px;
}
#contact-social i{
    font-size: 18px;
    color: #000;
}

#contact-page{

}
#contact-page .warp{
    width: 70%;
    margin: 0 auto;
    color: #1E1E1E;
    font-size: 13px;
}
#contact-page .warp #frmContact{
    padding: 0;
}
#contact-page .warp #box-address{
    background: #FFFBF6;
    padding: 20px 30px;
}
#contact-page .warp #box-address h3{
    color: #1E1E1E;
    font-size: 15px;
    font-weight: 600;
}
#contact-page .warp #box-address .view-map{
    color: #1E1E1E;
    font-size: 13px;
    font-weight: 400;
    text-decoration: underline;
}
#contact-page .warp #box-address .direction-map{
    color: #6290EE;
    font-size: 13px;
    font-weight: 600;
    text-decoration: underline;
}

#contact-page .warp #dot-address{
    padding: 20px 30px;
}
#contact-page .warp #dot-address i{
    font-size: 20px;
}


@media screen and (max-width: 768px) {
    #contact{ margin-top: 0; }
    #contact-about .warp{
        width: 100%;
    }
    #contact-page .warp {
        width: 100%;
    }
    #contact-about .warp .desc{
        text-align: justify;
    }
    #contact #frmContact{ padding: 0px 10px; }
}

#accordionMission .accordion-item{ background: none!important; border: none!important;;}
#accordionMission .accordion-button{ background: none; font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;}
#accordionMission .accordion-button:focus{ border: none; box-shadow: none;}
#accordionMission .accordion-button img{ margin-right: 15px;}
#accordionMission{}
#accordionMission{}
#accordionMission{}

#panel-products-details{}
#panel-products-details .tilte_producst{
    font-size: 26px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}
#panel-products-details .price a{
    background:#90B239;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    color: #fff;
    display: inline-block;
    padding: 10px 32px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    text-transform: uppercase;
}

#hotline a{ font-size: 18px; font-size: 600; }

.post-box{}
.post-box .post-title a{
    display: block;
    color: #181C32;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
}

.news-date{
    color: #707070;
    font-size: 14px;
    font-weight: 400;
}
.news-title{
    color: #181C32;
    font-size: 38px;
    font-weight: 600;
}
.news-content{ margin-top: 20px;}

.others-img{
    width: 80px;
    height: 80px;
}
.others-date{
    color: #707070;
    font-size: 12px;
    font-weight: 400;
}
.others-title{
    color: #181C32;
    font-size: 16px;
    font-weight: 600;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/

#footer {
    background: #363A43;
    color: #fff;
    padding: 60px 0px;
}
#footer a{
    color: #fff;
}
#footer #blogo{
    text-align: center;
}
#footer #blogo img{
        height: 160px;
}
#footer #footer_text{
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
}
#footer .title-footer{ margin-bottom: 20px;}
#footer .title-footer h2{
    font-size: 20px;
    font-weight: 700;
}
#footer .info-item i{
    color: #E1B876;
    font-size: 18px;
    margin-right: 20px;
}

#frmNewsletter{ margin: 0 auto; }
#frmNewsletter input{ border: none; border-radius: 60px; }
#frmNewsletter #btnNewsletter{ background: #C19847; margin-left:-30px; border: none; color: #fff; border-radius: 60px; padding: 0 20px;}

#bsocial {margin-top: 20px; margin-left: 18px; text-align: center; }
#bsocial img{margin-right: 20px;}

#footer .copyright{ border-top: 1px solid #FBEBF3; padding: 12px 0; color: #888; }

@media screen and (max-width: 768px) {
    #bsocial{ margin-top: 15px;}
    #footer #blogo{
        text-align: center;
    }
    #footer #blogo img{
        margin: 0 auto;
    }
    #bsocial {text-align: center; margin-left: 25px;}
}


.pnCarousel {
    position: relative;
}
.pnCarousel .owl-theme .custom-nav {
    position: absolute;
    top: 0%;
    left: 0;
    right: 0;
}
.pnCarousel .owl-theme .custom-nav .owl-prev, .pnCarousel .owl-theme .custom-nav .owl-next {
    position: absolute;
    height: 100px;
    color: inherit;
    background: none;
    border: none;
    z-index: 100;
}
.pnCarousel .owl-theme .custom-nav .owl-prev i, .pnCarousel .owl-theme .custom-nav .owl-next i {
    font-size: 80px;
    color: #cecece;
}
.pnCarousel .owl-theme .custom-nav .owl-prev {
    left: 0;
}
.pnCarousel .owl-theme .custom-nav .owl-next {
    right: 0;
}

.pnCarousel .owl-carousel .owl-item img{ max-height: 350px; max-width: 100%; width: auto!important; margin: 0 auto;}

.pagination .page-item.active .page-link{ background-color: #E1B876;}
.pagination .page-item .page-link{}

:root {
    --swiper-navigation-size: 44;
}

.swiper-button-next-01, .swiper-button-prev-01 {
    position: absolute;
    top: 50%;
    width: calc(var(--swiper-navigation-size)/ 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2));
    z-index: 999;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #474747;
    border-radius: 50%;
    border: 1px solid #E1B876;
    background: #fff;
    width: 60px;
    height: 60px;
}

.swiper-button-next-01, .swiper-button-prev-01 i{
    font-size: 20px;
}

.swiper-button-next-01 {
    right: 10px;
    left: auto;
}

.swiper-button-prev-01{
    left: 10px;
    right: auto;
}

.swiper-pagination-bullet-active{ background:#000;}

#btnbooking{ display: none; position: fixed; right: 15px; bottom: 15px; text-align: center; z-index: 110;}
#btnbooking img{width: 80px; }
@media screen and (max-width: 768px) {
    #btnbooking {
        display: block;
    }
}

/* 🔸 Responsive Mobile chỉnh lại cho gọn */
@media (max-width: 768px) {

    .banner-home img {
        width: 100%;
        height: 400px;
        object-fit: cover; /* ảnh phủ kín khung mà không méo */
        object-position: center; /* canh giữa ảnh */
    }
        .banner-caption {
            left: 10%;
            top: 50%;
            max-width: 90%;
        }

        .banner-caption h2 {
            font-size: 32px;
            line-height: 1.2;
        }

        .banner-caption .desc {
            font-size: 16px;
        }
}