/* Intro geometry and timing are coupled to the logo artwork. */
.site-loader {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #030405;
  opacity: 1;
  visibility: visible;
  transition: opacity .62s cubic-bezier(.22, 1, .36, 1), visibility .62s;
}

.site-loader::before {
  position: absolute;
  inset: -18%;
  background: linear-gradient(112deg, transparent 28%, rgba(30, 69, 116, .075) 50%, transparent 72%);
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-5%, 0, 0);
}

.site-loader.is-playing::before {
  animation: loader-ambient 1.85s ease-out both;
}

.site-loader.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.loader-lockup {
  position: relative;
  z-index: 1;
  width: min(1020px, 92vw);
  width: min(1020px, 92vw, calc(42svh * 6.55));
  aspect-ratio: 6.55;
  contain: paint;
  isolation: isolate;
  filter: drop-shadow(0 22px 44px rgba(0, 0, 0, .52)) drop-shadow(0 0 22px rgba(24, 139, 255, .075));
  transition: opacity .48s ease, filter .48s ease, transform .62s cubic-bezier(.22, 1, .36, 1);
}

.loader-lockup::before {
  position: absolute;
  inset: 27% -5%;
  z-index: -1;
  background: linear-gradient(90deg, transparent, rgba(27, 119, 247, .055) 24%, rgba(225, 241, 255, .02) 50%, rgba(27, 119, 247, .045) 76%, transparent);
  filter: blur(24px);
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: scaleX(.72);
}

.site-loader.is-playing .loader-lockup::before {
  animation: loader-lockup-aura 1.45s .12s ease-out both;
}

.site-loader.is-hidden .loader-lockup {
  opacity: 0;
  filter: blur(2px) drop-shadow(0 22px 44px rgba(0, 0, 0, .42));
  transform: scale(1.008);
}

.loader-layer {
  position: absolute;
  top: 46%;
  left: 50%;
  display: block;
  width: 100%;
  height: auto;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -50%);
  user-select: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  will-change: opacity, transform, filter;
}

.loader-layer--mark {
  -webkit-clip-path: inset(0 68% 0 0);
  clip-path: inset(0 68% 0 0);
}

.loader-layer--divider {
  -webkit-clip-path: inset(0 64.17% 0 32%);
  clip-path: inset(0 64.17% 0 32%);
}

.loader-letter--s {
  --letter-delay: .68s;
  -webkit-clip-path: inset(0 51.97% 0 35.83%);
  clip-path: inset(0 51.97% 0 35.83%);
}

.loader-letter--e {
  --letter-delay: .76s;
  -webkit-clip-path: inset(0 41.93% 0 48.03%);
  clip-path: inset(0 41.93% 0 48.03%);
}

.loader-letter--t {
  --letter-delay: .84s;
  -webkit-clip-path: inset(0 31.58% 0 58.07%);
  clip-path: inset(0 31.58% 0 58.07%);
}

.loader-letter--v {
  --letter-delay: .92s;
  -webkit-clip-path: inset(0 19.68% 0 68.42%);
  clip-path: inset(0 19.68% 0 68.42%);
}

.loader-letter--i {
  --letter-delay: 1s;
  -webkit-clip-path: inset(0 16.69% 0 80.32%);
  clip-path: inset(0 16.69% 0 80.32%);
}

.loader-letter--x {
  --letter-delay: 1.08s;
  -webkit-clip-path: inset(0 0 0 83.31%);
  clip-path: inset(0 0 0 83.31%);
}

.site-loader.is-playing .loader-layer--mark {
  animation: loader-mark-in .72s .06s cubic-bezier(.16, 1, .3, 1) both;
}

.site-loader.is-playing .loader-layer--divider {
  animation: loader-divider-in .38s .48s cubic-bezier(.22, 1, .36, 1) both;
}

.site-loader.is-playing .loader-letter {
  animation: loader-letter-in .5s var(--letter-delay) cubic-bezier(.16, 1, .3, 1) both;
}

@supports not (clip-path: inset(0)) {
  .loader-layer:not(.loader-layer--mark) {
    display: none;
  }

  .loader-layer--mark {
    -webkit-clip-path: none;
    clip-path: none;
  }
}

@keyframes loader-ambient {
  from {
    opacity: 0;
    transform: translate3d(-5%, 0, 0);
  }

  45% {
    opacity: 1;
  }

  to {
    opacity: .35;
    transform: translate3d(3%, 0, 0);
  }
}

@keyframes loader-lockup-aura {
  from {
    opacity: 0;
    transform: scaleX(.72);
  }

  55% {
    opacity: .78;
    transform: scaleX(1.03);
  }

  to {
    opacity: .34;
    transform: scaleX(1);
  }
}

@keyframes loader-mark-in {
  from {
    opacity: 0;
    filter: blur(5px) brightness(.84);
    transform: translate(-50%, -50%) translate3d(-12px, 5px, 0) scale(.976);
  }

  48% {
    opacity: 1;
  }

  to {
    opacity: 1;
    filter: blur(0) brightness(1);
    transform: translate(-50%, -50%);
  }
}

@keyframes loader-divider-in {
  from {
    -webkit-clip-path: inset(50% 64.17% 50% 32%);
    clip-path: inset(50% 64.17% 50% 32%);
    opacity: 0;
  }

  to {
    -webkit-clip-path: inset(0 64.17% 0 32%);
    clip-path: inset(0 64.17% 0 32%);
    opacity: 1;
  }
}

@keyframes loader-letter-in {
  from {
    opacity: 0;
    filter: blur(3px) brightness(1.08);
    transform: translate(-50%, -50%) translate3d(0, 7px, 0);
  }

  to {
    opacity: 1;
    filter: blur(0) brightness(1);
    transform: translate(-50%, -50%);
  }
}


/* Progressive enhancement: an inactive overlay never covers the document. */
.site-loader[hidden] {
  display: none;
}

html:not(.intro-pending) .site-loader {
  display: none;
}

html.intro-pending .site-loader {
  display: grid;
}

body.is-loading {
  overflow: hidden;
}

#site-content {
  transition: opacity .75s ease, transform .75s cubic-bezier(.22, 1, .36, 1), filter .75s ease;
}

body.is-loading #site-content {
  opacity: 0;
  filter: blur(7px);
  transform: translateY(12px);
}

@media (prefers-reduced-motion: reduce) {
  .site-loader {
    display: none !important;
  }

  #site-content {
    transition: none;
  }

  body.is-loading {
    overflow: auto;
  }

  body.is-loading #site-content {
    opacity: 1;
    filter: none;
    transform: none;
  }
}