/* =============================================================
   HOME PAGE
   ============================================================= */

/* Promotional Section */
.section-container .home-section-header {
    font-family: sans-serif, 'Montserrat';
}
.promotional-section .card {
    cursor: pointer;
    font-family: sans-serif, 'Montserrat';
}
.promotional-section .card .card-body {
    padding: 5%;
    height: 260px;
}
.promotional-section .left-card .card {
    background-color: #c8102e;
}
.promotional-section .card .card-body .badge {
    width: fit-content;
    font-size: 16px;
    background-color: #feeb00;
}
.promotional-section .card .card-body .btn {
    width: fit-content;
}

/* Famous Brands */
.famous-brands-section {
    background-color: #fff;
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
    padding-top: 48px;
    padding-bottom: 48px;
}
.famous-brands {
    margin-bottom: 32px;
}
.famous-brands__title {
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
    letter-spacing: 0.07px;
    color: #1a1a1a;
}
.brand-list .owl-stage { display: flex; }
.brand-list .owl-item { display: flex; }
.brand-list .item { display: flex; width: 100%; }
.brand-list .brand-card {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 110px;
    padding: 8px;
    background-color: transparent;
    transition: transform 0.25s ease, opacity 0.25s ease;
}
.brand-list .brand-card:hover {
    transform: scale(1.05);
    opacity: 0.85;
    text-decoration: none;
}
.brand-list .brand-card img {
    max-height: 100%;
    max-width: 100%;
    width: auto;
    object-fit: contain;
}

.home .brand-list > div {
    padding-left: 0;
    padding-right: 0;
}

/* Service Promotions */
.service-promo-section {
    font-family: sans-serif, 'Montserrat';
}
.service-promo-section .badge-icon {
    width: 65px;
    height: 65px;
    background-color: #c8102e;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.service-promo-section .badge-icon svg {
    width: 30px;
    height: 30px;
    fill: #ffffff;
}

/* Newsletter */
.newsletter-section {
    font-family: sans-serif, 'Montserrat';
    background-color: rgb(172, 230, 203);
}
.newsletter-section .newsletter-icon {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.newsletter-section .newsletter-icon svg {
    width: 50px;
    height: 50px;
    fill: inherit;
}
.newsletter-section .newsletter-description {
    font-size: 16px;
    font-weight: 500;
}
.newsletter-section .form-control.newsletter-email {
    border-radius: 8px !important;
}
.newsletter-section button {
    background-color: #c8102e;
    height: 52px;
}

/* Carousel */
.carousel {
    position: relative;
    min-height: 32vw;
}
.carousel .owl-stage { display: flex; }
.carousel .item { height: 100%; }
.carousel .item > a {
    display: block;
    height: 32vw;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.carousel .item > a picture { display: block; width: 100%; height: 100%; }
.carousel .item > a img { width: 100%; height: 100%; object-fit: cover; }
.carousel .owl-nav button { position: absolute; top: 0; bottom: 0; }
.carousel .owl-nav {
    margin: 0 auto;
    position: absolute;
    max-width: 120px;
    height: auto;
    bottom: 9.2%;
    left: 90%;
    right: 0;
}
.carousel .owl-dots { position: absolute; bottom: 10px; width: 100%; }
.carousel .owl-nav button.owl-prev { left: 20px; padding-left: 10px !important; }
.carousel .owl-nav button.owl-next { right: 20px; padding-right: 10px !important; }
.carousel .owl-nav button.owl-prev:hover,
.carousel .owl-nav button.owl-prev:focus,
.carousel .owl-nav button.owl-next:focus,
.carousel .owl-nav button.owl-next:hover { outline: none; background-color: transparent; }

/* Utility */
.font-bold      { font-weight: 700; }
.font-montserrat { font-family: 'Montserrat', sans-serif !important; }
.ptb-15         { padding-top: 15px; padding-bottom: 15px; }
.container-left-right { padding-right: 0; padding-left: 0; }

/* Wrapper / Welcome bar */
.wrapper { font-size: 15px; }
.wrapper.arrow-ribbon { padding: 20px 0; }

/* Section header */
.home-section-header { /* rendered by section_header() */ }

/* Product sections */
.leading-market { padding-top: 10px; }
.leading-market a:hover { text-decoration: none; }

.item-list .row { margin-left: -5px; margin-right: -5px; }
.item-list .col-lg-4 { padding: 0 5px 10px; display: flex; }
.item-list .img-responsive { max-width: 100%; width: 100%; height: 100%; object-fit: cover; vertical-align: middle; }

.owl-carousel .owl-stage { display: flex; flex-wrap: wrap; }
.owl-carousel .owl-stage .owl-item { display: flex; }

.item-list-slider .item a { width: 100%; }
.home .item-list-slider { display: none; }
.home .item-list a { display: block; overflow: hidden; border-radius: 4px; transition: box-shadow 0.3s ease; }
.home .item-list a img { transition: transform 0.3s ease; }
.home .item-list a:hover { box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15); }
.home .item-list a:hover img { transform: scale(1.05); }

/* FB / promo banners */
.fb-banner { margin-top: 30px; }
.fb-banner img { width: 100%; }

/* Product card flags */
.home .products .product .flag {
    color: #fff;
    font-size: 14px;
    background-color: #ccc;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
    line-height: 1;
    padding: 10px 15px;
    position: absolute;
    z-index: 1;
    bottom: 67px;
    right: 0;
}
.home .products .product .flag.flag-instore { background-color: #32a483; }
.home .products .product .flag.flag-oos     { background-color: #d1d1d1; color: #555; }

.home .product:hover .product-hover a,
li.product:hover .product-hover a { display: flex; }

/* Home page nth-child spacing */
.home #page > div:nth-child(7) { margin-top: 50px; }

/* Responsive */
@media screen and (max-width: 991px) {
    .w-md-100 { width: 100% !important; }
    .promotional-section .card .card-body { height: auto; }
    .newsletter-section .newsletter-content,
    .newsletter-section .newsletter-form { align-items: center; }
    .newsletter-section .newsletter-description,
    .newsletter-section .newsletter-disclaimer { text-align: center; }
    .newsletter-section .newsletter-email { height: 52px; }
    .home .item-list-slider { display: block; }
    .home h3 { line-height: 24px; }
}

@media (max-width: 767px) {
    .home #page > div:nth-child(7) { margin-top: 30px; }
}

@media screen and (max-width: 767px) {
    .home .carousel { min-height: 40vw; }
    .home .carousel .item > a { height: 40vw !important; }
}

@media (max-width: 576px) {
    .home #page > div:nth-child(7) { margin-top: 30px; }
    .home .leading-market .row > div,
    .home .latest-markdown .row > div,
    .home .just-arrived .row > div { margin-bottom: 10px; }
    .famous-brands-section { padding-top: 32px; padding-bottom: 32px; }
    .famous-brands { margin-bottom: 24px; }
    .famous-brands__title { font-size: 20px; line-height: 28px; }
    .brand-list .brand-card { height: 90px; padding: 6px; }
}

@media (max-width: 575px) {
    .home .carousel { min-height: 100vw; }
    .home .carousel .item > a { height: 115vw !important; }
}

/* Less Deals Banner — make the banner image span the full container width */
.home .less-deals-banner a img {
    width: 100%;
}
