/* ===================================
   PURPLLE CASE STUDY - MOBILE RESPONSIVE
   =================================== */

@media (max-width: 768px) {
    /* Challenge Cards - 2x2 layout */
    #case-purplle .challenge-cards {
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
    }
    
    /* Stress Test Chart */
    #case-purplle .stress-test-chart {
        padding: 16px !important;
        height: 300px !important;
    }
    
    /* Impact Grid - 2x2 layout */
    #case-purplle .impact-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }
    
    #case-purplle .impact-card,
    #case-purplle .impact-item,
    #case-purplle .impact-tile {
        padding: 12px !important;
    }
    
    #case-purplle .impact-number,
    #case-purplle .impact-value {
        font-size: 18px !important;
    }
    
    /* Architect's Note */
    #case-purplle .case-note {
        padding: 18px 20px !important;
    }
    
    #case-purplle .case-note p {
        font-size: 15px !important;
    }
}