/* ===========================================
   MANSUL MVV WIDGET - GRID
   =========================================== */

.mansul-mvv-grid {
    display: grid;
    width: 100%;
    box-sizing: border-box;
}

/* ===========================================
   ITEM/CARD
   =========================================== */

.mansul-mvv-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    width: 100%;
}

.mansul-mvv-item__icone {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.mansul-mvv-item__icone img {
    max-width: 100%;
    height: auto;
    display: block;
}

.mansul-mvv-item__content {
    width: 100%;
}

.mansul-mvv-item__titulo {
    margin: 0;
}

.mansul-mvv-item__texto {
    margin: 0;
}

.mansul-mvv-item__texto p {
    margin: 0 0 10px 0;
}

.mansul-mvv-item__texto p:last-child {
    margin-bottom: 0;
}

.mansul-mvv-item__texto ul,
.mansul-mvv-item__texto ol {
    margin: 0;
    padding-left: 20px;
}

.mansul-mvv-item__texto li {
    margin-bottom: 5px;
}

/* ===========================================
   LAYOUT - ÍCONE ACIMA (padrão)
   =========================================== */

.mansul-mvv-item--icon-top {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* ===========================================
   LAYOUT - ÍCONE À ESQUERDA
   =========================================== */

.mansul-mvv-item--icon-left {
    flex-direction: row;
    align-items: flex-start;
    text-align: left;
}

.mansul-mvv-item--icon-left .mansul-mvv-item__content {
    flex: 1;
}

/* ===========================================
   RESPONSIVO - Mobile (até 480px)
   =========================================== */

@media (max-width: 480px) {
    /* Em mobile pequeno, força layout em coluna */
    .mansul-mvv-item--icon-left {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}