/* Fix Projects Page Mobile Click Issues */

/* Ensure project cards are clickable on mobile */
@media (max-width: 768px) {
    /* Make sure the overlay doesn't block clicks */
    .elementor-cta__bg-overlay {
        pointer-events: none !important;
    }

    /* Ensure the main link is clickable */
    a.elementor-cta {
        pointer-events: auto !important;
        cursor: pointer !important;
        position: relative !important;
        z-index: 10 !important;
        display: block !important;
        touch-action: manipulation !important;
    }

    /* Make the content area clickable */
    .elementor-cta__content {
        pointer-events: none !important;
    }

    /* Allow touch events on the entire card */
    .elementor-widget-call-to-action {
        pointer-events: auto !important;
        touch-action: manipulation !important;
    }

    /* Ensure background wrapper doesn't block */
    .elementor-cta__bg-wrapper {
        pointer-events: none !important;
    }

    /* Make titles visible but not blocking */
    .elementor-cta__title {
        pointer-events: none !important;
        position: relative !important;
        z-index: 11 !important;
    }

    /* Improve touch target size */
    a.elementor-cta {
        min-height: 200px !important;
        width: 100% !important;
    }

    /* Remove any transform that might interfere */
    .elementor-invisible {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* Additional mobile-specific fixes */
@media (max-width: 480px) {
    /* Increase minimum touch target */
    a.elementor-cta {
        min-height: 250px !important;
        padding: 20px !important;
    }

    /* Ensure column spacing doesn't interfere */
    .elementor-column-gap-wide > .elementor-column {
        padding: 10px !important;
    }
}

/* Fix for iOS Safari specifically */
@supports (-webkit-touch-callout: none) {
    @media (max-width: 768px) {
        a.elementor-cta {
            -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1) !important;
            -webkit-touch-callout: default !important;
        }

        /* Force hardware acceleration */
        .elementor-cta__bg,
        .elementor-cta__bg-overlay {
            -webkit-transform: translateZ(0) !important;
            transform: translateZ(0) !important;
        }
    }
}

/* Desktop - keep normal behavior */
@media (min-width: 769px) {
    a.elementor-cta {
        /* Desktop hover effects remain normal */
        pointer-events: auto;
    }

    .elementor-cta__bg-overlay {
        pointer-events: auto;
    }
}