/* ============================================
   FLOATING CARDS POSITION ADJUSTMENT
   Desktop Only - Move cards down closer to text
   ============================================ */

/* Desktop only - cards positioned lower */
@media (min-width: 992px) {
    .desktop-cards .card-item {
        position: absolute;
        background: white;
        border-radius: 15px;
        padding: 2rem;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
        width: 240px;
        transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    }
    
    .desktop-cards .card-item:hover {
        transform: translateY(-10px);
        box-shadow: 0 20px 40px rgba(65, 105, 225, 0.1);
    }
    
    /* Adjust card positions - moved down significantly */
    .desktop-cards .card-1 {
        top: 80px;  /* Moved down from 0 */
        left: 10%;
        animation: float-card 6s ease-in-out infinite;
        z-index: 3;
    }
    
    .desktop-cards .card-2 {
        top: 180px;  /* Moved down from 40% */
        right: 0;
        animation: float-card 7s ease-in-out infinite 1s;
        z-index: 5;
    }
    
    .desktop-cards .card-3 {
        bottom: auto;  /* Changed from bottom positioning */
        top: 280px;  /* Use top positioning instead */
        left: 25%;
        animation: float-card 8s ease-in-out infinite 0.5s;
        z-index: 4;
    }
    
    /* Adjust the interactive visual container height to accommodate new positions */
    .interactive-visual {
        position: relative;
        height: 100%;
        min-height: 450px;  /* Increased from 400px */
    }
}

/* Mobile-specific adjustments for AI Bot section */
@media (max-width: 991.98px) {
    /* Center the "Explore AI Bot Solutions" button */
    .service-action {
        text-align: center;
        margin-bottom: 3rem; /* Add space below button */
    }
    
    /* Add top margin to floating cards container to create gap */
    .mobile-cards {
        margin-top: 2rem; /* Space between button and cards */
    }
    
    .mobile-cards .card-item {
        position: relative;
        width: 100%;
        margin-bottom: 1.5rem;
        animation: none;
    }
}

/* Float animation remains the same */
@keyframes float-card {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}