
.snowflake {
  --size: 1vw;
  width: var(--size);
  height: var(--size);
  background: white;
  border-radius: 50%;
  position: absolute;
  top: -10vh; /* Start slightly above the viewport */
  z-index: 1000; /* Ensure snowflakes are on the top layer */
  animation: snowfall 10s linear infinite; /* Default animation */
}

/* Keyframes for snowfall animation */
@keyframes snowfall {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(0, 200vh, 0); /* Falls beyond the viewport */
  }
}

/* Style for every 6th snowflake with a blur */
.snowflake:nth-child(6n) {
  filter: blur(1px);
}
