.block--scroll-over {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
.block--scroll-over .scroll-over__drawer {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  position: relative;
}
.block--scroll-over .scroll-over__images {
  height: auto;
  max-height: 100vh;
  width: 50vw;
  position: sticky;
  top: 0;
}
.block--scroll-over .scroll-over__image {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: opacity 350ms var(--cb);
}
@supports (object-fit: cover) {
  .block--scroll-over .scroll-over__image img {
    max-width: none;
    max-height: none;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
@media all and (-ms-high-contrast: none) {
  .block--scroll-over .scroll-over__image img {
    position: absolute;
    right: 50%;
    bottom: 50%;
    max-width: none;
    max-height: none;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    transform: translate(50%, 50%);
  }
}
.block--scroll-over .scroll-over__image--default {
  z-index: 0;
}
.block--scroll-over .scroll-over__image--section {
  opacity: 0;
}
.block--scroll-over .scroll-over__image--active {
  z-index: 1;
  opacity: 1;
}
.block--scroll-over .scroll-over__entries {
  width: 50vw;
}
.block--scroll-over .scroll-over .entry {
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 20px;
  background-color: var(--c-primary-100);
  padding: 100px 60px;
  border-bottom: 1px solid var(--c-dark-300);
  transition: background-color 350ms var(--cb);
}
.block--scroll-over .scroll-over .entry:hover {
  background-color: var(--c-primary-200);
}
.block--scroll-over .scroll-over .entry:hover .entry__arrow {
  animation: arrow-hover 7s infinite;
}
.block--scroll-over .scroll-over .entry__arrow {
  margin-left: auto;
}
.block--scroll-over .scroll-over .entry__content {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

@media only screen and (max-width: 1024px) {
  .block--scroll-over {
    margin-left: -15px;
    margin-right: -15px;
  }
  .block--scroll-over .scroll-over__drawer {
    display: block;
    z-index: 1;
  }
  .block--scroll-over .scroll-over__images {
    height: 100vh;
    width: 100vw;
    z-index: -1;
  }
  .block--scroll-over .scroll-over__entries {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 16px;
    width: calc(100vw - 32px);
    padding-bottom: 25vh;
    margin: -25vh 16px 0;
    z-index: 2;
  }
  .block--scroll-over .scroll-over .entry {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 36px;
    background-color: rgba(237, 248, 243, 0.75);
    border: none;
    border-radius: 8px;
    backdrop-filter: blur(12px);
    width: 100%;
    padding: 32px 16px;
  }
  .block--scroll-over .scroll-over .entry__content {
    row-gap: 20px;
  }
  .block--scroll-over .scroll-over .entry__arrow {
    margin-left: 0;
    margin-right: auto;
  }
  .block--scroll-over .scroll-over .entry--active {
    background-color: var(--c-primary-200);
  }
}
@keyframes arrow-hover {
  0% {
    transform: translateX(0);
  }
  15% {
    transform: translateX(8px);
  }
  25% {
    transform: translateX(8px);
  }
  40% {
    transform: translateX(0);
  }
  55% {
    transform: translateX(12px);
  }
  70% {
    transform: translateX(12px);
  }
  85% {
    transform: translateX(0);
  }
}

/*# sourceMappingURL=block_scrollover.css.map */
