.header-section {
  position: relative;
}

.header-section-text-wrapper {
  grid-column: 3 / span 10;
  grid-row: 1 / span 1;
  padding-top: var(--s-xl);
  padding-bottom: var(--s-lg);
  min-height: 100vh;
  min-height: 100svh;
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
}

.header-section.default-slider-wrapper .header-section-text-wrapper {
  min-height: unset;
  padding-top: unset;
  padding-bottom: unset;
}

.header-section-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: var(--white);
  border-left: 5px solid currentColor;
  padding-left: 2em;
}

.header-section.variant-2 .header-section-text {
  padding-left: calc(
    var(--grid-margin) + var(--grid-col-width) + var(--grid-gap) * 2
  );
  padding-right: var(--grid-col-width);
  border-left: none;
  align-self: center;
}

.header-section-headline {
  font-size: max(2rem, 3.75vw);
  text-transform: uppercase;
  line-height: 0.95;
  text-wrap: balance;
  margin: 0;
  margin-bottom: var(--s-xs);
  padding-top: 0.1em;
  max-width: min(100%, 25ch);
}

.header-section-description {
  max-width: min(100%, 61ch);
}

.header-section-description a {
  color: var(--white);
  text-decoration: underline;
  text-underline-offset: 0.1em;
  transition: color 0.4s ease;
}

.header-section-description a:hover {
  color: var(--red);
}

.header-section > img,
.header-section > picture {
  grid-column: 1 / span 14;
  grid-row: 1 / span 1;
  width: 100%;
  height: 100%;
  position: absolute;
}

.header-section-slider {
  grid-column: 1 / span 14;
  grid-row: 1 / span 1;
  height: 100vh;
  height: 100svh;
}

.header-section-slider picture,
.header-section-slider img,
.header-section-slider .slick-list,
.header-section-slider .slick-track {
  height: 100%;
}

.header-section.img-only > img,
.header-section.img-only > picture {
  aspect-ratio: 2560 / 800;
  position: relative;
}

.header-section-slider-arrow.default-slider-next {
  grid-column: 13 / span 1;
}

.header-section-slider-arrow.default-slider-prev {
  grid-column: 2 / span 1;
}

.header-section-slider-arrow {
  grid-row: 1 / span 1;
  z-index: 2;
}

.header-section.img-only .header-section-text-wrapper {
  display: none;
}

.header-section img,
.header-section picture {
  object-fit: cover;
}

.header-section-btn {
  display: flex;
  justify-self: flex-start;
  margin-top: var(--s-sm);
}

.header-section::before {
  content: "";
  width: 100%;
  grid-column: 1 / span 14;
  grid-row: 1 / span 1;
  height: 100%;
  position: absolute;
  background-color: var(--black);
  opacity: 0.2;
  z-index: 1;
}

.header-section.variant-2::before {
  display: none;
}

.header-section.variant-2::after {
  background-color: var(--blue);
}

.header-section-lower-section {
  grid-column: 1 / span 14;
  grid-row: 2 / span 1;
  padding-top: var(--s-lg);
  padding-bottom: var(--s-lg);
  position: relative;
}

.header-section.default-slider-wrapper .header-section-lower-section {
  grid-row: 3 / span 1;
}

.header-section-lower-section-headline {
  margin: 0;
  grid-column: 3 / span 10;
  text-align: center;
}

.header-section-lower-section-description {
  grid-column: 5 / span 6;
  text-align: center;
  margin-top: var(--s-sm);
}

.header-section-lower-section-description li {
  break-inside: avoid;
}

.header-section.variant-2 .header-section-text-wrapper {
  grid-column: 1 / span 7;
  margin-right: calc(-1 * (1px + var(--grid-gap) / 2));
  background-color: var(--blue);
  padding-top: var(--s-lg);
  display: grid;
}

.header-section.variant-2 > img,
.header-section.variant-2 > picture {
  grid-column: 8 / span 7;
  margin-left: calc(-1 * var(--grid-gap) / 2);
  width: calc(100% + var(--grid-gap) / 2);
}

.header-section-lower-section-buttons {
  grid-column: 3 / span 10;
  display: flex;
  gap: 1em;
  margin-top: var(--s-sm);
}

.header-section .special-border.bot.triangle {
  transform: translateY(calc(100% + 2px)) rotate(180deg);
  z-index: 1;
}

@media (max-width: 1199.98px) {
  .header-section-text-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    grid-column: 2 / span 12;
  }

  .header-section-text {
    padding-left: 1em;
  }

  .header-section.variant-2 .header-section-text {
    padding-left: var(--grid-gap);
  }

  .header-section-lower-section-headline {
    grid-column: 2 / span 12;
  }

    .header-section-lower-section-headline,
    .header-section-lower-section-description,
  .header-section-lower-section-buttons {
    grid-column: 2 / span 12;
  }

  .header-section-slider {
    grid-row: 1 / span 2;
  }

  .header-section.default-slider-wrapper::before {
  grid-row: 1 / span 2;
}

  .header-section-slider-arrow {
    grid-row: 2 / span 1;
    margin-top: var(--s-sm);
  }

  .header-section-slider-arrow.default-slider-next.default-slider-next,
  .header-section-slider-arrow.default-slider-prev.default-slider-prev {
    align-self: flex-start;
  }

  .header-section.default-slider-wrapper .header-section-text-wrapper {
    align-self: flex-end;
  }

}

@media (max-width: 991.98px) {
  .header-section.variant-2 .header-section-text-wrapper {
    grid-column: 1 / span 14;
    grid-row: unset;
    margin-top: 50vh;
    min-height: unset;
    text-align: center;
    padding-top: var(--s-sm);
    margin-right: 0;
  }

  .header-section.variant-2 > img,
  .header-section.variant-2 > picture {
    grid-column: 1 / span 14;
    margin-left: 0;
    grid-row: unset;
    width: 100%;
    height: 50vh;
  }

  .header-section.variant-2 .header-section-text {
    padding-right: var(--grid-gap);
    align-items: center;
  }

  .header-section-description {
    max-width: min(100%, 80ch);
  }
}