/* ==========================================================
   LANDING PAGE
   Desa Cantik 2026
========================================================== */

/* ===========================
   HERO
=========================== */

/* #billboard {

    min-height: 80vh;

    display: flex;

    align-items: center;

    background: linear-gradient(
        135deg,
        #0d6efd,
        #0b5ed7
    );

}

#billboard h1 {

    font-weight: 700;

    line-height: 1.2;

}

#billboard p {

    font-size: 1.1rem;

    opacity: .9;

}

#billboard img {

    border-radius: 16px;

    box-shadow: 0 25px 60px rgba(0,0,0,.20);

} */

/* ===========================
   PILIH DESA
=========================== */

#desa-list {

    background: #f8f9fa;

}

#desa-list h2 {

    font-weight: 700;

}

#searchDesa {

    height: 58px;

    border-radius: 50px;

    padding-left: 25px;

    font-size: 16px;

    box-shadow: none;

}

#searchDesa:focus {

    border-color: #0d6efd;

    box-shadow: 0 0 0 .2rem rgba(13,110,253,.15);

}

/* ===========================
   CARD DESA
=========================== */

.desa-item {

    transition: .35s;

}

.desa-item .card {

    border-radius: 18px;

    overflow: hidden;

    transition: .35s;

}

.desa-item:hover {

    transform: translateY(-8px);

}

.desa-item:hover .card {

    box-shadow: 0 18px 40px rgba(0,0,0,.12);

}

.desa-item h5 {

    font-weight: 600;

    margin-bottom: 10px;

}

.desa-item .btn {

    border-radius: 30px;

    height: 46px;

}

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

@media (max-width:991px){

    #billboard{

        min-height:auto;

        padding:70px 0;

        text-align:center;

    }

    #billboard img{

        margin-top:40px;

    }

}

@media (max-width:768px){

    #billboard h1{

        font-size:2rem;

    }

    #searchDesa{

        height:52px;

    }

}

/* ==========================================================
   Gallery Modal
========================================================== */

.gallery-modal{

    position:fixed;

    inset:0;

    z-index:99999;

    display:flex;

    justify-content:center;

    align-items:center;

    /* Overlay */
    background:rgba(0,0,0,.75);

    /* Awalnya disembunyikan */
    opacity:0;

    visibility:hidden;

    transition:.3s ease;

}

/* Ketika dibuka */

.gallery-modal.show{

    opacity:1;

    visibility:visible;

}

.gallery-modal-box{

    width:90%;

    max-width:1200px;

    background:#fff;

    border-radius:15px;

    overflow:hidden;

    transform:scale(.9);

    transition:.3s ease;

}

.gallery-left{

    height:650px;

    background:#111;

    overflow:hidden;

}

.gallery-left img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.35s;


}
.gallery-left-apbd{

    height:900px;
    width: auto; 
    max-width: 100%;
    object-fit: contain;
    background:#111;
    overflow:hidden;

}
.gallery-left-apbd img{
    
    width:100%;

    height:100%;
    object-fit: fill;
    background:#8a8888;

}

.gallery-right{

    padding:35px;

    overflow:auto;

    max-height:650px;

}

.gallery-close{

    position:absolute;

    top:15px;

    right:20px;

    z-index:100;

    border:none;

    background:none;

    font-size:35px;

    cursor:pointer;

}

.gallery-thumb{

    cursor:pointer;

    transition:.3s;

}

.gallery-thumb:hover{

    transform:scale(1.04);

}

.content-editor ol{
    list-style: decimal !important;
    padding-left: 2rem !important;
}

.content-editor ol li{
    display: list-item !important;
}

.content-editor ol li::marker{
    color: #000 !important;
}

.content-editor p{

    margin-bottom: 1rem;

}