body {
    min-height: 100%;
}

:root {
  --star-color: #CDB482;
  --star-dim: #CDB48280;
  --sky-bg: #030f22;
}

.star-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: -1;
  background-color: var(--sky-bg); 
  overflow: hidden;
  pointer-events: none;
}

.stars {
  background: transparent;
  border-radius: 50%;
  position: absolute;
  will-change: opacity;
}

.stars-1 {
  width: 1px;
  height: 1px;
  box-shadow: 
    7vw 12vh var(--star-color), 82vw 19vh var(--star-dim), 41vw 82vh var(--star-color), 29vw 44vh var(--star-color), 
    94vw 92vh var(--star-dim), 13vw 71vh var(--star-color), 66vw 8vh var(--star-dim), 2vw 37vh var(--star-color), 
    38vw 15vh var(--star-color), 79vw 42vh var(--star-color), 51vw 28vh var(--star-color), 8vw 91vh var(--star-color), 
    89vw 52vh var(--star-color), 1vw 24vh var(--star-color), 47vw 75vh var(--star-color), 63vw 22vh var(--star-color), 
    74vw 58vh var(--star-color), 81vw 11vh var(--star-color), 96vw 89vh var(--star-color), 18vw 3vh var(--star-color);
  animation: pulse 18s infinite ease-in-out;
}

.stars-2 {
  width: 1.5px;
  height: 1.5px;
  box-shadow: 
    34vw 14vh var(--star-color), 68vw 45vh var(--star-color), 15vw 81vh var(--star-dim), 81vw 24vh var(--star-color), 
    57vw 52vh var(--star-color), 8vw 68vh var(--star-color), 91vw 12vh var(--star-color), 31vw 88vh var(--star-color), 
    25vw 33vh var(--star-color), 53vw 19vh var(--star-color), 76vw 55vh var(--star-color), 19vw 22vh var(--star-color), 
    42vw 84vh var(--star-color), 61vw 61vh var(--star-color), 12vw 65vh var(--star-color), 28vw 38vh var(--star-color), 
    75vw 47vh var(--star-color), 86vw 94vh var(--star-color), 97vw 5vh var(--star-color), 4vw 79vh var(--star-color);
  animation: pulse 14s infinite ease-in-out -4s;
}

.stars-3 {
  width: 2px;
  height: 2px;
  box-shadow: 
    22vw 63vh var(--star-color), 61vw 72vh var(--star-dim), 91vw 8vh var(--star-color), 38vw 35vh var(--star-color), 
    59vw 7vh var(--star-color), 11vw 18vh var(--star-color), 37vw 39vh var(--star-color), 51vw 11vh var(--star-color), 
    79vw 29vh var(--star-color), 88vw 81vh var(--star-color), 16vw 25vh var(--star-color), 35vw 12vh var(--star-color), 
    55vw 31vh var(--star-color), 71vw 14vh var(--star-color), 19vw 4vh var(--star-color), 27vw 49vh var(--star-color), 
    46vw 18vh var(--star-color), 69vw 28vh var(--star-color), 85vw 11vh var(--star-color), 9vw 29vh var(--star-color);
  animation: pulse 12s infinite ease-in-out -8s;
}

.stars-4 {
  width: 1px;
  height: 1px;
  opacity: 0.3;
  box-shadow: 
    6vw 9vh var(--star-color), 91vw 91vh var(--star-color), 48vw 48vh var(--star-color), 22vw 21vh var(--star-color), 
    71vw 71vh var(--star-color), 4vw 94vh var(--star-color), 28vw 74vh var(--star-color), 45vw 55vh var(--star-color), 
    68vw 31vh var(--star-color), 85vw 12vh var(--star-color), 16vw 84vh var(--star-color), 36vw 62vh var(--star-color), 
    58vw 41vh var(--star-color), 79vw 22vh var(--star-color), 96vw 11vh var(--star-color), 17vw 82vh var(--star-color), 
    37vw 61vh var(--star-color), 57vw 42vh var(--star-color), 77vw 21vh var(--star-color), 97vw 11vh var(--star-color);
  animation: pulse 22s infinite ease-in-out -12s;
}

@keyframes pulse {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 1; }
}