@media (max-width:768px){
html,body{overflow-x:hidden;width:100%}.container{width:100%;max-width:100%;padding-left:16px;padding-right:16px}img,video,iframe{max-width:100%}
.header .container{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px;padding:8px 14px 10px}.logo{max-width:165px;margin-left:0}.logo img{height:54px!important;max-width:165px}.header-search{grid-column:1/-1;grid-row:2;width:100%;max-width:none}.header-search-form{width:100%;min-height:42px}.header-search-input{min-width:0;font-size:.9rem}.header-icons{grid-column:2;grid-row:1;display:flex!important;gap:2px}.header-icon{width:36px;height:36px;min-width:36px;font-size:1.05rem}.header-icons .header-icon[aria-label="Chat on WhatsApp"]{display:none}nav{grid-column:3;grid-row:1;min-width:40px;flex:none!important}.mobile-menu-toggle{display:flex!important;width:40px;height:40px;min-width:40px;align-items:center;justify-content:center;padding:.4rem}.nav-menu{width:min(86vw,340px)!important;max-width:340px;padding:5.5rem 20px 24px!important}.nav-menu .nav-link{min-height:48px;display:flex;align-items:center}
.section{padding-top:42px;padding-bottom:42px}.page-title{padding-top:34px!important;padding-bottom:34px!important}.page-title h1{font-size:clamp(1.8rem,8vw,2.45rem)}.section-title{margin-bottom:2rem}.section-title h2{font-size:clamp(1.65rem,7vw,2.2rem)}
.kw-hero{padding:24px 0 42px}.kw-hero .container{grid-template-columns:1fr!important;gap:26px}.kw-hero-media{order:-1}.kw-hero-copy{max-width:100%}.kw-hero-copy h1{font-size:clamp(2.15rem,10vw,3rem);line-height:1.04}.kw-hero-copy p.kw-hero-sub{font-size:.98rem}.kw-hero-cta{gap:12px}.kw-hero-badge{left:10px;bottom:10px;max-width:190px;padding:.8rem}.kw-hero-frame{aspect-ratio:4/4.7}
.age-groups-grid,.category-cards-grid,.gifting-cards-grid,.business-grid,.social-media-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}.kw-featured-grid,.story-teaser-grid,.features .feature-row{grid-template-columns:1fr!important}.kw-featured-media,.story-teaser-image{order:-1}
.product-grid,.product-carousel .carousel-track,.products.section .product-carousel .carousel-track{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}.product-card{min-width:0;overflow:hidden}.product-card .product-image{width:100%;height:auto;min-height:0}.product-card .product-info{padding:10px}.product-card h3,.product-card .product-name{font-size:.86rem}.product-actions{gap:6px}.product-actions .btn,.product-actions button{width:100%;min-height:40px;padding:.7rem .5rem;font-size:.67rem}
.shop-container{display:flex;flex-direction:column;gap:20px}.shop-sidebar{width:100%;position:static!important}.shop-products,.shop-main,.products-container{width:100%;min-width:0}.filter-toggle{width:100%;min-height:44px}
.product-container{width:100%!important;max-width:100%;margin:0!important;padding:14px!important}.product-container .row{display:flex;flex-direction:column;gap:24px}.product-container .row>[class*=col-]{width:100%!important;max-width:100%!important;flex:0 0 100%!important}.product-media-container,.product-gallery-wrapper{width:100%;max-width:100%}.product-detail h1{font-size:clamp(1.6rem,7vw,2.25rem)}
.cart-container,.checkout-container,.checkout-content{width:100%;max-width:100%;min-width:0}.cart-container{overflow-x:auto}.cart-table,.checkout-table{min-width:620px}.cart-summary,.order-summary{width:100%;max-width:100%}.cart-actions,.checkout-actions{flex-wrap:wrap}.cart-actions .btn,.checkout-actions .btn{width:100%}
input,select,textarea{max-width:100%;font-size:16px}.form-row,.form-group-row,.contact-grid,.checkout-grid{grid-template-columns:1fr!important;flex-direction:column}.form-group,.form-control,.contact-form,.checkout-form{width:100%;max-width:100%}.carousel-container,.carousel-track{max-width:100%;min-width:0}.carousel-slide{min-width:0}.testimonials-carousel,.why-us-carousel{--carousel-visible:1}.footer-grid{grid-template-columns:1fr!important;gap:24px!important}.kw-footer-top{flex-direction:column;align-items:flex-start}.whatsapp-btn{width:48px;height:48px;right:14px;bottom:14px}}
@media(max-width:480px){.container{padding-left:13px;padding-right:13px}.header .container{padding-left:11px;padding-right:11px}.logo img{height:48px!important;max-width:145px}.header-icon{width:34px;height:34px;min-width:34px}.mobile-menu-toggle{width:38px;min-width:38px;height:38px}.age-groups-grid,.category-cards-grid,.gifting-cards-grid,.business-grid,.social-media-grid,.product-grid,.product-carousel .carousel-track{gap:9px!important}.kw-hero-copy h1{font-size:clamp(2rem,10.5vw,2.55rem)}.kw-hero-cta{flex-direction:column;align-items:stretch}.kw-hero-cta .btn{width:100%}}


@media (max-width: 768px) {

    .nav-menu {
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        left: auto !important;

        width: min(82vw, 340px) !important;
        height: 100vh !important;

        transform: translateX(100%) !important;
        transition: transform 0.35s ease !important;

        z-index: 1200 !important;
        overflow-y: auto !important;
    }

    .nav-menu.active {
        transform: translateX(0) !important;
    }

    .kw-nav-backdrop {
        position: fixed !important;
        inset: 0 !important;

        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;

        z-index: 1100 !important;
    }

    body.menu-open .kw-nav-backdrop {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    body.menu-open {
        overflow: hidden !important;
    }

    .kw-nav-close {
        z-index: 1300 !important;
        cursor: pointer !important;
    }
}


/* =========================================================
   MOBILE HEADER FINAL FIX
   Logo LEFT + Wishlist HEART ALWAYS VISIBLE
   ========================================================= */

@media (max-width: 768px) {

    /* Header layout */
    .header .container {
        display: grid !important;

        grid-template-columns: 1fr auto auto !important;
        grid-template-rows: 66px 44px !important;

        grid-template-areas:
            "logo actions menu"
            "search search search" !important;

        align-items: center !important;
        gap: 0 !important;

        padding: 6px 12px 8px !important;
    }

    /* ---------------- LOGO ---------------- */

    .logo {
        grid-area: logo !important;

        justify-self: start !important;
        align-self: center !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .logo img {
        height: 58px !important;
        width: auto !important;
        max-width: 150px !important;
        object-fit: contain !important;
    }


    /* ---------------- HEART + CART ---------------- */

    .header-icons {
        grid-area: actions !important;

        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;

        gap: 4px !important;
        min-width: 0 !important;
        width: auto !important;
    }

    .header-icon {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        font-size: 1.15rem !important;
    }

    /* ❤️ ALWAYS SHOW WISHLIST HEART */
    .header-icon.kw-wishlist {
        color: var(--primary-color) !important;
        background: transparent !important;
        border: none !important;
    }

    .header-icon.kw-wishlist i {
        display: inline-block !important;

        font-family: "Font Awesome 5 Free" !important;
        font-weight: 900 !important;

        color: var(--primary-color) !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .header-icon.kw-wishlist i::before {
        content: "\f004" !important;
        font-family: "Font Awesome 5 Free" !important;
        font-weight: 900 !important;
    }

    /* Don't change heart just because wishlist has items */
    .header-icon.kw-wishlist.is-active i {
        color: var(--primary-color) !important;
    }


    /* ---------------- HAMBURGER ---------------- */

    nav {
        grid-area: menu !important;

        width: 42px !important;
        min-width: 42px !important;

        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;

        order: unset !important;
    }

    .mobile-menu-toggle {
        display: inline-flex !important;

        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;

        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* ---------------- SEARCH ---------------- */

    .header-search {
        grid-area: search !important;

        width: 100% !important;
        max-width: none !important;

        display: flex !important;
        align-items: center !important;

        margin: 0 !important;
    }

    .header-search-toggle {
        display: inline-flex !important;

        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;

        align-items: center !important;
        justify-content: flex-start !important;

        padding: 0 !important;
    }

    .header-search-form {
        top: calc(100% + 4px) !important;
    }


    /* WhatsApp hide on mobile header */
    .header-icons .header-icon[aria-label="Chat on WhatsApp"] {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .header-icon:hover,
    .header-icon:active,
    .header-icon:focus {
        background: transparent !important;
        color: var(--primary-color) !important;
        transform: none !important;
        box-shadow: none !important;
    }

    .kw-wishlist:hover,
    .kw-wishlist:active,
    .kw-wishlist:focus {
        background: transparent !important;
        color: var(--primary-color) !important;
    }
}

/* =========================================================
   MOBILE SHOP DROPDOWN — PREMIUM MENU
   ========================================================= */

@media (max-width: 992px) {

    .nav-menu .nav-item.kw-has-dropdown {
        width: 100% !important;
    }

    .nav-menu .nav-item.kw-has-dropdown > .nav-link {
        position: relative !important;

        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;

        width: 100% !important;
        min-height: 52px !important;
    }

    /* Arrow */
    .nav-menu .kw-dropdown-caret {
        position: relative !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 42px !important;
        height: 42px !important;

        flex-shrink: 0 !important;

        cursor: pointer !important;
        z-index: 20 !important;
    }

    .nav-menu .kw-dropdown-caret i {
        transition: transform 0.25s ease !important;
    }

    .nav-menu
    .nav-item.kw-has-dropdown.kw-open
    .kw-dropdown-caret i {
        transform: rotate(180deg) !important;
    }


    /* ==========================================
       CLOSED
       ========================================== */

    .nav-menu .kw-megamenu {
        display: none !important;

        position: static !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 12px 0 14px 14px !important;

        background: transparent !important;

        border: 0 !important;
        box-shadow: none !important;

        opacity: 1 !important;
        visibility: visible !important;

        transform: none !important;
    }


    /* ==========================================
       OPEN
       ========================================== */

    .nav-menu
    .nav-item.kw-has-dropdown.kw-open
    > .kw-megamenu {

        display: block !important;

        position: static !important;

        width: 100% !important;
        max-width: 100% !important;

        height: auto !important;

        overflow: visible !important;

        padding: 8px 0 14px 14px !important;

        background: #f8eee0 !important;

        border-radius: 0 !important;

        opacity: 1 !important;
        visibility: visible !important;

        transform: none !important;

        animation: kwMobileDropdownOpen 0.22s ease forwards;
    }


    /* ==========================================
       COLUMNS
       ========================================== */

    .nav-menu .kw-megamenu-inner {
        display: grid !important;

        grid-template-columns: 1fr !important;

        gap: 0 !important;

        width: 100% !important;
    }

    .nav-menu .kw-megamenu-col {
        display: block !important;

        width: 100% !important;

        padding: 0 !important;
        margin: 0 !important;
    }


    /* ==========================================
       DROPDOWN HEADINGS
       ========================================== */

    .nav-menu .kw-megamenu-title,
    .nav-menu .kw-megamenu-heading {
        display: block !important;

        margin: 8px 0 4px !important;

        font-size: 0.65rem !important;

        font-weight: 700 !important;

        letter-spacing: 0.12em !important;

        color: #8a4b28 !important;
    }


    /* ==========================================
       DROPDOWN LINKS
       ========================================== */

    .nav-menu .kw-megamenu a {
        display: flex !important;

        align-items: center !important;

        width: 100% !important;

        min-height: 40px !important;

        padding: 8px 12px !important;

        color: #4a2b1b !important;

        background: transparent !important;

        font-size: 0.78rem !important;

        line-height: 1.3 !important;

        text-decoration: none !important;

        border-bottom: 1px solid rgba(120, 75, 40, 0.10) !important;
    }

    .nav-menu .kw-megamenu a:hover,
    .nav-menu .kw-megamenu a:active {
        color: #8a4b28 !important;

        background: rgba(138, 75, 40, 0.07) !important;
    }


    /* ==========================================
       ARROW
       ========================================== */

    .nav-menu .kw-dropdown-caret {
        color: #8a4b28 !important;
    }


    @keyframes kwMobileDropdownOpen {
        from {
            opacity: 0;
            transform: translateY(-5px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}

/* =========================================================
   MOBILE PRODUCT CATEGORY TABS
   Horizontal swipe without affecting product cards
   ========================================================= */

@media (max-width: 768px) {

    .product-group-tabs,
    .category-tabs {
        width: 100%;
        max-width: 100%;
        min-width: 0;

        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: center;

        gap: 10px;

        overflow-x: auto;
        overflow-y: hidden;

        padding: 8px 4px 14px;

        -webkit-overflow-scrolling: touch;
        touch-action: pan-x;

        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .product-group-tabs::-webkit-scrollbar,
    .category-tabs::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    .product-group-tab,
    .category-tabs button,
    .category-tabs .tab,
    .category-tabs a {
        flex: 0 0 auto;
        white-space: nowrap;
    }
}

/* =========================================================
   MOBILE SOCIAL MEDIA BUTTON FIX
   ========================================================= */

@media (max-width: 768px) {

    .social-media-follow {
        width: 100%;
        max-width: none;
        margin-top: auto;
    }

    .social-media-follow .btn {
        width: 100%;
        min-height: 40px;
        height: 40px;

        padding: 8px 6px;

        display: inline-flex;
        align-items: center;
        justify-content: center;

        gap: 5px;

        font-size: 0.68rem;
        line-height: 1;

        white-space: nowrap;
        overflow: hidden;
        text-overflow: clip;

        box-sizing: border-box;
    }

    .social-media-follow .btn i {
        flex: 0 0 auto;
        font-size: 0.9rem;
    }

    .social-media-follow .btn span {
        display: inline-block;
        white-space: nowrap;
    }
}