/* Transición pública de navegación: cortina VCASS, aislada del contenido y del admin. */
#public-page-transition {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #082C62 0%, #0A3C84 58%, #0D4FA8 100%);
  opacity: 0;
  pointer-events: none;
  transform: translateY(100%);
  visibility: hidden;
}

html.page-transition-pending #public-page-transition {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

html.page-transition-pending #public-page-transition .page-transition-logo {
  opacity: 1;
  transform: translateY(0) scale(1);
}

#public-page-transition .page-transition-logo {
  width: min(42vw, 190px);
  max-height: 72px;
  object-fit: contain;
  opacity: 0;
  transform: translateY(12px) scale(.96);
  transition: none;
}

#public-page-transition .page-transition-wordmark {
  width: auto;
  max-height: none;
  color: #fff;
  font: 900 clamp(2rem, 6vw, 3.5rem)/1 var(--heading-font, sans-serif);
  letter-spacing: -.08em;
}

#public-page-transition .page-transition-wordmark span { color: #3B82F6; }

#public-page-transition.is-leaving {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  animation: page-curtain-cover .5s cubic-bezier(.76, 0, .24, 1) both;
}

@keyframes page-curtain-cover {
  from { opacity: 1; transform: translateY(100%); }
  to { opacity: 1; transform: translateY(0); }
}

#public-page-transition.is-leaving .page-transition-logo {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition: none;
}

/* Al cargar la nueva URL, la página nace cubierta y la cortina se eleva
   completamente antes de dejar visible el reveal ascendente del contenido. */
#public-page-transition.is-entering {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

html.page-transition-pending #public-page-transition.is-entering {
  transform: translateY(0);
}

#public-page-transition.is-entering .page-transition-logo {
  opacity: 1;
  transform: translateY(0) scale(1);
}

#public-page-transition.is-entering.is-released {
  pointer-events: none;
  transform: translateY(-100%);
  transition: transform .68s cubic-bezier(.76, 0, .24, 1), visibility 0s linear .68s;
  visibility: hidden;
}

#public-page-transition.is-entering.is-released .page-transition-logo {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition: none;
}

@media (prefers-reduced-motion: reduce) {
  #public-page-transition,
  #public-page-transition .page-transition-logo {
    transition: none !important;
  }
}