.container {
  display: grid;
  place-content: center;
}
ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 10px;
}

li {
  background: hsl(200deg calc(100% - (sibling-index() - 1) * 15%) 60%);
  border-radius: 14px;
}


a {
  display: grid;
  grid-template-columns: 9.5em 1fr;
  align-items: center;
  gap: 12px;

  padding: 12px 14px;
  text-decoration: none;
  color: #fff;
  border-radius: 14px;
}