@media (max-width: 1100px) {
    .flow { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .menu-toggle { display: block; }
    .site-nav {
        position: fixed; inset: 0 0 0 auto; width: min(360px, 88%); height: 100dvh;
        background: #fff; flex-direction: column; align-items: stretch;
        padding: 88px 22px 28px; transform: translateX(110%); transition: transform .24s ease;
        box-shadow: var(--shadow-md); z-index: 1100; overflow-y: auto;
    }
    .site-nav.is-open { transform: translateX(0); }
    .nav-list { flex-direction: column; }
    .nav-actions { flex-direction: column; }
    .nav-backdrop {
        display: block; position: fixed; inset: 0; width: 100%; height: 100%;
        background: rgba(11,27,48,.45); z-index: 1050;
    }
    .nav-backdrop[hidden] { display: none; }
    .grid-3, .grid-2, .form-grid, .footer-grid { grid-template-columns: 1fr; }
    .track-widget { grid-template-columns: 1fr; }
    .hero { padding: 56px 0 48px; }
    .flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    .grid-4 { grid-template-columns: 1fr; }
    .flow { grid-template-columns: 1fr; }
    .hero-actions, .cta-actions { flex-direction: column; }
    .hero-actions .btn, .cta-actions .btn, .track-widget .btn { width: 100%; }
    .toast-stack { left: 12px; right: 12px; width: auto; }
    .section { padding: 56px 0; }
}