/* Transición global entre documentos.
   Se activa desde includes.js y funciona también donde las View Transitions
   nativas todavía no están disponibles (por ejemplo, Firefox). */
html.em-page-transition-enabled::before,
html.em-page-transition-enabled::after {
  position: fixed;
  pointer-events: none;
  visibility: hidden;
}

html.em-page-transition-enabled::before {
  content: "";
  inset: 0;
  z-index: 2147483000;
  background:
    radial-gradient(circle at 50% 44%, rgba(220,171,139,.18), transparent 34%),
    linear-gradient(135deg, #f7f3ef 0%, #edf2ef 100%);
  transform: translateX(102%);
}

html.em-page-transition-enabled::after {
  content: "Escuela Medita";
  top: 50%;
  left: 50%;
  z-index: 2147483001;
  min-width: 12rem;
  padding: 3.4rem 1.3rem 0;
  color: #58756e;
  background: url('/assets/img/favicon-32.png?v=2') center .25rem / 2.5rem 2.5rem no-repeat;
  font-family: "Poppins", system-ui, sans-serif;
  font-size: clamp(.9rem, 1.25vw, 1.05rem);
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  opacity: 0;
  transform: translate(-50%, -45%);
}

html.em-page-leaving::before,
html.em-page-leaving::after,
html.em-page-entering::before,
html.em-page-entering::after {
  visibility: visible;
}

html.em-page-leaving::before {
  animation: em-page-curtain-in .36s cubic-bezier(.65,0,.35,1) both;
}

html.em-page-leaving::after {
  animation: em-page-loader-in .25s .09s ease-out both;
}

html.em-page-leaving body {
  pointer-events: none;
  animation: em-page-content-out .36s cubic-bezier(.65,0,.35,1) both;
}

html.em-page-entering::before {
  transform: translateX(0);
}

html.em-page-entering::after {
  opacity: 1;
  transform: translate(-50%, -50%);
}

html.em-page-entering body {
  animation: em-page-content-in .48s cubic-bezier(.22,1,.36,1) both;
}

html.em-page-entering.em-page-entering-active::before {
  animation: em-page-curtain-out .48s cubic-bezier(.65,0,.35,1) both;
}

html.em-page-entering.em-page-entering-active::after {
  animation: em-page-loader-out .2s ease-in both;
}

@keyframes em-page-curtain-in {
  from { transform: translateX(102%); }
  to { transform: translateX(0); }
}

@keyframes em-page-curtain-out {
  from { transform: translateX(0); }
  to { transform: translateX(-102%); }
}

@keyframes em-page-loader-in {
  from { opacity: 0; transform: translate(-45%, -50%); }
  to { opacity: 1; transform: translate(-50%, -50%); }
}

@keyframes em-page-loader-out {
  from { opacity: 1; transform: translate(-50%, -50%); }
  to { opacity: 0; transform: translate(-55%, -50%); }
}

@keyframes em-page-content-out {
  from { opacity: 1; transform: translateX(0); }
  to { opacity: .55; transform: translateX(-4vw); }
}

@keyframes em-page-content-in {
  from { opacity: .35; transform: translateX(4vw); }
  to { opacity: 1; transform: translateX(0); }
}

@media (prefers-reduced-motion: reduce) {
  html.em-page-leaving body,
  html.em-page-entering body {
    animation: none;
  }

  html.em-page-leaving::before,
  html.em-page-entering.em-page-entering-active::before {
    animation-duration: .12s;
  }
}