.job-details-block {
  margin-bottom: var(--s-lg);
}

.job-details-block__img-wrapper {
  grid-column: 3 / span 3;
  grid-row: 1 / span 4;
  aspect-ratio: 558 / 650;
}

.job-details-block__headline {
  grid-column: 7 / span 5;
  grid-row: 1 / span 1;
  margin-top: 0;
  margin-bottom: var(--s-xs);
}

.job-details-block__job-infos {
  grid-column: 7 / span 4;
  grid-row: 2 / span 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--s-sm);
  gap: 1em;
}

.job-details-block__description {
  grid-column: 7 / span 4;
  grid-row: 3 / span 1;
}

.job-details-block__lists {
  grid-column: 7 / span 5;
  grid-row: 4 / span 1;
  margin-top: max(6rem, 6.8359375vw);
  display: flex;
  flex-direction: column;
  gap: var(--s-md);
}

.job-details-block__bottom-headline {
  grid-column: 3 / span 10;
}

.content-wrapper h2.job-details-block__bottom-headline {
  margin: 0;
  margin-bottom: max(0.5625rem, 0.390625vw);
  margin-top: var(--s-md);
}

.job-details-block__bottom-wrapper {
  grid-column: 3 / span 10;
  display: flex;
  justify-content: space-between;
  gap: var(--grid-gap);
  align-items: center;
}

.job-details-block__lists-item {
  display: flex;
  flex-direction: column;
  gap: var(--s-sm);
}

.content-wrapper h3.job-details-block__lists-item-headline {
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  gap: max(0.4375rem, 0.8203125vw);
  font-size: max(1.25rem, 1.171875vw);
}

.content-wrapper h3.job-details-block__lists-item-headline::after {
  content: "";
  width: 100%;
  height: max(0.3125rem, 0.27em);
  mask-image: url(../../img/wave-repeatable.svg);
  mask-repeat: repeat-x;
  mask-size: contain;
  background-color: currentColor;
}

.job-details-block__lists-item-content {
  font-size: max(1.25rem, 1.171875vw);
}

.job-details-block__lists-item-content li:not(:last-child) {
  margin-bottom: 1.6em;
}

.job-details-block__mail-link,
.job-details-block__phone-link {
  font-size: max(1.25rem, 1.171875vw);
  display: flex;
  gap: 0.9em;
  align-items: center;
}

.content-wrapper a.job-details-block__mail-link,
.content-wrapper a.job-details-block__phone-link {
  color: var(--black);
}

.job-details-block__mail-link .icon,
.job-details-block__phone-link .icon {
  width: max(3.103125rem, 2.26484375vw);
  height: auto;
}

@media (max-width: 1499.98px) {
  .job-details-block__bottom-wrapper,
  .job-details-block__bottom-headline {
    grid-column: 2 / span 12;
  }

  .job-details-block__bottom-wrapper {
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .job-details-block__bottom-text {
    width: 100%;
  }
}

@media (max-width: 1199.98px) {
  .job-details-block__img-wrapper {
    grid-column: 2 / span 5;
  }

  .job-details-block__headline,
  .job-details-block__description,
  .job-details-block__job-infos,
  .job-details-block__lists {
    grid-column: 7 / span 7;
    padding-left: var(--grid-gap);
  }
}

@media (max-width: 991.98px) {
  .job-details-block__headline,
  .job-details-block__description,
  .job-details-block__job-infos,
  .job-details-block__lists {
    grid-column: 3 / span 10;
    grid-row: unset;
    padding-left: 0;
  }

  .job-details-block__img-wrapper {
    grid-row: 1 / span 1;
    grid-column: 3 / span 10;
    margin-bottom: var(--s-md);
  }

  .job-details-block__description {
    grid-row: 4 / span 1;
  }
}

@media (max-width: 767.98px) {
  .job-details-block__bottom-wrapper,
  .job-details-block__bottom-headline {
    text-align: center;
    justify-content: center;
  }

  .job-details-block__bottom-wrapper {
    justify-content: flex-start;
  }

  .job-details-block__mail-link,
  .job-details-block__phone-link {
    text-align: left;
  }
}

@media (max-width: 575.98px) {
  .job-details-block__headline,
  .job-details-block__description,
  .job-details-block__job-infos,
  .job-details-block__lists {
    grid-column: 2 / span 12;
  }

  .job-details-block__job-infos {
    flex-direction: column;
  }

  .job-details-block__headline {
    text-align: center;
  }
}
