/* ==========================================================================
   AURORA — Page transitions
   ========================================================================== */

html.is-loading body {
  overflow: hidden;
}

.page-transition {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--ink-900);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 380ms var(--ease-premium), visibility 380ms var(--ease-premium);
}

.page-transition.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}

.page-transition__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-6);
}

.page-transition__brand {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-transition__img {
  display: block;
  width: min(52vw, 240px);
  height: auto;
}

.page-transition__mark {
  position: absolute;
  top: 2%;
  left: 50%;
  transform: translateX(-50%);
  width: 34%;
  height: auto;
  aspect-ratio: 120 / 100;
  pointer-events: none;
}

body.is-transitioning {
  overflow: hidden;
}

body.is-transitioning main,
body.is-transitioning .header,
body.is-transitioning .footer {
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .page-transition { transition-duration: 0.001ms; }
  .page-transition__img {
    opacity: 1;
    transform: none;
    transition: none;
  }
}