.accordion-card {
      flex: 1;
      cursor: pointer;
      transition: .5s;
    }

    .accordion-card.active {
      flex: 2.5;
    }

    .card-img-box {
      height: 520px;
      position: relative;
    }

    .card-img-box img {
      transition: .5s;
    }

    .accordion-card:hover img {
      transform: scale(1.05);
    }

    .card-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(0, 0, 0, .35), transparent);
    }

    .arrow-btn {
      opacity: 0;
      transition: .4s;
    }

    .accordion-card.active .arrow-btn {
      opacity: 1;
    }

    .arrow-btn:hover {
      background: #000;
      color: #fff;
    }

    .card-desc{
    max-height:0;
    opacity:0;
    transition:.4s;
}

.accordion-card.active .card-desc{
    max-height:80px;
    opacity:1;
}

    @media(max-width:768px) {

      .accordion-wrapper {
        flex-direction: column;
        height: auto;
      }

      .card-img-box {
        height: 280px;
      }

      .card-title {
        font-size: 32px;
      }
    }
 