/* ========================================
   MOBILE IMPACT CARDS - ANIMATION RESTORED
   1. Opacity FORCED to 1 (To ensure visibility)
   2. CUT FIX maintained (object-fit:cover, height:280px)
   3. CONTENT TOP maintained (upar show)
   4. ANIMATIONS ALLOWED (Removed 'animation: none')
   ======================================== */

@media (max-width: 768px) {

    /* Allow animations/transforms to control visibility */
    .impact-section,
    div[class*="impact"]:not(.impact-card):not(.impact-card-overlay):not(.impact-icon):not(.impact-number):not(.impact-description) {
        opacity: 1 !important;
        visibility: visible !important;
    }

    /* CARD CONTAINER - FIXED SIZE (Cuts image) */
    .impact-card {
        position: relative !important;
        display: block !important;
        height: 280px !important;
        width: 100% !important;
        margin-bottom: 20px !important;
        border-radius: 20px !important;
        overflow: hidden !important;
        background: #000 !important;
        padding: 0 !important;
    }

    /* IMAGE - FORCE COVER */
    .impact-card .impact-card-image {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .impact-card .impact-card-image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center top !important;
    }

    /* OVERLAY - PINNED TO TOP */
    .impact-card .impact-card-overlay {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;

        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-end !important;
        align-items: flex-start !important;

        padding: 20px 20px !important;

        background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, transparent 100%) !important;
        z-index: 100 !important;
    }

    .impact-icon-num-wrapper {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 12px !important;
        margin-bottom: 5px !important;
        width: 100% !important;
    }

    /* ICONS and TEXT */
    .impact-card .impact-icon {
        width: 50px !important;
        height: 50px !important;
        margin: 0 !important;
        background: #ffffff !important;
        border-radius: 50% !important;
        border: 2px solid #ff8c00 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-shrink: 0 !important;
        overflow: hidden !important;
    }

    .impact-card .impact-icon svg,
    .impact-card .impact-icon img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        transform: scale(1.1) !important;
    }

    .impact-card .impact-number {
        font-size: 28px !important;
        margin: 0 !important;
        color: #ff8c00 !important;
        text-align: left !important;
    }

    .impact-card .impact-description {
        font-size: 14px !important;
        margin: 0 !important;
        color: #ffffff !important;
        line-height: 1.3 !important;
        text-align: left !important;
    }

    /* Remove Pseudo */
    .impact-card-overlay::before,
    .impact-card-overlay::after {
        display: none !important;
    }
}