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

  .hero-container,
  .about-container,
  .app-container {
    grid-template-columns: 1fr;
  }

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

  .service-card {
    width: 250px;
    height: 250px;
  }

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

  .reviews-grid {
    grid-template-columns: 1fr;
    gap: var(--spacing-sm);
  }

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

  .hero-content h1 {
    font-size: 36px;
  }

  .footer-bottom {
    flex-direction: column;
    gap: var(--spacing-sm);
    text-align: center;
  }
}