/* AZRA pixel-logo intro layer */
#introCurtain {
  animation: azraIntroCurtainOut 3.65s cubic-bezier(.7,0,.2,1) forwards !important;
  background: #000;
  overflow: hidden;
}
#introLogoCanvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  image-rendering: pixelated;
  opacity: 1;
}
.intro-scanline {
  position: absolute;
  left: 8%;
  right: 8%;
  top: 50%;
  height: 1px;
  opacity: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,213,0,.75), rgba(192,132,252,.55), transparent);
  box-shadow: 0 0 16px rgba(255,213,0,.35);
  animation: azraIntroScan 3.2s ease-in-out .25s forwards;
}
@keyframes azraIntroScan {
  0%, 9% { opacity: 0; transform: scaleX(.15); }
  16% { opacity: .75; transform: scaleX(1); }
  42% { opacity: .2; transform: scaleX(.78); }
  70% { opacity: .08; transform: scaleX(.45); }
  86%, 100% { opacity: 0; transform: scaleX(.1); }
}
@keyframes azraIntroCurtainOut {
  0% { opacity: 1; visibility: visible; }
  78% { opacity: 1; visibility: visible; }
  100% { opacity: 0; visibility: hidden; }
}
@media (prefers-reduced-motion: reduce) {
  #introCurtain { animation: azraIntroCurtainOut 1.2s ease forwards !important; }
  #introLogoCanvas { opacity: 0 !important; }
  .intro-scanline { display: none; }
}