/* --- Hapus padding/margin default header OJS --- */
.pkp_structure_head, 
.pkp_structure_head .pkp_head_wrapper {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

/* --- Bungkus logo agar 100% lebar --- */
.pkp_site_name {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

/* --- LOGO: Full width, tinggi mengikuti gambar --- */
.pkp_site_name img {
    display: block !important;
    width: 100% !important;         /* FULL width */
    height: auto !important;        /* tinggi otomatis */
    margin: 0 auto !important;
    object-fit: contain !important; /* aman tidak nge-zoom */
    max-height: none !important;
}

/* --- NAVBAR menempel rapat ke bawah logo --- */
.pkp_site_nav_menu {
    margin-top: 0 !important;
}


/* ===============================
   📱 RESPONSIVE MODE (HP / ANDROID)
   =============================== */
@media (max-width: 768px) {

    /* HEADER tanpa ruang kosong */
    .pkp_structure_head, 
    .pkp_structure_head .pkp_head_wrapper {
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Logo lebih kecil supaya tidak terlalu tinggi di HP */
    .pkp_site_name img {
        width: 100% !important;
        height: auto !important;
        max-height: 180px !important;   /* batas aman untuk HP */
        object-fit: contain !important; /* biar tidak terpotong */
    }

    /* Jarak sedikit agar lebih rapi */
    .pkp_site_nav_menu {
        margin-top: 5px !important;
    }
}

/* ===============================
   📱 RESPONSIVE EXTRA SMALL (Layar sangat kecil)
   =============================== */
@media (max-width: 480px) {

    /* Logo disesuaikan lagi */
    .pkp_site_name img {
        max-height: 150px !important;
    }
}