
/* Mobile-only refactor: do not affect desktop */
html.mobile-menu-active,
body.mobile-menu-active{
  overflow: hidden;
}

@media (max-width: 768px){

  /* -------------------------
     Promo strip + fixed header
  ------------------------- */
  .announcement-bar{
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 9px 14px;
    text-align: left;
    font-size: .56rem;
    line-height: 1.2;
    letter-spacing: .12em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    z-index: 120;
  }

  .site-header{
    top: 42px !important;
    height: 64px !important;
    padding: 0 16px !important;
    z-index: 110 !important;
  }

  .site-header.scrolled{
    top: 0 !important;
  }

  .header-logo{
    font-size: 1.15rem !important;
  }

  .header-actions{
    gap: .55rem !important;
  }

  .header-action-btn:not(.cart-btn),
  .header-nav-wrap{
    display: none !important;
  }

  .mobile-menu-btn{
    display: inline-flex !important;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
  }

  /* -------------------------
     Mobile menu
  ------------------------- */
  .mobile-menu{
    background: rgba(10,10,10,.985);
    padding: 94px 16px 22px;
    justify-content: flex-start;
    align-items: stretch;
    gap: .55rem;
    overflow-y: auto;
  }

  .mobile-menu-close{
    top: 50px;
    right: 12px;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .mobile-menu-links{
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: .55rem;
    width: 100%;
  }

  .mobile-menu .mobile-menu-link{
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: .95rem 1rem !important;
    border: 1px solid rgba(245,241,234,.10);
    border-radius: 16px;
    background: rgba(255,255,255,.03);
    color: var(--ivory) !important;
    font-family: var(--font-family-body) !important;
    font-size: .92rem !important;
    font-weight: 500 !important;
    letter-spacing: .14em !important;
    line-height: 1.2 !important;
    text-transform: uppercase;
    text-decoration: none !important;
  }

  .mobile-menu .mobile-menu-group{
    border: 1px solid rgba(245,241,234,.10);
    border-radius: 16px;
    background: rgba(255,255,255,.03);
    padding: 0 1rem;
    overflow: hidden;
  }

  .mobile-menu .mobile-menu-toggle{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    padding: .95rem 0 !important;
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(245,241,234,.10);
    color: var(--ivory) !important;
    font-family: var(--font-family-body) !important;
    font-size: .92rem !important;
    font-weight: 500 !important;
    letter-spacing: .14em !important;
    line-height: 1.2 !important;
    text-transform: uppercase;
    text-align: left;
    cursor: pointer;
  }

  .mobile-menu .mobile-menu-group:not(.is-open) > .mobile-menu-toggle{
    border-bottom-color: transparent;
  }

  .mobile-menu .mobile-menu-toggle-label{
    display: block;
  }

  .mobile-menu .mobile-menu-toggle-icon,
  .mobile-menu .mobile-sub-menu-toggle-icon{
    color: var(--beige);
    font-size: .95rem;
    line-height: 1;
    flex: 0 0 auto;
  }

  .mobile-menu .mobile-sub-menu{
    display: block;
    padding: .1rem 0 .7rem;
  }

  .mobile-menu .mobile-sub-menu[hidden],
  .mobile-menu .mobile-sub-menu-list[hidden]{
    display: none !important;
  }

  .mobile-menu .mobile-sub-menu-group{
    border-top: 1px solid rgba(245,241,234,.07);
  }

  .mobile-menu .mobile-sub-menu-toggle{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    padding: .7rem 0 !important;
    background: transparent;
    border: 0;
    color: rgba(245,241,234,.92);
    font-family: var(--font-family-body) !important;
    font-size: .68rem !important;
    font-weight: 500 !important;
    letter-spacing: .16em !important;
    line-height: 1.2 !important;
    text-transform: uppercase;
    text-align: left;
    cursor: pointer;
  }

  .mobile-menu .mobile-sub-menu-title{
    color: var(--accent);
  }

  .mobile-menu .mobile-sub-menu-list{
    display: grid;
    gap: .45rem;
    padding: 0 0 .8rem;
  }

  .mobile-menu .mobile-sub-menu-link{
    display: block;
    padding: .12rem 0 .12rem .85rem !important;
    color: rgba(245,241,234,.84) !important;
    font-family: var(--font-family-body) !important;
    font-size: .84rem !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    text-decoration: none !important;
  }

  .mobile-menu .mobile-sub-menu-link:hover{
    color: var(--ivory) !important;
  }

  .mobile-menu .mobile-menu-social{
    display: flex;
    gap: .7rem;
    margin-top: .75rem;
    justify-content: center;
  }

  .mobile-menu .mobile-menu-social .social-link{
    width: 36px;
    height: 36px;
    font-size: .6rem !important;
    letter-spacing: .05em;
  }

  /* -------------------------
     Section spacing + hierarchy
  ------------------------- */
  .categories-section,
  .products-section,
  .testimonials-section,
  .single-product-shell,
  .shop-archive-section,
  .footer{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .categories-section,
  .products-section,
  .testimonials-section{
    padding-top: 72px !important;
    padding-bottom: 72px !important;
  }

  .single-product-shell{
    padding-top: 110px !important;
    padding-bottom: 56px !important;
  }

  .section-label{
    margin-bottom: .5rem !important;
    font-size: .6rem !important;
    letter-spacing: .16em !important;
  }

  .categories-main-heading,
  .products-heading,
  .bestsellers-heading,
  .testimonials-heading{
    font-family: var(--font-family-body) !important;
    font-size: 1.35rem !important;
    font-weight: 600 !important;
    line-height: 1.1 !important;
    text-transform: none !important;
    letter-spacing: -0.02em !important;
  }

  .categories-heading-block,
  .products-header{
    margin-bottom: 1.25rem !important;
    gap: 1rem !important;
    align-items: flex-start !important;
  }

  .categories-description{
    font-size: .86rem !important;
    line-height: 1.6 !important;
  }

  .ornamental-divider{
    margin-bottom: 1.5rem !important;
  }

  /* -------------------------
     Home categories
  ------------------------- */
  .categories-grid{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 12px !important;
  }

  .category-card{
    aspect-ratio: .82 !important;
    min-height: 0 !important;
    border-radius: 16px;
    overflow: hidden;
  }

  .category-card-content{
    padding: .8rem !important;
  }

  .category-emoji{
    font-size: 2rem !important;
    padding-bottom: 1.2rem !important;
  }

  .category-name{
    font-family: var(--font-family-body) !important;
    font-size: .92rem !important;
    font-weight: 600 !important;
    line-height: 1.22 !important;
    letter-spacing: -0.01em !important;
  }

  .category-count{
    font-size: .68rem !important;
    letter-spacing: .12em !important;
  }

  /* -------------------------
     Home products
  ------------------------- */
  .products-grid{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 12px !important;
  }

  .product-card{
    min-width: 0;
    border-radius: 16px;
    overflow: hidden;
  }

  .product-img-wrap{
    aspect-ratio: 1 / 1.02 !important;
  }

  .product-badge{
    top: .6rem !important;
    left: .6rem !important;
    font-size: .46rem !important;
    padding: .24rem .5rem !important;
  }

  .product-wishlist{
    top: .6rem !important;
    right: .6rem !important;
  }

  .product-actions{
    display: none !important;
  }

  .product-info{
    padding: .8rem !important;
  }

  .product-category{
    font-size: .56rem !important;
    letter-spacing: .14em !important;
  }

  .product-name{
    font-family: var(--font-family-body) !important;
    font-size: .9rem !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    margin-bottom: .35rem !important;
    text-decoration: none !important;
  }

  .product-desc{
    display: none !important;
  }

  .product-price{
    font-family: var(--font-family-body) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
  }

  .product-price-old{
    font-size: .68rem !important;
  }

  .product-price-row{
    gap: .5rem;
  }

  .product-price-row > a{
    display: none !important;
  }

  /* -------------------------
     Best sellers
  ------------------------- */
  .bestsellers-section{
    padding: 72px 0 !important;
  }

  .bestsellers-header{
    padding: 0 16px !important;
    margin-bottom: 1rem !important;
    align-items: flex-start !important;
  }

  .carousel-controls{
    display: none !important;
  }

  .carousel-track{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 12px !important;
    overflow: visible !important;
    padding: 0 16px !important;
  }

  .carousel-item{
    min-width: 0 !important;
    flex: none !important;
    border-radius: 16px;
    overflow: hidden;
    transform: none !important;
  }

  .carousel-img-wrap{
    aspect-ratio: 1 / 1.02 !important;
    font-size: 2rem !important;
  }

  .carousel-item-info{
    padding: .75rem !important;
  }

  .carousel-item-name{
    font-family: var(--font-family-body) !important;
    font-size: .88rem !important;
    font-weight: 600 !important;
    line-height: 1.22 !important;
    text-decoration: none !important;
  }

  .carousel-item-price{
    font-family: var(--font-family-body) !important;
    font-size: .92rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
  }

  /* -------------------------
     Testimonials
  ------------------------- */
  .testimonials-grid{
    display: grid !important;
    grid-auto-flow: column;
    grid-auto-columns: 84%;
    gap: 12px !important;
    overflow-x: auto;
    padding-bottom: 2px;
    scroll-snap-type: x proximity;
  }

  .testimonials-grid::-webkit-scrollbar{
    display: none;
  }

  .testimonial-card{
    padding: 1rem !important;
    border-radius: 16px;
    scroll-snap-align: start;
  }

  .testimonial-quote-mark{
    font-size: 2.2rem !important;
    margin-bottom: .75rem !important;
  }

  .testimonial-text{
    font-family: var(--font-family-body) !important;
    font-style: normal !important;
    font-size: .92rem !important;
    line-height: 1.55 !important;
    margin-bottom: 1.2rem !important;
  }

  .testimonial-author{
    gap: .75rem !important;
  }

  .testimonial-avatar{
    width: 32px !important;
    height: 32px !important;
    font-family: var(--font-family-body) !important;
    font-size: .82rem !important;
  }

  /* -------------------------
     Shop page mobile layout
  ------------------------- */
  .shop-shell{
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
  }

  .shop-main{
    order: 1;
  }

  .shop-sidebar{
    order: 2;
    position: static !important;
    top: auto !important;
  }

  .shop-toolbar{
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 1rem !important;
    padding: 1rem !important;
    border-radius: 18px;
  }

  .shop-toolbar-copy{
    max-width: none !important;
  }

  .shop-toolbar-controls{
    width: 100%;
    justify-content: flex-start !important;
  }

  .shop-filter-card{
    padding: 1rem !important;
    border-radius: 16px;
  }

  .woocommerce ul.products,
  .woocommerce-page ul.products{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 12px !important;
  }

  .shop-product-card{
    border-radius: 16px;
    overflow: hidden;
  }

  .shop-product-image-link{
    aspect-ratio: 1 / 1.02 !important;
  }

  .shop-product-actions{
    display: none !important;
  }

  .shop-product-info{
    padding: .85rem !important;
  }

  .shop-product-title{
    font-family: var(--font-family-body) !important;
    font-size: .9rem !important;
    font-weight: 600 !important;
    line-height: 1.24 !important;
    text-decoration: none !important;
  }

  .shop-product-description{
    display: none !important;
  }

  .shop-product-price{
    font-family: var(--font-family-body) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
  }

  .shop-add-to-cart,
  .shop-add-to-cart.button{
    padding: .75rem .75rem !important;
    font-size: .56rem !important;
    letter-spacing: .14em !important;
  }

  /* -------------------------
     Single product mobile
  ------------------------- */
  .single-product-layout{
    gap: 1.1rem !important;
  }

  .single-product-main-media img{
    aspect-ratio: 1 / 1 !important;
  }

  .single-product-thumbs{
    margin-top: 8px !important;
    gap: 8px !important;
    grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  }

  .single-product-summary{
    gap: .75rem !important;
  }

  .single-product-category{
    font-size: .62rem !important;
    letter-spacing: .18em !important;
  }

  .single-product-title{
    font-family: var(--font-family-body) !important;
    font-size: 1.45rem !important;
    font-weight: 600 !important;
    line-height: 1.08 !important;
  }

  .single-product-price{
    font-family: var(--font-family-body) !important;
    font-size: 1.1rem !important;
    font-weight: 600 !important;
  }

  .single-product-excerpt,
  .single-product-meta,
  .single-product-panel-copy,
  .single-product-delivery p{
    font-size: .88rem !important;
    line-height: 1.6 !important;
  }

  .single-product-purchase{
    padding: 1rem !important;
    border-radius: 16px;
  }

  .single-product-purchase form.cart{
    gap: .75rem !important;
  }

  .single-product-purchase .quantity .qty{
    width: 74px !important;
    padding: .7rem .75rem !important;
  }

  .single-product-purchase .single_add_to_cart_button{
    padding: .82rem 1rem !important;
    font-size: .62rem !important;
  }

  .single-product-highlights{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 10px !important;
  }

  .single-product-highlight{
    padding: .85rem .9rem !important;
    min-height: 0;
    border-radius: 16px;
  }

  .single-product-highlight h3{
    font-family: var(--font-family-body) !important;
    font-size: .86rem !important;
    font-weight: 600 !important;
  }

  .single-product-highlight p{
    font-size: .78rem !important;
    line-height: 1.45 !important;
  }

  .single-product-panels{
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
    margin-top: 1.5rem !important;
  }

  .single-product-panel{
    padding: 1rem !important;
    border-radius: 16px;
  }

  .single-product-panel-title{
    font-family: var(--font-family-body) !important;
    font-size: .96rem !important;
    font-weight: 600 !important;
  }

  .single-product-delivery-row{
    padding-bottom: .75rem !important;
  }

  .single-product-related{
    margin-top: 1.75rem !important;
  }

  .single-product-related-head{
    margin-bottom: .85rem !important;
    align-items: center !important;
  }

  .single-product-related-head .btn-outline{
    display: none !important;
  }

  .single-product-related-head h2{
    font-family: var(--font-family-body) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
  }

  .single-product-related-grid{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 12px !important;
  }

  .single-product-related-card{
    display: block !important;
    border-radius: 16px;
    overflow: hidden;
  }

  .single-product-related-media img{
    aspect-ratio: 1 / 1 !important;
  }

  .single-product-related-info{
    padding: .7rem .75rem !important;
  }

  .single-product-related-category{
    font-size: .56rem !important;
    letter-spacing: .14em !important;
  }

  .single-product-related-name{
    font-family: var(--font-family-body) !important;
    font-size: .82rem !important;
    font-weight: 600 !important;
    line-height: 1.24 !important;
    margin-bottom: .25rem !important;
  }

  .single-product-related-price{
    font-family: var(--font-family-body) !important;
    font-size: .84rem !important;
    font-weight: 600 !important;
  }

  /* -------------------------
     Footer mobile
  ------------------------- */
  .footer{
    padding-top: 72px !important;
    padding-bottom: 0 !important;
  }

  .footer-top{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 1.25rem 1rem !important;
    padding-bottom: 1.5rem !important;
  }

  .footer-top > div:first-child{
    grid-column: 1 / -1;
  }

  .footer-col-title{
    margin-bottom: .75rem !important;
    font-size: .66rem !important;
  }

  .footer-links{
    gap: .45rem !important;
  }

  .footer-links a{
    font-size: .78rem !important;
  }

  .footer-social{
    gap: .75rem !important;
  }

  .footer-bottom{
    min-height: 0 !important;
    padding-top: 1.2rem !important;
  }

  .footer-bg-text{
    display: none !important;
  }

  .footer-copyright{
    margin-left: 0 !important;
    padding-bottom: 1.2rem !important;
    font-size: .58rem !important;
  }
}

@media (max-width: 390px){
  .testimonials-grid{
    grid-auto-columns: 90%;
  }

  .single-product-highlights{
    grid-template-columns: 1fr !important;
  }
}


/* =========================================
   Additional mobile cleanup: footer tabs + shop search first
   Desktop should remain unchanged
   ========================================= */
.shop-mobile-search{
  display:none;
}

.footer-mobile-nav{
  display:none;
}

@media (max-width: 768px){
  /* show search before products and hide noisy sidebar cards */
  .shop-mobile-search{
    display:block;
    margin-bottom:1rem;
  }

  .shop-mobile-search .woocommerce-product-search{
    display:flex;
    gap:0;
  }

  .shop-mobile-search .search-field{
    width:100%;
    background:rgba(245,241,234,.06);
    border:1px solid rgba(245,241,234,.18);
    color:var(--ivory);
    padding:.85rem 1rem;
    font-family:var(--font-family-body);
    font-size:.88rem;
    outline:none;
    border-radius:16px 0 0 16px;
  }

  .shop-mobile-search button{
    background:var(--accent);
    border:1px solid var(--accent);
    color:var(--ivory);
    padding:.85rem 1rem;
    letter-spacing:.15em;
    text-transform:uppercase;
    font-family:var(--font-family-body);
    font-size:.6rem;
    font-weight:500;
    border-radius:0 16px 16px 0;
  }

  .shop-shell{
    grid-template-columns:1fr !important;
  }

  .shop-sidebar{
    display:none !important;
  }

  .shop-main{
    order:1 !important;
  }

  /* footer mobile tabs instead of stacked columns */
  .footer-top{
    grid-template-columns:1fr !important;
    gap:1rem !important;
    padding-bottom:1.25rem !important;
  }

  .footer-brand-block{
    display:block;
  }

  .footer-desktop-column{
    display:none !important;
  }

  .footer-mobile-nav{
    display:block;
    margin-top:1rem;
  }

  .footer-mobile-tab-row{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
  }

  .footer-mobile-tab{
    appearance:none;
    border:1px solid rgba(245,241,234,.12);
    background:rgba(255,255,255,.03);
    color:var(--ivory);
    border-radius:14px;
    padding:.8rem .5rem;
    font-family:var(--font-family-body);
    font-size:.68rem;
    font-weight:600;
    letter-spacing:.12em;
    line-height:1.15;
    text-transform:uppercase;
    text-align:center;
  }

  .footer-mobile-tab.is-open{
    background:rgba(184,149,106,.14);
    border-color:rgba(184,149,106,.35);
    color:var(--beige);
  }

  .footer-mobile-panels{
    margin-top:.75rem;
  }

  .footer-mobile-panel{
    border:1px solid rgba(245,241,234,.1);
    background:rgba(255,255,255,.03);
    border-radius:16px;
    padding:.9rem 1rem;
  }

  .footer-mobile-links-list{
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    gap:.55rem;
  }

  .footer-mobile-links-list a{
    color:rgba(245,241,234,.85);
    font-family:var(--font-family-body);
    font-size:.82rem;
    font-weight:400;
    line-height:1.3;
    text-decoration:none;
  }

  .footer-mobile-links-list a:hover{
    color:var(--ivory);
  }
}


/* =========================================
   Latest mobile cleanup only
   3) footer mobile panels should scroll fully into view
   2) keep quantity controls large enough on mobile too
   ========================================= */
@media (max-width: 768px){
  .footer-mobile-panels{
    margin-top: .75rem;
    padding-bottom: .35rem;
  }

  .single-product-purchase .quantity .qty{
    width: 58px !important;
    min-width: 58px !important;
    height: 44px !important;
    font-size: .96rem !important;
  }

  .single-product-purchase .quantity .qty-button{
    width: 42px !important;
    min-width: 42px !important;
    height: 44px !important;
    font-size: 1.06rem !important;
  }
}


/* =========================================
   Focused fix: mobile Shop submenu labels
   ========================================= */
@media (max-width: 768px){
  .mobile-menu-group{
    border: 1px solid rgba(245,241,234,.10);
    border-radius: 16px;
    background: rgba(255,255,255,.03);
    padding: 0 1rem;
    overflow: hidden;
  }

  .mobile-menu-group-head,
  .mobile-sub-menu-row{
    display: flex;
    align-items: center;
    gap: .75rem;
  }

  .mobile-menu-link-parent{
    flex: 1 1 auto;
    width: auto !important;
    border: 0 !important;
    background: transparent !important;
    padding: .95rem 0 !important;
  }

  .mobile-menu-inline-toggle{
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    color: var(--beige);
    cursor: pointer;
  }

  .mobile-menu-group:not(.is-open) > .mobile-menu-group-head .mobile-menu-link-parent{
    border-bottom: 0 !important;
  }

  .mobile-menu-group.is-open > .mobile-menu-group-head{
    border-bottom: 1px solid rgba(245,241,234,.10);
  }

  .mobile-sub-menu{
    display: block;
    padding: .1rem 0 .7rem;
  }

  .mobile-sub-menu-group{
    border-top: 1px solid rgba(245,241,234,.07);
  }

  .mobile-sub-menu-heading-link{
    flex: 1 1 auto;
    display: block;
    padding: .7rem 0 !important;
    color: var(--accent) !important;
    font-family: var(--font-family-body) !important;
    font-size: .68rem !important;
    font-weight: 500 !important;
    letter-spacing: .16em !important;
    line-height: 1.2 !important;
    text-transform: uppercase;
    text-decoration: none !important;
  }

  .mobile-sub-menu-heading-link:hover{
    color: var(--beige) !important;
  }

  .mobile-sub-menu-toggle{
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
  }

  .mobile-sub-menu-list{
    display: grid;
    gap: .45rem;
    padding: 0 0 .8rem;
  }

  .mobile-sub-menu-link{
    display: block;
    padding: .12rem 0 .12rem .85rem !important;
    color: rgba(245,241,234,.84) !important;
    font-family: var(--font-family-body) !important;
    font-size: .84rem !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    text-decoration: none !important;
  }
}
