.container-populair-card {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(5, 1fr);
}

.container-img img{
    width: 100%;
    height: 275px;
    transition: transform 0.3s ease;
    cursor: pointer;
    object-fit: contain;
}

.container-populair-card img:hover {
    transform: rotate(10deg) translateY(-15px); 
}

.btn-populair-card {
    margin-top: 30px;
    display: flex;
    justify-content: center;
}

.btn-populair-card a {
    color: #ffcafd;
    font-family: 'bubblegum';
    font-size: 18px;
    background-color: #00009c;
    padding: 12px 20px;
    border-radius: 50px;
    transition: color 0.3s ease, background-color 0.3s ease;
}

.btn-populair-card a:hover {
    color: #ff589e;
}

@media only screen and (max-width: 600px) { 
    .container-populair-card {
        gap: 6px;
        grid-template-columns: repeat(2, 1fr);
    }

    .btn-populair-card a {
        padding: 12px 16px;
    }
}