.visual-page-wash {
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: grid;
  place-items: center;
  visibility: visible;
  opacity: 1;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(16, 19, 22, .99), rgba(143, 16, 20, .99));
  pointer-events: auto;
  transition: opacity 220ms ease, visibility 0s linear 220ms;
  animation: pageTransitionFailOpen 2.5s linear forwards;
}

.visual-page-wash::before {
  color: rgba(255, 255, 255, .1);
  content: "CARS / SPACE";
  direction: ltr;
  font: 900 clamp(3rem, 12vw, 12rem)/1 Arial, sans-serif;
  letter-spacing: -.1em;
  transform: skewX(-12deg);
}

.visual-page-wash::after {
  position: absolute;
  right: 0;
  bottom: 18%;
  left: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .78), transparent);
  content: "";
  transform: scaleX(0);
  transform-origin: right center;
}

.visual-page-wash.is-ready {
  animation: none;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

html.is-leaving .visual-page-wash {
  animation: none;
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transition: none;
}

html.is-leaving .visual-page-wash::after {
  animation: pageTransitionSignal 360ms cubic-bezier(.22, 1, .36, 1) both;
}

html.is-leaving .site-header,
html.is-leaving .page-main,
html.is-leaving .site-footer {
  opacity: .94;
  transform: scale(.999);
  transition: opacity 180ms ease, transform 180ms ease;
}

@keyframes pageTransitionSignal {
  0% { opacity: 0; transform: scaleX(0); }
  45% { opacity: 1; transform: scaleX(.72); }
  100% { opacity: 0; transform: scaleX(1); }
}

@keyframes pageTransitionFailOpen {
  0%, 92% { opacity: 1; visibility: visible; }
  100% { opacity: 0; visibility: hidden; pointer-events: none; }
}

@media (prefers-reduced-motion: reduce) {
  .visual-page-wash { transition-duration: 100ms; }
  .visual-page-wash::before { transform: none; }
  .visual-page-wash::after { display: none; }
  html.is-leaving .site-header,
  html.is-leaving .page-main,
  html.is-leaving .site-footer { transition: none; transform: none; }
}

@media print {
  .visual-page-wash { display: none !important; }
}