html {
    scroll-behavior: smooth;
    overflow-y: scroll;
}

body {
    -webkit-overflow-scrolling: touch;
}

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

:root{
    --devt-header-height:90px;
    --devt-header-small:55px;

    --devt-logo:46px;
    --devt-logo-small:34px;

    --devt-gold:#D7CB9C;

    --devt-speed:.4s;
}

p {
    font-size:0.9rem;
}

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

.devt-header{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:var(--devt-header-height);

    display:flex;
    align-items:center;

    background:transparent;

    border-bottom:1px solid transparent;

    transition:.4s;

    z-index:9999;
}

.devt-header.devt-scrolled{
    height:var(--devt-header-small);

    background:rgba(0,0,0,.65);

    backdrop-filter:blur(15px);
    -webkit-backdrop-filter:blur(15px);

    border-bottom:1px solid rgba(255,255,255,.08);
}

.devt-container{

    width:100%;
    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:0 50px;

    position:relative;
    z-index:10001;

}

.devt-logo{

    display:flex;
    align-items:center;
    text-decoration:none;

}

.devt-img{
    height:var(--devt-logo);
    transition:.4s;
}

.devt-header.devt-scrolled .devt-img{

    height:var(--devt-logo-small);

}

.devt-menu {
    display: flex;
    gap: 40px;
    margin: 0px;
}

.devt-menu li {
    list-style: none;
    font-family: 'DevataFont', sans-serif;
}

.f-room-popup {
    position:sticky;
    padding:20px;
    bottom:0px;
    background: #fdf3e8;
    border-radius: 12px;
    display: flex;
    justify-content: space-between;
    gap: 30px;
    align-items: center;
}

.devt-link-nav {
    font-size:1rem;
    color:white;
    letter-spacing:1px;
    text-decoration: none;
}

.devt-link-nav:hover {
    color:#D7CB9C;
    transition:.3s;
}

.devt-gap-menu {
    display: flex;
    gap: 60px;
    align-items: center;
    justify-content: space-between;
}

/* =========================
    HAMBURGER
========================= */

.devt-hamburger{

    width: 35px;
    height: 20px;

    border:none;
    background:none;

    cursor:pointer;

    display:flex;
    flex-direction:column;
    justify-content:space-between;

    padding:0;

    position:relative;

    z-index:10002;

}

.devt-hamburger span{

    width:100%;
    height:2px;

    background:#fff;

    transition:.4s;

}

.devt-hamburger.devt-active span:nth-child(1){

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

}

.devt-hamburger.devt-active span:nth-child(2){

    opacity:0;

}

.devt-hamburger.devt-active span:nth-child(3){

    transform:translateY(-11px) rotate(-45deg);

}

/* =========================
    FULLSCREEN MENU
========================= */

.devt-nav{
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    background: rgba(0, 0, 0, .8);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: .5s;
    z-index: 10000;
    align-items: center;
    padding: 60px;
    gap:150px;
}

.devt-nav-div {
    display: flex;
    gap: 150px;
    align-items: flex-start;
}

.devt-nav.devt-active{

    opacity:1;

    visibility:visible;

    pointer-events:auto;

}

.devt-list{
    font-family: 'DevataFont', sans-serif;
    list-style:none;

    padding:0;
    margin:0;

    display:flex;
    flex-direction:column;

    gap:15px;

    text-align:left;

}

.devt-list li{

    opacity:0;

    transform:translateY(30px);

    transition:.6s;

}

.devt-nav.devt-active .devt-list li{

    opacity:1;

    transform:translateY(0);

}

.devt-nav.devt-active .devt-list li:nth-child(1){transition-delay:.10s;}
.devt-nav.devt-active .devt-list li:nth-child(2){transition-delay:.20s;}
.devt-nav.devt-active .devt-list li:nth-child(3){transition-delay:.30s;}
.devt-nav.devt-active .devt-list li:nth-child(4){transition-delay:.40s;}
.devt-nav.devt-active .devt-list li:nth-child(5){transition-delay:.50s;}
.devt-nav.devt-active .devt-list li:nth-child(6){transition-delay:.60s;}

.devt-link{

    color:#fff;

    text-decoration:none;

    font-size:2.5rem;

    font-weight:300;

    letter-spacing:2px;

    transition:.3s;

    position:relative;

}

.devt-link:hover{

    color:var(--devt-gold);

}

.devt-link::after{

    content:"";

    position:absolute;

    left:50%;
    bottom:-12px;

    width:0;
    height:1px;

    background:var(--devt-gold);

    transform:translateX(-50%);

    transition:.3s;

}

.devt-link:hover::after{

    width:70%;

}

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

@media(max-width:768px){
    
    .devt-nav{
        position: fixed;
        inset: 0;
        width: 100%;
        height: 100vh;
        display: flex;
        background: rgba(0, 0, 0, .85);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: .5s;
        z-index: 10000;
        align-items: center;
        padding: 80px 30px;
        gap:150px;
    }
    
    .devt-nav-div {
        display: flex;
        gap: 10px;
        align-items: flex-start;
        flex-direction: column;
    }

    .devt-container{

        padding:0 20px;

    }

    .devt-link{

        font-size:2rem;

    }
    
    .devt-img{
        height:36px;
        transition:.4s;
    }
    
    .devt-menu {
        display:none;
    }
    

}

/* end luwak header*/

/* --------------------------------------------------------------- */

/* CSS HERO VIDEO */

#hero{
    position:relative;
    width:100%;
    height:100vh;
    overflow:hidden;
    background:#000;
}

/* VIDEO */

.hero-video{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
}

/* IMAGE HOVER */

.hero-hover-bg{
    position:absolute;
    inset:0;

    background-size:cover;
    background-position:center;

    opacity:0;
    transition:.6s ease;
    z-index:1;
}

/* DARK OVERLAY */

.hero-overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.25);
    z-index:2;
}

/* CONTENT */

.hero-content {
    position: relative;
    z-index: 3;
    width: 90%;
    max-width: 1500px;
    height: 100%;
    margin: auto;
    display: flex;
    justify-content: end;
    padding-bottom: 50px;
    flex-direction: column;
    align-items: flex-start;
}

.hero-title h1{
    margin:0;
    color:#F4EEE6;
    font-size:3rem;
    line-height:.9;
    font-family: 'DevataFont', sans-serif;
    font-weight:400;

}
.hero-title {
    text-align:start;
}
.hero-title h2{
    color:#F4EEE6;
    margin-top:20px;
    font-size:1.4rem;
    font-family: 'DevataFont', sans-serif;
    font-weight:300;

}

.hero-menu {
    display: flex;
    flex-direction: column;
    gap: 13px;
    width: fit-content;
    position: absolute;
    right: 0px;
    bottom: 60px;
}

.hero-menu a{
    color:white;
    text-decoration:none;
    font-size:1rem;
    transition:.35s;
    position:relative;
}

.hero-menu a:hover{
    color:#fff;
}

.hero-menu a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-6px;
    width:0;
    height:2px;
    background:#fff;
    transition:.35s;
}

.hero-menu a:hover::after{
    width:100%;
}

@media(max-width:760px) {
    .hero-title h2{
        margin-top:10px;
        font-size:1.5rem;
    }
    
    .hero-title h1{
        font-size:2.5rem;
    }
    
    .hero-menu {
        display: flex;
        flex-direction: row;
        gap: 30px;
        position: absolute;
        width: 100%;
        justify-content: space-between;
        left: 0px;
        bottom: 100px;
    }
    
    .hero-content {
       
        justify-content: center;
        align-items: center;
    }
}

/* END CSS HERO VIDEO */


/* --------------------------------------------------------------- */

/*ROOM HOME */

        .offpercent {
            position: absolute;
            z-index: 2;
            left: 10px;
            top: 10px;
            background: red;
            padding: 5px 10px;
            border-radius: 15px;
            color: white;
            font-size: 0.7rem;
        }
        

        .devt-room-arrow svg{
            width:18px;
            height:18px;
        }
        
        .devt-room-title {
            font-size: 3.5rem;
            line-height: 0.9;
            font-weight: 300;
            color: #91602f;
            font-family: 'DevataFont', sans-serif;
        }
        

        .devt-room-rooms {
            padding: 150px 40px;
            background-color: #f5eae4;
        }

        .devt-room-room-header {
            display: flex;
            justify-content: space-between;
            align-items: center
        }

        .devt-room-room-slider {
            display: flex;
            gap: 24px;
            overflow: auto;
            scroll-behavior: smooth;
            padding: 20px 0
        }

        .devt-room-room-slider::-webkit-scrollbar {
            display: none
        }

        .devt-room-room-card {
            min-width: 380px;
            background: #fff;
            border-radius: 18px;
            overflow: hidden;
            cursor: pointer
        }

        .devt-room-image-slider {
            display: flex;
            transition: .5s
        }

        .devt-room-image-slider img{
            min-width:100%;
            width:100%;
            height:240px;
            object-fit:cover;
            flex-shrink:0;
        }

        .devt-room-room-content {
            padding: 18px
        }
        
        .devt-room-room-content h3{
            font-size:0.9rem;
        }

        .devt-room-price {
            font-size: 0.8rem;
            font-weight: normal;
            color: #6a6a6a;
        }
        
        .room-f-faci {
            margin-top:20px;
            display:flex;
            justify-content: space-between;
        }
        
        .spec-item-devata {
            display: flex;
            align-items: center;
            gap: 6px;
            color: #555; 
            font-size: 11px;
        }
         
        .spec-item-devata svg {
            width: 18px;
            height: 18px;
            stroke: #333;
            stroke-width: 1px;
            fill: none;
        }

        
        .devt-room-popup {
            position: fixed;
            inset: 0;
            background: rgba(0, 0, 0, .5);
            display: none;
            align-items: center;
            justify-content: center
        }

        .devt-room-popup.active {
            display: flex !important;
            z-index: 99999;
        }

        .devt-room-modal {
            background: #fff;
            border-radius: 16px;
            width: 90%;
            max-width: 1000px;
            max-height: 95%;
            overflow: scroll;
        }

        .devt-room-gallery {
            display: grid; 
            grid-template-columns: 2fr 1fr;
            gap: 10px;
            padding:20px;
        }
        
        .devt-room-de {
            
            padding:20px;
        }

        .devt-room-big img {
            width: 100%;
            height: 420px;
            object-fit: cover;
            border-radius: 12px
        }

        .devt-room-small {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 10px;
        }

        .devt-room-small img {
            width: 100%;
            height: 205px;
            object-fit: cover;
            border-radius: 10px;
            cursor: pointer
        }

        .devt-room-close {
            border: none;
            background: transparent;
            color: black;
            font-size: 1.5rem;
            padding: 10px 20px 0px 20px;
        }
        
        .devt-room-image-wrapper{
            position:relative;
            overflow:hidden;
        }

        .devt-room-image-slider{
            display:flex;
            transition:transform .5s ease;
        }

        .devt-room-image-dots{
            position:absolute;
            bottom:14px;
            left:50%;
            transform:translateX(-50%);
            display:flex;
            gap:8px;
            z-index:2;
        }

        .devt-room-image-dots span{
            width:10px;
            height:10px;
            border-radius:50%;
            background:rgba(255,255,255,.45);
            transition:.3s;
            cursor:pointer;
        }

        .devt-room-image-dots span.active{
            width:26px;
            border-radius:20px;
            background:#fff;
        }
        
        .devt-room-arrow {
            border: 1px solid grey;
            padding: 7px 10px;
            border-radius: 50%;
        }
        
        .book-room-button {
            padding: 10px 20px;
            font-size: 0.8rem;
            text-decoration: none;
            border-radius: 5px;
            color: #ffffff;
            border: none;
            background: linear-gradient(135deg, #ebbc8d 0%, #dba36c 50%, #c88a4a 100%);
            transition: all 0.3s ease;
            float: inline-end;
        }
        
        .book-room-button:hover {
            transform: translateY(-2px);
            letter-spacing:1.5px;
        }
        
        .price-book-room {
            display:flex;
            align-items: center;
            justify-content: space-between;
        }
        
        .pop-room-name h3 {
            margin-top: 20px;
            font-size: 1.6rem;
        }
        
        .pop-room-facility h3 {
            font-size:0.9rem;
            font-weight:bold;
        }
        
        .pop-facility-list {
            list-style: none;
            padding: 0;
            margin: 15px 0 0;
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 10px;
        }
        
        .pop-facility-list li {
            display: flex;
            align-items: center;
            gap: 8px;
            font-size: 0.9rem;
        }
        
        .pop-facility-list svg {
            width: 18px;
            height: 18px;
            color: #22c55e;
            flex-shrink: 0;
        }
        
        .w-pop-room {
            max-width: 50%;
        }
        
        .pop-but-mobile {
            display: flex;
            gap: 30px;
        }
        
        .pop-room-desc p {
            font-size:0.9rem;
        }
        .pop-room-facility svg{
            width:20px; 
            height:20px;
        }
        
        @media (max-width:760px) {
            
            .devt-room-close {
                border: none;
                background: transparent;
                color: white;
                font-size: 1rem;
                padding: 5px 10px;
                position: absolute;
                top: 50px;
                right: 50px;
                border-radius: 50%;
                background: #80808063;
            }
            
            .spec-item-devata {
                font-size:0.5rem;
            }
            
            .room-f-faci {
                margin-top:0px;
                
            }
            
            .devt-room-title {
                font-size: 2.5rem;
            }
            .devt-room-rooms {
                padding: 80px 20px;
                background-color: #f5eae4;
            }
            
            .devt-room-room-card {
                min-width: 270px;
            }
            
            .devt-room-modal {
                padding:0px;
            }
            
            .devt-room-image-slider img {
                height:200px;
            }
            .devt-room-room-content h3 {
                font-size: 0.8rem;
            }
            
            .devt-room-price {
                font-size: 0.7rem;
                font-weight: normal;
                color: #6a6a6a;
            }
            .price-book-room {
                gap: 5px;
            }
            
            
            .devt-room-image-dots span {
                width:5px;
                height:5px;
            }
            
            
            
            .book-room-button {
                padding: 5px 20px;
                border-radius:25px;
                display: block;
                float: none;
                text-align: center;
            }
            
            .devt-room-room-content {
                padding: 10px;
            }
            
            .devt-room-gallery {
                display:flex;
                flex-direction: column;
            }
            
            .devt-room-big img {
                height:200px;
            }
            
            .devt-room-small {
                display: grid;
                grid-template-columns: repeat(4, 1fr);
                gap: 10px;
            }
            
            .devt-room-small img {
                width: 100%;
                height: 50px;
                border-radius: 5px;
            }
            
            
            
            .pop-room-name h3 {
                margin-top: 0px;
                font-size: 1.1rem;
            }
            
            .pop-room-facility h3 {
                font-size:0.8rem;
            }
            
            
            .pop-facility-list li {
                display: flex;
                align-items: center;
                gap: 5px;
                font-size: 0.7rem;
            }
            
            .pop-facility-list {
                grid-template-columns: repeat(2, 1fr);
                gap: 3px;
            }
            
            .pop-but-mobile {
                text-align:center;
                padding: 10px 20px;
            }
            
            .w-pop-room {
                max-width: 100%;
                justify-content: flex-start;
                gap: 30px;
            }
            
            .pop-room-desc p {
                font-size:0.7rem;
            }
            
            .pop-room-facility svg{
                width:20px;
                height:20px;
            }
            
        }
        
/* END ROOM HOME */        

/* --------------------------------------------------------------- */


/* SERVICE SECTION */

.devt-serv-section{
    min-height:100vh;
    display:flex;
    overflow:hidden;
    background:#f5eae4;
}

.devt-serv-image-side{
    width:50%;
    position:relative;
    overflow:hidden;
}

.devt-serv-bg-parallax{
    position:absolute;
    inset:-10%;
    will-change:transform;
}

.devt-serv-bg-parallax img{
    width:100%;
    height:120%;
    object-fit:cover;
    transform:scale(1.15);
}

.devt-serv-floating-image{
    position:absolute;
    width:260px;
    height:360px;
    left:68%;
    top:62%;
    transform:translate(-50%,-50%);
    overflow:hidden;
    z-index:5;
    box-shadow:0 25px 60px rgba(0,0,0,.15);
    will-change:transform;
}

.devt-serv-floating-image img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.devt-serv-content-side{
    width:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:100px;
}

.devt-serv-content{
    max-width:520px;
}

.devt-serv-subtitle{
    display:block;
    color:#91602f;
    font-size:14px;
    font-weight:600;
    letter-spacing:1px;
    margin-bottom:25px;
}

.devt-serv-title{
    font-size:3.5rem;
    line-height:.9;
    font-weight:300;
    color:#91602f;
    margin-bottom:40px;
    font-family:'DevataFont', sans-serif;
}

.devt-serv-text{
    color:#474747;
    line-height:1.8;
    font-size:1.1rem;
}

.devt-serv-text p{
    margin-bottom:25px;
}

.devt-serv-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:20px;
    padding:18px 42px;
    background:#c76f3d;
    color:#fff;
    text-decoration:none;
    border-radius:14px;
    transition:.4s;
}

.devt-serv-button:hover{
    transform:translateY(-3px);
}

.devt-serv-subtitle,
.devt-serv-title,
.devt-serv-text,
.devt-serv-button{
    opacity:0;
    transform:translateY(60px);
    transition:
        opacity 1.2s cubic-bezier(.22,.61,.36,1),
        transform 1.2s cubic-bezier(.22,.61,.36,1);
}

.devt-serv-visible .devt-serv-subtitle{
    opacity:1;
    transform:none;
}

.devt-serv-visible .devt-serv-title{
    opacity:1;
    transform:none;
    transition-delay:.15s;
}

.devt-serv-visible .devt-serv-text{
    opacity:1;
    transform:none;
    transition-delay:.3s;
}

.devt-serv-visible .devt-serv-button{
    opacity:1;
    transform:none;
    transition-delay:.45s;
}

@media(max-width:768px){
    
    .devt-serv-text {
        font-size:0.9rem;
    }

    .devt-serv-section{
        flex-direction:column;
    }

    .devt-serv-image-side,
    .devt-serv-content-side{
        width:100%;
    }
    
    .devt-content-plp {
        background-color:#faf8f4 !important
    }

    .devt-serv-image-side{
        height:70vh;
    }

    .devt-serv-content-side{
        padding:60px 30px;
    }

    .devt-serv-title{
        font-size:2.5rem;
    }

    .devt-serv-floating-image{
        width:180px;
        height:260px;
    }
}


/* END SERVICE SECTION */

/* JOURNEY */

.journey-hero{
    max-width:100%;
    margin:auto;
    padding:100px 40px 0px 40px;
    display:flex;
    justify-content:space-between;
    gap:100px;
    align-items:flex-end;
    background: #faf8f4;
}

.journey-hero-left{
    flex:1.5;
}

.journey-hero-left h1{
    font-size: 3.5rem;
    line-height: .9;
    font-weight: 300;
    color: #91602f;
    margin-bottom: 20px;
    font-family: 'DevataFont', sans-serif;
}

.journey-navigation {
    display:none;
}

.journey-hero-right{
    flex:1;
}

.journey-label {
    display: block;
    color: #91602f;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    margin-bottom: 10px;
}

.journey-hero-right p{
    color: #474747;
    line-height: 1.8;
    font-size: 1.1rem;
}

.journey-section{
    padding: 40px 40px 120px 40px;
    overflow:hidden;
    background: #faf8f4;
}

.journey-header h2{
    font-size:2.5rem;
    margin-bottom:40px;
    color:var(--green);
}

.journey-slider-wrapper{
    position:relative;
}

.journey-slider{
    display:flex;
    gap:25px;
    overflow-x:auto;
    scroll-behavior:smooth;
    scrollbar-width:none;
}

.journey-slider::-webkit-scrollbar{
    display:none;
}

.journey-card{
    min-width:380px;
    border-radius:22px;
    overflow:hidden;
    background:white;
    flex-shrink:0;
}

.journey-card img{
    width:100%;
    height:260px;
    object-fit:cover;
}

.journey-card-content{
    padding:20px;
    background: #e8dfda;
}

.journey-card-content h3{
    margin:0px;
    color:#91602f;
    font-size: 0.9rem;
}

.journey-card-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
}

.journey-detail-btn,
.journey-book-btn{
    padding: 10px 20px;
    font-size: 0.7rem;
    border:none;
    border-radius:8px;
    cursor:pointer;
    text-decoration:none;
}

.journey-detail-btn{
    background:#ececec;
}

.journey-book-btn{
    background:var(--green);
    color:white;
}

.journey-nav{
    position:absolute;
    top:45%;
    transform:translateY(-50%);
    width:50px;
    height:50px;
    border:none;
    border-radius:50%;
    background:white;
    cursor:pointer;
    z-index:10;
    box-shadow:0 5px 20px rgba(0,0,0,.1);
}

.prev{
    left:-15px;
}

.next{
    right:-15px;
}

.journey-popup{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.5);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:9999;
}

.journey-popup.active{
    display:flex;
}

.journey-popup-content{
    width:min(900px,90%);
    background:white;
    border-radius:20px;
    overflow:hidden;
    padding:20px;
    position:relative;
}

.journey-popup-content img{
    width:100%;
    height:45vh;
    object-fit:cover;
    
    object-position:center;
}

.journey-popup-content h3{
    padding:30px 0px 0px;
    color:var(--green);
}

.journey-popup-content p{
    padding:0px;
    color:#555;
    line-height:1.8;
    font-size:0.9rem;
}

.journey-popup-content .journey-book-btn{
    margin:0 30px 30px;
    display:inline-block;
}

.journey-close {
    border: none;
    border-radius: 50%;
    background: transparent;
    font-size: 2rem;
    cursor: pointer;
    color: black;
}

@media(max-width:768px){
    
    .journey-close {
        border: none;
        border-radius: 50%;
        font-size: 1.5rem;
        cursor: pointer;
        color: white;
        position: absolute;
        top: 20px;
        right: 20px;
        padding: 1px 13px;
        background: #80808063;
    }
    
    .journey-card-content{
        padding:20px 10px;
        background: #e8dfda;
    }

    .journey-hero{
        flex-direction:column;
        gap:40px;
        padding: 100px 20px 0px 20px;
    }

    .journey-hero-right p{
        font-size:0.9rem;
    }

    .journey-card{
        min-width:270px;
        max-width: 270px;
    } 
    
    .journey-card img {
        max-height : 200px;
    }
    
    .journey-hero-left h1 {
        font-size: 2.5rem;
    }
    
    .journey-popup-body {
        padding:20px 0px;
    }
    
    .journey-section {
        padding:20px 20px 100px 20px;
    }
    
    .journey-detail-btn {
        padding: 5px 20px;
        border-radius: 25px;
        display: block;
        float: none;
        text-align: center;
    }
    
    .journey-popup-content {
        height: fit-content;
        overflow: scroll;
        padding:10px 10px 20px 10px;
    }
    
    .journey-popup-content img {
        width: 100%;
        height: 45vh;
        object-fit: cover;
        border-radius:12px;
    }
    
    #popupBookBtn {
        padding:10px 20px !important;
    }
    
    .journey-popup-content h3 {
        padding: 0px;
        color: black;
        font-size: 1.2rem;
        margin-bottom: 20px;
    }
    
    .journey-popup-content p {
        padding: 0px;
        font-size:0.9rem;
    }

}

/* END JOURNEY */


/* START TESTIMONIAL */

#testimonial{
    padding:100px 0;
    background:#faf8f4;
    overflow:hidden;
}

.devt-pro-review-header{
    text-align:center;
    margin-bottom:50px;
}

.devt-pro-review-header span{
    color: #91602f;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    margin-bottom: 25px;
}

.devt-pro-review-header h2{
    margin-top:10px;
    font-size:32px;
    font-weight:400;
    color:#91602f;
    font-family: 'DevataFont', sans-serif;
}

.devt-pro-review-slider-wrapper{
    position:relative;
}

.devt-pro-review-slider{
    display:flex;
    gap:25px;
    overflow-x:auto;
    scroll-behavior:smooth;
    scrollbar-width:none;
}

.devt-pro-review-slider::-webkit-scrollbar{
    display:none;
}

.devt-pro-review-card{
    min-width:280px;
    max-width:280px;
    background:#fff;
    border:1px solid #e6d8c7;
    border-radius:22px;
    padding:28px;
    flex-shrink:0;
}

.devt-pro-review-source{
    height:40px;
    margin-bottom:0px;
}

.devt-pro-review-source img{
    height:20px;
    width:auto;
}

.devt-pro-review-rating-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:20px;
}

.devt-pro-review-stars{
    color:#c6923e;
}

.devt-pro-review-score{
    font-size:0.7rem;
    color:#444;
}

.devt-pro-review-text{
    min-height:fit-content;
    line-height:1.6;
    color:grey;
    font-size:0.8rem;
    margin-bottom:25px;
}

.devt-pro-review-user{
    display:flex;
    align-items:center;
    gap:12px;
}

a {
    text-decoration:none !important;
}

.devt-read-more span {
    color:black;
    text-decoration: underline;
}

.devt-pro-review-user img,
.devt-pro-review-avatar{
    width:35px;
    height:35px;
    border-radius:50%;
}

.devt-pro-review-avatar{
    display:flex;
    align-items:center;
    justify-content:center;
    background:#c6923e;
    color:#fff;
    font-weight:bold;
}

.devt-pro-review-name{
    font-size:16px;
    font-weight:600;
}

.devt-pro-review-nav{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:55px;
    height:55px;
    border:1px solid #d6b98b;
    border-radius:50%;
    background:#fff;
    color:#c6923e;
    z-index:5;
    cursor:pointer;
}

.devt-pro-review-nav.prev{
    left:-25px;
}

.devt-pro-review-nav.next{
    right:-25px;
}

.devt-review-modal{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.75);
    z-index:999999;
    justify-content:center;
    align-items:center;
}

.devt-review-modal-content{
    background:#fff;
    width:600px;
    max-width:90%;
    padding:35px;
    border-radius:20px;
    position:relative;
}

#closeReviewModal{
    position:absolute;
    right:15px;
    top:15px;
    border:none;
    background:none;
    font-size:22px;
    cursor:pointer;
}

#reviewModalText{
    line-height:1.9;
    color:#444;
}

/* END TESTIMONIAL */

/*BOOKING*/

.devt-book-custom {
    padding: 30px;
    border: 1px solid #91602f99;
    margin-top: 50px;
    border-radius: 18px;
}

.devt-book-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.devt-pay-mth {
    display:flex;
    gap: 20px;
    align-items: center;
}
.devt-pay-mth img {
    max-height:30px;
}

.devt-book-header h3 {
    margin-bottom: 0px;
    font-size: 32px;
    font-weight: 400;
    color: #91602f;
    font-family: 'DevataFont', sans-serif;
}

.devt-book-header p {
    font-size:0.9rem;
    margin-bottom:20px;
}

@media (max-width:768px) {
    
    .devt-book-custom {
        display:none;
    }
    .devt-book-header {
        flex-direction: column;
    }
    .devt-pay-mth {
        margin-bottom: 30px;
    }
}

/*END BOOKING*/

/* BANNER PROMO */

.commitment-section{
    height:fit-content;
    position:relative;
    background: #faf8f4;
}

.commitment-card{
    position:sticky;
    top:90px;

    height:65vh;

    display:flex;
    align-items:center;
    justify-content:center;

    overflow:hidden;
}

.commitment-card img{
    position:absolute;

    width:75%;
    height:75vh;

    object-fit:cover;

    border-radius:24px;

    transform-origin:center center;
}

.commitment-overlay{
    position:absolute;
    inset:0;

    background:transparent;
    pointer-events:none;
}

.commitment-content{
    position:relative;

    text-align:center;

    color:#fff;

    width:min(88%);

    opacity:.2;

    transform:translateY(50px);
}



.head-offer h2 {
    text-align: center;
    font-size: 3.5rem;
    font-family: 'DevataFont', sans-serif;
}

/* END BANNER PROMO */

/* FOOTER */
    .devt-footer-main * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        
    }

    /* ANIMASI SMOOTH FADE-IN */
    @keyframes devt-footer-fadeInUp {
        from {
            opacity: 0;
            transform: translateY(20px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .devt-footer-main .devt-footer-smooth-appear {
        animation: devt-footer-fadeInUp 1.2s cubic-bezier(0.25, 1, 0.5, 1) forwards;
    }

    /* UTAMA FOOTER */
    .devt-footer-main {
        background-color: #f5eae4; /* Warna Background Request */
        padding: 80px 40px 40px 40px;
        letter-spacing: 1.5px;
        width: 100%;
    }

    .devt-footer-main .devt-footer-container {
        display: block;
        max-width: 1400px;
        margin: 0 auto;
    }

    /* Tata Letak Kolom Atas menggunakan Table-Cell */
    .devt-footer-main .devt-footer-top-table {
        display: table;
        width: 100%;
        table-layout: fixed;
    }

    .devt-footer-main .devt-footer-brand-cell {
        display: table-cell;
        width: 40%;
        vertical-align: top;
    }

    .devt-footer-main .devt-footer-links-cell {
        display: table-cell;
        width: 60%;
        vertical-align: top;
    }

    /* TAGLINE STYLING */
    .devt-footer-main .devt-footer-brand h2 {
        font-size: 2.6rem;
        font-weight: 300;
        line-height: 1.2;
        color: #91602f; 
        text-transform: none;
        font-family: 'DevataFont', sans-serif;
    }
    
    .devt-footer-brand p {
        margin-bottom: 20px;
        font-weight: bold;
        color: #91602f;
        font-size: 0.8rem;
    }

    .devt-footer-main .devt-footer-brand h2 span {
        font-weight: bold;
        font-family: 'DevataFont', sans-serif;
    }

    /* MENU NAVIGASI */
    .devt-footer-main .devt-footer-columns-wrap {
        display: table;
        width: 100%;
    }

    .devt-footer-main .devt-footer-link-column {
        display: table-cell;
        width: 33.33%;
        vertical-align: top;
    }

    .devt-footer-main .devt-footer-link-column a {
        display: block;
        text-decoration: none;
        color: #000000;
        font-size: 0.85rem;
        font-weight: normal;
        margin-bottom: 12px;
        transition: opacity 0.3s ease;
    }

    .devt-footer-main .devt-footer-link-column a:hover {
        opacity: 0.5;
    }

    /* SOSIAL MEDIA */
    .devt-footer-main .devt-footer-social-icons {
        margin-top: 25px;
    }

    .devt-footer-main .devt-footer-social-icons a {
        display: inline-block;
        margin-right: 20px;
        font-size: 1.1rem;
        color: #000000;
    }

    /* PENGHARGAAN / LOGO CERTIFICATE */
    .devt-footer-main .devt-footer-awards {
        margin: 60px auto 0 auto;
        max-width: 1400px;
    }

    .devt-footer-main .devt-footer-award-item {
        display: inline-block;
        border: 1px dashed rgba(145, 96, 47, 0.4);
        color: #91602f;
        font-size: 0.7rem;
        font-weight: bold;
        padding: 10px 15px;
        margin-right: 15px;
        margin-bottom: 15px;
        border-radius: 2px;
    }

    /* GARIS PEMBATAS */
    .devt-footer-main .devt-footer-divider {
        border: none;
        border-top: 1px solid rgba(145, 96, 47, 0.2);
        margin: 40px auto 30px auto;
        max-width: 1400px;
    }

    /* BAGIAN BAWAH (COPYRIGHT & LEGAL) */
    .devt-footer-main .devt-footer-bottom-table {
        display: table;
        width: 100%;
        max-width: 1400px;
        margin: 0 auto;
        font-size: 0.7rem;
        color: #000000;
    }

    .devt-footer-main .devt-footer-copyright-cell {
        display: table-cell;
        width: 40%;
        vertical-align: middle;
        opacity: 0.8;
    }

    .devt-footer-main .devt-footer-legal-cell {
        display: table-cell;
        width: 60%;
        text-align: right;
        vertical-align: middle;
    }

    .devt-footer-main .devt-footer-legal-cell a {
        text-decoration: none;
        color: #000000;
        margin-left: 25px;
        opacity: 0.8;
        transition: opacity 0.3s ease;
    }

    .devt-footer-main .devt-footer-legal-cell a:hover {
        opacity: 0.5;
    }

    /* RESPONSIVE DESIGN UNTUK GADGET/HP */
    @media (max-width: 768px) {
        .devt-footer-main {
            padding: 50px 20px 30px 20px;
        }
        .devt-footer-main .devt-footer-brand-cell,
        .devt-footer-main .devt-footer-links-cell,
        .devt-footer-main .devt-footer-top-table,
        .devt-footer-main .devt-footer-columns-wrap,
        .devt-footer-main .devt-footer-link-column,
        .devt-footer-main .devt-footer-bottom-table,
        .devt-footer-main .devt-footer-copyright-cell,
        .devt-footer-main .devt-footer-legal-cell {
            display: block;
            width: 100% !important;
            text-align: left !important;
        }
        .devt-footer-main .devt-footer-brand-cell {
            margin-bottom: 40px;
        }
        .devt-footer-main .devt-footer-link-column {
            margin-bottom: 30px;
        }
        .devt-footer-main .devt-footer-legal-cell {
            margin-top: 20px;
        }
        .devt-footer-main .devt-footer-legal-cell a {
            display: block;
            margin-left: 0;
            margin-bottom: 10px;
        }
    }
    
/* END FOOTER */