@media (max-width: 900px) {
  .header-top {
    display: grid;
    grid-template-columns: auto auto;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 0.5rem;
  }

  .logo {
    grid-column: 1;
    grid-row: 1;
  }

  .main-nav {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
  }

  .searchbar {
    grid-column: 1 / span 2;
    grid-row: 2;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
  }

  .search-wrapper {
    flex: 1;
  }

  .searchbar button {
    margin-top: 0.5rem;
  }
}