@media (max-width: 940px){
  h1{font-size:36px}
  .hero-grid{grid-template-columns:1fr}
  .cards-4{grid-template-columns:repeat(2, 1fr)}
  .cards-3{grid-template-columns:repeat(2, 1fr)}
  .two-col{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .cta{flex-direction:column; align-items:flex-start}
}

@media (max-width: 640px){
  .cards-2,.cards-3,.cards-4{grid-template-columns:1fr}
  .nav-toggle{display:inline-flex}
  .nav-menu{
    display:none;
    position:absolute; right:18px; top:70px;
    flex-direction:column; align-items:stretch;
    background: rgba(11,16,34,.96);
    border:1px solid var(--line);
    border-radius:16px;
    padding:10px;
    min-width: 220px;
  }
  .nav-menu.open{display:flex}
  .nav-menu a{width:100%}
}