.logo {
  text-decoration: none;
  position: relative;
  padding: 0.2em;
  top: 0;
  color: #000;
  transition:
    border
      linear(
        0,
        0.03 1.1%,
        0.125 2.4%,
        0.906 9.8%,
        1.046 12.3%,
        1.11 15%,
        1.116 16.3%,
        1.11 17.8%,
        1.014 25.8%,
        0.987 31.2%,
        1.001 47.2%,
        1
      )
      0.5s,
    box-shadow
      linear(
        0,
        0.03 1.1%,
        0.125 2.4%,
        0.906 9.8%,
        1.046 12.3%,
        1.11 15%,
        1.116 16.3%,
        1.11 17.8%,
        1.014 25.8%,
        0.987 31.2%,
        1.001 47.2%,
        1
      )
      0.5s,
    top
      linear(
        0,
        0.03 1.1%,
        0.125 2.4%,
        0.906 9.8%,
        1.046 12.3%,
        1.11 15%,
        1.116 16.3%,
        1.11 17.8%,
        1.014 25.8%,
        0.987 31.2%,
        1.001 47.2%,
        1
      )
      1s 0.5s;
}

.logo:hover {
  border: 2px solid #000;
  box-shadow: 4px 4px 0 #000;
  color: #000;
  top: 10px;
}

li {
  list-style-type: square;
}

.links-box {
  width: 90%;
  max-width: 800px;
  margin: 1em auto;
}

.links-box {
  width: min-content;
}

.links img {
  aspect-ratio: 1;
  height: 5em;
  transition: linear(
      0,
      0.013 0.6%,
      0.05 1.2%,
      0.2 2.5%,
      0.949 6.7%,
      1.2 8.4%,
      1.286 9.2%,
      1.35 10%,
      1.392 10.8%,
      1.411 11.6%,
      1.411 12.2%,
      1.401 12.8%,
      1.343 14.2%,
      1.258 15.5%,
      1.016 18.7%,
      0.914 20.4%,
      0.856 21.9%,
      0.831 23.5%,
      0.834 24.7%,
      0.858 26.1%,
      0.996 30.7%,
      1.037 32.4%,
      1.06 33.9%,
      1.07 35.4%,
      1.061 37.7%,
      0.989 43.8%,
      0.971 47.2%,
      1.012 59.1%,
      0.995 70.8%,
      1
    )
    1s;
}

.links img:hover {
  height: 5.5em;
}

.links:hover img:not(:hover) {
  height: 4.5em;
}

.links {
  width: 18em;
  height: 5.5em;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1em;
}