/* ===============================
   TRANSICIÓN GLOBAL REAL
   (ANTI PANTALLA NEGRA)
================================ */

body{
  background:#000;
}

/* overlay */
#page-transition{
  position: fixed;
  inset: 0;
  background: #000;
  z-index: 9999;
  opacity: 1;
  pointer-events: none;
  transition: opacity .45s ease;
}

/* cuando la página está lista */
body.ready #page-transition{
  opacity: 0;
}

/* al salir */
body.fade-out #page-transition{
  opacity: 1;
}