/* ============================================
   CAROUSEL MOBILE OPTIMIZATION
   Специфични стилове за мобилната версия на карусела
   ============================================ */

@media (max-width: 768px) {
    /* ============================================
       SPONSORS SECTION MOBILE
       ============================================ */

    /* Platform Features Carousel Background - Mobile Override */
    #platform-features-carousel {
        background: linear-gradient(135deg, #0a0e27 0%, #1a1f3a 25%, #2d1b4e 50%, #1a1f3a 75%, #0a0e27 100%) !important;
        background-size: 400% 400% !important;
        animation: gradientShift 15s ease infinite !important;
    }

    /* Sponsors Header */
    .sponsors-section-wrapper {
        padding: 20px 0 30px 0 !important;
        background: transparent !important;
    }

    .sponsors-header {
        margin-bottom: 2rem !important;
        padding: 0 1rem !important;
    }

    .sponsors-title {
        font-size: 24px !important;
        margin-bottom: 0.5rem !important;
    }

    /* ============================================
       CAROUSEL MOBILE STYLES
       ============================================ */

    /* Carousel Container */
    .carousel-container {
        padding: 0 !important;
        overflow: visible !important;
    }

    /* Carousel Height */
    .carousel {
        height: 360px !important;
    }

    /* Carousel Items - More Spacing for Mobile */
    .carousel-item {
        width: 200px !important;
        height: 280px !important;
        margin-left: -85px !important; /* Increased from -100px for less overlap */
        margin-top: -140px !important;
        padding: 0 20px !important; /* Increased padding between cards */
    }

    /* Cards */
    .card {
        padding: 10px !important;
        border-radius: 14px !important;
    }

    .card img {
        height: 110px !important;
        border-radius: 10px !important;
    }

    .card-content h3 {
        font-size: clamp(0.45rem, 2vw, 0.55rem) !important;
    }

    .card-content p {
        font-size: clamp(0.5rem, 2.5vw, 0.65rem) !important;
        padding: 0 6px 10px 6px !important;
    }

    .nav {
        font-size: 1rem !important;
        padding: 6px 10px !important;
    }

    /* Carousel Controls */
    .carousel-control-prev,
    .carousel-control-next {
        width: 44px !important;
        height: 44px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        background: rgba(25, 134, 28, 0.9) !important;
        border-radius: 50% !important;
        opacity: 0.9 !important;
    }

    .carousel-control-prev {
        left: 8px !important;
    }

    .carousel-control-next {
        right: 8px !important;
    }

    /* Carousel Indicators */
    .carousel-indicators {
        margin-bottom: -20px !important;
    }

    .carousel-indicators button {
        width: 8px !important;
        height: 8px !important;
        border-radius: 50% !important;
        margin: 0 4px !important;
    }
}

@media (max-width: 480px) {
    /* Extra small screens adjustments */
    .carousel {
        height: 320px !important;
    }

    .carousel-item {
        width: 180px !important;
        height: 260px !important;
        margin-left: -75px !important; /* Consistent with increased spacing */
        margin-top: -130px !important;
        padding: 0 18px !important; /* Slightly reduced but still more than before */
    }

    .card img {
        height: 100px !important;
    }

    .card-content h3 {
        font-size: clamp(0.42rem, 2vw, 0.5rem) !important;
    }

    .card-content p {
        font-size: clamp(0.45rem, 2.2vw, 0.6rem) !important;
    }
}