.intro {
  margin-top: 124px;
  display: flex;
  gap: 80px;
}

.intro > * {
  flex: 1;
}

@media only screen and (max-width: 768px) {
  .intro {
    margin-top: 40px;
    flex-direction: column;
    gap: 24px;
  }
}

.paragraph-block {
  max-width: 620px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
@media only screen and (max-width: 768px) {
  .paragraph-block > p {
    text-align: left;
  }
}

.img-banner {
  margin: 80px auto;
}
.img-banner > img {
  display: block;
  margin: 0 auto;
  max-width: 80%;
}

@media only screen and (max-width: 768px) {
  .img-banner > img {
    max-width: 100%;
    height: 320px;
    object-fit: cover;
    border-radius: 8px;
  }
}

.sustainability {
  margin-bottom: 200px;
}

.sustainability > .paragraph-block {
  margin: 0 auto;
  text-align: center;
  color: var(--gray-900) !important;
}

@media only screen and (max-width: 768px) {
  .sustainability {
    margin-bottom: 40px;
  }
}