.card-services {
    flex: 1;
    min-width: 120px;
    padding: 12px 16px;
    border: 2px solid #e2e8f0;
    background: white;
    border-radius: 10px;
    cursor: pointer;
    font-weight: 600;
    font-size: 13px;
    color: #4a5568;
    text-align: center;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 110px;
    /* opcional, deixa todos iguais */
    position: relative;
}

.card-services i {
    font-size: 36px;
    color: #3acce1;
    /* teste 28px, 32px, 40px */
}

.card-services.active i {
    color: white !important;
}

.card-services:hover {
    border-color: #3acce1;
    background: #ebf8ff;
    color: #2b6cb0;
    transform: translateY(-2px);
}

.card-services.active {
    border-color: #3acce1;
    background: linear-gradient(135deg, #08c2df, #21d5f1);
    color: white;
    box-shadow: 0 4px 12px rgba(13, 110, 253, 0.3);
}

.card-services.active .card-services-title,
.card-services.active .card-services-subtitle,
.card-services.active .card-services-description {
    color: white !important;
}

.card-services.active img {
    filter: brightness(0) invert(1);
}

.card-services-img {
    border: 0;
    margin-bottom: 10px;
    /* width: 25px; */
}

.card-services-title {
    font-size: 12px;
    font-weight: bold;
    color: #5d5d5d;
}

.card-services-subtitle {
    margin-top: -5px;
    font-size: 10px;
    font-weight: bold;
    color: #c3c3c3;
}


.card-services-description {
    font-size: 12px;
    color: #8d9eb2;
    margin-top: 10px;
    display: block;
}

.service-badge {
    position: absolute;
    top: -10px;
    right: -5px;
    background: linear-gradient(135deg, #2f8301, #23df30);
    color: white;
    font-size: 9px;
    font-weight: 800;
    padding: 3px 8px;
    border-radius: 10px;
    z-index: 10;
    box-shadow: 0 3px 8px rgba(58, 204, 225, 0.3);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}


@media (max-width: 890px) {}

@media (max-width: 390px) {}