.hero-img {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

@media only screen and (max-width: 1900px) {
    .hero-img {
        min-height: 80vh;
        position: relative; /* supaya anak-anaknya bisa absolute */
        z-index: 0;
    }

    .papan-nama {
        position: absolute; /* supaya bisa bebas */
        bottom: 110px; /* atau atur sesuai layout Anda */
        left: 8%;
        transform: translateX(-50%);
        z-index: 100; /* lebih tinggi dari wave (3) & gambar (1) */
        text-align: center;
        color: #000;
        padding: 10px;
        border-radius: 5px;
        display: flex;
        justify-content: space-around;
        gap: 32px;
    }



    .papan-nama .nama {
        background: linear-gradient(-45deg, #1391a5, #274685);
        border: 2px solid #ffffff; /* biru tua */
        border-radius: 8px;
        padding: 10px 20px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 250px;
    }

    .papan-nama .nama-lengkap {
        color: #fff;
        font-size: 16px;
        font-weight: bold;
    }
    .papan-nama .jabatan {
        color: #000000;
        font-weight: bold;
        font-size: 14px;
        letter-spacing: 1px;
    }
}


@media only screen and (max-width: 1400px) {
    .hero-img {
        min-height: 60vh;
        position: relative; /* supaya anak-anaknya bisa absolute */
        z-index: 0;
    }

    .papan-nama {
        position: absolute; /* supaya bisa bebas */
        bottom: 35px; /* atau atur sesuai layout Anda */
        left: 2%;
        transform: translateX(-50%);
        z-index: 100; /* lebih tinggi dari wave (3) & gambar (1) */
        text-align: center;
        color: #000;
        padding: 10px;
        border-radius: 0px;
        display: flex;
        justify-content: space-around;
        gap: 30px;
    }

    .papan-nama .nama {
        background: linear-gradient(-45deg, #1391a5, #274685);
        border: 2px solid #ffffff; /* biru tua */
        border-radius: 8px;
        padding: 10px 20px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 250px;
    }

    .papan-nama .nama-lengkap {
        color: #fff;
        font-size: 0.875em;
        font-weight: bold;
    }
    .papan-nama .jabatan {
        color: #000000;
        font-weight: bold;
        font-size: 0.875em;
        letter-spacing: 1px;
    }
}

@media only screen and (max-width: 1200px) {
    .hero-img {
        min-height: 0vh;
        position: relative; /* supaya anak-anaknya bisa absolute */
        z-index: 0;
    }

    .papan-nama {
        position: absolute; /* supaya bisa bebas */
        bottom: 35px; /* atau atur sesuai layout Anda */
        left: -5%;
        transform: translateX(-50%);
        z-index: 100; /* lebih tinggi dari wave (3) & gambar (1) */
        text-align: center;
        color: #000;
        padding: 10px;
        border-radius: 0px;
        display: flex;
        justify-content: space-around;
        gap: 10px;
    }

    .papan-nama .nama {
        background: linear-gradient(-45deg, #1391a5, #274685);
        border: 2px solid #ffffff; /* biru tua */
        border-radius: 8px;
        padding: 10px 20px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 250px;
    }

    .papan-nama .nama-lengkap {
        color: #fff;
        font-size: 0.875em;
        font-weight: bold;
    }
    .papan-nama .jabatan {
        color: #000000;
        font-weight: bold;
        font-size: 0.875em;
        letter-spacing: 1px;
    }

    .bupati {
        width: 20px;
    }
}

@media only screen and (max-width: 991px) {
    .hero-img {
        min-height: 30vh;
        position: relative; /* supaya anak-anaknya bisa absolute */
        z-index: 0;
    }

    .papan-nama {
        position: absolute; /* supaya bisa bebas */
        bottom: 40px; /* atau atur sesuai layout Anda */
        left: 5%;
        transform: translateX(-50%);
        z-index: 100; /* lebih tinggi dari wave (3) & gambar (1) */
        text-align: center;
        color: #000;
        padding: 10px;
        border-radius: 0px;
        display: flex;
        justify-content: space-around;
        gap: 35px;
    }

    .papan-nama .nama {
        background: linear-gradient(-45deg, #1391a5, #274685);
        border: 2px solid #ffffff; /* biru tua */
        border-radius: 8px;
        padding: 10px 20px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 300px;
    }

    .papan-nama .nama-lengkap {
        color: #fff;
        font-size: 1em;
        font-weight: bold;
    }
    .papan-nama .jabatan {
        color: #000000;
        font-weight: bold;
        font-size: 0.875em;
        letter-spacing: 1px;
    }
    #hero {
        min-height:1040px;
    }
}

@media only screen and (max-width: 767px) {
    .hero-img {
        min-height: 30vh;
        position: relative; /* supaya anak-anaknya bisa absolute */
        z-index: 0;
    }

    .papan-nama {
        position: absolute; /* supaya bisa bebas */
        bottom: 30px; /* atau atur sesuai layout Anda */
        left: 0%;
        transform: translateX(-50%);
        z-index: 100; /* lebih tinggi dari wave (3) & gambar (1) */
        text-align: center;
        color: #000;
        padding: 10px;
        border-radius: 0px;
        display: flex;
        justify-content: space-around;
        gap: 10px;
    }

    .papan-nama .nama {
        background: linear-gradient(-45deg, #1391a5, #274685);
        border: 2px solid #ffffff; /* biru tua */
        border-radius: 8px;
        padding: 10px 20px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 250px;
    }

    .papan-nama .nama-lengkap {
        color: #fff;
        font-size: 0.875em;
        font-weight: bold;
    }
    .papan-nama .jabatan {
        color: #000000;
        font-weight: bold;
        font-size: 0.875em;
        letter-spacing: 1px;
    }
    #hero {
        min-height:970px;
    }
}

@media only screen and (max-width: 600px) {
    #hero {
        min-height:960px;
    }
}

@media only screen and (max-width: 540px) {
    #hero {
        min-height:950px;
    }
}


@media only screen and (max-width: 530px) {
    .papan-nama {
        position: absolute; /* supaya bisa bebas */
        bottom: 20px; /* atau atur sesuai layout Anda */
        left: 5%;
        transform: translateX(-50%);
        z-index: 100; /* lebih tinggi dari wave (3) & gambar (1) */
        text-align: center;
        color: #000;
        padding: 10px;
        border-radius: 0px;
        display: flex;
        justify-content: space-around;
        gap: 30px;
    }

    .papan-nama .nama {
        background: linear-gradient(-45deg, #1391a5, #274685);
        border: 2px solid #ffffff; /* biru tua */
        border-radius: 8px;
        padding: 10px 20px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 200px;
    }

    .papan-nama .nama-lengkap {
        color: #fff;
        font-size: 0.75em;
        font-weight: bold;
    }
    .papan-nama .jabatan {
        color: #000000;
        font-weight: bold;
        font-size: 0.875em;
        letter-spacing: 1px;
    }
}

@media only screen and (max-width: 500px) {
    #hero {
        min-height:948px;
    }
}

@media only screen and (max-width: 494px) {
    .papan-nama {
        position: absolute; /* supaya bisa bebas */
        bottom: 15px; /* atau atur sesuai layout Anda */
        left: 7%;
        transform: translateX(-50%);
        z-index: 100; /* lebih tinggi dari wave (3) & gambar (1) */
        text-align: center;
        color: #000;
        padding: 10px;
        border-radius: 0px;
        display: flex;
        justify-content: space-around;
        gap: 30px;
    }

    .papan-nama .nama {
        background: linear-gradient(-45deg, #1391a5, #274685);
        border: 2px solid #ffffff; /* biru tua */
        border-radius: 8px;
        padding: 10px 20px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 180px;
    }

    .papan-nama .nama-lengkap {
        color: #fff;
        font-size: 0.75em;
        font-weight: bold;
    }
    .papan-nama .jabatan {
        color: #000000;
        font-weight: bold;
        font-size: 0.875em;
        letter-spacing: 1px;
    }

    #hero {
        min-height:942px;
    }
}

@media only screen and (max-width: 484px) {
    .papan-nama {
        position: absolute; /* supaya bisa bebas */
        bottom: 15px; /* atau atur sesuai layout Anda */
        left: 7%;
        transform: translateX(-50%);
        z-index: 100; /* lebih tinggi dari wave (3) & gambar (1) */
        text-align: center;
        color: #000;
        padding: 10px;
        border-radius: 0px;
        display: flex;
        justify-content: space-around;
        gap: 30px;
    }

    .papan-nama .nama {
        background: linear-gradient(-45deg, #1391a5, #274685);
        border: 2px solid #ffffff; /* biru tua */
        border-radius: 8px;
        padding: 10px 20px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 170px;
    }


    #hero {
        min-height:940px;
    }
}

@media only screen and (max-width: 473px) {
    .papan-nama {
        position: absolute; /* supaya bisa bebas */
        bottom: 15px; /* atau atur sesuai layout Anda */
        left: 7%;
        transform: translateX(-50%);
        z-index: 100; /* lebih tinggi dari wave (3) & gambar (1) */
        text-align: center;
        color: #000;
        padding: 10px;
        border-radius: 0px;
        display: flex;
        justify-content: space-around;
        gap: 20px;
    }

    .papan-nama .nama {
        background: linear-gradient(-45deg, #1391a5, #274685);
        border: 2px solid #ffffff; /* biru tua */
        border-radius: 8px;
        padding: 10px 20px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 170px;
    }

    .papan-nama .nama-lengkap {
        color: #fff;
        font-size: 0.75em;
        font-weight: bold;
    }
    .papan-nama .jabatan {
        color: #000000;
        font-weight: bold;
        font-size: 0.75em;
        letter-spacing: 1px;
    }

    #hero {
        min-height:935px;
    }
}
/* 431 */
@media only screen and (max-width: 431px) {
    .papan-nama {
        position: absolute; /* supaya bisa bebas */
        bottom: 20px; /* atau atur sesuai layout Anda */
        left: 8%;
        transform: translateX(-50%);
        z-index: 100; /* lebih tinggi dari wave (3) & gambar (1) */
        text-align: center;
        color: #000;
        padding: 10px;
        border-radius: 0px;
        display: flex;
        justify-content: space-around;
        gap: 45px;
    }

    .papan-nama .nama {
        background: linear-gradient(-45deg, #1391a5, #274685);
        border: 2px solid #ffffff; /* biru tua */
        border-radius: 8px;
        padding: 10px 20px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 150px;
        padding: 5px;
    }

    .papan-nama .nama-lengkap {
        color: #fff;
        font-size: 0.5625em;
        font-weight: bold;
        padding: 0px;
    }
    .papan-nama .jabatan {
        color: #000000;
        font-weight: bold;
        font-size: 0.5625em;
        letter-spacing: 1px;
        padding: 0px;
    }

    #hero {
        min-height:980px;
    }
}

/* 391 */
@media only screen and (max-width: 391px) {
    .papan-nama {
        position: absolute; /* supaya bisa bebas */
        bottom: 20px; /* atau atur sesuai layout Anda */
        left: 5%;
        transform: translateX(-50%);
        z-index: 100; /* lebih tinggi dari wave (3) & gambar (1) */
        text-align: center;
        color: #000;
        padding: 10px;
        border-radius: 0px;
        display: flex;
        justify-content: space-around;
        gap: 30px;
    }

    .papan-nama .nama {
        background: linear-gradient(-45deg, #1391a5, #274685);
        border: 2px solid #ffffff; /* biru tua */
        border-radius: 8px;
        padding: 10px 20px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 150px;
        padding: 5px;
    }

    #hero {
        min-height:935px;
    }
}
/* 361 */
@media only screen and (max-width: 361px) {
    .papan-nama {
        position: absolute; /* supaya bisa bebas */
        bottom: 20px; /* atau atur sesuai layout Anda */
        left: 6%;
        transform: translateX(-50%);
        z-index: 100; /* lebih tinggi dari wave (3) & gambar (1) */
        text-align: center;
        color: #000;
        padding: 10px;
        border-radius: 0px;
        display: flex;
        justify-content: space-around;
        gap: 30px;
    }

    .papan-nama .nama {
        background: linear-gradient(-45deg, #1391a5, #274685);
        border: 2px solid #ffffff; /* biru tua */
        border-radius: 8px;
        padding: 10px 20px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 130px;
        padding: 3px;
    }

    .papan-nama .nama-lengkap {
        color: #fff;
        font-size: 0.5625em;
        font-weight: bold;
        padding: 0px;
    }
    .papan-nama .jabatan {
        color: #000000;
        font-weight: bold;
        font-size: 0.5625em;
        letter-spacing: 1px;
        padding: 0px;
    }

    #hero {
        min-height:950px;
    }
}