.jg-cards-all{
        display: flex;
    flex-wrap: wrap;
    gap: 40px;
    justify-content: center;

}

.jg-cards-all-container{
transform: translateY(var(--transformTop));
margin-bottom: var(--transformTop);
}

.jg-cards-all-container .button-wrap{
      display: flex;
    justify-content: center;
    width: 100%; 
    margin-top: 4rem;
}

.jg-cards-all .jg-card{
    width: 400px;
    height: 670px;
    border-radius: 20px;
    flex: 0 0 400px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 10px 10px -8px rgba(0, 0, 0, 0.25);
    background-color: var(--weiss);
    color:black;
        transition: all 0.3s ease-in-out;
}

.jg-cards-all a:hover .jg-card{
    transform: translateY(-20px);
   
}

#jg .jg-cards-all a:hover .jg-card h3{
    color:var(--orange-base);
  
}

.jg-cards-all a .jg-card img{
    transform: scale(1);
    transition: transform 0.3s ease-in-out;
}

.jg-cards-all a:hover .jg-card img{
    transform: scale(1.1);
}

.jg-cards-all .text-block{
    flex: 0 0 43% ;
    padding: 2.53rem 2rem 0 2rem;
}

.jg-cards-all .text-block p{
    margin: 0;
}

.jg-cards-all .img-block{
    flex: 0 0 57% ;
    
}

.jg-cards-all .text{
    font-size: 18px;
}

.jg-cards-all .img-block img{
width: 100%;
height: 100%;
object-fit: cover;
    
}
/* badge*/

.jg-cards-all .tags{
   border-radius: 20px;
   padding: 2px 15px;
   width: fit-content;
   color: var(--weiss);
   text-transform: uppercase;
   font-weight: 600;
}

.jg-cards-all .tag-1{
    background-color: var(--badge-green);
}

.jg-cards-all .tag-2{
    background-color: var(--violet-base);
}

.jg-cards-all .tag-3{
    background-color: var(--orange-base);
}