/**
 * Media header
 * -------
 * Styles for the main media header.
 *
 * Dependencies:
 * - default variables
 */
/* VARIABLES */
/* TYPOGRAPHY */
/* Google Fonts */
.media-header-wrapper:not(:has(.field--name-field-banner)) {
  width: 100%;
  height: 100vh;
}
@media (max-width: 47.99875rem) {
  .media-header-wrapper:not(:has(.field--name-field-banner)) {
    min-height: 35vh;
  }
}
@media print {
  .media-header-wrapper:not(:has(.field--name-field-banner)) {
    height: auto !important;
  }
}
@media print {
  .media-header-wrapper .position-absolute {
    position: relative !important;
  }
}
@media (max-width: 47.99875rem) {
  .media-header-wrapper .media-header-sticky {
    height: 100% !important;
    gap: 1rem !important;
  }
}
@media (min-width: 36rem) {
  .media-header-wrapper .media-header-sticky:has(.field-sub-title) .field--name-node-title h1 {
    font-size: 4.687rem !important;
  }
}
@media print {
  .media-header-wrapper .media-header-sticky {
    position: static !important;
    top: auto !important;
    height: auto !important;
    max-height: none !important;
  }
}
.media-header-wrapper::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 200px;
  background: linear-gradient(360deg, rgba(20, 21, 25, 0) 7.21%, rgba(28, 26, 29, 0.38) 20.19%, rgba(32, 29, 31, 0.59) 39.9%, rgba(35, 31, 32, 0.73) 65.87%);
  pointer-events: none;
  z-index: 2;
}
.media-header-wrapper::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 45%;
  background: linear-gradient(180deg, rgba(34, 34, 34, 0) 32.69%, rgba(34, 34, 34, 0.507042) 42.6%, rgba(34, 34, 34, 0.77052) 62.17%, #222222 94.48%);
  pointer-events: none;
  z-index: 2;
}

.divider {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.divider::before, .divider::after {
  content: "";
  display: inline-block;
  height: 1px;
  width: 25%;
  background-color: currentColor;
  transform: translateY(-50%);
}
.divider::before {
  left: 0;
}
.divider::after {
  right: 0;
}
@media screen and (max-width: 47.99875rem) {
  .divider .field--name-node-title h1 {
    font-size: 1.625rem !important;
  }
}

.scroll-explore {
  cursor: pointer;
  font-size: 0.9rem;
  animation: bounce 2s infinite;
  color: #acacac;
}
.scroll-explore span {
  margin-bottom: 0.5rem;
  letter-spacing: 1px;
}
.scroll-explore .arrow {
  width: 8px;
  height: 8px;
  border-bottom: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: rotate(45deg);
}

@keyframes bounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}
.media-header {
  display: flex;
  flex-direction: column;
  width: auto;
  position: relative;
  background: #222222;
  height: 100vh;
  height: 100svh;
  max-height: 100vh;
  max-height: 100svh;
}
@media (max-width: 61.99875rem) {
  .media-header {
    display: flex;
    flex-direction: column;
  }
  .media-header .media-header__gallery {
    height: 100%;
  }
}
@media (min-width: 48rem) {
  .media-header {
    height: 150vh;
    height: 150svh;
    max-height: 150vh;
    max-height: 150svh;
  }
}
.media-header .media-header__inner {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  background: #222222;
  padding: 0.5rem;
  filter: brightness(0.8);
}
.media-header .media-header__inner .media-header__gallery {
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 2;
}
@media (min-width: 48rem) {
  .media-header .media-header__inner .media-header__gallery {
    left: -12.5%;
    width: 125%;
  }
}
.media-header .media-header__inner .media-header__gallery .media-header__slotmachine {
  position: absolute;
  top: 0;
  bottom: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  height: 100%;
  width: 120%;
  inset-inline-start: 50%;
  transform: translate(-50%, 0);
}
@media (min-width: 48rem) {
  .media-header .media-header__inner .media-header__gallery .media-header__slotmachine {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media (min-width: 62rem) {
  .media-header .media-header__inner .media-header__gallery .media-header__slotmachine {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  }
}
@media (max-width: 47.99875rem) {
  .media-header .media-header__inner .media-header__gallery .media-header__slotmachine {
    animation: slotmachine 260s linear infinite;
    bottom: auto;
    height: auto;
  }
}
.media-header .media-header__inner .media-header__gallery .media-header__slotmachine .media-header__slot {
  display: grid;
  grid-template-rows: 1fr 1fr 1fr;
  opacity: 0.5;
}
.media-header .media-header__inner .media-header__gallery .media-header__slotmachine .media-header__slot:nth-child(even) {
  animation-direction: reverse;
}
@media (min-width: 48rem) {
  .media-header .media-header__inner .media-header__gallery .media-header__slotmachine .media-header__slot {
    transform: translateY(-20%);
  }
}
.media-header .media-header__inner .media-header__gallery .media-header__slotmachine .media-header__slot img {
  -o-object-fit: cover;
     object-fit: cover;
}

@media (min-width: 48rem) {
  .media-header__slot--reverse {
    transform: translateY(-10%);
  }
}

.media-header__slotmachineimg {
  border-radius: 0.125rem;
  aspect-ratio: 1/1;
  overflow: hidden;
  margin-bottom: 1rem;
}
@media (min-width: 48rem) {
  .media-header__slotmachineimg {
    border-radius: 0.25rem;
  }
}

.media-header__img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  filter: grayscale(1);
}

@keyframes slotmachine {
  0% {
    transform: translate(-50%, 0);
  }
  100% {
    transform: translate(-50%, -100%);
  }
}
.banner-full video,
.banner-full .drimage,
.banner-full .photosphere,
.media--view-mode-banner-full video,
.media--view-mode-banner-full .drimage,
.media--view-mode-banner-full .photosphere {
  width: 100% !important;
  -o-object-fit: cover;
     object-fit: cover;
  height: 100vh !important;
}
.banner-full video img,
.banner-full .drimage img,
.banner-full .photosphere img,
.media--view-mode-banner-full video img,
.media--view-mode-banner-full .drimage img,
.media--view-mode-banner-full .photosphere img {
  -o-object-fit: cover;
     object-fit: cover;
}
@media print {
  .banner-full video,
  .banner-full .drimage,
  .banner-full .photosphere,
  .media--view-mode-banner-full video,
  .media--view-mode-banner-full .drimage,
  .media--view-mode-banner-full .photosphere {
    height: auto !important;
  }
}