.row{
    width: 950px;
}


.shop_name{
width: 100%;
background-image: linear-gradient(90deg,#ff4a4c, #ffc240);
border-radius: 16px;
}
.shop_name h4{
    font-size: 28px;
    font-weight: 800;
    color: #fff;
    text-align: center;
}
.shop_img{
    width: 30%;
}
.shop_img img{
    width: 100%;
    border-radius: 15px;
}
.shop_text{
    width: 70%;
    text-align: start;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.discount{
    border-bottom: 1px solid #ccc;
}
.discount h6{
    font-size: 22px;
    font-weight: 600;
}
.red{
    font-size: 36px;
}
.date{
    font-size: 16px;
}
.more_btn a{
    text-decoration: underline;
    color: #fff;
}

@property --gradient-color-1 {
    syntax: '<color>';
    inherits: false;
    initial-value:#ff4a4c ;

}
@property --gradient-color-2 {
    syntax: '<color>';
    inherits: false;
    initial-value:#ffc240 ;

}
@property --gradient-rotate {
    syntax: '<angle>';
    inherits: false;
    initial-value:45deg ;

}




.more_btn{

    background: linear-gradient(var(--gradient-rotate),var(--gradient-color-1),var(--gradient-color-2));
    transition: --gradient-color-1 0.8s, --gradient-color-2 0.8s , --gradient-rotate 0.8s, color 0.8s;
}
.more_btn:hover{
    --gradient-color-1: #ffc240;
  --gradient-color-2: #ff4a4c;
  --gradient-rotate: 15deg;
  color: rgba(255, 255, 255, 1);
    /* background: linear-gradient(90deg,#ffc240,#ff4a4c, #ffc240); */
    /* transition-duration: .5s; */
}