.cards_section{

    padding: 30px 0 80px 0;

}

.cards_section .inner-container{

    padding: 80px;

    background: #F8F7FF;

    border-radius: 32px;

}

/* text */

.cards_section .subtitle{

    margin-bottom: 10px;

    max-width: 100%;

}

.disable-feedbacked-icon{
pointer-events: none;
}

.hide-feedbacked-icon{
display: none !important;
}

.cards_section .cards-wrapper{

    display: flex;

    margin-left: -30px;

    margin-right: -20px;

    padding: 20px;

}

.cards_section .item-wrapper{

    width: 25%;

    padding: 10px 12px;

    cursor: pointer;

    transition: 0.4s;		

}



/* focus????? js add class */

.cards_section .item-image .active:after{

    content: "";

    position: absolute;

    width: 100%;

    height: 100%;

    left: 0;

    right: 0;

    background: #C4C4C4;

    opacity: 0.5;

    transition: 0.4s;

}



.cards_section .item-wrapper:hover .item-image img{		

    transform: scale(1.1);

    transition: 0.4s;

}	

.cards_section .item{		

    text-align: center;

    background: #FFFFFF;

    box-shadow: 0px 4px 25px rgba(7, 13, 144, 0.16);

    border-radius: 8px;

    overflow: hidden;

    position: relative;

}

.cards_section .item-image img{

    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: 0.4s;

}

/* .cards_section .item-wrapper.active .item:after{

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    opacity: 0.5;

    width: 100%;

    height: 100%;

    background: #F8F7FF;

    box-shadow: 0px 4px 25px rgba(7, 13, 144, 0.16);

} */

.cards_section .item-image{

    /* max-height: 230px; */

    height: 230px;

    overflow: hidden;

    position: relative;

    transition: 0.4s;

}

.cards_section .item-title{

    display: flex;

    align-items: center;

    justify-content: center;

}

.cards_section .item-wrapper:hover .item-title p{

    color: var(--hover_color);

}

.cards_section .item-title p{

    margin: 0;

    padding: 16px 0;

    transition: 0.4s;

    font: 700 16px/26px 'Montserrat';

    color: #181818;

}

.cards_section .my-swiper{

    overflow: hidden;

}





@media(max-width: 768px){

    .cards_section h2{

        font: 800 29px/36px 'Montserrat';

    }

    .cards_section .inner-container{

        padding: 40px 24px;

    }		

    .cards_section .cards-wrapper{

        padding: 15px!important;

    }			

    .cards_section .subtitle{

        margin-bottom: 10px;

    }	

    .cards_section{

        padding: 40px 0;

    }

}

@media(max-width: 600px){

    .cards_section{

        padding: 26px 0;

    }

}

@media(min-width: 320px) and (max-width: 600px){

    .cards_section .swiper-slide-active{

        width: 90% !important;

    }

    .cards_section .swiper-slide-next,

    .cards_section .swiper-slide-prev{

        transform: scale(0.9) !important;

        transition: 0.4s;

    }

    .cards_section .swiper-slide-next .item:after{

        content: "";

        position: absolute;

        width: 100%;

        height: 100%;

        left: 0;

        top: 0;

        background: #A5A79F;

        opacity: 0.5;

        transition: 0.4s;

    }

    .cards_section .swiper-slide-next{

        margin-left: -15px !important;

    }

    .cards_section .swiper-backface-hidden .swiper-slide{

        margin-right: 0 !important;

    }

}


.cards-main-wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(14%, 1fr));
    gap: 36px;
    margin-top: 62px;
}

.cards-content{
    cursor: pointer;
}
.cards-main-wrapper span{
    color: #000;
    font-family: Inter;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}




.cards-content img{
    object-fit: cover;
    background-repeat: no-repeat;
    height: 100%;
    width: 100%;
}

 @media screen and (max-width: 480px) {
    .cards-main-wrapper {
      grid-template-columns: repeat(auto-fill, minmax(23%, 1fr));
        gap: 54px;
    }

  }