.products .box-container {
    display  : flex;
    flex-wrap: wrap;
    gap      : 1.5rem;
}

.products .heading {
    padding-top: 1%;
}

.giagoc {
    text-decoration: line-through;
}

.giaban {
    color      : #ff0000;
    font-weight: bold;
}

.products .box-container .box {
    flex           : 1 1 30rem;
    border-radius  : .5rem;
    box-shadow     : 0 .5rem 1.5rem rgba(0, 0, 0, 0.1);
    border         : 1rem solid rgba(0, 0, 0, 0.1);
    position       : relative;
    min-height     : 45rem;
    /* tuỳ chỉnh theo nội dung của hộp */
    flex-direction : column;
    justify-content: space-between;
    /* giúp căn đều nội dung bên trong */
}

.products .box-container .box .image {
    position   : relative;
    text-align : center;
    padding-top: 2rem;
    overflow   : hidden;
}

.products .box-container .box .image img {
    height       : 20rem;
    /* Chiều cao cố định */
    transition   : all 0.5s ease;
    border       : 2px solid #e0e0e0;
    /* Viền xám */
    padding      : 5px;
    /* Khoảng cách trong viền */
    border-radius: 8px;
    /* Góc bo tròn */
    box-shadow   : 0 4px 8px rgba(0, 0, 0, 0.1);

}


.products .box-container .box:hover .image img {
    transform: scale(1.1);
}

.products .box-container .box .content .icons {
    position  : absolute;
    bottom    : 0;
    left      : 0;
    right     : 0;
    display   : flex;
    text-align: center;
}

.products .box-container .box .content .icons a {
    height     : 5rem;
    line-height: 5rem;
    font-size  : 1.5rem;
    width      : 50%;
    background : var(--pink);
    color      : #fff;
}

.products .box-container .box .content .icons a:hover {
    background: #333;
}

.products .box-container .box .content {
    padding   : 2.5rem;
    margin-top: 1rem;
    /* khoảng cách giữa hình và nội dung */
    text-align: center;
}


.products .box-container .box .content .products-price {
    padding  : 1.5rem;
    font-size: 1.5rem;
}

@keyframes neonBlink {

    0%,
    100% {
        color      : #fff600;
        text-shadow: 0 0 5px #fff600, 0 0 10px #fff600, 0 0 20px #ff00de, 0 0 30px #ff00de;
    }

    50% {
        color      : #ff00de;
        text-shadow: 0 0 5px #ff00de, 0 0 10px #ff00de, 0 0 20px #fff600, 0 0 30px #fff600;
    }
}

.highlight {
    animation     : neonBlink 0.8s infinite;
    font-size     : 5rem;
    font-weight   : bold;
    text-transform: uppercase;
}