.gag-logo.index {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;

  width: min(320px, 60%)
}

.hero {
  margin: 96px 0;
}

ul.grid.index {
  list-style-type: none;
  padding: 0;
  margin: 1em 0;
  margin-top: 0 !important;

  display: grid;
  grid-gap: 2em;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-columns: 1fr;

  text-align: center;
}

ul.grid.index li {
  padding: 6px 1.2em;
  height: 100%;
}

ul.grid.index a {
  color: var(--fg-color);
  text-decoration: none;
}

@media (max-width: 720px) {
  ul.grid.index {
    grid-template-columns: 1fr;
  }
}