/* Enhanced Most Popular Badge - Positioned Above Service Card */
.service-badge {
    position: absolute;
    top: -35px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(135deg, #FF6B6B 0%, #FF8E53 100%);
    color: white;
    padding: 10px 18px;
    border-radius: 25px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 6px 20px rgba(255, 107, 107, 0.4);
    z-index: 20;
    white-space: nowrap;
}

.service-badge.enhanced {
    background: linear-gradient(135deg, #FF6B6B 0%, #FF8E53 50%, #FFD93D 100%);
    font-size: 0.85rem;
    padding: 10px 18px;
    font-weight: 700;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
    box-shadow: 
        0 6px 25px rgba(255, 107, 107, 0.5),
        0 0 35px rgba(255, 215, 61, 0.4);
    animation: badgePulse 2.5s ease-in-out infinite;
    border: 2px solid rgba(255, 255, 255, 0.4);
}

@keyframes badgePulse {
    0%, 100% {
        transform: translateX(-50%) scale(1);
        box-shadow: 
            0 6px 25px rgba(255, 107, 107, 0.5),
            0 0 35px rgba(255, 215, 61, 0.4);
    }
    50% {
        transform: translateX(-50%) scale(1.08);
        box-shadow: 
            0 8px 30px rgba(255, 107, 107, 0.7),
            0 0 45px rgba(255, 215, 61, 0.6);
    }
}

/* Most Popular Card Enhanced Styling */
.service-card.most-popular {
    border: 2px solid rgba(255, 215, 61, 0.4);
    background: rgba(255, 255, 255, 0.05);
    box-shadow: 
        0 20px 40px rgba(0, 0, 0, 0.3),
        0 0 50px rgba(255, 215, 61, 0.1);
    animation: shimmerBorder 3s ease-in-out infinite;
    position: relative;
}

@keyframes shimmerBorder {
    0%, 100% {
        border-color: rgba(255, 215, 61, 0.4);
        box-shadow: 
            0 20px 40px rgba(0, 0, 0, 0.3),
            0 0 50px rgba(255, 215, 61, 0.1);
    }
    50% {
        border-color: rgba(255, 215, 61, 0.8);
        box-shadow: 
            0 25px 50px rgba(0, 0, 0, 0.4),
            0 0 80px rgba(255, 215, 61, 0.2);
    }
}

.service-card.most-popular:hover {
    transform: scale(1.08) translateY(-5px);
    border-color: rgba(255, 215, 61, 0.8);
    box-shadow: 
        0 30px 60px rgba(0, 0, 0, 0.4),
        0 0 100px rgba(255, 215, 61, 0.3);
}

/* Mobile adjustments for most popular card */
@media (max-width: 768px) {
    .service-card.most-popular {
        transform: scale(1.02);
    }
    
    .service-card.most-popular:hover {
        transform: scale(1.05) translateY(-3px);
    }
    
    .service-badge.enhanced {
        font-size: 0.8rem;
        padding: 8px 16px;
    }
}
