@font-face {
    font-family: 'Epunda Slab';
    src: url('../fonts/epunda/EpundaSlab-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Epunda Slab';
    src: url('../fonts/epunda/EpundaSlab-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Epunda Slab';
    src: url('../fonts/epunda/EpundaSlab-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Epunda Slab';
    src: url('../fonts/epunda/EpundaSlab-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/montserrat/Montserrat-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/montserrat/Montserrat-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/montserrat/Montserrat-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/montserrat/Montserrat-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'LibertinusDisplay';
    src: url('../fonts/libertinus_serif_display/LibertinusSerifDisplay-Regular.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

.fm-epunda-300 {
    font-family: 'Epunda Slab' !important;
    font-weight: 300 !important;
}

.fm-epunda-400 {
    font-family: 'Epunda Slab' !important;
    font-weight: 400 !important;
}

.fm-epunda-600 {
    font-family: 'Epunda Slab' !important;
    font-weight: 500 !important;
}

.fm-epunda-700 {
    font-family: 'Epunda Slab' !important;
    font-weight: 700 !important;
}

.fm-montserrat-300 {
    font-family: 'Montserrat' !important;
    font-weight: 300 !important;
}

.fm-montserrat-400 {
    font-family: 'Montserrat' !important;
    font-weight: 400 !important;
}

.fm-montserrat-600 {
    font-family: 'Montserrat' !important;
    font-weight: 600 !important;
}

.fm-montserrat-700 {
    font-family: 'Montserrat' !important;
    font-weight: 700 !important;
}

.fm-libertinus-500 {
    font-family: 'LibertinusDisplay' !important;
    font-weight: 500 !important;
}


/* =========================================================
   HERO SLIDER
========================================================= */
.hero-slider-section {
    position: relative;
    overflow: hidden;
}

#carouselSlider .hero-slider-picture {
    display: block;
    width: 100%;
    aspect-ratio: 1440 / 600;
    overflow: hidden;
}

#carouselSlider .hero-slider-image {
    width: 100%;
    height: auto;
    aspect-ratio: 1440 / 600;
    object-fit: cover;
    display: block;
}

/* =========================================================
   CAROUSEL INDICATOR
========================================================= */
#carouselSlider .carousel-indicators {
    bottom: 25px;
    margin-bottom: 0;
}

#carouselSlider .carousel-indicators button {
    width: 12px;
    height: 12px;
    margin: 0 6px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.7);
    opacity: 1;
    transition: 0.3s;
}

#carouselSlider .carousel-indicators button.active {
    width: 28px;
    border-radius: 20px;
    background: #fff;
}

/* =========================================================
   SWIPER BASE
========================================================= */
.news-swiper-element,
.brand-swiper-element,
.slider-dine {
    display: block;
    width: 100%;
    overflow: hidden;
}

.news-swiper-element::part(wrapper),
.brand-swiper-element::part(wrapper),
.slider-dine::part(wrapper) {
    align-items: stretch;
}

/* =========================================================
   NEWS SECTION
========================================================= */
.news-swiper-element swiper-slide {
    height: auto;
}

.news-swiper-element .bg-light {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.news-swiper-element .pt-4 {
    flex: 1;
}

/* Pagination */
.news-swiper-element::part(pagination) {
    position: relative;
    bottom: 0;
}

.news-swiper-element::part(bullet) {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ebeadd;
    opacity: 1;
}

.news-swiper-element::part(bullet-active) {
    width: 24px;
    border-radius: 20px;
    background: #a59c83;
}

/* Typography */
.news-title {
    font-size: 20px;
    font-family: 'Epunda Slab', serif;
    font-weight: 400;
}

.news-sort-desc {
    font-size: 14px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 300;
}

.four-swiper-title {
    font-size: 20px;
    font-family: 'Epunda Slab', serif;
    font-weight: 400;
}

.four-swiper-sort-desc {
    font-size: 14px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 300;
    min-height: 195px;
}

/* =========================================================
   ROOM SECTION
========================================================= */
.room-title {
    font-size: 25px;
    font-family: 'Epunda Slab', serif;
    font-weight: 500;
    letter-spacing: 1px;
}

.room-description-box {
    padding: 0;
    /* border: 1px solid #eaeaea; */
    border-radius: 0px;
}

/* Owl Navigation */
.owl-custom-nav .btn-prev:before,
.owl-custom-nav .btn-next:before {
    background: #a59c83;
    color: #fff;
    border-radius: 50%;
}

/* =========================================================
   DINE SLIDER
========================================================= */
.hero-dine-slider-picture {
    width: 100%;
    height: clamp(660px, 70vh, 760px);
}

.hero-dine-slider-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* =========================================================
   SEE ALL LINK (PREMIUM STYLE)
========================================================= */
.see-all-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.5px;

    color: #776d51;
    text-decoration: none;
    position: relative;

    transition: all 0.3s ease;
}

/* Icon */
.see-all-link i {
    font-size: 12px;
    transition: transform 0.3s ease;
}

/* Underline Animation */
.see-all-link::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -4px;

    width: 0;
    height: 1px;

    background-color: #a59c83;
    transition: width 0.3s ease;
}

/* Hover */
.see-all-link:hover {
    color: #8c846d;
}

.see-all-link:hover::after {
    width: 100%;
}

.see-all-link:hover i {
    transform: translateX(4px);
}

/* Focus Accessibility */
.see-all-link:focus {
    outline: none;
}

.see-all-link:focus-visible {
    outline: 2px dashed #a59c83;
    outline-offset: 4px;
}

/* =========================
   HERO FIX (CLS)
========================= */
.hero-picture {
    display: block;
    width: 100%;
}

.hero-img {
    width: 100%;
    height: auto;
    /* ini kunci */
    object-fit: cover;
}

.outlet-box {
    height: 441px;
}

.process-btn,
.process-btn:link,
.process-btn:visited {
    background-color: #a59c83 !important;
    color: #ffffff !important;
    border-color: #a59c83 !important;
    font-family: 'Montserrat' !important;
    font-weight: 500 !important;
    border-radius: 0px !important;
    letter-spacing: 1.2px !important;
}

/* HOVER FIX */
.process-btn:hover,
.process-btn:focus,
.process-btn:active {
    background-color: #867f6a !important;
    color: #ffffff !important;
    cursor: pointer;
}

/* HAPUS EFEK ANEH */
.process-btn::before,
.process-btn::after {
    display: none !important;
}

.section-title {
    font-size: 46px;
    font-family: 'Epunda Slab', serif;
    font-weight: 500;
    letter-spacing: 1px !important;
}

.label-form {
    font-family: 'Epunda Slab', serif;
    font-weight: 500;
}

.bg-form {
    background: #a59c83 !important;
    color: #fff;
    border: 1px solid #a59c83;
    border-radius: 0px !important;
    font-size: 14px;
    letter-spacing: 1.2px;
}

.bg-form::placeholder {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1.2px;
}

/* FOCUS & ACTIVE */
.bg-form:focus,
.bg-form:active {
    background: #ffffff !important;
    color: #000;
    border: 1px solid #a59c83; /* warna custom kamu */
    box-shadow: none !important; /* hilangkan glow biru bootstrap */
    outline: none;
}

/* Optional: saat disabled / readonly */
.bg-form:disabled,
.bg-form[readonly] {
    background: #d3cbb5;
    color: #666;
}

.fm-epunda {
    font-family: 'Epunda Slab', serif;
    font-weight: 500;
}

.accordion-section-title {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    letter-spacing: 1.5px;
    font-size: 14px;
}

.description-accordion {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px;
    line-height: 1.7;
    color: #555;
}

.description-accordion * {
    font-family: 'Montserrat', sans-serif !important;
}

.description-accordion p,
.description-accordion span,
.description-accordion li {
    font-family: 'Montserrat', sans-serif !important;
}

.img-box {
    width: 100%;
    aspect-ratio: 1 / 1; /* bikin kotak */
    overflow: hidden;
    position: relative;
    
}

.img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* crop otomatis */
    object-position: center;
    transition: transform 0.5s ease;
}

/* optional hover biar luxury */
.img-box:hover img {
    transform: scale(1.08);
}

.btn-disabled {
    pointer-events: none;
    opacity: 0.5;
}

.special-offer-desc {
    font-size: 14px;
    letter-spacing: normal;
    line-height: 1.8;
}

#filters a.selected {
    background-color: #a59c83;
}

#filters a {
    border-radius: 0px !important;
}

/* TITLE */
.offers-title {
    font-family: 'Epunda Slab' !important;
    font-weight: 500 !important;
    font-size: 16px;
    margin-bottom: 6px;
}

/* DESC */
.offers-sort-desc {
    font-size: 13px;
    color: #777;
    line-height: 1.6;
    min-height: 60px;
}

.offers-price {
    font-size: 13px;
    color: #777;
    font-family: 'Montserrat' !important;
    font-weight: 300 !important;
}

.line-section {
    border-top: 1px solid #eaeaea;
    margin-bottom: 40px;
}

.swal-laska{
    border-radius: 0px;
    padding: 50px 40px;
    background: #f7f3ee;
    box-shadow: 0 25px 60px rgba(0,0,0,.15);
    border: 1px solid rgba(0,0,0,.08);
}

.swal-laska-title{
    font-family: 'Cormorant Garamond', serif;
    font-size: 42px;
    font-weight: 500;
    color: #1f1f1f;
    letter-spacing: 1px;
    margin-bottom: 15px;
}

.swal-laska-text{
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    line-height: 1.9;
    color: #666;
    max-width: 520px;
    margin: 0 auto;
}

.swal-laska-button{
    background: #a59c83;
    color: #fff;
    border: none;
    border-radius: 0;
    padding: 14px 42px;
    font-size: 13px;
    letter-spacing: 2px;
    text-transform: uppercase;
    transition: all .3s ease;
}

.swal-laska-button:hover{
    background: #8c836b;
}

.swal-error-item{
    padding: 10px 0;
    border-bottom: 1px solid rgba(0,0,0,.06);
    font-size: 14px;
    line-height: 1.7;
}

.swal-error-item:last-child{
    border-bottom: none;
}

.border-danger {
    border: 1px solid #dc3545 !important;
}

.logo-main,
.logo-scroll,
.logo-mobile {
    width: 180px;
    height: 87px;
    display: block;
    object-fit: contain;
}

.hotel-management-desc {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px;
    line-height: 1.7;
    color: #555;
}

.hotel-management-desc * {
    font-family: 'Montserrat', sans-serif !important;
}

.hotel-management-desc p,
.hotel-management-desc span,
.dhotel-management-desc li {
    font-family: 'Montserrat', sans-serif !important;
}

.hero-video-section{
    position: relative;
    overflow: hidden;
}

/* CONTAINER */
.hero-video-section .video-container{
    position: relative;
    width: 100%;
    height: 600px;
    overflow: hidden;
}

/* VIDEO */
.hero-video-section .video-container video{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
    display:block;
}


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

/* Desktop Adjustment */
@media (min-width: 992px) {
    .see-all-link {
        margin-bottom: 6px;
    }
}

/* Tablet */
@media (min-width: 768px) {
    .news-swiper-element {
        padding-bottom: 0;
    }

    .news-swiper-element::part(pagination) {
        display: none;
    }
}

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

    #carouselSlider,
    #carouselSlider .carousel-inner,
    #carouselSlider .carousel-item,
    #carouselSlider .hero-slider-picture {
        margin-top: 5px;
    }

    #carouselSlider .hero-slider-picture {
        aspect-ratio: 360 / 520;
    }

    #carouselSlider .hero-slider-image {
        aspect-ratio: 360 / 520;
    }

    .room-title {
        font-size: 22px;
    }

    .four-swiper-sort-desc {
        min-height: 150px !important;
    }

    .logo-main,
    .logo-scroll,
    .logo-mobile {
        width: 120px !important;
        height: 45px !important;
    }

    .offers-title {
        font-size: 20px;
    }
    .offers-sort-desc {
        font-size: 16px;
    }

    .offers-price {
        font-size: 16px;
    }

    .fs-32 {
        font-size: 30px !important;
    }

    .stay-room-desc {
        font-size: 14px !important;
        margin-bottom: 10px;
    }

    .hero-video-section .video-container{
        height: 600px;
    }
}
