.products{

display:flex;
justify-content:center;
gap:50px;
padding:60px;
flex-wrap:wrap;

}

.card{

width:340px;
background:#fff;
border-radius:18px;
overflow:hidden;
box-shadow:0 5px 20px rgba(0,0,0,.15);

transition:.3s;

}

.card:hover{

transform:translateY(-10px);

}

.card img{

width:100%;
height:430px;
object-fit:cover;

}

.card h3{

text-align:center;
font-size:24px;
margin-top:25px;

}

.price{

text-align:center;
font-size:22px;
color:#D4AF37;
margin:20px 0;

}

.button{

display:flex;
justify-content:space-evenly;
padding:25px;

}

.button a{

background:#222;
color:white;
text-decoration:none;
padding:15px 28px;
border-radius:8px;

}

.button button{

background:#D4AF37;
color:white;
border:none;
padding:15px 28px;
border-radius:8px;
cursor:pointer;

}

.button a:hover{

background:#444;

}

.button button:hover{

background:#b8902b;

}

/* =====================================================
   CART FLOATING BUTTON
===================================================== */

.cart-float-btn {
    background: #ffffff!important;
    color: #111111  !important;
    position: relative;
    border: 1px solid #eeeeee;
}

.cart-float-btn:hover {
    background: #ffffff !important;
    color:#111111 !important;
    transform: scale(1.08);
}


/* =====================================================
   CART BADGE
===================================================== */

.cart-badge {
    position: absolute;

    top: -5px;
    right: -5px;

    min-width: 21px;
    height: 21px;

    padding: 0 5px;

    background: #c62828;
    color: #ffffff;

    border: 2px solid #ffffff;

    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    font-weight: 600;

    line-height: 1;
}


/* =====================================================
   CART BOUNCE
===================================================== */

.cart-float-btn.cart-added {
    animation: cartBounce 0.45s ease;
}

@keyframes cartBounce {

    0% {
        transform: scale(1);
    }

    40% {
        transform: scale(1.2);
    }

    70% {
        transform: scale(0.95);
    }

    100% {
        transform: scale(1);
    }

}