@media (min-width: 1025px) and (max-width: 1199px) {

}

@media (min-width: 768px) and (max-width: 1024px) {
    .recent-products a.woocommerce-loop-product__link {
        aspect-ratio: 21 / 28;
    }
    .category-select li.product-category.product a {
        aspect-ratio: 18 / 28;
    }

    .recent-products h2, .recent-products .price, .recent-products a.button {
        bottom: 25px;
    }
    .vp-checkout-right {
        flex: 0 0 310px;
        width: 310px;
    }

}

@media (min-width: 320px) and (max-width: 1024px) {
    .vp-checkout-layout {
        margin: 60px auto;
        gap: 40px;
    }
    .filter-cate-sec .bapf_body {
        margin-bottom: 40px;
    }

    .recent-products h2 {
        line-height: 1.6em !important;
    }

    .recent-products h2 {
        margin-bottom: 47px !important;
        font-size: 12px !important;
        padding: 0px 10px !important;
    }

    .recent-products .price {
        margin-bottom: 26px !important;
    }

    #mega-menu-wrap-menu-1 .mega-menu-toggle.mega-menu-open ~ button.mega-close {
        left: calc(min(100vw - 0px, 260px)) !important;
    }


    .menu-mobile ul.max-mega-menu {
        padding: 60px 20px !important;
    }

    .menu-mobile ul.mega-sub-menu ul.mega-sub-menu {
        margin-bottom: 20px !important;
    }


    .menu-mobile ul.max-mega-menu .mega-menu-row h4.mega-block-title {
        color: #1d1d1d !important;
        font-family: "bristone", Sans-serif !important;
        font-weight: 400 !important;
        margin-bottom: 10px !important;
        padding-bottom: 0 !important;
        font-size: 11px !important;
    }

    .menu-mobile ul.mega-sub-menu ul.mega-sub-menu li {
        margin-bottom: 0 !important;
        padding: 0px !important;
        float: none !important;
    }

    .menu-mobile .mega-menu.max-mega-menu > li > a.mega-menu-link {
        color: #1d1d1d !important;
        font-family: "bristone", Sans-serif !important;
        font-size: 12px !important;
        padding: 4px 0 !important;
        height: auto !important;
    }

    .menu-mobile .mega-menu.max-mega-menu > li {
        margin-bottom: 10px !important;
    }

    .menu-mobile .mega-menu.max-mega-menu > li > ul.mega-sub-menu {
        background: #efefef !important;
    }

}

@media (min-width: 320px) and (max-width: 767px) {
    .vp-field-wrap {
        margin-bottom: 15px;
    }
    .vp-checkout-layout {
        padding: 0px 0px;
    }
    .vp-checkout-layout {
        flex-wrap: wrap;
    }
    .vp-checkout-right {
        flex: initial;
        width: 100%;
        position: relative;
        top: 00px;
    }
    .vp-cart-item {
        flex-wrap: wrap;
    }
    .vp-cart-item__image {
        flex-shrink: 0;
        width: 100%;
    }
    .cart-section-cs .cart-collaterals {
        margin-top: 10px;
    }
    .vp-totals-table {
        padding: 20px 0 15px;
    }
    .vp-proceed-to-checkout {
        margin-top: 50px;
    }

    .vp-cart-item__actions a {
        white-space: nowrap;
    }

    .vp-cart-item__actions {
        flex-wrap: nowrap;
    }

    .contact-frm .gform-body.gform_body .gfield textarea {
        height: 60px;
        font-size: 14px;
    }
    .contact-frm .gform_footer.top_label input.gform_button.button {
        font-size: 10px !important;
    }
    .contact-frm .gform-body.gform_body input {
        font-size: 14px !important;
    }
    .contact-frm .gform_fields {
        row-gap: 15px !important;
    }

    .recent-products h2, .recent-products .price, .recent-products a.button {
        bottom: 35px;
    }

    .elementor-menu-cart__toggle span.elementor-button-text {
        display: none;
    }

    .search-modal-sec .ekit-popup-btn__has-icon svg {
        width: 16px;
        height: 16px;
    }


    .brand-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .brand-grid span {
        font-size: 14px;
    }

    .filter-cate-sec .bapf_body ul {
        display: grid;
        grid-template-columns: auto auto auto;
        place-items: center;
        justify-items: center;
        justify-content: center;
        column-gap: 11px;
        row-gap: 14px;
    }

    .filter-cate-sec .single-filter .bapf_body span.bapf_img_span {
        width: 100px !important;
        height: 100px !important;
    }

    .filter-cate-sec .bapf_body {
        margin-bottom: 00px;
    }

    .filter-cate-sec .bapf_clr_text {
        font-size: 8px !important;
        padding-bottom: 0;
    }

    .woocommerce-checkout .page-content,
    .woocommerce-cart .page-content {
        padding: 0px 15px;
    }

    .woocommerce-account .woocommerce {
        padding: 0px 15px;
    }

    .woocommerce-account .page-content {
        margin: 30px 0 40px;
    }

    .woocommerce-MyAccount-navigation ul li a {
        font-size: 11px;
    }

    .woocommerce .woocommerce-customer-details .woocommerce-column__title, .woocommerce-account .woocommerce-customer-details h2, .woocommerce-account .woocommerce-customer-details h3, section.woocommerce-order-details h2, .woocommerce-account .woocommerce-MyAccount-content h2, .woocommerce-account .woocommerce-MyAccount-content h3 {
        font-size: 14px;
    }

    .heading-bag {
        margin: 30px 0 40px;
    }

    .cart-sec {
        padding: 0 0 0;
    }

    .wp-block-woocommerce-checkout-order-summary-block .checkout-order-summary-block-fill {
        border: 0 !important;
    }

    .woocommerce-page .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-order-summary__title {
        margin-top: 0;
        border: 0;
        padding: 0;
    }
    .woocommerce div.product .product-desc form.cart .variations th label {
        font-size: 13px;
    }
    .woocommerce ul.products li.product a img {
        margin-bottom: 0;
    }

    .swiper-pagination-fraction {
        font-size: 0;
        word-spacing: -8px;
    }

    .swiper-pagination-current,
    .swiper-pagination-total {
        font-size: 15px;
        letter-spacing: -1px;
    }

    .swiper-pagination-current::after {
        content: "⁄";
        font-size: 14px;
        margin: 0 2px;
        position: relative;
        top: 3px;
    }

    span.swiper-pagination-current {
        vertical-align: super;
    }
    .swiper-pagination-total{
        vertical-align: middle;
    }

    .vp-ma-wrap {
        padding: 0px 0px 10px;


    }
}




/* ==========================================================================
   Mobile hero slider (homepage) — v2, added 2026-07-20
   The two hero images are stacked (absolute) inside their container and
   cross-fade between each other. Container is overflow:hidden, so this can
   NEVER add horizontal page scroll. Mobile only (<=767px); desktop untouched.
   Slides get the .vp-slide class from custom.js. To revert: delete this block
   + the matching block in custom.js.
   ========================================================================== */
@media (max-width: 767px) {

    /* hero wrapper = positioning context for the dots; clip any stray overflow */
    .elementor-element-07bfe38 {
        position: relative;
        overflow-x: clip;
    }

    /* image row becomes the slider stage (keeps its Elementor min-height) */
    .elementor-element-d48650d {
        position: relative !important;
        display: block !important;
        overflow: hidden !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* both images fill the stage, stacked; only the active one is visible */
    .elementor-element-d48650d > .vp-slide {
        position: absolute !important;
        top: 0; left: 0; right: 0; bottom: 0;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        opacity: 0;
        transition: opacity .6s ease;
        pointer-events: none;
    }
    .elementor-element-d48650d > .vp-slide.is-active {
        opacity: 1;
        pointer-events: auto;
    }

    /* pagination dots (injected by custom.js) */
    .vp-hero-dots {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 18px;
        z-index: 9;
        display: flex;
        justify-content: center;
        gap: 9px;
        pointer-events: none;
    }
    .vp-hero-dots button {
        pointer-events: auto;
        width: 9px;
        height: 9px;
        padding: 0;
        margin: 0;
        border: 1px solid #fff;
        border-radius: 50%;
        background: transparent;
        opacity: .7;
        cursor: pointer;
        transition: background .25s ease, opacity .25s ease;
        -webkit-appearance: none;
        appearance: none;
        box-shadow: 0 0 4px rgba(0,0,0,.35);
    }
    .vp-hero-dots button.is-active {
        background: #fff;
        opacity: 1;
    }
}

/* Never show the mobile dots on tablet/desktop */
@media (min-width: 768px) {
    .vp-hero-dots { display: none !important; }
}