.banner img { width: 100%; }
.banner { position: relative; }
.banner .caption { position: absolute; left: 60px; bottom: 60px; color: white; max-width: 35%; }
.banner .caption p { font-size: 15px; }
.btn.white { background: #EFF2F666; color: white; border: 1px solid #EFF2F666; }
.btn.outline { border: 1px solid #EFF2F666; }
#hero h1 { font-size: 60px; font-weight: 300; }
#counters .container { display: flex; align-items: center; justify-content: space-around; padding-top: 30px; }
#counters .box { background: #EFF2F666; width: 300px; border-radius: 24px; padding: 16px; text-align: center; }
#counters span { display: block; font-size: 42px; font-weight: 700; background-image: linear-gradient(to bottom, #EC008C, #FF6A00); -webkit-background-clip: text; background-clip: text; color: transparent; }
#counters h4 { font-size: 16px; font-weight: 700; color: #929292; }
#offers { text-align: center; } 
#offers button.more { padding: 0.5rem 4rem; }
.products-wrapper { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 40px 0; }
.products-wrapper .item { border-radius: 22px; box-shadow: 0px 4px 4px 0px #00000040; }
.products-wrapper .item img { border-radius: 22px; }
.products-wrapper .item h5 { font-size: 18px; font-weight: 700; }
.products-wrapper .item .price { font-size: 30px; font-weight: 400; padding: 10px 0 10px; }
.products-wrapper .item .contents { padding: 20px; text-align: left; position: relative; }
.products-wrapper .rating-box { display: flex; align-items: center; justify-content: flex-start; gap: 10px; color: #EE0979; font-size: 12px; font-weight: 400; }
.products-wrapper .rating-box .stars { display: flex; align-items: center; justify-content: flex-start; gap: 6px; }
.products-wrapper .rating-box .filled { width: 16px; height: 16px; background: #FF6A00; -webkit-mask-image: url("/modules/main/images/star.svg"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: 16px; }
.products-wrapper button.add_to_cart { background: linear-gradient(to bottom, #EC008C, #FF6A00); border-radius: 100%; width: 48px; height: 48px; position: absolute; bottom: 20px; right: 20px; border: 0; display: flex; align-items: center; justify-content: center; padding-right: 8px; }
.products-wrapper button.add_to_cart:after { content: ""; background: white; -webkit-mask-image: url("/libraries/Feather/shopping-cart.svg"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: 25px; width: 25px; height: 25px; }
#brands { background: linear-gradient(to bottom, #EC008C, #FF6A00); color: white; text-align: center; }
#brands .owl-carousel { padding: 60px 0 0px; }
#brands .owl-carousel .owl-item img { xwidth: initial; margin: auto; }
#brands .owl-carousel .owl-stage { display: flex; align-items: center; justify-content: center; }

@media (max-width: 1440px) { 
#counters span { font-size: 38px; }
#counters h4 { font-size: 15px; }
#counters .box { width: 280px; }
}

@media (max-width: 1280px) { 
#hero h1 { font-size: 48px; }
#counters .container { gap: 10px; }
#counters span { font-size: 26px; }
#counters h4 { font-size: 16px; }
#counters .box { width: initial; padding: 16px 8px; flex: 50%; max-width: 300px; }
.products-wrapper { overflow-x: auto; }
.products-wrapper::-webkit-scrollbar { display: none; }
.products-wrapper .item img { height: 170px; }
.products-wrapper .item .price { font-size: 26px; }
}


@media (max-width: 1024px) { 
#hero h1 { font-size: 36px; }
#hero .container { padding: 0; }
#hero img { min-height: 560px; object-fit: cover; object-position: 100% bottom; }
.banner .caption { max-width: 100%; left: 0; padding: 0 24px; z-index: 7; }
.banner:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(transparent, rgba(0,0,0,0.8)); z-index: 3; }
#counters .container { align-items: stretch; padding-top: 20px; }
#counters span { font-size: 20px; }
#counters h4 { font-size: 12px; }
}