/* Snow Animation */
@keyframes snow {
  0% { transform: translateY(-100vh) translateX(0); }
  100% { transform: translateY(100vh) translateX(5vw); }
}

@keyframes snow-reverse {
  0% { transform: translateY(-100vh) translateX(0); }
  100% { transform: translateY(100vh) translateX(-5vw); }
}

.snow-fall {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  pointer-events: none;
  z-index: 50;
  overflow: hidden;
}

.snowflake {
  position: absolute;
  background: white;
  border-radius: 50%;
  opacity: 0.6;
  animation: snow linear infinite;
}

/* Small snowflakes */
.snowflake:nth-of-type(3n) {
  width: 3px;
  height: 3px;
  animation-duration: 12s;
  animation-delay: -3s;
  opacity: 0.4;
}

/* Medium snowflakes */
.snowflake:nth-of-type(3n+1) {
  width: 5px;
  height: 5px;
  animation-duration: 9s;
  animation-delay: -5s;
  animation-name: snow-reverse;
}

/* Large snowflakes */
.snowflake:nth-of-type(3n+2) {
  width: 7px;
  height: 7px;
  animation-duration: 7s;
  animation-delay: -1s;
}