/* Frontend Block Grid Styles - Forceful Application */

/* Narrow Body Section */
.subaru-narrow,
.narrow-body-section {
    max-width: 1200px !important;
    margin: 0 auto !important;
    width: 100% !important;
    padding: 0 30px !important; /* Increased padding slightly */
    box-sizing: border-box !important;
}

/* 2 Column Layout - Flexbox implementation */
/* NOW CONTAINED: Behaves like a 'narrow' section itself */
/* 2 Column Layout - Flexbox implementation */
/* NOW CONTAINED: Behaves like a 'narrow' section itself */
/* 2 Column Layout - Flexbox implementation */
/* NOW CONTAINED: Behaves like a 'narrow' section itself */
.subaru-2-col,
[class*="1-row-2-columns-1-row"],
[class*="1-row-1-2-1-2"] {
    display: flex !important;
    flex-wrap: wrap !important;
    flex-direction: row !important;
    
    /* Center it and constrain width */
    max-width: 1200px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    
    /* Ensure no negative margins pull it to the edge */
    /* Add padding to prevent touching edges on small screens */
    padding-left: 15px !important;
    padding-right: 15px !important;
    
    box-sizing: border-box !important;
}

/* Children items */
.subaru-2-col > .umb-block-grid__area,
[class*="1-row-2-columns-1-row"] > .umb-block-grid__area,
[class*="1-row-1-2-1-2"] > .umb-block-grid__area {
    flex: 0 0 50% !important;
    max-width: 50% !important;
    padding: 15px !important;
    box-sizing: border-box !important;
    display: block !important;
}

/* Tablet/Mobile Responsive */
@media (max-width: 768px) {
    .subaru-2-col > .umb-block-grid__area,
    [class*="1-row-2-columns-1-row"] > .umb-block-grid__area,
    [class*="1-row-1-2-1-2"] > .umb-block-grid__area {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}