/* Header */
.header__description {
  width: 90%;
  text-align: left;
  line-height: 1.5;
  color: var(--color-black);
  font-weight: 600;
  font-family: "AveriaSerif", sans-serif;
  font-size: clamp(0.8em, 2vw, 1.1em);
}

.header__description p {
  margin: 0 0 0.5rem 0;
}

/* Navigation */
.nav {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 1000px;
  min-height: 50vh;
  margin: 0 auto;
}

.nav__item:nth-child(odd) {
  align-self: flex-start;
}

.nav__item:nth-child(even) {
  align-self: flex-end;
}

.nav__item:nth-child(1) {
  --cloud-margin: -30px 0 0 10%;
}

.nav__item:nth-child(2) {
  --cloud-margin: -90px 18% 0 0;
}

.nav__item:nth-child(3) {
  --cloud-margin: -20px 0 0 29%;
}

.nav__item:nth-child(4) {
  --cloud-margin: -55px 9% 0 0;
}

.nav__item:nth-child(5) {
  --cloud-margin: -85px 0 0 4%;
}

.nav__item:nth-child(6) {
  --cloud-margin: -7px 16% 0 0;
}

.nav__item:nth-child(7) {
  --cloud-margin: -95px 0 0 20%;
}

@media (max-width: 768px) {
  .header {
    min-height: 150px;
  }

  .header__cloud {
    width: 90%;
  }

  .header__content {
    width: 85%;
  }

  .cloud__text {
    font-size: clamp(1.4rem, 2.5vw, 1.2rem);
  }

  .nav {
    padding-bottom: 2rem;
  }

  .nav__item {
    width: 200px;
  }

  .nav__item:nth-child(1) {
    --cloud-margin: 0px 0 0 10%;
  }
  .nav__item:nth-child(2) {
    --cloud-margin: -40px 18% 0 0;
  }
  .nav__item:nth-child(3) {
    --cloud-margin: -10px 0 0 29%;
  }
  .nav__item:nth-child(4) {
    --cloud-margin: 0 5% 0 0;
  }
  .nav__item:nth-child(5) {
    --cloud-margin: -35px 0 0 4%;
  }
  .nav__item:nth-child(6) {
    --cloud-margin: -5px 10% 0 0;
  }
  .nav__item:nth-child(7) {
    --cloud-margin: -45px 0 0 20%;
  }
}

@media (max-width: 560px) {
  .header {
    min-height: 120px;
  }

  .header__cloud {
    width: 92%;
    aspect-ratio: 1.5;
  }

  .header__content {
    width: 88%;
    gap: 0.6rem;
    margin-top: 1.5rem;
  }

  .header__description {
    width: 85%;
    font-size: clamp(0.65em, 1.9vw, 0.95em);
    line-height: 1.35;
  }
}

@media (max-width: 480px) {
  .header {
    min-height: 100px;
  }

  .header__cloud {
    width: 95%;
    aspect-ratio: 1.4;
  }

  .header__content {
    width: 90%;
    gap: 0.5rem;
    margin-top: 1rem;
  }

  .header__description {
    width: 82%;
    line-height: 1.3;
    font-size: clamp(0.75em, 1.8vw, 0.9em);
  }

  .cloud__text {
    width: 65%;
    line-height: 1.2;
    top: 65%;
    font-size: clamp(1.2rem, 2.5vw, 1.2rem);
  }

  .nav {
    padding-bottom: 1rem;
  }

  .nav__item {
    width: 200px;
  }

  .nav__item:nth-child(1) {
    --cloud-margin: -10px 0 0 5%;
  }
  .nav__item:nth-child(2) {
    --cloud-margin: -20px 10% 0 0;
  }
  .nav__item:nth-child(3) {
    --cloud-margin: -5px 0 0 15%;
  }
  .nav__item:nth-child(4) {
    --cloud-margin: -5px 5% 0 0;
  }
  .nav__item:nth-child(5) {
    --cloud-margin: -25px 0 0 2%;
  }
  .nav__item:nth-child(6) {
    --cloud-margin: 0 12% 0 0;
  }
  .nav__item:nth-child(7) {
    --cloud-margin: -30px 0 0 10%;
  }
}
