/*
 * Arquivo CSS para o banner de destaque da página inicial.
 * Contém estilos específicos para o brasão vertical.
 */

.cc-featured-banner .d-flex.flex-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    width: 100%;
}

/* Estilos globais para o brasão (Selo) */
.brasao-vertical {
    flex: 0 0 16;
    /* Proporção exata do desktop */
    width: 16.3% !important;
    height: auto !important;
    object-fit: contain !important;
    border-right: 0.25vw solid var(--color-semiwhite);
    /* Borda proporcional */
    border-radius: 0.75rem 0 0 0.75rem;
    background-color: var(--color-primary-700);
    /* Fallback se a classe não pegar */
}

/* Container do Banner Destaque */
.cc-featured-banner .d-flex.flex-grow-1 {
    flex: 1;
    min-width: 0;
}

.cc-featured-banner .cegovbr-banner-link {
    display: block;
    width: 100%;
    height: 100%;
}

/* Imagem do Banner */
.cc-featured-banner img.w-100 {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 0 0.75rem 0.75rem 0 !important;
    display: block;
}

.cc-featured-banner .cegovbr-banner-link.d-block img.w-100 {
    border-radius: 0.75rem !important;
}

/* Ajustes específicos para telas muito pequenas */
@media (max-width: 480px) {
    .brasao-vertical {

        border-right-width: 2px !important;
    }
}