/* =====================================================
   CSS CORREGIDO - CAJAS MÁS BAJAS Y RESPONSIVE
   ===================================================== */

/* Fondo oscuro con buen contraste */
.benifits-block {
    background: linear-gradient(135deg, #d47993 0%, #c96783 100%) !important;
    border: 2px solid rgba(255, 255, 255, 0.2);
    /* Reducido el padding vertical - era 48px arriba y 120px abajo */
    padding: 32px 28px 80px 28px !important;
    /* Reducida la altura mínima - era 320px */
    min-height: 260px !important;
}

/* Hover más brillante */
.benifits-block:hover {
    background: linear-gradient(135deg, #e08aa0 0%, #d47993 100%) !important;
}

/* Texto blanco para buen contraste */
.benifits-block h5 {
    color: #FFFFFF !important;
    text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.15);
    /* Reducido el margen inferior */
    margin-bottom: 12px !important;
}

.benifits-block p {
    color: rgba(255, 255, 255, 0.95) !important;
    /* Ajustado el line-height para más compacto */
    line-height: 145% !important;
}

/* Círculo de imagen más pequeño y mejor posicionado */
.benifits-block .image-circle {
    /* Reducido el tamaño - era 90px */
    width: 75px !important;
    height: 75px !important;
    /* Ajustada la posición */
    bottom: 20px !important;
    right: 20px !important;
}

.benifits-block .image-circle img {
    /* Reducido el tamaño de la imagen */
    max-width: 40px !important;
    max-height: 40px !important;
}

/* ===================================================== */
/* RESPONSIVE - MEJORADO */
/* ===================================================== */

/* Tablets grandes (1200px - 1399px) */
@media (max-width: 1399px) {
    .benifits-block {
        padding: 28px 24px 75px 24px !important;
        min-height: 240px !important;
    }
}

/* Tablets (992px - 1199px) */
@media (max-width: 1199px) {
    .benifits-block {
        padding: 28px 24px 70px 24px !important;
        min-height: 230px !important;
    }
    
    .benifits-block h5 {
        font-size: 20px !important;
    }
    
    .benifits-block .image-circle {
        width: 70px !important;
        height: 70px !important;
        bottom: 18px !important;
        right: 18px !important;
    }
    
    .benifits-block .image-circle img {
        max-width: 36px !important;
        max-height: 36px !important;
    }
}

/* Tablets pequeñas (768px - 991px) */
@media (max-width: 991px) {
    .benifits-block {
        padding: 24px 20px 65px 20px !important;
        min-height: 220px !important;
        margin-bottom: 20px !important;
    }
    
    .benifits-block h5 {
        font-size: 19px !important;
        margin-bottom: 10px !important;
    }
    
    .benifits-block p {
        font-size: 15px !important;
        line-height: 140% !important;
    }
    
    .benifits-block .image-circle {
        width: 65px !important;
        height: 65px !important;
        bottom: 16px !important;
        right: 16px !important;
    }
    
    .benifits-block .image-circle img {
        max-width: 34px !important;
        max-height: 34px !important;
    }
}

/* Móviles (577px - 767px) */
@media (max-width: 767px) {
    .benifits-block {
        padding: 24px 20px 60px 20px !important;
        min-height: 200px !important;
        margin-bottom: 20px !important;
    }
    
    .benifits-block h5 {
        font-size: 18px !important;
    }
    
    .benifits-block p {
        font-size: 14px !important;
    }
    
    .benifits-block .image-circle {
        width: 60px !important;
        height: 60px !important;
        bottom: 16px !important;
        right: 16px !important;
    }
    
    .benifits-block .image-circle img {
        max-width: 32px !important;
        max-height: 32px !important;
    }
}

/* Móviles pequeños (hasta 576px) */
@media (max-width: 576px) {
    .benifits-block {
        padding: 20px 18px 55px 18px !important;
        min-height: 190px !important;
        margin-bottom: 16px !important;
    }
    
    .benifits-block h5 {
        font-size: 17px !important;
        margin-bottom: 8px !important;
    }
    
    .benifits-block p {
        font-size: 14px !important;
        line-height: 135% !important;
    }
    
    .benifits-block .image-circle {
        width: 55px !important;
        height: 55px !important;
        bottom: 14px !important;
        right: 14px !important;
    }
    
    .benifits-block .image-circle img {
        max-width: 30px !important;
        max-height: 30px !important;
    }
}

/* Móviles muy pequeños (hasta 400px) */
@media (max-width: 400px) {
    .benifits-block {
        padding: 18px 16px 50px 16px !important;
        min-height: 180px !important;
    }
    
    .benifits-block h5 {
        font-size: 16px !important;
    }
    
    .benifits-block p {
        font-size: 13px !important;
    }
}

/* Los iconos se mantienen EXACTAMENTE igual que antes */