@media (max-width: 1100px) {
  .hero-grid,
  .about-grid,
  .app-grid,
  .footer-grid,
  .panel-grid,
  .triple-grid,
  .contact-grid {
    grid-template-columns: 1fr 1fr;
  }

  .cards-4 {
    grid-template-columns: repeat(2, 1fr);
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 860px) {
  .nav {
    display: none;
  }

  .hero-grid,
  .about-grid,
  .app-grid,
  .panel-grid,
  .triple-grid,
  .footer-grid,
  .cards-4,
  .pillars,
  .contact-grid {
    grid-template-columns: 1fr;
  }

  .section-head,
  .panel-head,
  .header-inner {
    flex-direction: column;
    align-items: flex-start;
  }

  .header-inner {
    gap: 14px;
  }

  .container {
    width: min(var(--container), calc(100% - 32px));
  }

  .hero-grid {
    padding: 60px 0 76px;
  }

  .section {
    padding: 72px 0;
  }

  h1 {
    font-size: 40px;
  }

  .section h2 {
    font-size: 34px;
  }

  .footer-copy img {
    max-width: 50%;
  }
}