nav {
  background: transparent;
}

#navbar ul li #discovernav {
  color: var(--gold);
  font-weight: bold;
}

#planets-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  padding: 20px;
  gap: 20px;
}

#planets-grid .card {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#planets-page-title {
  padding: 30px;
  color: var(--gold);
}

#planets-grid .card p {
  color: var(--grey);
  font-weight: bold;
}

#planets-grid .card:hover {
  box-shadow: 0 0 20px rgba(var(--gold-rgb), 0.5);
}

/* ***************** STAR BG ***************** */

.star {
  position: absolute;
  background: white;
  border-radius: 50%;
  animation: twinkle 3s infinite;
}

#stars-layer {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

@keyframes twinkle {
  0%,
  100% {
    opacity: 0.2;
  }
  50% {
    opacity: 1;
  }
}
