/* Background */
.background-decor {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  z-index: -1;
  pointer-events: none;
}

.background-decor img {
  position: absolute;
  z-index: 0;
  user-select: none;
  pointer-events: none;
}

/* Clouds */
.background-decor img[alt="Облака"] {
  top: .5rem;
  left: 0;
  width: 40rem;
  opacity: 0.8;
  animation: cloud-move 65s linear infinite;
}

/* Sun */
.background-decor img[alt="Солнце"] {
  top: 4rem;
  left: 4rem;
  width: 17rem;
  opacity: 0.9;
  animation: sun-spin 50s linear infinite;
}

/* Pines */
.background-decor img[alt="Елки"] {
  bottom: -3rem;
  right: -2rem;
  width: 48rem;
  opacity: 0.9;
}

/* Camp */
.background-decor img[alt="Палатка"] {
  bottom: -8rem;
  left: 8rem;
  width: 37rem;
  opacity: 0.85;
}

/* Fire */
.background-decor img[alt="Костер"] {
  bottom: -2rem;
  left: 50rem;
  width: 14rem;
  opacity: 0.75;
}

/* ANIMATION */
@keyframes cloud-move {
  0% { left: -30%; }
  100% { left: 100%; }
}

@keyframes sun-spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Adaptive response */
@media (max-width: 1024px) {
  .background-decor img[alt="Облака"] { width: 32rem; }
  .background-decor img[alt="Солнце"] { width: 12rem; left: 4rem; }
  .background-decor img[alt="Елки"] { width: 40rem; }
  .background-decor img[alt="Палатка"] { width: 28rem; }
  .background-decor img[alt="Костер"] { width: 12rem; left: 47rem; bottom: -1.5rem; }


    /* Pines */
    .background-decor img[alt="Елки"] {
        bottom: -2rem;
        right: -15rem;
    }

    /* Camp */
    .background-decor img[alt="Палатка"] {
        bottom: -5.5rem;
        left: 0rem;
      }

      /* Fire */
    .background-decor img[alt="Костер"] {
        bottom: -1rem;
        left: 29rem;
    }
}

@media (max-width: 768px) {
  .background-decor img[alt="Облака"] { width: 28rem; }
  .background-decor img[alt="Солнце"] { width: 15rem; }
  .background-decor img[alt="Елки"] { width: 29rem; }
  .background-decor img[alt="Палатка"] { width: 16rem; left: 8rem; }
  .background-decor img[alt="Костер"] { width: 8rem; left: 25rem; }

    /* Clouds */
    .background-decor img[alt="Облака"] {
        top: 2.5rem;
        left: 0;
    }
  
  /* Sun */
  .background-decor img[alt="Солнце"] {
    top: 4rem;
    left: 2rem;
  }
    /* Pines */
    .background-decor img[alt="Елки"] {
        bottom: -2rem;
        right: -10rem;
    }

    /* Camp */
    .background-decor img[alt="Палатка"] {
        bottom: -3rem;
        left: 0rem;
      }

      /* Fire */
    .background-decor img[alt="Костер"] {
        bottom: 0rem;
        left: 19rem;
    }  
}

@media (max-width: 480px) {
  .background-decor img[alt="Облака"] { width: 25rem; }
  .background-decor img[alt="Солнце"] { width: 12rem; }
  .background-decor img[alt="Елки"] { width: 40rem; }
  .background-decor img[alt="Палатка"] { width: 17rem; }
  .background-decor img[alt="Костер"] { width: 7rem; }

  @keyframes cloud-move {
    0% { left: -100%; }
    100% { left: 100%; }
  }

    /* Clouds */
    .background-decor img[alt="Облака"] {
        top: 2.5rem;
        left: 0;
        animation: cloud-move 25s linear infinite;
    }
  
  /* Sun */
  .background-decor img[alt="Солнце"] {
    top: 1rem;
    left: -2rem;
  }
    /* Pines */
    .background-decor img[alt="Елки"] {
        bottom: -2rem;
        right: -16rem;
    }

    /* Camp */
    .background-decor img[alt="Палатка"] {
        bottom: -3.5rem;
        left: -2rem;
      }

      /* Fire */
    .background-decor img[alt="Костер"] {
        opacity: 0;
    }  
}

@media (max-width: 360px) {
  .background-decor img[alt="Облака"] { width: 25rem; }
  .background-decor img[alt="Солнце"] { width: 10rem; }
  .background-decor img[alt="Елки"] { width: 24rem; }
  .background-decor img[alt="Палатка"] { width: 14rem; }
      /* Облака */
      .background-decor img[alt="Облака"] {
        top: 2.5rem;
        left: 0;
    }
  
  /* Sun */
  .background-decor img[alt="Солнце"] {
    top: 2rem;
    left: 0rem;
  }
    /* Pines */
    .background-decor img[alt="Елки"] {
        bottom: -2rem;
        right: -10rem;
    }

    /* Camp */
    .background-decor img[alt="Палатка"] {
        bottom: -3rem;
        left: -1rem;
      } 
}