.header-chuos {
 padding: 0 20px;
 position: absolute;
 top: 20px;
 z-index: 999;
 width: 100%;
}
.header-chuos .box-header {
    display: flex;
    justify-content: space-between;
}
.btn-chuos{
 padding:8px 15px;
 border-radius:20px;
 color:#fff;
 font-size:15px;
 text-decoration:none;
 background: linear-gradient(
    90deg,
    #ff004f 0%,
    #7a3cff 50%,
    #007bff 100%
);
 box-shadow:0 6px 15px rgba(0,0,0,0.2);
 transition:0.3s;
}

/*banner*/
.wrap-banner{
  position:relative;
  height:600px;
  overflow:hidden;
}

/* background */
.bg{
   position:absolute;
  inset:0;

  background-size:cover;
  background-position:center;

  opacity:0;
  transform: translateY(40px);
  animation:bgfadeIn 6s forwards;
}

@keyframes bgfadeIn{
  from{
    opacity:0;
  }
  to{
    opacity:1;
  }
}

/* person */
.person{
  position:absolute;
  bottom:0;
  left:50%;
  transform: translateX(-50%) scale(0);
  animation:personfadeUp 2s forwards;
  animation-delay:1s;
  max-width: 30%;
}
@keyframes personfadeUp{
    0%{
        transform: translateX(-50%) scale(0);
    }

    100%{
        transform: translateX(-50%) scale(1);
    }
}

/* text */
.text{
  position:absolute;
  top:120px;
  left:100px;
  opacity:0;
  animation:fadeUp 1s forwards;
  animation-delay:1s;
}

/* button */
.btn{
  position:absolute;
  top:40px;
  right:40px;
  opacity:0;
  animation:fadeUp 1s forwards;
  animation-delay:1.5s;
}

/* drone */
.drone{
  position:absolute;
  opacity:0;
  animation:fadeIn 1s forwards;
  animation-delay:2s;
}
/*end banner*/