.kongress {
  position: relative;
  background: linear-gradient(180deg, #000000 0%, #270905 100%);
  padding: 6.94vw 10.76vw 6.6vw;
  overflow: hidden;
}

.kongress > * {
  position: relative;
  z-index: 1;
}

.kongress__background {
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
}

.kongress__background-image {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.kongress::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;

  width: 24.51vw;
  height: 25.9vw;

  background-image: url("../../img/kongress/bg-item.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top right;

  z-index: 3;
  pointer-events: none;
}

.kongress__container {
  position: relative;
  z-index: 1;

  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 3.13vw;
}

.kongress__logo-image {
  height: 5.21vw;
  width: auto;
}

.kongress__cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, auto);
  column-gap: 1.74vw;
  row-gap: 2.08vw;
}

.kongress__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 1.74vw;
  padding: 3.13vw;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 0.69vw;
  box-shadow: 0 0.28vw 0.28vw 0 rgba(0, 0, 0, 0.25);
  position: relative;
  overflow: hidden;
  min-height: 13.26vw;
  justify-content: center;
}

.kongress__card *:hover {
  cursor: default;
}

.kongress__card::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url(../../img/kongress/kongress__card-bg.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  border-radius: 0.69vw;
  z-index: 0;
  border: 0.07vw solid rgba(255, 255, 255, 0.3);

  backdrop-filter: blur(0.21vw);
  -webkit-backdrop-filter: blur(0.21vw);

  opacity: 1;
  transition: opacity 0.4s ease;
}

.kongress__card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #d72c2c 0%, #ffa700 100%);
  border-radius: 0.69vw;
  z-index: 0;

  opacity: 0;
  transition: opacity 0.4s ease;
}

.kongress__card:hover::before {
  opacity: 0;
}

.kongress__card:hover::after {
  opacity: 1;
}

.kongress__card-title {
  font-family: Unbounded Regular;
  font-weight: 400;
  font-size: 1.11vw;
  line-height: 1.32vw;
  letter-spacing: 0;
  color: white;
  margin: 0;
  position: relative;
  z-index: 1;
}

.kongress__card-text {
  font-family: TT Travels Regular;
  font-weight: 400;
  font-size: 1.11vw;
  line-height: 1.32vw;
  letter-spacing: 0;
  color: white;
  margin: 0;
  position: relative;
  z-index: 1;
}

.kongress__summary {
  font-family: Unbounded Regular;
  font-weight: 400;
  font-size: 1.11vw;
  line-height: 1.32vw;
  letter-spacing: 0;
  color: white;
  margin: 0;
}

.kongress__slider {
  width: 100%;
}

.kongress__viewport {
  width: 100%;
}

.kongress__controls {
  display: none;
}

@media (max-width: 575.5px) {
  .kongress {
    padding: 18.75vw 0 20.31vw;
    background: linear-gradient(180deg, #000000 0%, #250905 100%);
  }

  .kongress::before {
    display: none;
  }

  .kongress__background-image {
    object-fit: cover;
  }

  .kongress__container {
    row-gap: 10.94vw;
    width: 100%;
    overflow: hidden;
    position: relative;
  }

  .kongress__logo {
    position: relative;
    z-index: 2;
    margin-top: 5vw;
  }

  .kongress__logo-image {
    width: 26.56vw;
    height: auto;
  }

  .kongress__slider {
    width: 100%;
  }

  .kongress__viewport {
    width: 100%;
    overflow: hidden;
  }

  .kongress__cards {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 89.06vw;
    grid-template-columns: none;
    grid-template-rows: repeat(2, 39.06vw);
    gap: 3.12vw;
    width: max-content;
    padding: 0 calc((100vw - 89.06vw) / 2);
    transform: translateX(0);
    transition: transform 0.35s ease;
    will-change: transform;
  }

  .kongress__card {
    width: 89.06vw;
    min-height: 39.06vw;
    box-sizing: border-box;
    padding: 9.38vw 7.81vw;
    row-gap: 6.25vw;
    border-radius: 3.12vw;
    justify-content: center;
  }

  .kongress__card::before,
  .kongress__card::after {
    border-radius: 3.12vw;
  }

  .kongress__card::before {
    border-width: 0.31vw;
    backdrop-filter: blur(0.94vw);
    -webkit-backdrop-filter: blur(0.94vw);
  }

  .kongress__card-title {
    font-size: 3.44vw;
    line-height: 4.06vw;
  }

  .kongress__card-text {
    font-size: 3.12vw;
    line-height: 3.75vw;
  }

  .kongress__card:first-child::before {
    opacity: 0;
  }

  .kongress__card:first-child::after {
    opacity: 1;
  }

  .kongress__card:hover::before {
    opacity: 1;
  }

  .kongress__card:hover::after {
    opacity: 0;
  }

  .kongress__card.is-active:hover::before {
    opacity: 0;
  }

  .kongress__card.is-active:hover::after {
    opacity: 1;
  }

  .kongress__controls {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15.62vw;
    margin-top: 32.81vw;
  }

  .kongress__control {
    width: 4.06vw;
    height: 5vw;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
  }

  .kongress__control img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .kongress__control:disabled {
    opacity: 0.35;
    pointer-events: none;
  }

  .kongress__summary {
    max-width: 81.25vw;
    margin-top: 0;
    text-align: center;
    font-size: 3.12vw;
    line-height: 3.75vw;
    position: absolute;
    bottom: 15.62vw;
    left: 50%;
    transform: translateX(-50%);
    width: 80%;
  }
}