/* ============================================================================
   Mobile responsive safety net.
   Several theme page-CSS files only collapse the hero/footer on mobile and leave
   their content grids multi-column (they get crushed on phones). This forces the
   common content grids to collapse. Loaded LAST on every page so it always wins.
   ============================================================================ */

/* Tablet: multi-column grids drop to two */
@media (max-width: 992px) {
    .values-grid,
    .team-grid,
    .features-grid,
    .svc-grid,
    .work-grid,
    .home-blog-grid,
    .use-grid,
    .offices-grid,
    .process-grid,
    .services-grid,
    .posts-grid,
    .related-grid,
    .points-grid,
    .outcomes-grid,
    .app-grid,
    .apps-grid,
    .category-grid,
    .review-grid,
    .service-points-grid,
    .channels-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* Phone: everything stacks to a single column */
@media (max-width: 640px) {
    .values-grid,
    .team-grid,
    .features-grid,
    .svc-grid,
    .work-grid,
    .home-blog-grid,
    .use-grid,
    .offices-grid,
    .process-grid,
    .services-grid,
    .posts-grid,
    .related-grid,
    .points-grid,
    .outcomes-grid,
    .app-grid,
    .apps-grid,
    .story-grid,
    .overview-grid,
    .why-grid,
    .why-points,
    .trust-grid,
    .trust-items,
    .support-items,
    .featured-grid,
    .hero-grid,
    .hs-grid,
    .category-grid,
    .review-grid,
    .service-points-grid,
    .channels-grid,
    .form-grid,
    .showcase-grid,
    .compare-grid,
    .timeline-grid,
    .response-grid,
    .mini-grid,
    .article-layout {
        grid-template-columns: 1fr !important;
    }
}

/* ---- Mobile nav: always show the hamburger + hide desktop nav when narrow ----
   (blog.css / apps.css incorrectly set .menu-toggle{display:none} on mobile) */
@media (max-width: 1180px) {
    .nav { display: none !important; }
    .menu-toggle { display: grid !important; place-items: center !important; }
}

/* ---- Don't let sticky sidebars / anchor bars stick on mobile (they overlap
   the page in a single-column layout) ---- */
@media (max-width: 992px) {
    .service-anchor-bar,
    .subnav,
    .service-summary,
    .overview-card {
        position: static !important;
        top: auto !important;
    }
}
