.capabilities-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);  
            gap: 20px;  
        }

       
        .capability-card {
            position: relative;
            border-radius: 8px;
            overflow: hidden;
            color: white;
            /* height: 280px; */
        }

     
        .card-img {
            width: 100%;
            height: 100%;
            object-fit: cover; 
            filter: brightness(0.7);  
            transition: filter 0.3s ease;
        }

        .capability-card:hover .card-img {
            filter: brightness(0.8);  
        }

        
        .card-content {
            position: absolute;
            bottom: 20px;
            left: 20px;
            z-index: 2;  
        }

        .card-title {
            font-size: clamp(16px, 0.94vw, 18px);
            font-weight: 700;
            color: #fff;
            margin-bottom: 6px;
        }

        .card-desc {
            font-size: clamp(12px, 0.78vw, 15px);
            line-height: 1.4;
            opacity: 0.9;
        }
 
        @media (max-width: 992px) {
            .capabilities-grid {
                grid-template-columns: repeat(2, 1fr);
                gap: 15px;
            }
        }

        @media (max-width: 576px) {
            .capabilities-grid {
                grid-template-columns: 1fr;
                gap: 10px;
            }
        }