#start-scene{position:absolute;inset:0}
#start-scene .bg-back,
#start-scene .bg-front,
#start-scene .moon-layer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
#start-scene .bg-back{z-index:1;object-fit:cover}
#start-scene .moon-layer{z-index:2;pointer-events:none}
#start-scene .bg-front{z-index:3;object-fit:cover;pointer-events:none}
#start-scene .btn-wrap{
  position:absolute;
  bottom:14%;
  left:50%;
  transform:translateX(-50%);
  z-index:10;
}

/* EWA CHARACTER */
.ewa-container{
  position:absolute;
  left:5%;
  bottom:12%;
  width:30%;
  z-index:8;
  opacity:0;
  transform:translateY(40px);
  transition:opacity .8s ease, transform .8s ease;
  pointer-events:none;
}
.ewa-container.visible{
  opacity:1;
  transform:translateY(0);
}
.ewa-img{
  width:100%;
  height:auto;
  display:block;
}

/* EWA SPEECH BUBBLE */
.ewa-speech{
  position:absolute;
  bottom:85%;
  left:50%;
  transform:translateX(-30%);
  width:28vw;
  background:rgba(20,8,40,.92);
  border:3px solid #E84F8B;
  border-radius:22px;
  padding:1.2vw 1.6vw;
  z-index:50;
  opacity:0;
  transition:opacity .4s;
  box-shadow:0 0 50px rgba(232,79,139,.3);
}
.ewa-speech.show{opacity:1}
.ewa-speech::after{
  content:"";
  position:absolute;
  bottom:-18px;
  left:25%;
  transform:translateX(-50%);
  border:14px solid transparent;
  border-top-color:#E84F8B;
  border-bottom:0;
}
.ewa-who{
  display:block;
  font-family:'Sora',sans-serif;
  font-size:.95vw;
  font-weight:700;
  color:#E84F8B;
  letter-spacing:2.5px;
  margin-bottom:.4vw;
  text-transform:uppercase;
}
.ewa-text{
  font-family:'Manrope',sans-serif;
  font-size:1.15vw;
  line-height:1.5;
  color:#fff;
  min-height:3vw;
}
.ewa-cursor{
  display:inline-block;
  width:.5vw;height:1.2vw;
  background:#E84F8B;
  margin-left:3px;
  vertical-align:middle;
  animation:caret-blink .8s steps(2) infinite;
}
@keyframes caret-blink{50%{opacity:0}}