/**
 * Services Module Styles - Soluciones Express
 * Tech Lead - ALIANZAGSM
 */

.app-card {
    background: #fff !important;
    border: 1px solid #E2E8F0 !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05) !important;
    border-radius: 16px !important;
    padding: 24px 16px !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.app-card:hover {
    transform: translateY(-4px) !important;
    border-color: var(--primary) !important;
    box-shadow: 0 10px 15px -3px rgba(37, 99, 235, 0.1), 0 4px 6px -4px rgba(37, 99, 235, 0.1) !important;
}

.app-card:active {
    transform: scale(0.95) !important;
}

.app-card span:first-child {
    transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.app-card:hover span:first-child {
    transform: scale(1.2) rotate(8deg);
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInScale {
    from {
        opacity: 0;
        transform: scale(0.98);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.native-form-animate {
    animation: slideUp 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.native-grid-animate {
    animation: fadeInScale 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}