[data-sal]{transition-delay:0s;transition-delay:var(--sal-delay,0s);transition-duration:.2s;transition-duration:var(--sal-duration,.2s);transition-timing-function:ease;transition-timing-function:var(--sal-easing,ease)}[data-sal][data-sal-duration="200"]{transition-duration:.2s}[data-sal][data-sal-duration="250"]{transition-duration:.25s}[data-sal][data-sal-duration="300"]{transition-duration:.3s}[data-sal][data-sal-duration="350"]{transition-duration:.35s}[data-sal][data-sal-duration="400"]{transition-duration:.4s}[data-sal][data-sal-duration="450"]{transition-duration:.45s}[data-sal][data-sal-duration="500"]{transition-duration:.5s}[data-sal][data-sal-duration="550"]{transition-duration:.55s}[data-sal][data-sal-duration="600"]{transition-duration:.6s}[data-sal][data-sal-duration="650"]{transition-duration:.65s}[data-sal][data-sal-duration="700"]{transition-duration:.7s}[data-sal][data-sal-duration="750"]{transition-duration:.75s}[data-sal][data-sal-duration="800"]{transition-duration:.8s}[data-sal][data-sal-duration="850"]{transition-duration:.85s}[data-sal][data-sal-duration="900"]{transition-duration:.9s}[data-sal][data-sal-duration="950"]{transition-duration:.95s}[data-sal][data-sal-duration="1000"]{transition-duration:1s}[data-sal][data-sal-duration="1050"]{transition-duration:1.05s}[data-sal][data-sal-duration="1100"]{transition-duration:1.1s}[data-sal][data-sal-duration="1150"]{transition-duration:1.15s}[data-sal][data-sal-duration="1200"]{transition-duration:1.2s}[data-sal][data-sal-duration="1250"]{transition-duration:1.25s}[data-sal][data-sal-duration="1300"]{transition-duration:1.3s}[data-sal][data-sal-duration="1350"]{transition-duration:1.35s}[data-sal][data-sal-duration="1400"]{transition-duration:1.4s}[data-sal][data-sal-duration="1450"]{transition-duration:1.45s}[data-sal][data-sal-duration="1500"]{transition-duration:1.5s}[data-sal][data-sal-duration="1550"]{transition-duration:1.55s}[data-sal][data-sal-duration="1600"]{transition-duration:1.6s}[data-sal][data-sal-duration="1650"]{transition-duration:1.65s}[data-sal][data-sal-duration="1700"]{transition-duration:1.7s}[data-sal][data-sal-duration="1750"]{transition-duration:1.75s}[data-sal][data-sal-duration="1800"]{transition-duration:1.8s}[data-sal][data-sal-duration="1850"]{transition-duration:1.85s}[data-sal][data-sal-duration="1900"]{transition-duration:1.9s}[data-sal][data-sal-duration="1950"]{transition-duration:1.95s}[data-sal][data-sal-duration="2000"]{transition-duration:2s}[data-sal][data-sal-delay="50"]{transition-delay:.05s}[data-sal][data-sal-delay="100"]{transition-delay:.1s}[data-sal][data-sal-delay="150"]{transition-delay:.15s}[data-sal][data-sal-delay="200"]{transition-delay:.2s}[data-sal][data-sal-delay="250"]{transition-delay:.25s}[data-sal][data-sal-delay="300"]{transition-delay:.3s}[data-sal][data-sal-delay="350"]{transition-delay:.35s}[data-sal][data-sal-delay="400"]{transition-delay:.4s}[data-sal][data-sal-delay="450"]{transition-delay:.45s}[data-sal][data-sal-delay="500"]{transition-delay:.5s}[data-sal][data-sal-delay="550"]{transition-delay:.55s}[data-sal][data-sal-delay="600"]{transition-delay:.6s}[data-sal][data-sal-delay="650"]{transition-delay:.65s}[data-sal][data-sal-delay="700"]{transition-delay:.7s}[data-sal][data-sal-delay="750"]{transition-delay:.75s}[data-sal][data-sal-delay="800"]{transition-delay:.8s}[data-sal][data-sal-delay="850"]{transition-delay:.85s}[data-sal][data-sal-delay="900"]{transition-delay:.9s}[data-sal][data-sal-delay="950"]{transition-delay:.95s}[data-sal][data-sal-delay="1000"]{transition-delay:1s}[data-sal][data-sal-easing=linear]{transition-timing-function:linear}[data-sal][data-sal-easing=ease]{transition-timing-function:ease}[data-sal][data-sal-easing=ease-in]{transition-timing-function:ease-in}[data-sal][data-sal-easing=ease-out]{transition-timing-function:ease-out}[data-sal][data-sal-easing=ease-in-out]{transition-timing-function:ease-in-out}[data-sal][data-sal-easing=ease-in-cubic]{transition-timing-function:cubic-bezier(.55,.055,.675,.19)}[data-sal][data-sal-easing=ease-out-cubic]{transition-timing-function:cubic-bezier(.215,.61,.355,1)}[data-sal][data-sal-easing=ease-in-out-cubic]{transition-timing-function:cubic-bezier(.645,.045,.355,1)}[data-sal][data-sal-easing=ease-in-circ]{transition-timing-function:cubic-bezier(.6,.04,.98,.335)}[data-sal][data-sal-easing=ease-out-circ]{transition-timing-function:cubic-bezier(.075,.82,.165,1)}[data-sal][data-sal-easing=ease-in-out-circ]{transition-timing-function:cubic-bezier(.785,.135,.15,.86)}[data-sal][data-sal-easing=ease-in-expo]{transition-timing-function:cubic-bezier(.95,.05,.795,.035)}[data-sal][data-sal-easing=ease-out-expo]{transition-timing-function:cubic-bezier(.19,1,.22,1)}[data-sal][data-sal-easing=ease-in-out-expo]{transition-timing-function:cubic-bezier(1,0,0,1)}[data-sal][data-sal-easing=ease-in-quad]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-sal][data-sal-easing=ease-out-quad]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-sal][data-sal-easing=ease-in-out-quad]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-sal][data-sal-easing=ease-in-quart]{transition-timing-function:cubic-bezier(.895,.03,.685,.22)}[data-sal][data-sal-easing=ease-out-quart]{transition-timing-function:cubic-bezier(.165,.84,.44,1)}[data-sal][data-sal-easing=ease-in-out-quart]{transition-timing-function:cubic-bezier(.77,0,.175,1)}[data-sal][data-sal-easing=ease-in-quint]{transition-timing-function:cubic-bezier(.755,.05,.855,.06)}[data-sal][data-sal-easing=ease-out-quint]{transition-timing-function:cubic-bezier(.23,1,.32,1)}[data-sal][data-sal-easing=ease-in-out-quint]{transition-timing-function:cubic-bezier(.86,0,.07,1)}[data-sal][data-sal-easing=ease-in-sine]{transition-timing-function:cubic-bezier(.47,0,.745,.715)}[data-sal][data-sal-easing=ease-out-sine]{transition-timing-function:cubic-bezier(.39,.575,.565,1)}[data-sal][data-sal-easing=ease-in-out-sine]{transition-timing-function:cubic-bezier(.445,.05,.55,.95)}[data-sal][data-sal-easing=ease-in-back]{transition-timing-function:cubic-bezier(.6,-.28,.735,.045)}[data-sal][data-sal-easing=ease-out-back]{transition-timing-function:cubic-bezier(.175,.885,.32,1.275)}[data-sal][data-sal-easing=ease-in-out-back]{transition-timing-function:cubic-bezier(.68,-.55,.265,1.55)}[data-sal|=fade]{opacity:0;transition-property:opacity}[data-sal|=fade].sal-animate,body.sal-disabled [data-sal|=fade]{opacity:1}[data-sal|=slide]{opacity:0;transition-property:opacity,transform}[data-sal=slide-up]{transform:translateY(20%)}[data-sal=slide-down]{transform:translateY(-20%)}[data-sal=slide-left]{transform:translateX(20%)}[data-sal=slide-right]{transform:translateX(-20%)}[data-sal|=slide].sal-animate,body.sal-disabled [data-sal|=slide]{opacity:1;transform:none}[data-sal|=zoom]{opacity:0;transition-property:opacity,transform}[data-sal=zoom-in]{transform:scale(.5)}[data-sal=zoom-out]{transform:scale(1.1)}[data-sal|=zoom].sal-animate,body.sal-disabled [data-sal|=zoom]{opacity:1;transform:none}[data-sal|=flip]{-webkit-backface-visibility:hidden;backface-visibility:hidden;transition-property:transform}[data-sal=flip-left]{transform:perspective(2000px) rotateY(-91deg)}[data-sal=flip-right]{transform:perspective(2000px) rotateY(91deg)}[data-sal=flip-up]{transform:perspective(2000px) rotateX(-91deg)}[data-sal=flip-down]{transform:perspective(2000px) rotateX(91deg)}[data-sal|=flip].sal-animate,body.sal-disabled [data-sal|=flip]{transform:none}
:root {
    --text-color: #343434;
    --blue-soft: #d4f7eb;
    --yellow-cream: #f8c87c;
    --coco: #96816b;
    --white-bone: #f1efe6;
    --sal-duration: .5s;
}

body {
    color: var(--text-color);
    font-family: Ubuntu;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

button {
    background-color: transparent;
    border: none;
}

.navbar-toggler {
    border: none;
}

.navbar-custom {
    background-color: white;
    --bs-bg-opacity: .5;
    -webkit-backdrop-filter: blur(50px);
            backdrop-filter: blur(50px);
}

.navbar-logo {
    width: 100px;
    height: auto;
}

.btn-chat {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 1
}

.chat-bot {
    position: fixed;
    bottom: 30px;
    right: 30px;
}

#about {
    background: #f5f5f5;
}

#about .title {
    padding-left: 1rem;
    padding-right: 1rem; 
    padding-top: 2.5rem;
    padding-bottom: 2.5rem; 
    font-weight: 500; 
    text-align: center; 
    font-size: 32px;
    color: #343434;
    line-height: 37px;
}

#about .subtitle {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem; 
    font-size: 1.25rem;
    line-height: 1.75rem; 
    font-weight: 500;
    text-align: center; 
    color: #343434;
}

#about .text-container {
    display: flex; 
    flex-direction: column; 
}

#about .description {
    padding: 28px; 
    text-align: justify; 
    color: #535353;
}

#about .image-large {
    display: none; 
    -o-object-fit: cover; 
       object-fit: cover; 
    -o-object-position: left; 
       object-position: left; 
}

#concept {
    background: #F1EFE6;
    padding-left: 28px;
    padding-right: 28px;
    padding-top: 28px;
    padding-bottom: 74px;
}

#concept .title {
    padding-left: 1rem;
    padding-right: 1rem;
    margin-bottom: 28px;
    font-weight: 500; 
    text-align: center; 
    font-size: 32px;
    color: #343434;
    line-height: 37px;
}

#concept .description {
    text-align: justify; 
    color: #535353;
    margin-bottom: 20px;
}

.card-container {
    display: flex; 
    flex-direction: column;
}

.card-custom {
    margin-bottom: 64px;
}

#concept .card-container {
    display: flex; 
    flex-direction: column;
}

#concept .card-custom {
    margin-bottom: 16px;
}

#concept .img-container {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    margin-bottom: 12px;
}

#concept .img-container img {
    width: 100%;
    aspect-ratio: 3 / 2;
    -o-object-fit: cover;
       object-fit: cover;
    display: block;
}

#concept .img-container .card-title {
    position: absolute;
    bottom: 0;
    left: 0;
    min-width: 250px;
    padding: 12px 24px;
    font-size: 21px;
    border-radius: 0 15px 0 0;
    background-color: rgba(255, 255, 255, 0.5);
    -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px);
}

#concept .card-description {
    text-align: justify;
    color: #343434;
}

#download-brochure {
    background-image: url(/images/brosur1.jpg?7787f502b121e32e3fc35d917326d67c);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

#download-brochure > div {
    padding: 28px;
    background-color: rgba(255, 255, 255, 0.7);
}

.title {
    font-weight: 500;
    text-align: center;
    font-size: 32px;
    color: #343434;
    line-height: 37px;
}

#download-brochure .title {
    font-size: 24px;
    color: #343434;
    line-height: 37px;
    margin-bottom: 24px;
    text-align: start;
}

#download-brochure button {
    color: white;
    background-color: #343434;
    border-radius: 10px;
    padding: 20px 44px;
    font-weight: 700;
}

#facility {
    background: #F1EFE6;
    padding: 24px 0;
}

#facility .title {
    margin-bottom: 24px;
}

#facility img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    border-radius: 15px;
}

#facility-slider {
    margin-bottom: 24px;
}

#facility-slider::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, transparent 15%, transparent 85%, rgba(255,255,255,1) 100%);
}

#virtual-tour img {
    display: block;
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    border-radius: 15px 0;
    aspect-ratio: 3 / 2;
    margin-bottom: 16px;
}

#virtual-tour p {
    text-align: center;
    font-size: 27px;
    color: #343434;
    margin-bottom: 16px;
}

#virtual-tour button {
    color: white;
    background-color: #343434;
    border-radius: 10px;
    padding: 8px 16px;
    font-weight: 500;
    font-size: 24px;
    width: 100%;
    margin-bottom: 18px;
}

#detail img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    border-radius: 15px 0;
    aspect-ratio: 6 / 9;
}

#detail > div {
    margin-bottom: 64px;
}

#detail .title {
    margin-bottom: 44px;
}

#detail .description {
    margin-bottom: 54px;
    text-align: justify;
}

#detail .card-custom {
    margin-bottom: 24px;
}

#detail .card-custom > div {
    position: relative;
    overflow: hidden;
    border-radius: 15px 0;
}

#detail .card-custom > div > img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    aspect-ratio: 3 / 4;
    -o-object-position: center;
       object-position: center;
}

#detail .card-custom > div > div {
    position: absolute;
    bottom: 0;
    right: 0;
    background-color: #9D9C9B;
    font-weight: 500;
    color: white;
    border-radius: 15px 0;
    padding: 12px 20px;
    min-width: 225px;
}

#portfolio {
    background: #F1EFE6;
    padding: 28px;
    color: #343434;
}

#portfolio > div {
    display: grid; 
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

#portfolio .title {
    margin-bottom: 28px;
    font-weight: 500;
}

#portfolio .navigation-custom {
    margin-bottom: 16px;
    display: flex; 
    justify-content: flex-end; 
}

#portfolio-slider img {
    display: block;
    width: 100%;
}

#portfolio-slider {
    margin-bottom: 18px;
}

.portfolio-text .portfolio-title {
    font-weight: 500;
    font-size: 32px;
    margin-bottom: 18px;
}

.portfolio-text .portfolio-description {
    text-align: justify;
}

#promo {
    padding: 56px 28px;
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    /* display: flex; */
    /* flex-direction: column; */
}

#promo > div {
    margin-bottom: 18px;
}

#promo .title {
    font-weight: 500;
    margin-bottom: 27px;
}

#promo .more-offer-container {
    background-color: #f9f9f9;
    border-radius: 10px;
    padding: 32px 32px 52px;
}

#promo .main-promo img {
    display: block;
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}

.container-main-promo {
    position: relative;
    overflow: hidden;
}

.container-main-promo .cover {
    position: absolute;
    display: none;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    top: 0;
    color: white;
    cursor: pointer;
}

.container-main-promo:hover .cover {
    display: flex;
    justify-content: center;
    align-items: center;
}

#promo .more-offer-container img {
    display: block;
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}

#video-slider iframe {
    aspect-ratio: 16 / 9;
    margin: 0 auto;
    width: 100%;
}

#video .navigation {
    display: flex;
    justify-content: center;
    padding: 16px 0;
}

#contact-us {
    padding: 37px 28px;
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

#contact-us .title {
    margin-bottom: 61px;
    font-weight: 600;
}

#contact-us .subtitle {
    margin-bottom: 20px;
    font-weight:600;
    text-align: justify;
    font-size: 20px;
}

#contact-us .wa {
    display: flex;
    margin-bottom: 36px;
    align-items: center;
    font-size: 20px;
}

#contact-us .wa > img {
    margin-right: 12px;
    width: 28px;
    aspect-ratio: 1 / 1;
}

#contact-us .map-title {
    font-weight: 600;
    font-size: 20px;
    margin-bottom: 20px;
}

#contact-us .map {
    border-radius: 15px;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
    aspect-ratio: 3 / 2;
    overflow: hidden;
    display: block;
    width: -webkit-fill-available;
}

#developer {
    padding: 70px 28px;
}

#developer .title {
    margin-bottom: 80px;
    font-weight: 500;
}

#footer {
    padding: 59px 28px 69px;
    background-color: #343434;
}

#footer img {
    max-width: 220px;
}


#footer .address-detail {
    font-size: 14px;
}

body.modal-open .blur{
    -moz-filter: blur(1px);
    -o-filter: blur(1px);
    -ms-filter: blur(1px);
    filter: blur(1px);
}

@media (min-width: 992px) {
    .navbar-custom {
        max-width: -webkit-max-content;
        max-width: -moz-max-content;
        max-width: max-content;
        border-radius: 10px;
        top: 32px;
        padding: 12px 60px;
    }

    .navbar-logo {
        width: 172px;
        height: auto;
    }

    .navbar-nav {
        align-items: center;
    }

    .btn-chat {
        bottom: 60px;
        right: 60px;
        font-weight: 500;
        font-size: 24px;
        padding: 16px 32px;
    }

    .chat-bot {
        bottom: 60px;
        right: 60px;
    }

    #about .title {
        padding-left: 0;
        padding-right: 0;
        text-align: start;
    }

    #about .subtitle {
        font-weight: 700;
        font-size: 27px;
        text-align: start;
    }

    #about .text-container {
        padding: 5rem;
    }

    #about .text-container > img {
        display: none;
    }

    #about .description {
        padding-left: 0;
        padding-right: 0; 
    }

    #about .image-large {
        display: block; 
    }

    #concept {
        padding-left: 61px;
        padding-right: 61px;
        padding-top: 50px;
        padding-bottom: 69px;
    }

    #concept .description {
        text-align: center;
        margin-bottom: 100px;
    }

    .card-container {
        flex-direction: row;
        justify-content: center;
    }

    .card-custom {
        margin-bottom: 0;
        padding: 0 24px;
        max-width: 400px;
    }

    #concept .card-container {
        flex-direction: row;
        justify-content: center;
    }

    #concept .card-custom {
        margin-bottom: 0;
        padding: 0 24px;
        max-width: 400px;
    }

    #download-brochure {
        background-image: url(/images/brosur2.jpg?62793454d0a18a96c106c201f25ca716);
    }

    #download-brochure > div {
        padding: 48px 28px;
    }

    #download-brochure .title {
        font-size: 32px;
        color: #343434;
        margin-bottom: 44px;
        text-align: center;
    }

    #download-brochure > div > div {
        display: flex;
        justify-content: center;
    }

    #facility {
        padding: 90px 0;
    }

    #facility .title {
        margin-bottom: 58px;
    }

    #facility-slider::after {
        background: linear-gradient(90deg, rgba(255,255,255,1) 0%, transparent 5%, transparent 95%, rgba(255,255,255,1) 100%);
    }

    #detail .title {
        margin-bottom: 32px;
    }

    #detail .description {
        margin-bottom: 72px;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        max-width: 700px;
    }

    #detail .card-custom > div > div {
        min-width: 280px;
    }

    #portfolio {
        background: #F1EFE6;
        padding: 52px 80px;
        color: #343434;
    }

    #portfolio > div {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        -moz-column-gap: 80px;
             column-gap: 80px;
    }

    #portfolio .title {
        margin-bottom: 98px;
        grid-column-start: 2; 
    }

    #portfolio .navigation-custom {
        grid-column-start: 2;
        grid-row-start: 3;
        justify-content: flex-start; 
    }

    #portfolio .navigation-custom > button {
        font-size: 36px;
    }

    #portfolio-slider {
        margin-bottom: 56px;
        grid-column-start: 2;
    }

    .portfolio-text {
        grid-column-start: 1;
        grid-row-start: 2;
    }

    .portfolio-text .portfolio-title {
        margin-bottom: 80px;
    }

    #promo {
        /* flex-direction: row; */
        grid-template-columns: repeat(3, minmax(0, 1fr));
        padding: 48px 55px 68px 68px;
        max-width: 1440px;
        margin: 0 auto;
    }

    #promo .main-promo {
        /* flex: 1 1 0%; */
        grid-column: span 2 / span 2;
        height: 530px;
        margin-right: 60px;
    }

    #promo .main-promo img {
        aspect-ratio: 2 / 1;
        height: auto;
        width: 100%;
        -o-object-fit: cover;
           object-fit: cover;
    }

    #promo .more-offer-container {
        height: 530px;
        padding: 34px 47px;
        margin-bottom: 0;
    }

    #promo .more-offer-container img {
        aspect-ratio: 2 / 1;
    }

    #promo .more-offer-container .title {
        text-align: center;
        margin-bottom: 26px;
    }

    #promo .images-container {
        overflow: auto;
        height: 80%;
    }

    #promo .title {
        text-align: start;
        font-size: 32px;
        margin-bottom: 59px;
    }

    #video-slider iframe {
        aspect-ratio: 3 / 1;
    }

    #video .navigation {
       font-size: 36px;
    }

    #contact-us .map {
        margin-bottom: 0;
        aspect-ratio: 2 / 1;
    }

    #contact-us {
        padding: 96px 60px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-column-gap: 98px;
    }

    #developer {
        padding: 59px 61px 174px;
        background: #F1EFE6;
    }

    #developer p {
        width: 50%;
    }

    #footer {
        padding: 70px 208px 87px;
    }

    #footer img {
        max-width: 400px;
    }

    #footer .address-title {
        font-size: 20px;
    }

    #footer .address-detail {
        font-size: 20px;
    }
}