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

@media (max-width: 920px) {
  .hero,
  .split,
  .quote-card,
  .screenshots-grid {
    grid-template-columns: 1fr;
  }

  .grid,
  .references,
  .stats {
    grid-template-columns: 1fr;
  }

}

@media (max-width: 760px) {
  .brand span {
    display: none;
  }
}

@media (max-width: 620px) {
  .page,
  .topbar-inner {
    width: min(100% - 24px, var(--max));
  }

  .hero {
    padding-top: 48px;
  }

  section {
    padding: 44px 0;
  }

  .product-card,
  .split,
  .quote-card {
    padding: 18px;
  }

  .hero-actions {
    flex-direction: column;
  }

  .button {
    width: 100%;
  }

  .nav-actions {
    gap: 8px;
  }
}