/* BUILD 18 — LOGO EXPLOSION INTRO */
body.wit-intro-active{
  overflow:hidden;
}

.wit-intro{
  position:fixed;
  inset:0;
  z-index:99999;
  display:grid;
  place-items:center;
  background:#030303;
  overflow:hidden;
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.wit-intro-logo{
  position:relative;
  z-index:4;
  width:min(42vw,360px);
  max-width:360px;
  height:auto;
  opacity:0;
  transform:scale(.45);
  filter:drop-shadow(0 0 0 rgba(255,31,40,0));
  animation:
    witLogoIn .8s cubic-bezier(.16,1,.3,1) .12s forwards,
    witLogoCharge .7s ease-in-out 1.02s forwards,
    witLogoExplode .62s cubic-bezier(.7,0,.84,0) 1.74s forwards;
}

.wit-intro-burst{
  position:absolute;
  width:40px;
  height:40px;
  border-radius:50%;
  background:var(--wit-red,#ff1f28);
  opacity:0;
  z-index:1;
  animation:witBurst 1s ease-out 1.58s forwards;
}

.wit-intro-ring{
  position:absolute;
  width:120px;
  height:120px;
  border:2px solid rgba(255,31,40,.75);
  border-radius:50%;
  opacity:0;
  z-index:2;
}

.ring-one{animation:witRing .9s ease-out 1.55s forwards}
.ring-two{animation:witRing 1s ease-out 1.67s forwards}
.ring-three{animation:witRing 1.1s ease-out 1.79s forwards}

@keyframes witLogoIn{
  0%{
    opacity:0;
    transform:scale(.45) rotate(-4deg);
  }
  70%{
    opacity:1;
    transform:scale(1.08) rotate(1deg);
  }
  100%{
    opacity:1;
    transform:scale(1) rotate(0);
    filter:drop-shadow(0 0 24px rgba(255,31,40,.28));
  }
}

@keyframes witLogoCharge{
  0%{
    transform:scale(1);
    filter:drop-shadow(0 0 24px rgba(255,31,40,.28));
  }
  50%{
    transform:scale(1.06);
    filter:drop-shadow(0 0 52px rgba(255,31,40,.72));
  }
  100%{
    transform:scale(1.02);
    filter:drop-shadow(0 0 34px rgba(255,31,40,.48));
  }
}

@keyframes witLogoExplode{
  0%{
    opacity:1;
    transform:scale(1.02);
    filter:blur(0) drop-shadow(0 0 36px rgba(255,31,40,.55));
  }
  55%{
    opacity:1;
    transform:scale(2.8);
    filter:blur(1px) drop-shadow(0 0 70px rgba(255,31,40,.75));
  }
  100%{
    opacity:0;
    transform:scale(8);
    filter:blur(8px) drop-shadow(0 0 120px rgba(255,31,40,.9));
  }
}

@keyframes witBurst{
  0%{
    opacity:.9;
    transform:scale(.2);
    box-shadow:
      0 0 0 0 rgba(255,31,40,.7),
      0 0 60px 20px rgba(255,31,40,.4);
  }
  55%{
    opacity:.8;
    transform:scale(16);
    box-shadow:
      0 0 0 25vw rgba(255,31,40,.22),
      0 0 120px 60px rgba(255,31,40,.35);
  }
  100%{
    opacity:0;
    transform:scale(32);
    box-shadow:
      0 0 0 60vw rgba(255,31,40,0),
      0 0 180px 90px rgba(255,31,40,0);
  }
}

@keyframes witRing{
  0%{
    opacity:.85;
    transform:scale(.35);
  }
  100%{
    opacity:0;
    transform:scale(10);
  }
}

.wit-intro.wit-intro-exit{
  animation:witIntroExit .5s ease .05s forwards;
}

@keyframes witIntroExit{
  from{
    opacity:1;
    visibility:visible;
  }
  to{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
  }
}

/* Page reveal after intro */
body.wit-intro-active > *:not(.wit-intro){
  opacity:0;
  transform:scale(.985);
}
body.wit-intro-finished > *:not(.wit-intro){
  animation:witPageReveal .72s cubic-bezier(.16,1,.3,1) forwards;
}
@keyframes witPageReveal{
  from{
    opacity:0;
    transform:scale(.985);
    filter:blur(5px);
  }
  to{
    opacity:1;
    transform:scale(1);
    filter:blur(0);
  }
}

@media(max-width:700px){
  .wit-intro-logo{
    width:min(62vw,300px);
  }
}

@media(prefers-reduced-motion:reduce){
  .wit-intro{
    display:none!important;
  }
  body.wit-intro-active{
    overflow:auto!important;
  }
  body.wit-intro-active > *:not(.wit-intro){
    opacity:1!important;
    transform:none!important;
  }
}