/* Responsive Structural Systems Media Query Grid Mappings Layout Breakpoints Control Matrix */

@media (max-width: 1024px) {
    .container {
        padding-left: 24px;
        padding-right: 24px;
    }
    
    .grid-4-col {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    
    .grid-3-col {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    
    .size-xxlarge { font-size: 3.75rem; }
    .size-xlarge { font-size: 2.75rem; }
    .size-large { font-size: 1.85rem; }
}

@media (max-width: 768px) {
    .grid-tablet-2-col {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    
    .grid-tablet-1-col {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
    
    .display-none-desktop {
        display: block;
    }
    
    .display-none-mobile {
        display: none !important;
    }
    
    .text-center-tablet {
        text-align: center !important;
    }
    
    .align-items-mobile-start {
        align-items: flex-start !important;
    }
    
    .craftsmanship-visual-composite {
        min-height: 420px;
        margin-top: 40px;
    }
    
    .transform-translate-x-neg-10 { transform: translateX(0); }
    .transform-translate-y-10 { transform: translateY(5%); }
    
    .padding-y-large { padding-top: 40px; padding-bottom: 40px; }
    .padding-y-xlarge { padding-top: 60px; padding-bottom: 60px; }
}

@media (max-width: 480px) {
    .grid-mobile-1-col {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
    
    .flex-wrap-mobile {
        flex-wrap: wrap;
        justify-content: center;
        width: 100%;
    }
    
    .flex-wrap-mobile > a, .flex-wrap-mobile > button {
        width: 100%;
        text-align: center;
    }
    
    .size-xxlarge { font-size: 2.5rem; }
    .size-xlarge { font-size: 2rem; }
    
    .width-85-max {
        width: 85% !important;
    }
    
    .width-60 {
        width: 92% !important;
    }
}