/* stylelint-disable comment-empty-line-before */

.Columns {
  display: flex;
  flex-direction: column;
  gap: 8px;
  gap: var(--spaces, 8px);
}

@media screen and (min-width: 769px) {

.Columns {
    flex-direction: row;
}
  }

.Columns > * {
    flex: 0 0 100%;
    max-width: 100%;
  }

@media screen and (min-width: 769px) {

.Columns > * {
      flex: 0 0 calc(50% - 8px / 2);
      flex: 0 0 calc(50% - var(--spaces, 8px) / 2);
      max-width: 50%;
  }
    }

.Columns {

  /* OfferCard */

  .OfferCard--extended {
    display: flex;
    justify-content: space-between;
    min-width: 100%;
    max-width: 100%;
  }

  .OfferCard-image img {
    min-height: 250px;
    max-height: 250px;
  }

  .OfferCard-data {
    justify-content: space-between;
    height: 100%;
  }
}

.Columns .Text {
    word-break: break-word;
  }

.Columns[\:has\(.OfferCard\)] {
    --spaces: 10px;
  }

.Columns:has(.OfferCard) {
    --spaces: 10px;
  }

@media screen and (min-width: 1026px) {

.Columns[\:has\(.OfferCard\)] {
      --spaces: 20px;
  }

.Columns:has(.OfferCard) {
      --spaces: 20px;
  }
    }

.Columns .Column[\:has\(.OfferCard\)] {
    display: flex;
  }

.Columns .Column:has(.OfferCard) {
    display: flex;
  }

@media (max-width: 767px) {
  .Columns > .Column[\:has\(.OfferCard\)] + .Column .mt-1,
  .Columns > .Column + .Column[\:has\(.OfferCard\)] .mt-1 {
    margin-top: 15px !important;
  }
  .Columns > .Column:has(.OfferCard) + .Column .mt-1,
  .Columns > .Column + .Column:has(.OfferCard) .mt-1 {
    margin-top: 15px !important;
  }

  .Columns > .Column[\:has\(.OfferCard\)] + .Column .mt-3,
  .Columns > .Column + .Column[\:has\(.OfferCard\)] .mt-3 {
    margin-top: 30px !important;
  }

  .Columns > .Column:has(.OfferCard) + .Column .mt-3,
  .Columns > .Column + .Column:has(.OfferCard) .mt-3 {
    margin-top: 30px !important;
  }

  .Columns > .Column[\:has\(.OfferCard\)] + .Column .mt-5,
  .Columns > .Column + .Column[\:has\(.OfferCard\)] .mt-5 {
    margin-top: 45px !important;
  }

  .Columns > .Column:has(.OfferCard) + .Column .mt-5,
  .Columns > .Column + .Column:has(.OfferCard) .mt-5 {
    margin-top: 45px !important;
  }
}

.JobThemeSection-content .Columns--50-50 {
    --spaces: 20px;
  }

@media screen and (min-width: 769px) {

.JobThemeSection-content .Columns--50-50 {
      --spaces: 100px;
  }
    }

.Columns--big {
  justify-content: space-between;
}

@media screen and (min-width: 769px) {
  /* 33% - 33% - 33% */

  .Columns--33-33-33 {
    flex-wrap: wrap;
    gap: 25px;
    gap: var(--spaces, 25px);
  }

    .Columns--33-33-33 > * {
      flex: 1 1 calc(100% / 2 - 25px);
      flex: 1 1 calc(100% / 2 - var(--spaces, 25px));
      max-width: calc(100% / 2 - 25px);
      max-width: calc(100% / 2 - var(--spaces, 25px));
    }
}

/* 25% - 25% - 25% - 25% */

@media screen and (min-width: 769px) {
  .Columns--25-25-25-25 {
    flex-wrap: wrap;
    gap: 18px;
    gap: var(--spaces, 18px);
  }

    .Columns--25-25-25-25 > * {
      flex: 1 1 calc(50% - 18px);
      flex: 1 1 calc(50% - var(--spaces, 18px));
      max-width: calc(50% - 18px);
      max-width: calc(50% - var(--spaces, 18px));
    }
}

@media screen and (min-width: 769px) {
  /* 25% - 75% */

  .Columns--25-75 > *:nth-child(1) {
    flex: 0 0 calc(25% - 8px / 2);
    flex: 0 0 calc(25% - var(--spaces, 8px) / 2);
    max-width: 25%;
  }

  .Columns--25-75 > *:nth-child(2) {
    flex: 0 0 calc(75% - 8px / 2);
    flex: 0 0 calc(75% - var(--spaces, 8px) / 2);
    max-width: 75%;
  }

  /* 75% - 25% */

  .Columns--75-25 > *:nth-child(1) {
    flex: 0 0 calc(75% - 8px / 2);
    flex: 0 0 calc(75% - var(--spaces, 8px) / 2);
    max-width: 75%;
  }

  .Columns--75-25 > *:nth-child(2) {
    flex: 0 0 calc(25% - 8px / 2);
    flex: 0 0 calc(25% - var(--spaces, 8px) / 2);
    max-width: 25%;
  }

  /* 33% - 66% */

  .Columns--33-66 > *:nth-child(1) {
    flex: 0 0 calc(33% - 8px / 2);
    flex: 0 0 calc(33% - var(--spaces, 8px) / 2);
    max-width: 33%;
  }

  .Columns--33-66 > *:nth-child(2) {
    flex: 0 0 calc(67% - 8px / 2);
    flex: 0 0 calc(67% - var(--spaces, 8px) / 2);
    max-width: 67%;
  }

  /* 66% - 33% */

  .Columns--66-33 > *:nth-child(1) {
    flex: 0 0 calc(67% - 8px / 2);
    flex: 0 0 calc(67% - var(--spaces, 8px) / 2);
    max-width: 67%;
  }

  .Columns--66-33 > *:nth-child(2) {
    flex: 0 0 calc(33% - 8px / 2);
    flex: 0 0 calc(33% - var(--spaces, 8px) / 2);
    max-width: 33%;
  }

  /* Spacing Big */

  .Columns--big > *:nth-child(2) {
    max-width: 37%;
  }
}

@media screen and (min-width: 1361px) {
  /* 33% - 33% - 33% */

  .Columns--33-33-33 {
    flex-wrap: nowrap;
    gap: 78px;
  }

    .Columns--33-33-33 > * {
      flex: 1 1 calc(100% / 3);
      max-width: calc(100% / 3);
    }
}

/* 25% - 25% - 25% -25% */

@media screen and (min-width: 1367px) {
  .Columns--25-25-25-25 {
    flex-wrap: nowrap;
    gap: 17px;
  }

    .Columns--25-25-25-25 > * {
      flex: 1 1 calc(100% / 4);
      max-width: calc(100% / 4);
    }
}

@media screen and (min-width: 1921px) {
  /* Spacing Big */

  .Columns--big > *:nth-child(2) {
    max-width: 40%;
  }
}

.Columns--100 > * {
  flex: 0 0 100%;
  max-width: 100%;
}
