
.card {
    position: relative;
    transition: 0.3s;
    cursor: pointer;
  }
  
  .card:hover {
    transform: scale(1.03);
  }
  
  .card::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(106.35deg, #5433FF 2.64%, #20BDFF 49.71%, #A5FECB 96.25%);
    border-radius:40px;
  }
  
  .card::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(106.35deg, #5433FF 2.64%, #20BDFF 49.71%, #A5FECB 96.25%);
    filter: blur(5px);
    border-radius: 40px;
  }
  
  /* .card .card_shadow {
    position: absolute;
    top: 2px;
    left: 2px;
    right: 2px;
    bottom: 2px;
    background-color: rgba(15,19,27,1);
    z-index: 2;
    border-radius: 39px;
  } */
  .card .card_shadow {
    position: relative;
    /* height: 100%; */
    transform: scale(0.98);
    background-color: rgba(15,19,27,1);
    z-index: 2;
    border-radius: 39px;
  }
  
  @media screen and (max-width:480px){
    .card {
      /* height: 310px; */
      aspect-ratio: 1;
    }
    .card::before {
      border-radius: 20px;
    }
    .card::after {
      border-radius: 20px;
    }
    .card .card_shadow{
      border-radius: 19px;
    }
  }
  