.why-us {
  padding: 5vw;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  .main {
    display: flex;
    flex-wrap: wrap;
    padding: 70px 20px;
    gap: 80px;
    justify-content: center;

    div {
      width: 23vw;
      min-width: 250px;
      display: flex;
      flex-direction: column;
      align-items: start;
      justify-content: center;
      gap: 10px;

      border: 2px solid #eaeaea5a;
      border-radius: 15px;
      padding: 20px;


      i {
        font-size: 80px;
        padding: 20px;
        color: #ff6100;
        transition: all 0.3s ease-in-out;
        animation: keep-bouncing 5s infinite ;
      }
      h3 {
        font-weight: 1000;
        color: #ff6100;
        font-size: medium;
      }
      p {
        color: #9f9f9f;
        text-align: center;
        font-size: small;
      }
    }

    div:hover {
      i {
        transform: scale(1.1) rotate(5deg);
      }
    }
  }
}


@media screen and (max-width: 768px) {
  .main {
    div {
      width: 90vw;
      align-items: center !important;
    }
  }
  
}

@keyframes keep-bouncing {
  0% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(+10px);
  }
}