/* -------------------- Bollar header ----------------------- */
body {
  margin: 0;
}

.hero {
  position: relative;
  height: 100vh;
  overflow: hidden;
  background-color: #003315;
  display: flex;
  align-items: center;
  justify-content: center;
}

.background {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.ball {
  position: absolute;
  border-radius: 50%;
  filter: blur(100px);
  opacity: 0.8;
}

/* Större bollar */
.ball1 { width: 700px; height: 700px; background: #009940; top: -200px; left: -300px; animation: move1 9s ease-in-out infinite alternate; }
.ball2 { width: 650px; height: 650px; background: #b8e6cb; top: 40%; left: -250px; animation: move2 11s ease-in-out infinite alternate; }
.ball3 { width: 600px; height: 600px; background: #e6f2eb; top: -150px; left: 60%; animation: move3 10s ease-in-out infinite alternate; }
.ball4 { width: 800px; height: 800px; background: #009940; bottom: -250px; right: -300px; animation: move4 12s ease-in-out infinite alternate; }
.ball5 { width: 500px; height: 500px; background: #b8e6cb; top: 70%; left: 30%; animation: move5 8s ease-in-out infinite alternate; }
.ball6 { width: 750px; height: 750px; background: #e6f2eb; bottom: -300px; left: -200px; animation: move6 13s ease-in-out infinite alternate; }
.ball7 { width: 550px; height: 550px; background: #009940; top: 20%; left: 80%; animation: move7 9s ease-in-out infinite alternate; }
.ball8 { width: 600px; height: 600px; background: #b8e6cb; bottom: 10%; left: 50%; animation: move8 10s ease-in-out infinite alternate; }

/* Större rörelser */
@keyframes move1 { to { transform: translate(350px, 250px); } }
@keyframes move2 { to { transform: translate(300px, -280px); } }
@keyframes move3 { to { transform: translate(-270px, 200px); } }
@keyframes move4 { to { transform: translate(-320px, -260px); } }
@keyframes move5 { to { transform: translate(280px, -220px); } }
@keyframes move6 { to { transform: translate(350px, 250px); } }
@keyframes move7 { to { transform: translate(-300px, 200px); } }
@keyframes move8 { to { transform: translate(-250px, -240px); } }