/* ================================================== */
/* BASE                                               */
/* ================================================== */

*,
*:before,
*:after {
    box-sizing: border-box;
}

html,
body {
    height: 100%;
    margin: 0;
    padding: 0;
}

body {
    min-height: 100vh;
    background: linear-gradient(to bottom, #F6F6F6 0%, #E0E0E0 100%);
    background-size: cover;
    background-attachment: fixed;
}

@media (max-width:768px) {

.benefit-slider {
    flex-wrap:nowrap !important;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-left:12px;
    padding-right:12px;
}

.benefit-slider::-webkit-scrollbar {display:none;}

.benefit-item {
    flex:0 0 calc(100% - 24px);
    max-width:calc(100% - 24px);
    scroll-snap-align:center;
}

}

/* ================================================== */
/* CATEGORY SLIDER                                    */
/* ================================================== */

@media (max-width:768px) {

.category-slider {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin-left: 0;
    margin-right: 0;
    padding-left: 12px;
    padding-right: 12px;
}

.category-slider::-webkit-scrollbar {
    display: none;
}

.category-item {
    flex: 0 0 46vw;
    max-width: 46vw;
    scroll-snap-align: start;
    padding-left: 4px;
    padding-right: 4px;
}

}
/* ================================================== */
/* CATEGORY CARD                                      */
/* ================================================== */

.category-card {
    border-radius:12px;
    border:4px solid #eef3f6;
}

/* ================================================== */
/* PRODUCT CARD                                       */
/* ================================================== 

.product-card {
    position:relative;
    border-radius:12px;
    overflow:hidden;
} */

.product-badge {
    position: relative;
    top:10px;
    left:10px;
    padding:6px 10px;
    border-radius:30px;
    background:#e12626;
    color:#fff;
    font-size:12px;
    font-weight:700;
}

.product-title {
    margin-bottom:8px;
    font-size:16px;
    font-weight:700;
    line-height:1.3;
}

.product-title a {
    color:inherit;
    text-decoration:none;
}

.product-price {
    margin-bottom:8px;
    color:#0f6f78;
    font-size:24px;
    font-weight:800;
}

.product-old {
    margin-left:6px;
    color:#222;
    font-size:14px;
    text-decoration:line-through;
}

@media (max-width:768px){

.product-title {font-size:14px;}

.product-price {font-size:19px;}

}