#site-transition-cover {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 2147483646;
  overflow: hidden;
  background: #050607;
  pointer-events: auto;
}

html.site-transition-departing #site-transition-cover,
html.site-transition-handoff #site-transition-cover,
html.site-transition-arrival #site-transition-cover {
  display: block;
}

html.site-transition-departing #site-transition-cover {
  animation: site-transition-darken 320ms ease-in both;
}

@keyframes site-transition-darken {
  from { opacity: 0; }
  to { opacity: 1; }
}

#site-transition-globe {
  display: none;
  position: absolute;
  top: calc(50% - 60px);
  left: 50%;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background: #050607 url('/site-redirect-globe.webp') 0 0 / 8000px 200px no-repeat;
  transform-origin: center;
}

html.site-transition-handoff #site-transition-globe,
html.site-transition-arrival #site-transition-globe {
  display: block;
  animation:
    site-transition-approach 2800ms linear var(--site-transition-delay, 0ms) both,
    site-transition-turn 1850ms steps(39, end) calc(var(--site-transition-delay, 0ms) + 650ms) both;
}

html.site-transition-arrival.site-transition-finishing #site-transition-globe {
  background-position: -7800px 0;
  animation: site-transition-finish 850ms cubic-bezier(.36, 0, .72, 1) both;
}

@keyframes site-transition-approach {
  0% { transform: translate(-50%, -50%) scale(2.1); opacity: .72; animation-timing-function: cubic-bezier(.42, 0, .22, 1); }
  35%, 100% { transform: translate(-50%, -50%) scale(.88); opacity: .72; }
}

@keyframes site-transition-finish {
  0% { transform: translate(-50%, -50%) scale(.88); opacity: .72; }
  35% { opacity: .72; }
  100% { transform: translate(-50%, -50%) scale(2.65); opacity: 0; }
}

@keyframes site-transition-turn {
  from { background-position: 0 0; }
  to { background-position: -7800px 0; }
}

#site-transition-brand {
  display: none;
  position: absolute;
  top: calc(50% + 62px);
  left: 50%;
  align-items: center;
  gap: 1px;
  white-space: nowrap;
  opacity: 0;
  transform: translateX(-50%);
}

#site-transition-brand img {
  display: block;
  width: 176px;
  height: auto;
  flex: none;
}

#site-transition-ai {
  color: #fff;
  font: 700 32px/1 "Avenir Next", "Arial Rounded MT Bold", "Trebuchet MS", sans-serif;
  opacity: 0;
}

html.site-transition-handoff #site-transition-brand,
html.site-transition-arrival #site-transition-brand {
  display: flex;
  animation: site-transition-brand-enter 480ms ease-out calc(var(--site-transition-delay, 0ms) + 900ms) both;
}

html.site-transition-handoff #site-transition-ai,
html.site-transition-arrival #site-transition-ai {
  animation: site-transition-ai-enter 620ms ease-out calc(var(--site-transition-delay, 0ms) + 1470ms) both;
}

html.site-transition-arrival.site-transition-finishing #site-transition-brand {
  animation: site-transition-brand-exit 220ms ease-in both;
}

@keyframes site-transition-brand-enter {
  from { opacity: 0; transform: translate(-50%, 8px); }
  to { opacity: 1; transform: translate(-50%, 0); }
}

@keyframes site-transition-ai-enter {
  from { opacity: 0; transform: translateX(-7px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes site-transition-brand-exit {
  from { opacity: 1; }
  to { opacity: 0; }
}

html.site-transition-revealing #site-transition-cover {
  opacity: 0;
  pointer-events: none;
  transition: opacity 520ms ease-out;
}

@media (prefers-reduced-motion: reduce) {
  html.site-transition-departing #site-transition-cover,
  html.site-transition-handoff #site-transition-globe,
  html.site-transition-arrival #site-transition-globe,
  html.site-transition-arrival.site-transition-finishing #site-transition-globe,
  html.site-transition-handoff #site-transition-brand,
  html.site-transition-arrival #site-transition-brand,
  html.site-transition-arrival.site-transition-finishing #site-transition-brand,
  html.site-transition-handoff #site-transition-ai,
  html.site-transition-arrival #site-transition-ai {
    animation: none;
  }

  html.site-transition-handoff #site-transition-globe,
  html.site-transition-arrival #site-transition-globe {
    display: none;
  }

  html.site-transition-handoff #site-transition-brand,
  html.site-transition-arrival #site-transition-brand,
  html.site-transition-handoff #site-transition-ai,
  html.site-transition-arrival #site-transition-ai {
    opacity: 1;
  }

  html.site-transition-revealing #site-transition-cover {
    transition-duration: 80ms;
  }
}