@font-face { font-family: 'Intro Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/loader/poppins-400.ttf') format('truetype'); }
@font-face { font-family: 'Intro Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url('/fonts/loader/poppins-600.ttf') format('truetype'); }
@font-face { font-family: 'Intro Bengali'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/loader/hind-siliguri-400.ttf') format('truetype'); }
.school-intro {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #152557;
  color: #fff;
  transition: opacity .3s ease, visibility .3s;
}
.school-intro[hidden] { display: none; }
.school-intro__content { width: min(100% - 48px, 440px); text-align: center; }
.school-intro__logo { position: relative; display: grid; place-items: center; width: 176px; height: 176px; margin: 0 auto 32px; }
.school-intro__logo img { display: block; width: 140px; height: 140px; object-fit: contain; }
.school-intro__orbit { position: absolute; inset: 0; border: 2px solid #efbe2e30; border-radius: 50%; }
.school-intro__orbit::after { content: ''; position: absolute; inset: -2px; border: 2px solid transparent; border-top-color: #efbe2e; border-right-color: #efbe2e; border-radius: 50%; animation: school-intro-orbit 1.8s linear infinite; }
.school-intro__letters { display: flex; justify-content: center; gap: 3px; font: 600 64px/1 'Intro Poppins', Arial, sans-serif; letter-spacing: 0; }
.school-intro__letters span { position: relative; color: #ffffff12; -webkit-text-stroke: 1px #ffffff45; }
.school-intro__letters span::after {
  content: attr(data-letter);
  position: absolute;
  inset: 0;
  color: #efbe2e;
  -webkit-text-stroke: 0;
  clip-path: inset(100% 0 0);
  animation: school-intro-ink 1.8s cubic-bezier(.4, 0, .2, 1) both;
  animation-play-state: paused;
}
.school-intro.is-animating .school-intro__letters span::after { animation-play-state: running; }
.school-intro.is-filled .school-intro__letters span::after { animation: none; clip-path: inset(0); }
.school-intro__letters span:nth-child(2)::after { animation-delay: .12s; }
.school-intro__letters span:nth-child(3)::after { animation-delay: .24s; }
.school-intro__letters span:nth-child(4)::after { animation-delay: .36s; }
.school-intro__status { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 20px 0 0; color: #bcc6dd; font: 400 12px/1.6 'Intro Bengali', 'Intro Poppins', Arial, sans-serif; letter-spacing: 0; }
.school-intro__status::before { content: ''; width: 4px; height: 4px; background: #efbe2e; }
.school-intro.is-leaving { opacity: 0; visibility: hidden; pointer-events: none; }
.school-intro__retry { margin-top: 16px; padding: 8px 18px; border: 1px solid #efbe2e; border-radius: 4px; background: transparent; color: #efbe2e; font: 400 14px/1.5 'Intro Bengali', 'Intro Poppins', Arial, sans-serif; cursor: pointer; }
.school-intro__retry[hidden] { display: none; }
.school-intro__retry:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
@keyframes school-intro-orbit { to { transform: rotate(360deg); } }
@keyframes school-intro-ink {
  from { clip-path: inset(100% 0 0); }
  to { clip-path: inset(0 0 0); }
}
@media (max-width: 380px) {
  .school-intro__letters { font-size: 56px; }
}
@media (prefers-reduced-motion: reduce) {
  .school-intro { transition: none; }
  .school-intro__letters span::after { animation: none; clip-path: inset(0); }
  .school-intro__orbit::after { animation: none; }
}
