#wetzlar-splash {
  --splash-fade-duration: 800ms;
  --splash-logo-delay: 200ms;
  --splash-logo-fade-duration: 800ms;
  --splash-logo-scale-duration: 1000ms;
  --splash-logo-exit-duration: 600ms;
  --splash-cross-fade-duration: 1200ms;
  --splash-prompt-duration: 600ms;
  --splash-logo-width: 200px;
  --splash-logo-max-width: 42vw;
  --splash-background: var(--wp--preset--color--surface-container-lowest, #0e0e0e);
  --splash-image-opacity: 0.7;
  --splash-hero-overlay-opacity: 0.22;

  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  overflow: hidden;
  background: #0e0e0e;
  background: var(--splash-background, var(--wp--preset--color--surface-container-lowest, #0e0e0e));
  color: #e5e2e1;
  cursor: default;
  transition: opacity var(--splash-fade-duration, 800ms) ease-out;
}

#wetzlar-splash::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(8, 8, 8, calc(var(--splash-hero-overlay-opacity, 0.22) + 0.12)) 0%, rgba(8, 8, 8, calc(var(--splash-hero-overlay-opacity, 0.22) * 0.8)) 28%, rgba(8, 8, 8, calc(var(--splash-hero-overlay-opacity, 0.22) * 1.25)) 100%);
}

#wetzlar-splash.is-dismissible {
  cursor: pointer;
}

#wetzlar-splash.is-exiting {
  opacity: 0;
  pointer-events: none;
}

.wetzlar-splash__slides,
.wetzlar-splash__slide {
  position: absolute;
  inset: 0;
}

.wetzlar-splash__slides {
  z-index: 0;
}

.wetzlar-splash__slide {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  opacity: 0;
  visibility: hidden;
  transform: scale(1.02);
  filter: blur(0) saturate(1);
  transition:
    opacity var(--splash-cross-fade-duration, 1200ms) ease,
    transform var(--splash-cross-fade-duration, 1200ms) ease,
    filter var(--splash-cross-fade-duration, 1200ms) ease;
  will-change: opacity, transform, filter;
  backface-visibility: hidden;
}

.wetzlar-splash__slide.is-active,
.wetzlar-splash__slide.is-incoming,
.wetzlar-splash__slide.is-outgoing {
  visibility: visible;
}

.wetzlar-splash__slide.is-active,
.wetzlar-splash__slide.is-entering {
  opacity: var(--splash-image-opacity, 0.7);
  transform: translate3d(0, 0, 0) scale(1);
  filter: blur(0) saturate(1);
  z-index: 2;
}

.wetzlar-splash__slide.is-outgoing {
  z-index: 3;
  opacity: var(--splash-image-opacity, 0.7);
}

.wetzlar-splash__slide.is-incoming {
  z-index: 4;
}

.wetzlar-splash__slide.is-incoming.is-entering {
  opacity: var(--splash-image-opacity, 0.7);
}

.wetzlar-splash__slide.is-outgoing.is-leaving {
  opacity: 0;
  transform: scale(1.04);
}

#wetzlar-splash.is-syncing .wetzlar-splash__slide {
  transition: none !important;
}

.wetzlar-splash__logo {
  position: relative;
  z-index: 2;
  width: min(var(--splash-logo-width, 200px), var(--splash-logo-max-width, 42vw));
  max-width: var(--splash-logo-max-width, 42vw);
  height: auto;
  opacity: 0;
  transform: scale(0.95);
  filter: brightness(0) invert(1);
  transition:
    opacity var(--splash-logo-fade-duration, 800ms) ease-out var(--splash-logo-delay, 200ms),
    transform var(--splash-logo-scale-duration, 1000ms) cubic-bezier(0.25, 0.1, 0.25, 1);
}

.wetzlar-splash__logo.is-visible {
  opacity: 1;
  transform: scale(1);
  animation: wetzlar-splash-logo-glow 2500ms ease-in-out both;
}

.wetzlar-splash__logo.is-leaving {
  opacity: 0;
  transform: scale(0.98);
  animation: none;
  transition:
    opacity var(--splash-logo-exit-duration, 600ms) ease-in,
    transform var(--splash-logo-exit-duration, 600ms) ease-in;
}

.wetzlar-splash__prompt {
  position: absolute;
  z-index: 3;
  bottom: 48px;
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
  color: #737373;
  font-family: "Sohne Mono", "Space Grotesk", monospace;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 0;
  transition: opacity var(--splash-prompt-duration, 600ms) ease-out;
}

.wetzlar-splash__prompt.is-visible {
  opacity: 1;
}

@keyframes wetzlar-splash-logo-glow {
  0%, 100% {
    filter: brightness(0) invert(1) drop-shadow(0 0 0 rgba(171, 137, 135, 0));
  }

  45% {
    filter: brightness(0) invert(1) drop-shadow(0 0 28px rgba(171, 137, 135, 0.5));
  }
}

@media (max-width: 768px) {
  .wetzlar-splash__prompt {
    bottom: 32px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #wetzlar-splash.respects-reduced-motion .wetzlar-splash__logo,
  #wetzlar-splash.respects-reduced-motion .wetzlar-splash__slide,
  #wetzlar-splash.respects-reduced-motion .wetzlar-splash__prompt {
    animation: none !important;
    transition: none !important;
  }

  #wetzlar-splash.respects-reduced-motion .wetzlar-splash__logo,
  #wetzlar-splash.respects-reduced-motion .wetzlar-splash__slide {
    transform: none !important;
  }
}