/* Only a one-time stage entrance/reveal. There is no idle hat animation. */
html:has(.sorting-cinematic-page),
body:has(.sorting-cinematic-page) { overflow: hidden; }
.enrollment-page.sorting-cinematic-page { animation: sorting-video-arrive .4s ease-out both; }
.enrollment-page.sorting-pending-page {
  grid-template-columns: minmax(0, 600px);
  justify-content: center;
  text-align: center;
}
.sorting-pending-page .enrollment-eyebrow { justify-content: center; }
.sorting-pending-page p { margin-inline: auto; }
.sorting-pending-page h1 { font-size: clamp(28px, 4vw, 42px); }
.sorting-welcome-page .sorting-stage,
.sorting-welcome-page .sorting-copy { animation: sorting-welcome-down .5s ease-out both; }
.sorting-welcome-page .sorting-crest-frame {
  display: grid;
  place-items: center;
  width: min(100%, 480px);
  height: min(58vh, 480px);
  height: min(58dvh, 480px);
  background: radial-gradient(ellipse, color-mix(in srgb, var(--faculty-color) 18%, transparent), transparent 70%);
}
.sorting-welcome-page .sorting-faculty-crest {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: contain;
  filter: drop-shadow(0 12px 28px #0007);
}
.sorting-welcome-page .sorting-stage .enrollment-back { min-height: 48px; text-align: center; }
@keyframes sorting-video-arrive {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: none; }
}
@keyframes sorting-welcome-down {
  from { opacity: 0; transform: translateY(-24px); }
  to { opacity: 1; transform: none; }
}
@media (max-width: 850px) {
  .sorting-welcome-page .sorting-crest-frame { height: min(30vh, 240px); height: min(30dvh, 240px); }
}
@media (prefers-reduced-motion: reduce) {
  .enrollment-page.sorting-cinematic-page,
  .sorting-welcome-page .sorting-stage,
  .sorting-welcome-page .sorting-copy { animation: none; }
}