/* CSS-only cover applied synchronously by an inline IIFE before first paint.
   This is what kills the FOUC flash between exit-cover and enter-cover. */
html.pt-pre-enter { background: #0F172A; }
html.pt-pre-enter::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 9998; /* sits below .page-transition (9999) */
  background: linear-gradient(170deg, #0F172A 0%, #3B82F6 100%);
  pointer-events: none;
}

.page-transition {
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  display: flex;
  visibility: hidden;
  contain: layout paint style;
  transform: translateZ(0);
}

.pt-strip {
  flex: 1;
  transform: translate3d(0, 100%, 0);
  will-change: transform;
  backface-visibility: hidden;
}

.page-transition.pt-ready .pt-strip {
  will-change: transform;
}

.pt-strip:nth-child(1) { background: linear-gradient(170deg, #0F172A 0%, #3B82F6 100%); }
.pt-strip:nth-child(2) { background: linear-gradient(170deg, #0B172D 0%, #2563EB 100%); }
.pt-strip:nth-child(3) { background: linear-gradient(170deg, #0F172A 0%, #60A5FA 100%); }

@keyframes strip-in {
  from { transform: translate3d(0, 100%, 0); }
  to   { transform: translate3d(0, 0, 0); }
}

@keyframes strip-out {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(0, -100%, 0); }
}

/* EXIT: strips rise from bottom to cover screen */
body.is-leaving .page-transition,
body.is-entering .page-transition,
html.pt-pre-enter .page-transition {
  visibility: visible;
}

html.pt-pre-enter .pt-strip {
  transform: translate3d(0, 0, 0);
}

body.is-leaving .pt-strip {
  animation: strip-in 360ms cubic-bezier(0.86, 0, 0.07, 1) both;
}
body.is-leaving .pt-strip:nth-child(2) { animation-delay: 50ms; }
body.is-leaving .pt-strip:nth-child(3) { animation-delay: 100ms; }

/* ENTER: strips continue upward off the top to reveal the new page */
body.is-entering .pt-strip {
  animation: strip-out 360ms cubic-bezier(0.86, 0, 0.07, 1) both;
}
body.is-entering .pt-strip:nth-child(2) { animation-delay: 50ms; }
body.is-entering .pt-strip:nth-child(3) { animation-delay: 100ms; }

body.is-entering.is-leaving .pt-strip {
  animation-name: strip-in;
}

@media (prefers-reduced-motion: reduce) {
  .page-transition { display: none; }
}
