@media (max-width: 768px) {
    .hide-for-mobile {
        display: none !important;
    }

    .hero-bento {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .mobile-row {
        display: flex;
        flex-direction: row !important;
        gap: 1rem;

        .mobile-flex-1 {
            flex: 1 !important;
            margin-top: 0 !important;
        }

        .mobile-flex-2 {
            flex: 2 !important;
            margin-top: 0 !important;
        }
    }

    .bento-image {
        width: 50px !important;
    }

    .reverse-on-mobile {
        flex-direction: column-reverse !important;
    }

    .no-background-on-mobile .cbb-bg-image {
        background-image: none !important;
    }
}

@media (min-width: 769px) {
    .show-for-mobile {
        display: none !important;
    }

    .flex-fill-rest {
        flex: 1;
        flex-grow: 1;
        flex-shrink: 1;
        flex-basis: 0;
    }
}

@media (max-width: 1320px) and (min-width: 780px) {
    .footer-columns {
        flex-direction: column !important;
    }
}

/* 6-box grids on About/Products pages
   Force into 3x2 grid on desktop, 2-column on tablets, single column on mobile */
@media (min-width: 1024px) {
    .wp-block-columns[style*="flex-wrap:wrap"] > .wp-block-column:not([style*="flex-basis"]) {
        flex-basis: calc(33.33% - var(--wp--preset--spacing--20)) !important;
        flex-grow: 0 !important;
    }
}

@media (max-width: 1023px) and (min-width: 769px) {
    /* Tablets: 2 columns */
    .wp-block-columns[style*="flex-wrap:wrap"] > .wp-block-column:not([style*="flex-basis"]) {
        flex-basis: calc(50% - var(--wp--preset--spacing--10)) !important;
        flex-grow: 0 !important;
    }

    /* Reduce font sizes on tablets */
    .wp-block-columns[style*="flex-wrap:wrap"] .wp-block-heading {
        font-size: 1.1rem !important;
    }
    .wp-block-columns[style*="flex-wrap:wrap"] .has-medium-font-size {
        font-size: 0.95rem !important;
    }
}

@media (max-width: 768px) {
    /* Mobile: single column */
    .wp-block-columns[style*="flex-wrap:wrap"] > .wp-block-column:not([style*="flex-basis"]) {
        flex-basis: 100% !important;
        flex-grow: 0 !important;
    }

    /* Reduce font sizes on mobile */
    .wp-block-columns[style*="flex-wrap:wrap"] .wp-block-heading {
        font-size: 1rem !important;
    }
    .wp-block-columns[style*="flex-wrap:wrap"] .has-medium-font-size {
        font-size: 0.9rem !important;
    }
}

/* Homepage "What We Do" grid - has explicit flex-basis:31% */
@media (max-width: 1023px) and (min-width: 769px) {
    /* Tablets: 2 columns */
    .wp-block-columns[style*="flex-wrap:wrap"] > .wp-block-column[style*="flex-basis:31"] {
        flex-basis: calc(50% - var(--wp--preset--spacing--10)) !important;
    }

    /* Reduce font sizes */
    .wp-block-columns[style*="flex-wrap:wrap"] > .wp-block-column[style*="flex-basis:31"] .wp-block-heading {
        font-size: 1.1rem !important;
    }
}

@media (max-width: 768px) {
    /* Mobile: single column */
    .wp-block-columns[style*="flex-wrap:wrap"] > .wp-block-column[style*="flex-basis:31"] {
        flex-basis: 100% !important;
    }

    /* Reduce font sizes on mobile */
    .wp-block-columns[style*="flex-wrap:wrap"] > .wp-block-column[style*="flex-basis:31"] .wp-block-heading {
        font-size: 1rem !important;
    }
}