/* ===== OJS 3.0 - RPQ - Logo Responsiva (200px Desktop / 30px Mobile) ===== */

/* DESKTOP - Logo com altura exata de 200px */
.pkp_site_name_wrapper .pkp_site_name img {
    max-height: 200px;
    height: 200px;
    width: auto;
    object-fit: contain;
}

.pkp_site_name_wrapper {
    height: auto;
    display: flex;
    align-items: center;
}

/* ===== TABLET (768px até 1024px) ===== */
@media screen and (max-width: 1024px) {
    .pkp_site_name_wrapper .pkp_site_name img {
        max-height: 120px;
        height: 120px;
        width: auto;
    }
    
    .pkp_site_name_wrapper {
        height: auto;
        min-height: 140px;
    }
}

/* ===== MOBILE MÉDIO (481px até 767px) ===== */
@media screen and (max-width: 767px) {
    .pkp_site_name_wrapper .pkp_site_name img {
        max-height: 80px;
        height: 80px;
        width: auto;
    }
    
    .pkp_site_name_wrapper {
        height: auto;
        min-height: 100px;
        padding: 10px 0;
    }
}

/* ===== MOBILE PEQUENO (até 480px) ===== */
@media screen and (max-width: 480px) {
    .pkp_site_name_wrapper .pkp_site_name img {
        max-height: 50px;
        height: 50px;
        width: auto;
    }
    
    .pkp_site_name_wrapper {
        height: auto;
        min-height: 70px;
        padding: 10px 0;
    }
}

/* ===== DISPOSITIVOS MUITO PEQUENOS (até 320px) ===== */
@media screen and (max-width: 320px) {
    .pkp_site_name_wrapper .pkp_site_name img {
        max-height: 30px;
        height: 30px;
        width: auto;
    }
    
    .pkp_site_name_wrapper {
        height: auto;
        min-height: 50px;
        padding: 5px 0;
    }
}

/* ===== CARTÃO RESPONSIVO COM LOGO ===== */
.logo-card {
    min-height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.logo-card img {
    max-height: 200px;
    height: 200px;
    width: auto;
    object-fit: contain;
}

@media screen and (max-width: 767px) {
    .logo-card {
        min-height: 120px;
    }
    
    .logo-card img {
        max-height: 80px;
        height: 80px;
    }
}

@media screen and (max-width: 480px) {
    .logo-card {
        min-height: 80px;
    }
    
    .logo-card img {
        max-height: 50px;
        height: 50px;
    }
}

@media screen and (max-width: 320px) {
    .logo-card {
        min-height: 60px;
    }
    
    .logo-card img {
        max-height: 30px;
        height: 30px;
    }
}