/* Compact visual controls with accessible touch targets. */
@media (max-width: 575px) {
    .hm-slider-dots {
        align-items: center;
        gap: 0;
    }

    .hm-dot,
    .hm-dot.is-active {
        position: relative;
        width: 24px !important;
        min-width: 24px;
        height: 24px !important;
        padding: 0;
        border: 0;
        background: transparent !important;
    }

    .hm-dot::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 7px !important;
        height: 7px !important;
        border-radius: 999px;
        background: #661c14;
        transform: translate(-50%, -50%);
        transition: width 0.2s ease;
    }

    .hm-dot.is-active::before {
        width: 20px !important;
        height: 7px !important;
    }

    .hm-toggle-autoplay {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 28px !important;
        min-width: 28px;
        height: 28px !important;
    }
}


/* CPG mobile category grid: nine direct links, three per row. */
@media (max-width: 575px) {
    .hm-category-carousel-wrap {
        display: block;
    }

    .hm-category-carousel {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 18px 8px;
        width: 100%;
        padding: 0 8px;
        overflow: visible;
        scroll-behavior: auto;
    }

    .hm-category-item {
        width: 100%;
        min-width: 0;
    }

    .hm-category-thumb {
        width: min(27vw, 104px);
        height: min(27vw, 104px);
        margin: 0 auto;
    }

    .hm-category-item span {
        display: block;
        margin-top: 8px;
        padding: 0 2px;
        font-size: 12.5px;
        line-height: 1.15;
        overflow-wrap: anywhere;
    }

    .hm-category-carousel-fade,
    .hm-category-arrow {
        display: none !important;
    }
}

/* CPG mobile stacked filters and anniversary offers. */
@media (max-width: 575px) {
    .mht-filters {
        display: grid !important;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 8px;
        width: 100%;
        margin: 10px 0 14px;
        padding: 2px 10px 0;
        overflow: visible;
        scroll-snap-type: none;
    }

    .mht-filter {
        grid-column: span 2;
    }

    .mht-filter:nth-child(4) {
        grid-column: 2 / span 2;
    }

    .mht-filter:nth-child(5) {
        grid-column: 4 / span 2;
    }

    .mht-filter,
    .hm-page button.mht-filter {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-width: 0;
        min-height: 42px;
        padding: 8px 5px;
        border-radius: 18px;
        white-space: normal;
        text-align: center;
        line-height: 1.1;
    }

    .hm-day-offer-mobile {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }

    .hm-day-offer-mobile .hm-container {
        width: 100%;
        padding-right: 14px;
        padding-left: 14px;
    }

    .hm-day-offer-mobile .hm-day-offer-rotator {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        width: 100%;
        min-height: 0;
        padding: 2px 0 4px;
        overflow: visible;
        scroll-snap-type: none;
    }

    .hm-day-offer-mobile .hm-day-offer-slide,
    .hm-day-offer-mobile .hm-day-offer-slide.is-active {
        display: block !important;
        width: 100%;
        min-width: 0;
        height: auto;
        flex: none;
        scroll-snap-align: none;
    }

    .hm-day-offer-mobile .hm-day-offer-product {
        width: 100%;
        min-width: 0;
    }

    .hm-day-offer-mobile .hm-day-offer-dots {
        display: none !important;
    }
}

/* CPG mobile: show full offer images and stack the three prize banners. */
@media (max-width: 575px) {
    .hm-day-offer-mobile .hm-day-offer-media img {
        object-fit: contain;
        padding: 3px;
        background: #fff;
    }

    #featured-offers-carousel .hm-offer-carousel-wrap {
        width: 100%;
        height: auto;
        overflow: visible;
    }

    #featured-offers-carousel .hm-offer-carousel {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
        width: 100%;
        height: auto;
        padding: 0;
        overflow: visible;
        scroll-snap-type: none;
    }

    #featured-offers-carousel .hm-offer-banner-card {
        width: 100%;
        min-width: 0;
        max-width: none;
        flex: none;
    }

    #featured-offers-carousel .hm-offer-banner-visual {
        width: 100%;
    }

    #featured-offers-carousel .hm-offer-fade,
    #featured-offers-carousel .hm-offer-arrow {
        display: none !important;
    }
}

/* CPG desktop: present pet tabs and product filters as one centered control group. */
@media (min-width: 1025px) {
    .mht-nav {
        justify-content: center;
        gap: 28px;
    }

    .mht-filters {
        justify-content: center;
    }
}

/* CPG mobile: give product-pack artwork enough vertical room. */
@media (max-width: 575px) {
    .hm-day-offer-mobile .hm-day-offer-product {
        grid-template-columns: 88px minmax(0, 1fr);
        min-height: 128px;
        padding: 14px 12px;
        align-items: center;
    }

    .hm-day-offer-mobile .hm-day-offer-media {
        width: 88px;
        height: 92px;
    }

    .hm-day-offer-mobile .hm-day-offer-media img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
}

/* CPG desktop: show every prize banner and category without horizontal scrolling. */
@media (min-width: 1025px) {
    #featured-offers-carousel .hm-offer-carousel-wrap {
        width: 100%;
        height: auto;
        overflow: visible;
    }

    #featured-offers-carousel .hm-offer-carousel {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 560px));
        justify-content: center;
        gap: 24px;
        width: 100%;
        height: auto;
        padding: 0;
        overflow: visible;
        scroll-snap-type: none;
    }

    #featured-offers-carousel .hm-offer-banner-card {
        width: 100%;
        min-width: 0;
        max-width: none;
        flex: none;
    }

    #featured-offers-carousel .hm-offer-banner-card:nth-child(3) {
        grid-column: 1 / -1;
        width: 100%;
        max-width: 560px;
        justify-self: center;
    }

    #featured-offers-carousel .hm-offer-fade,
    #featured-offers-carousel .hm-offer-arrow {
        display: none !important;
    }

    .hm-category-carousel-wrap {
        overflow: visible;
    }

    .hm-category-carousel {
        display: grid;
        grid-template-columns: repeat(10, minmax(0, 1fr));
        gap: 24px 12px;
        width: 100%;
        max-width: 1100px;
        margin: 0 auto;
        padding: 4px 0;
        overflow: visible;
        scroll-snap-type: none;
    }

    .hm-category-item {
        grid-column: span 2;
        width: 100%;
        min-width: 0;
    }

    .hm-category-item:nth-child(6) { grid-column: 2 / span 2; }
    .hm-category-item:nth-child(7) { grid-column: 4 / span 2; }
    .hm-category-item:nth-child(8) { grid-column: 6 / span 2; }
    .hm-category-item:nth-child(9) { grid-column: 8 / span 2; }

    .hm-category-carousel-fade,
    .hm-category-arrow {
        display: none !important;
    }
}

@media (min-width: 1025px) {
    #featured-offers-carousel .hm-section-head > div {
        width: 100%;
        justify-content: center;
    }

    #featured-offers-carousel .hm-section-head h2 {
        text-align: center;
    }
}

/* CPG mobile: remove the legacy height cap that clipped stacked offers. */
@media (max-width: 575px) {
    .hm-day-offer-mobile,
    .hm-day-offer-mobile .hm-day-offer {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

/* CPG desktop: center the primary homepage section headings. */
@media (min-width: 1025px) {
    #shop-by-category .hm-section-head > div,
    #featured-offers-carousel .hm-section-head > div,
    #pet-parenting .hm-section-head > div,
    #featured-brands .hm-section-head > div,
    #productos .mht-head > div {
        width: 100%;
        justify-content: center;
    }

    #shop-by-category .hm-section-head h2,
    #featured-offers-carousel .hm-section-head h2,
    #pet-parenting .hm-section-head h2,
    #featured-brands .hm-section-head h2,
    #productos .mht-head h2,
    .hm-seo h2 {
        margin-right: auto;
        margin-left: auto;
        text-align: center;
    }

    #home-blog .hm-section-head > div {
        display: grid;
        grid-template-columns: 1fr auto 1fr;
        width: 100%;
        align-items: center;
    }

    #home-blog .hm-section-head h2 {
        grid-column: 2;
        margin: 0;
        text-align: center;
    }

    #home-blog .hm-blog-more {
        grid-column: 3;
        justify-self: end;
    }
}

/* CPG desktop: center each prize caption under its image. */
@media (min-width: 1025px) {
    #featured-offers-carousel .hm-offer-banner-body,
    #featured-offers-carousel .hm-offer-banner-body h3 {
        width: 100%;
        text-align: center;
    }
}
