/* v1.0.8 PWA/mobile optimisation layer - intentionally scoped to mobile/small screens */
:root{
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
}

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
}

body{
  padding-left:var(--safe-left);
  padding-right:var(--safe-right);
}

button,
input,
select,
textarea{
  font:inherit;
}

.pwa-install-banner{
  position:fixed;
  left:max(14px, var(--safe-left));
  right:max(14px, var(--safe-right));
  bottom:max(14px, var(--safe-bottom));
  z-index:9998;
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 14px 14px 16px;
  border:1px solid #ead8ca;
  border-radius:20px;
  background:#fffdfb;
  box-shadow:0 18px 50px rgba(63,48,43,.18);
  color:#5e646b;
}

.pwa-install-banner strong{
  display:block;
  color:#2d2d2d;
  line-height:1.2;
}

.pwa-install-banner span{
  display:block;
  font-size:12px;
  line-height:1.35;
}

.pwa-install-banner [data-pwa-install]{
  margin-left:auto;
  border:1px solid #c9a167;
  background:#fff7ef;
  color:#6d4a36;
  border-radius:999px;
  min-height:38px;
  padding:0 14px;
  font-weight:800;
}

.pwa-install-banner [data-pwa-dismiss]{
  width:34px;
  height:34px;
  border:1px solid #ead8ca;
  background:#fff;
  border-radius:999px;
  color:#6d4a36;
  font-size:22px;
  line-height:1;
}

.offline-toast{
  position:fixed;
  left:50%;
  bottom:max(86px, calc(20px + var(--safe-bottom)));
  transform:translateX(-50%) translateY(20px);
  z-index:9999;
  max-width:calc(100vw - 32px);
  padding:11px 16px;
  border-radius:999px;
  background:#3f302b;
  color:#fff;
  box-shadow:0 14px 35px rgba(0,0,0,.18);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
  font-size:13px;
  font-weight:700;
}

.offline-toast.is-visible{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

@media (max-width: 860px){
  .container{
    width:min(100% - 28px, 760px);
  }

  .top-strip{
    height:auto;
  }

  .strip-inner{
    min-height:44px;
    height:auto;
    grid-template-columns:1fr;
    gap:6px;
    padding:8px 0;
    text-align:center;
  }

  .fixed-socials{
    justify-content:center;
    order:2;
  }

  .strip-address{
    font-size:11px;
    line-height:1.35;
  }

  .strip-email{
    text-align:center;
    font-size:12px;
  }

  .brand-inner{
    height:auto;
    min-height:92px;
    padding:18px 0;
  }

  .logo img{
    width:min(235px, 68vw);
  }

  .header-icons{
    right:0;
    top:50%;
    transform:translateY(-50%);
    gap:8px;
  }

  .nav-bar,
  .nav-inner{
    height:auto;
  }

  .nav-inner{
    justify-content:stretch;
    padding:10px 0;
  }

  .menu-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-height:44px;
    border:1px solid #ead8ca;
    border-radius:999px;
    background:#fffaf6;
    color:#6d4a36;
    font-weight:800;
  }

  .main-nav{
    display:none;
    position:absolute;
    left:14px;
    right:14px;
    top:auto;
    margin-top:54px;
    z-index:50;
    background:#fff;
    border:1px solid #ead8ca;
    border-radius:18px;
    box-shadow:0 18px 45px rgba(63,48,43,.13);
    padding:10px;
  }

  .nav-bar.is-open .main-nav,
  .main-nav.is-open{
    display:grid;
    gap:4px;
  }

  .main-nav a{
    line-height:1.25;
    min-height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    font-size:14px;
  }

  .main-nav a:hover,
  .main-nav a.active{
    background:#fff7ef;
  }

  .home-hero-slider{
    padding:18px 0 26px !important;
  }

  .home-hero-slider .container{
    width:100% !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  .home-hero-carousel{
    width:100% !important;
    min-height:auto !important;
    aspect-ratio:1536/643 !important;
  }

  .home-panels{
    padding-bottom:38px;
  }

  .info-panel,
  .info-panel.image-left{
    grid-template-columns:1fr !important;
    gap:22px;
    padding:26px 20px;
    margin-bottom:20px;
    border-radius:18px;
  }

  .info-panel.image-left .panel-image{
    order:2;
  }

  .info-panel.image-left .panel-copy{
    order:1;
  }

  .panel-copy h2{
    font-size:24px;
    margin-bottom:12px;
  }

  .panel-copy p{
    font-size:14px;
    line-height:1.7;
  }

  .panel-image img{
    width:min(230px, 76vw);
    height:min(230px, 76vw);
  }

  .site-footer{
    padding-bottom:calc(34px + var(--safe-bottom));
  }

  .footer-grid{
    grid-template-columns:1fr !important;
    text-align:center;
    gap:24px;
  }

  .footer-column a{
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .footer-bottom{
    flex-direction:column;
    gap:6px;
    text-align:center;
    padding:14px 18px calc(14px + var(--safe-bottom));
  }

  .modal-form,
  .admin-modal,
  .site-modal{
    max-width:calc(100vw - 24px) !important;
  }
}

@media (max-width: 520px){
  body{
    font-size:14px;
  }

  .container{
    width:calc(100% - 24px);
  }

  .header-icons svg{
    width:18px;
    height:18px;
  }

  .header-icons .basket-count{
    font-size:13px;
  }

  .pwa-install-banner{
    align-items:flex-start;
  }

  .pwa-install-banner [data-pwa-install]{
    padding:0 12px;
  }
}


/* v1.0.9 mobile-only header and homepage hero refinements */
@media (max-width: 860px){
  body:has(.home-hero-slider) .home-hero-slider{
    display:none !important;
  }

  .top-strip{
    display:block !important;
    background:#9a8584 !important;
  }

  .strip-inner{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:12px !important;
    min-height:46px !important;
    padding:7px 0 !important;
  }

  .fixed-socials,
  .strip-address{
    display:none !important;
  }

  .strip-email{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:34px !important;
    max-width:calc(100vw - 126px) !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    color:#fff !important;
    text-align:left !important;
    font-size:12px !important;
    font-weight:800 !important;
    letter-spacing:.04em !important;
  }

  .brand-inner{
    justify-content:center !important;
    min-height:86px !important;
    padding:16px 0 !important;
  }

  .brand-header .header-icons{
    position:static !important;
    transform:none !important;
    right:auto !important;
    top:auto !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:9px !important;
    color:#fff !important;
    flex:0 0 auto !important;
  }

  .brand-header .header-icons a,
  .brand-header .header-icons .basket-count{
    color:#fff !important;
  }

  .brand-header .header-icons svg{
    width:18px !important;
    height:18px !important;
    fill:#fff !important;
  }

  .brand-header .header-icons .basket-count{
    font-size:12px !important;
    margin-left:-4px !important;
  }

  .mobile-strip-icons{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:9px !important;
    flex:0 0 auto !important;
  }

  .brand-header .header-icons:not(.mobile-strip-icons){
    color:#000 !important;
  }

  .brand-header .header-icons:not(.mobile-strip-icons) a,
  .brand-header .header-icons:not(.mobile-strip-icons) .basket-count{
    color:#000 !important;
  }

  .brand-header .header-icons:not(.mobile-strip-icons) svg{
    fill:#000 !important;
  }
}

@media (min-width: 861px){
  .mobile-strip-icons{
    display:flex;
  }
}


/* v1.0.10 mobile-only header/footer polish */
@media (max-width: 860px){
  .top-strip{
    background:#9a8584 !important;
    color:#fff !important;
  }

  .strip-inner{
    width:calc(100% - 24px) !important;
    min-height:48px !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    padding:6px 0 !important;
  }

  .strip-email{
    flex:1 1 auto !important;
    min-width:0 !important;
    max-width:none !important;
    justify-content:flex-start !important;
    color:#fff !important;
    font-size:12px !important;
    line-height:1.2 !important;
    letter-spacing:.02em !important;
  }

  .strip-email,
  .strip-email:visited,
  .strip-email:hover{
    color:#fff !important;
  }

  .mobile-strip-icons{
    flex:0 0 auto !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:12px !important;
    margin-left:8px !important;
    color:#fff !important;
  }

  .mobile-strip-icons a,
  .mobile-strip-icons a:visited,
  .mobile-strip-icons .basket-count{
    color:#fff !important;
    text-decoration:none !important;
  }

  .mobile-strip-icons svg,
  .mobile-strip-icons a svg{
    width:19px !important;
    height:19px !important;
    fill:#fff !important;
    color:#fff !important;
  }

  .mobile-strip-icons .basket-count{
    font-size:12px !important;
    font-weight:800 !important;
    line-height:1 !important;
    margin-left:-8px !important;
  }

  .brand-header .header-icons.mobile-strip-icons{
    position:static !important;
    transform:none !important;
  }

  .brand-inner{
    min-height:82px !important;
    padding:14px 0 !important;
  }

  .site-footer{
    padding:34px 0 24px !important;
  }

  .site-footer .container,
  .footer-grid{
    width:calc(100% - 28px) !important;
  }

  .footer-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:18px !important;
    text-align:center !important;
    align-items:center !important;
  }

  .footer-logo{
    display:flex !important;
    justify-content:center !important;
    margin-bottom:4px !important;
  }

  .footer-logo img{
    max-width:min(245px, 78vw) !important;
    height:auto !important;
  }

  .footer-column{
    width:100% !important;
    padding:18px 16px !important;
    border:1px solid rgba(255,255,255,.22) !important;
    border-radius:18px !important;
    background:rgba(255,255,255,.06) !important;
  }

  .footer-column h3{
    margin:0 0 10px !important;
    font-size:15px !important;
    line-height:1.25 !important;
  }

  .footer-column a{
    min-height:38px !important;
    padding:7px 8px !important;
    justify-content:center !important;
    font-size:13px !important;
    line-height:1.25 !important;
  }

  .footer-bottom{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:4px !important;
    padding:13px 18px calc(13px + var(--safe-bottom)) !important;
    font-size:11px !important;
    line-height:1.35 !important;
    text-align:center !important;
  }

  .footer-bottom span:nth-child(2){
    display:none !important;
  }
}

@media (max-width: 420px){
  .strip-inner{
    gap:8px !important;
  }

  .strip-email{
    font-size:11px !important;
  }

  .mobile-strip-icons{
    gap:10px !important;
  }

  .mobile-strip-icons svg,
  .mobile-strip-icons a svg{
    width:18px !important;
    height:18px !important;
  }

  .footer-column{
    padding:16px 12px !important;
  }
}


/* v1.0.11 mobile header spacing fix */
@media (max-width: 860px){
  .strip-inner{
    justify-content:space-between !important;
    gap:8px !important;
    padding:6px 12px !important;
  }

  .strip-email{
    flex:1 1 auto !important;
    width:auto !important;
    max-width:calc(100% - 78px) !important;
    justify-content:flex-start !important;
    text-align:left !important;
    padding-right:4px !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  .mobile-strip-icons{
    flex:0 0 auto !important;
    min-width:62px !important;
    margin-left:0 !important;
    justify-content:flex-end !important;
  }

  .mobile-strip-icons a{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
}

@media (max-width: 420px){
  .strip-inner{
    padding:6px 10px !important;
  }

  .strip-email{
    max-width:calc(100% - 72px) !important;
    font-size:11px !important;
  }

  .mobile-strip-icons{
    min-width:58px !important;
    gap:8px !important;
  }
}


/* v1.0.12 mobile floating app bar */
.mobile-app-bar{
  display:none;
}

@media (max-width: 860px){
  .top-strip .header-icons,
  .mobile-strip-icons{
    display:none !important;
  }

  .strip-inner{
    justify-content:flex-start !important;
  }

  .strip-email{
    max-width:100% !important;
    width:100% !important;
    justify-content:center !important;
    text-align:center !important;
    padding:0 !important;
  }

  body{
    padding-bottom:calc(82px + var(--safe-bottom)) !important;
  }

  .mobile-app-bar{
    position:fixed;
    left:max(12px, var(--safe-left));
    right:max(12px, var(--safe-right));
    bottom:max(10px, var(--safe-bottom));
    z-index:9997;
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:4px;
    padding:8px;
    border:1px solid #ead8ca;
    border-radius:24px;
    background:rgba(255,253,251,.96);
    box-shadow:0 18px 50px rgba(63,48,43,.22);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }

  .mobile-app-bar a{
    position:relative;
    min-height:54px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    border-radius:18px;
    color:#6d4a36;
    text-decoration:none;
    font-size:11px;
    font-weight:800;
    line-height:1;
  }

  .mobile-app-bar a.active,
  .mobile-app-bar a:hover{
    background:#fff3ea;
    color:#3f302b;
  }

  .mobile-app-bar svg{
    width:21px;
    height:21px;
    fill:currentColor;
    display:block;
  }

  .mobile-app-bar em{
    position:absolute;
    top:5px;
    right:18px;
    min-width:17px;
    height:17px;
    padding:0 4px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    background:#9a8584;
    color:#fff;
    font-style:normal;
    font-size:10px;
    line-height:1;
  }

  .site-footer{
    padding-bottom:calc(96px + var(--safe-bottom)) !important;
  }

  .pwa-install-banner{
    bottom:calc(92px + var(--safe-bottom)) !important;
  }

  .offline-toast{
    bottom:calc(158px + var(--safe-bottom)) !important;
  }
}

@media (min-width: 861px){
  .mobile-app-bar{
    display:none !important;
  }
}


/* v1.0.13 mobile 2-column shop/category layouts */
@media (max-width: 860px){

  /* Generic product/category grids */
  .products-grid,
  .product-grid,
  .shop-grid,
  .category-grid,
  .archive-products,
  .woocommerce-products,
  .product-list-grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:14px !important;
    align-items:stretch !important;
  }

  /* Product cards */
  .product-card,
  .shop-product-card,
  .product-item,
  .woocommerce-product-card,
  .archive-product{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    border-radius:18px !important;
    overflow:hidden !important;
  }

  .product-card img,
  .shop-product-card img,
  .product-item img,
  .woocommerce-product-card img,
  .archive-product img{
    width:100% !important;
    aspect-ratio:1 / 1 !important;
    object-fit:cover !important;
  }

  .product-card-content,
  .shop-product-content,
  .product-item-content{
    padding:12px !important;
  }

  .product-card h3,
  .shop-product-card h3,
  .product-item h3{
    font-size:14px !important;
    line-height:1.35 !important;
    margin-bottom:6px !important;
  }

  .product-card .price,
  .shop-product-card .price,
  .product-item .price{
    font-size:13px !important;
  }

  .product-card .btn,
  .shop-product-card .btn,
  .product-item .btn{
    width:100% !important;
    min-height:40px !important;
    font-size:12px !important;
    padding:0 10px !important;
  }

  /* Category cards */
  .category-card,
  .shop-category-card,
  .product-category-card{
    width:100% !important;
    border-radius:18px !important;
    overflow:hidden !important;
  }

  .category-card img,
  .shop-category-card img,
  .product-category-card img{
    width:100% !important;
    aspect-ratio:1 / 1 !important;
    object-fit:cover !important;
  }

  /* Prevent oversized wrappers */
  .products-wrapper,
  .shop-products-wrapper,
  .category-products-wrapper{
    width:100% !important;
    overflow:hidden !important;
  }
}

@media (max-width: 420px){
  .products-grid,
  .product-grid,
  .shop-grid,
  .category-grid,
  .archive-products,
  .woocommerce-products,
  .product-list-grid{
    gap:10px !important;
  }

  .product-card-content,
  .shop-product-content,
  .product-item-content{
    padding:10px !important;
  }

  .product-card h3,
  .shop-product-card h3,
  .product-item h3{
    font-size:13px !important;
  }
}


/* v1.0.14 force actual shop/category product grid to 2 columns on mobile */
@media (max-width: 860px){
  .catalogue-section .container{
    width:calc(100% - 24px) !important;
  }

  .catalogue-section .product-grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:12px !important;
    align-items:stretch !important;
  }

  .catalogue-section .shop-product-card{
    min-width:0 !important;
    width:100% !important;
    padding:8px 8px 12px !important;
    border-radius:18px !important;
    box-shadow:0 12px 28px rgba(76,55,42,.08) !important;
  }

  .catalogue-section .shop-product-image{
    border-radius:14px !important;
    margin-bottom:10px !important;
  }

  .catalogue-section .shop-product-card .shop-product-image img{
    border-radius:14px !important;
  }

  .catalogue-section .shop-product-body{
    padding:0 2px !important;
  }

  .catalogue-section .shop-product-category{
    font-size:9px !important;
    letter-spacing:.08em !important;
    margin-bottom:5px !important;
  }

  .catalogue-section .shop-product-card h2{
    min-height:38px !important;
    font-size:12px !important;
    line-height:1.25 !important;
    margin-bottom:7px !important;
  }

  .catalogue-section .shop-card-price{
    min-height:auto !important;
    font-size:12px !important;
    gap:5px !important;
    margin-bottom:8px !important;
  }

  .catalogue-section .shop-card-price .old-price{
    font-size:10px !important;
  }

  .catalogue-section .shop-card-button{
    min-height:36px !important;
    font-size:10px !important;
    padding:0 8px !important;
  }

  .catalogue-section .shop-card-badge{
    top:7px !important;
    left:7px !important;
    min-height:22px !important;
    padding:4px 7px !important;
    font-size:8px !important;
  }

  .catalogue-section .sale-badge + .stock-badge{
    top:34px !important;
  }
}

@media (max-width: 360px){
  .catalogue-section .product-grid{
    gap:9px !important;
  }

  .catalogue-section .shop-product-card{
    padding:7px 7px 10px !important;
  }

  .catalogue-section .shop-product-card h2{
    font-size:11px !important;
  }
}


/* v1.0.15 mobile product page optimisation */
@media (max-width: 860px){
  .product-detail-section.compact-shop-page{
    padding:18px 12px 110px !important;
    background:#fffaf7 !important;
  }

  .product-detail-grid{
    width:100% !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:16px !important;
  }

  .product-gallery-panel{
    background:#fff !important;
    border:1px solid #eadfd6 !important;
    border-radius:22px !important;
    padding:10px !important;
    box-shadow:0 12px 34px rgba(76,55,42,.07) !important;
  }

  .product-gallery-panel > .product-main-image{
    border-radius:18px !important;
    max-height:none !important;
    aspect-ratio:1 / 1 !important;
  }

  .product-thumbs{
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    gap:8px !important;
    margin-top:10px !important;
    padding:0 2px 4px !important;
    -webkit-overflow-scrolling:touch !important;
  }

  .product-thumb{
    flex:0 0 54px !important;
    width:54px !important;
    height:54px !important;
    border-radius:12px !important;
  }

  .product-purchase-card{
    position:static !important;
    top:auto !important;
    padding:18px !important;
    border-radius:22px !important;
    box-shadow:0 12px 34px rgba(76,55,42,.07) !important;
  }

  .product-title-row{
    gap:8px !important;
    margin-bottom:10px !important;
  }

  .product-title-row h1{
    font-size:24px !important;
    line-height:1.16 !important;
  }

  .sale-pill-main{
    min-height:26px !important;
    padding:5px 10px !important;
    font-size:10px !important;
  }

  .product-price{
    margin-bottom:12px !important;
    font-size:14px !important;
  }

  .product-short{
    margin-bottom:16px !important;
    font-size:14px !important;
    line-height:1.6 !important;
  }

  .product-options-wrap{
    gap:12px !important;
    margin-bottom:14px !important;
  }

  .product-option-field span{
    font-size:12px !important;
  }

  .product-option-field input,
  .product-option-field textarea,
  .product-option-field select,
  .product-native-select,
  .product-select-trigger{
    min-height:48px !important;
    font-size:16px !important;
    border-radius:14px !important;
  }

  .product-add-row,
  .product-add-row.full-width-add{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    width:100% !important;
  }

  .product-add-row .btn,
  .product-add-row button,
  .product-purchase-card .btn{
    width:100% !important;
    min-height:50px !important;
    border-radius:999px !important;
    font-size:14px !important;
  }

  .installments-note,
  .greyed-options-note{
    font-size:12px !important;
    line-height:1.5 !important;
  }

  .product-share-panel,
  .product-description-panel,
  .featured-product-carousel{
    width:100% !important;
    margin-top:18px !important;
    padding:18px !important;
    border-radius:22px !important;
  }

  .product-description-copy{
    font-size:14px !important;
    line-height:1.7 !important;
  }

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

  .share-btn{
    min-height:44px !important;
    justify-content:center !important;
  }

  .featured-carousel-track{
    display:grid !important;
    grid-auto-flow:column !important;
    grid-auto-columns:minmax(155px, 62vw) !important;
    overflow-x:auto !important;
    gap:12px !important;
    scroll-snap-type:x mandatory !important;
    -webkit-overflow-scrolling:touch !important;
  }

  .featured-carousel-card{
    scroll-snap-align:start !important;
  }
}

@media (max-width: 380px){
  .product-title-row h1{
    font-size:22px !important;
  }

  .product-purchase-card,
  .product-description-panel,
  .product-share-panel,
  .featured-product-carousel{
    padding:15px !important;
  }
}


/* v1.0.16 mobile cart + checkout optimisation */
@media (max-width: 860px){

  .cart-page,
  .checkout-page,
  .cart-section,
  .checkout-section{
    padding-bottom:120px !important;
  }

  .cart-layout,
  .checkout-layout,
  .checkout-grid,
  .cart-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:16px !important;
  }

  .cart-card,
  .checkout-card,
  .checkout-summary,
  .cart-summary,
  .cart-items,
  .checkout-form-wrap{
    border-radius:22px !important;
    padding:16px !important;
    overflow:hidden !important;
  }

  .cart-item,
  .checkout-item,
  .basket-item{
    display:grid !important;
    grid-template-columns:88px 1fr !important;
    gap:12px !important;
    align-items:start !important;
    padding:12px 0 !important;
  }

  .cart-item img,
  .checkout-item img,
  .basket-item img{
    width:88px !important;
    height:88px !important;
    object-fit:cover !important;
    border-radius:16px !important;
  }

  .cart-item-details,
  .checkout-item-details{
    min-width:0 !important;
  }

  .cart-item h3,
  .checkout-item h3,
  .basket-item h3{
    font-size:14px !important;
    line-height:1.35 !important;
    margin-bottom:6px !important;
  }

  .cart-price,
  .checkout-price,
  .basket-price{
    font-size:13px !important;
  }

  .qty-wrap,
  .quantity-wrap,
  .cart-qty{
    width:100% !important;
    justify-content:flex-start !important;
    margin-top:8px !important;
  }

  .qty-wrap button,
  .quantity-wrap button,
  .cart-qty button{
    width:40px !important;
    height:40px !important;
    border-radius:12px !important;
  }

  .qty-wrap input,
  .quantity-wrap input,
  .cart-qty input{
    height:40px !important;
    min-width:58px !important;
    font-size:16px !important;
    text-align:center !important;
  }

  .checkout-form,
  .checkout-fields{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
  }

  .checkout-form input,
  .checkout-form select,
  .checkout-form textarea,
  .checkout-fields input,
  .checkout-fields select,
  .checkout-fields textarea{
    min-height:50px !important;
    border-radius:14px !important;
    font-size:16px !important;
  }

  .checkout-form textarea,
  .checkout-fields textarea{
    min-height:120px !important;
  }

  .checkout-summary,
  .cart-summary{
    position:sticky !important;
    bottom:86px !important;
    z-index:20 !important;
    box-shadow:0 16px 40px rgba(63,48,43,.14) !important;
  }

  .checkout-total,
  .cart-total{
    font-size:18px !important;
  }

  .checkout-actions,
  .cart-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  .checkout-actions .btn,
  .cart-actions .btn,
  .checkout-button,
  .cart-button{
    width:100% !important;
    min-height:52px !important;
    border-radius:999px !important;
    font-size:15px !important;
  }

  .payment-methods,
  .payment-options{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  .payment-method,
  .payment-option{
    border-radius:16px !important;
    padding:14px !important;
  }

  .coupon-row,
  .discount-row{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  .coupon-row .btn,
  .discount-row .btn{
    width:100% !important;
  }
}


/* v1.0.17 mobile checkout/cart summary fix - do not cover forms */
@media (max-width: 860px){
  .checkout-summary,
  .cart-summary{
    position:static !important;
    bottom:auto !important;
    z-index:auto !important;
    box-shadow:0 12px 30px rgba(63,48,43,.10) !important;
  }

  .checkout-layout,
  .checkout-grid,
  .cart-layout,
  .cart-grid{
    align-items:start !important;
  }

  .checkout-section,
  .cart-section,
  .checkout-page,
  .cart-page{
    padding-bottom:calc(110px + var(--safe-bottom)) !important;
  }
}


/* v1.0.18 mobile menu styling */
@media (max-width: 860px){
  .nav-bar{
    position:relative !important;
    z-index:80 !important;
    border-top:1px solid #f0e6df !important;
    border-bottom:1px solid #eadfd7 !important;
    background:#fffdfb !important;
  }

  .nav-inner{
    padding:10px 0 !important;
  }

  .menu-toggle{
    position:relative !important;
    width:100% !important;
    min-height:46px !important;
    border:1px solid #ead8ca !important;
    border-radius:999px !important;
    background:#fffaf6 !important;
    color:#6d4a36 !important;
    box-shadow:0 10px 26px rgba(63,48,43,.08) !important;
    font-size:14px !important;
    font-weight:900 !important;
    letter-spacing:.03em !important;
  }

  .menu-toggle::after{
    content:"☰" !important;
    position:absolute !important;
    right:18px !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    font-size:18px !important;
    line-height:1 !important;
  }

  .nav-bar.is-open .menu-toggle::after{
    content:"×" !important;
    font-size:24px !important;
  }

  .main-nav{
    left:14px !important;
    right:14px !important;
    margin-top:10px !important;
    padding:10px !important;
    border:1px solid #ead8ca !important;
    border-radius:22px !important;
    background:#fffdfb !important;
    box-shadow:0 22px 55px rgba(63,48,43,.16) !important;
    overflow:hidden !important;
  }

  .nav-bar.is-open .main-nav,
  .main-nav.is-open{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:6px !important;
  }

  .main-nav a{
    min-height:46px !important;
    padding:0 16px !important;
    justify-content:flex-start !important;
    border-radius:15px !important;
    background:#fff !important;
    border:1px solid #f1e7df !important;
    color:#4d5962 !important;
    font-size:14px !important;
    font-weight:800 !important;
    line-height:1.2 !important;
  }

  .main-nav a.active,
  .main-nav a:hover{
    background:#fff3ea !important;
    border-color:#ead2bd !important;
    color:#6d4a36 !important;
  }

  .main-nav a::after{
    content:"›" !important;
    margin-left:auto !important;
    color:#c9a167 !important;
    font-size:20px !important;
    line-height:1 !important;
  }
}


/* v1.0.19 PWA install/offline polish */
@media (display-mode: standalone){
  body{
    min-height:100vh !important;
  }

  .top-strip{
    padding-top:var(--safe-top) !important;
  }
}

.ios-install-hint{
  position:fixed;
  left:max(12px, var(--safe-left));
  right:max(12px, var(--safe-right));
  bottom:calc(92px + var(--safe-bottom));
  z-index:9998;
  display:flex;
  align-items:center;
  gap:12px;
  padding:13px 14px;
  border:1px solid #ead8ca;
  border-radius:20px;
  background:#fffdfb;
  box-shadow:0 18px 50px rgba(63,48,43,.18);
  color:#5e646b;
}

.ios-install-hint strong{
  display:block;
  color:#2d2d2d;
  line-height:1.2;
}

.ios-install-hint span{
  display:block;
  font-size:12px;
  line-height:1.35;
}

.ios-install-hint button{
  margin-left:auto;
  width:34px;
  height:34px;
  border:1px solid #ead8ca;
  border-radius:999px;
  background:#fff;
  color:#6d4a36;
  font-size:22px;
  line-height:1;
}

@media (min-width: 861px){
  .ios-install-hint{
    max-width:420px;
    left:auto;
    bottom:24px;
  }
}


/* v1.0.20 mobile account/dashboard pages */
@media (max-width: 860px){
  .account-section,
  .account-auth-section{
    padding:22px 12px 118px !important;
    background:#fffaf7 !important;
  }

  .account-container,
  .account-auth-wrap,
  .account-login-only-wrap,
  .auth-single-wrap,
  .simple-login-card{
    width:100% !important;
    max-width:none !important;
  }

  .account-page-head{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
    margin-bottom:18px !important;
    text-align:center !important;
  }

  .account-page-head h1,
  .simple-login-card h1,
  .account-auth-card h1,
  .auth-card-header h1{
    font-size:28px !important;
    line-height:1.12 !important;
    letter-spacing:-.03em !important;
    text-align:center !important;
  }

  .account-dashboard-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:16px !important;
  }

  .account-card,
  .account-auth-card,
  .account-login-card,
  .auth-card-polished,
  .simple-login-card{
    border:1px solid #eadfd6 !important;
    border-radius:22px !important;
    background:#fffdfb !important;
    box-shadow:0 12px 34px rgba(76,55,42,.08) !important;
    padding:18px !important;
    overflow:hidden !important;
  }

  .simple-login-card{
    margin:0 auto !important;
  }

  .simple-login-note,
  .account-login-note,
  .auth-card-header p{
    font-size:14px !important;
    line-height:1.6 !important;
    text-align:center !important;
    margin-bottom:18px !important;
  }

  .account-card-title,
  .auth-card-header{
    padding:0 0 15px !important;
    margin:0 0 16px !important;
    border-bottom:1px solid #eee3d9 !important;
    text-align:center !important;
  }

  .account-card-title h2{
    font-size:22px !important;
  }

  .account-details-form,
  .auth-form,
  .auth-form.auth-form-two-col{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
    padding:0 !important;
  }

  .auth-form .auth-fields,
  .auth-form .auth-actions,
  .checkout-fields.two,
  .checkout-fields.three,
  .account-login-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
  }

  .account-details-form label,
  .auth-form label{
    margin:0 !important;
    font-size:13px !important;
  }

  .account-details-form input,
  .auth-form input,
  .account-auth-card input,
  .simple-login-card input{
    width:100% !important;
    min-height:50px !important;
    border-radius:14px !important;
    font-size:16px !important;
  }

  .site-light-btn,
  .account-logout-btn,
  .account-forgot-link,
  .checkout-main-btn,
  .account-login-return{
    width:100% !important;
    min-height:50px !important;
    border-radius:999px !important;
    font-size:14px !important;
    text-align:center !important;
  }

  .account-update-btn{
    width:100% !important;
    min-width:0 !important;
    justify-self:stretch !important;
  }

  .account-order-list.compact-orders{
    gap:12px !important;
  }

  .account-order-list.compact-orders article{
    padding:14px !important;
    border-radius:18px !important;
  }

  .account-order-head,
  .account-order-meta,
  .account-order-total{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:6px !important;
    text-align:left !important;
  }

  .account-order-head strong{
    font-size:14px !important;
    word-break:break-word !important;
  }

  .account-order-list small,
  .account-order-list span{
    font-size:12px !important;
  }

  .checkout-error,
  .coupon-message,
  .coupon-message.success{
    border-radius:16px !important;
    padding:13px 14px !important;
    font-size:13px !important;
    line-height:1.5 !important;
  }
}

@media (max-width: 380px){
  .account-card,
  .account-auth-card,
  .account-login-card,
  .auth-card-polished,
  .simple-login-card{
    padding:15px !important;
  }

  .account-page-head h1,
  .simple-login-card h1,
  .account-auth-card h1,
  .auth-card-header h1{
    font-size:25px !important;
  }
}


/* v1.0.21 mobile account orders card first */
@media (max-width: 860px){
  .account-dashboard-grid{
    display:flex !important;
    flex-direction:column !important;
  }

  .account-dashboard-grid > :first-child{
    order:2 !important;
  }

  .account-dashboard-grid > :last-child{
    order:1 !important;
  }

  .account-order-list.compact-orders{
    order:1 !important;
  }
}


/* v1.0.22 mobile search panel */
.mobile-search-panel{
  display:none;
}

@media (max-width: 860px){
  .mobile-app-bar{
    grid-template-columns:repeat(5, 1fr) !important;
  }

  .mobile-app-bar button[data-toggle-mobile-search]{
    position:relative;
    min-height:54px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    border:0;
    border-radius:18px;
    background:transparent;
    color:#6d4a36;
    text-decoration:none;
    font-size:11px;
    font-weight:800;
    line-height:1;
    padding:0;
  }

  .mobile-app-bar button[data-toggle-mobile-search]:hover,
  .mobile-app-bar button[data-toggle-mobile-search].active{
    background:#fff3ea;
    color:#3f302b;
  }

  .mobile-app-bar button[data-toggle-mobile-search] svg{
    width:21px;
    height:21px;
    fill:currentColor;
    display:block;
  }

  .mobile-search-panel{
    position:fixed;
    left:max(12px, var(--safe-left));
    right:max(12px, var(--safe-right));
    bottom:calc(92px + var(--safe-bottom));
    z-index:9996;
    display:block;
    padding:14px;
    border:1px solid #ead8ca;
    border-radius:22px;
    background:#fffdfb;
    box-shadow:0 18px 50px rgba(63,48,43,.20);
    transform:translateY(14px);
    opacity:0;
    pointer-events:none;
    transition:opacity .22s ease, transform .22s ease;
  }

  .mobile-search-panel.is-open{
    opacity:1;
    transform:translateY(0);
    pointer-events:auto;
  }

  .mobile-search-panel[hidden]{
    display:block !important;
  }

  .mobile-search-panel label{
    display:block;
    margin:0 0 8px;
    color:#6d4a36;
    font-size:12px;
    font-weight:900;
    letter-spacing:.04em;
    text-transform:uppercase;
  }

  .mobile-search-row{
    display:grid;
    grid-template-columns:1fr auto;
    gap:8px;
  }

  .mobile-search-row input{
    min-width:0;
    width:100%;
    min-height:46px;
    border:1px solid #dacdc3;
    border-radius:999px;
    background:#fff;
    padding:0 15px;
    color:#272b30;
    font-size:16px;
  }

  .mobile-search-row button{
    min-height:46px;
    border:1px solid #dfc2ad;
    border-radius:999px;
    background:#f7e6d8;
    color:#6d442d;
    padding:0 16px;
    font-weight:900;
  }
}

@media (max-width: 380px){
  .mobile-app-bar a,
  .mobile-app-bar button[data-toggle-mobile-search]{
    font-size:10px !important;
  }

  .mobile-app-bar svg,
  .mobile-app-bar button[data-toggle-mobile-search] svg{
    width:19px !important;
    height:19px !important;
  }
}


/* v1.0.23 mobile search keyboard overlap fix */
@media (max-width: 860px){
  .mobile-search-panel{
    bottom:calc(104px + var(--safe-bottom)) !important;
    transition:
      opacity .22s ease,
      transform .22s ease,
      bottom .22s ease !important;
  }

  body.mobile-keyboard-open .mobile-search-panel{
    bottom:auto !important;
    top:calc(var(--safe-top) + 12px) !important;
    transform:none !important;
    max-height:calc(100vh - 24px - var(--safe-top)) !important;
    overflow:auto !important;
  }

  body.mobile-keyboard-open .mobile-app-bar{
    transform:translateY(120%) !important;
    opacity:0 !important;
    pointer-events:none !important;
  }

  body.mobile-keyboard-open .pwa-install-banner,
  body.mobile-keyboard-open .ios-install-hint,
  body.mobile-keyboard-open .offline-toast{
    display:none !important;
  }

  .mobile-search-row input{
    font-size:16px !important;
  }
}


/* v1.0.24 mobile performance/image polish */
@media (max-width: 860px){
  img{
    max-width:100%;
    height:auto;
  }

  .product-main-image,
  .shop-product-image img,
  .panel-image img,
  .featured-carousel-card img{
    content-visibility:auto;
  }

  .home-panels,
  .catalogue-section,
  .product-detail-section,
  .account-section,
  .account-auth-section,
  .cart-section,
  .checkout-section{
    content-visibility:auto;
    contain-intrinsic-size:800px;
  }

  .shop-product-card,
  .product-purchase-card,
  .account-card,
  .cart-card,
  .checkout-card{
    transform:translateZ(0);
  }
}


/* v1.0.25 mobile touch UX polish */
@media (max-width: 860px){
  a,
  button,
  input,
  select,
  textarea{
    -webkit-tap-highlight-color:rgba(154,133,132,.18);
  }

  a,
  button,
  .site-light-btn,
  .checkout-main-btn,
  .shop-card-button,
  .mobile-app-bar a,
  .mobile-app-bar button{
    touch-action:manipulation;
  }

  input,
  select,
  textarea{
    scroll-margin-top:110px;
    scroll-margin-bottom:120px;
  }

  .mobile-app-bar{
    transition:transform .22s ease, opacity .22s ease, box-shadow .22s ease;
  }

  .mobile-app-bar a:active,
  .mobile-app-bar button:active{
    transform:scale(.96);
  }

  .site-light-btn:active,
  .checkout-main-btn:active,
  .shop-card-button:active,
  .account-forgot-link:active{
    transform:scale(.985) !important;
  }

  .admin-modal,
  .site-modal,
  .modal-form{
    max-height:calc(100vh - 28px - var(--safe-top) - var(--safe-bottom)) !important;
    overflow:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }
}


/* v1.0.29 mobile footer: remove exact Your Account & Cart card */
@media (max-width: 860px){
  .site-footer .mobile-footer-account-cart{
    display:none !important;
  }
}


/* v1.0.30 final mobile QA tidy */
@media (max-width: 860px){
  /* Ensure bottom app bar never covers the final footer links/content */
  body{
    padding-bottom:calc(92px + var(--safe-bottom)) !important;
  }

  .site-footer{
    padding-bottom:calc(108px + var(--safe-bottom)) !important;
  }

  /* Keep only the intended footer info card visible on mobile */
  .site-footer .mobile-footer-account-cart{
    display:none !important;
  }

  /* Stable floating app/search stacking */
  .mobile-app-bar{
    z-index:9997 !important;
  }

  .mobile-search-panel{
    z-index:9998 !important;
  }

  .pwa-install-banner,
  .ios-install-hint{
    z-index:9999 !important;
  }

  /* Avoid horizontal overflow caused by long names/options/order refs */
  .product-title-row,
  .shop-product-body,
  .account-card,
  .cart-card,
  .checkout-card,
  .order-detail-card,
  .footer-column{
    min-width:0 !important;
    overflow-wrap:anywhere !important;
  }

  /* Consistent mobile tap targets */
  .mobile-app-bar a,
  .mobile-app-bar button,
  .menu-toggle,
  .main-nav a{
    min-height:48px !important;
  }
}


/* v1.0.31 working shop search */
.shop-search-toolbar{
  display:grid !important;
  gap:14px !important;
}

.shop-search-form{
  display:grid !important;
  grid-template-columns:minmax(220px,1fr) minmax(210px,auto) auto auto !important;
  gap:10px !important;
  align-items:end !important;
}

.shop-search-field,
.shop-sort-field{
  display:grid !important;
  gap:6px !important;
  margin:0 !important;
}

.shop-search-field span,
.shop-sort-field span{
  color:#7b6b62 !important;
  font-size:11px !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}

.shop-search-field input{
  min-height:44px !important;
  border:1px solid #ddd4cc !important;
  border-radius:14px !important;
  background:#fff !important;
  color:#3b2b22 !important;
  font-family:"Montserrat", Arial, sans-serif !important;
  font-size:14px !important;
  font-weight:700 !important;
  padding:10px 14px !important;
}

.shop-search-submit,
.shop-search-clear{
  min-height:44px !important;
  border:1px solid #dfc2ad !important;
  border-radius:999px !important;
  background:#f7e6d8 !important;
  color:#6d442d !important;
  padding:0 18px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
  font-weight:900 !important;
  cursor:pointer !important;
}

.shop-search-clear{
  background:#fff !important;
}

.shop-no-results{
  margin-bottom:18px !important;
}

@media (max-width: 860px){
  .shop-search-form{
    grid-template-columns:1fr !important;
  }

  .shop-search-submit,
  .shop-search-clear{
    width:100% !important;
  }
}


/* v1.0.33 image optimisation pass */
img{
  height:auto;
}

img[loading="lazy"]{
  content-visibility:auto;
}

@media (max-width: 860px){
  .shop-product-image,
  .product-gallery-panel,
  .panel-image,
  .featured-carousel-image-wrap{
    contain:layout paint;
  }

  .shop-product-card img,
  .product-main-image,
  .panel-image img,
  .featured-carousel-card img{
    background:#f7f4f1;
  }
}


/* v1.0.34 performance optimisation pass */
@media (min-width: 861px){
  .home-panels,
  .catalogue-section,
  .product-description-panel,
  .featured-product-carousel,
  .site-footer{
    content-visibility:auto;
    contain-intrinsic-size:700px;
  }
}

@media (max-width: 860px){
  .home-panels,
  .catalogue-section,
  .product-description-panel,
  .featured-product-carousel,
  .site-footer,
  .account-section,
  .cart-section,
  .checkout-section{
    content-visibility:auto;
    contain-intrinsic-size:720px;
  }

  .shop-product-card,
  .product-purchase-card,
  .account-card,
  .cart-card,
  .checkout-card,
  .info-panel{
    will-change:auto;
  }
}

@media (prefers-reduced-motion: reduce){
  *,
  *::before,
  *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    scroll-behavior:auto !important;
    transition-duration:.01ms !important;
  }
}
