.elementor-438 .elementor-element.elementor-element-c04d846{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS *//* ==========================================================
   LogeAchi - Shop / Product Category archive
   Values taken from the reference build (src/styles.css):
   .shop-hero, .shop-sidebar, .shop-filter-controls,
   .shop-toolbar, .shopgrid and their 850 / 700 breakpoints.
   Sizes and colours that the Elementor panel can express live
   in the panel; this block only does what it cannot.
   ========================================================== */

/* ---------- 1 - HERO ---------- */
.elementor-438 .lg-shop-hero{
  position:relative; overflow:hidden; isolation:isolate;
  /* width:auto is what stops the inset margins from pushing the
     container past the viewport - an Elementor container is
     max-width:min(100%,var(--width)), so margins would add on top */
  width:auto; max-width:none;
  margin:26px clamp(14px,4.5vw,68px) 0;
}
/* the two soft circles on the right, as in the reference */
.elementor-438 .lg-shop-hero::before,
.elementor-438 .lg-shop-hero::after{
  content:""; position:absolute; z-index:0;
  border-radius:50%; pointer-events:none;
}
.elementor-438 .lg-shop-hero::before{
  width:190px; height:190px; top:-112px; right:5.5%;
  background:rgba(255,255,255,.16);
}
.elementor-438 .lg-shop-hero::after{
  width:250px; height:250px; bottom:-174px; right:15%;
  background:rgba(255,255,255,.11);
}
.elementor-438 .lg-shop-hero-in{
  position:relative; z-index:1;
  width:100%; max-width:1340px; margin-inline:auto; text-align:center;
}
.elementor-438 .lg-shop-eyebrow{ margin-bottom:7px; }
.elementor-438 .lg-shop-title .elementor-heading-title{ margin:0; }
.elementor-438 .lg-shop-desc{ max-width:510px; margin:13px auto 0; }
.elementor-438 .lg-shop-desc p{ margin:0; color:#E8E5E2; font-size:15px; line-height:1.6; }
.elementor-438 .lg-shop-desc:not(:has(p)){ display:none; }
/* the back link is text only - no button chrome */
.elementor-438 .lg-shop-back{ margin-top:12px; }
.elementor-438 .lg-shop-back .elementor-button{
  padding:0; border:0; border-radius:0; background:transparent; box-shadow:none;
  transition:color .2s ease, transform .2s ease;
}
.elementor-438 .lg-shop-back .elementor-button:hover{
  background:transparent; color:#D7D4D1; transform:translateX(-2px);
}

/* ---------- 2 - BODY LAYOUT ---------- */
.elementor-438 .lg-shop-body{
  width:100%; max-width:1340px; margin-inline:auto; align-items:flex-start;
}
.elementor-438 .lg-shop-sidebar{
  flex:0 0 270px; width:270px;
  position:sticky; top:112px; align-self:flex-start;
  box-shadow:0 9px 18px rgba(0,0,0,.047);
}
.elementor-438 .lg-shop-results{ flex:1 1 auto; min-width:0; }

/* ---------- 3 - SIDEBAR FILTERS (see shop-sidebar.css) ---------- */
/* ==========================================================
   LogeAchi - shop sidebar filters
   Rebuilt against the reference build, src/styles.css:
     .shop-filter-controls  (lines 676-691, 712-714, 728-733)
     .price-filter          (lines 681-683, 738-742)
     .filter-checks         (684-686)
     .filter-chips          (689-691)
     .clear-filters         (692-693, 806)
     .apply-filters         (700)
   ========================================================== */

/* ---------- collapsible section headings ---------- */
.elementor-438 .lg-filter-block{ margin:0; padding:0; border-top:1px solid #EEE5DF; }
.elementor-438 .lg-filter-block .elementor-widget-container > div{ margin:0; }
.elementor-438 .lg-filter-block h5{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  min-height:53px; margin:0; padding:0;
  color:#211D1A; font:800 14px Manrope, sans-serif;
  cursor:pointer; user-select:none;
}
.elementor-438 .lg-filter-block h5::after{
  content:""; flex:0 0 20px; width:20px; height:20px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C84E09' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>") center/20px 20px no-repeat;
  transform:rotate(180deg); transition:transform .2s ease;
}
.elementor-438 .lg-filter-block.lg-closed h5{ color:#211D1A; }
.elementor-438 .lg-filter-block.lg-closed h5::after{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23171717' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  transform:none;
}
.elementor-438 .lg-filter-block.lg-closed ul,
.elementor-438 .lg-filter-block.lg-closed form,
.elementor-438 .lg-filter-block.lg-closed .price_slider_wrapper{ display:none; }

/* ---------- lists ---------- */
.elementor-438 .lg-filter-block ul{
  display:grid; gap:8px; margin:0; padding:0 0 16px; list-style:none;
}
.elementor-438 .lg-filter-block ul li{ margin:0; padding:0; }
.elementor-438 .lg-filter-block ul ul{ padding:8px 0 0 23px; }

/* ---------- category + brand: checkbox rows ---------- */
.elementor-438 .lg-filter-cats li > a,
.elementor-438 .lg-filter-brand li > a{
  display:flex; align-items:center; gap:8px;
  color:#5D554F; font-size:12px; text-decoration:none;
  transition:color .18s ease;
}
.elementor-438 .lg-filter-cats li > a::before,
.elementor-438 .lg-filter-brand li > a::before{
  content:""; flex:0 0 15px; width:15px; height:15px;
  border:1px solid #C9C2BC; border-radius:3px; background:#fff;
  transition:background .18s ease, border-color .18s ease;
}
.elementor-438 .lg-filter-cats li > a:hover,
.elementor-438 .lg-filter-brand li > a:hover{ color:#171717; }
.elementor-438 .lg-filter-cats li > a:hover::before,
.elementor-438 .lg-filter-brand li > a:hover::before{ border-color:#171717; }
.elementor-438 .lg-filter-cats li.current-cat > a,
.elementor-438 .lg-filter-brand li.chosen > a{ color:#171717; font-weight:700; }
.elementor-438 .lg-filter-cats li.current-cat > a::before,
.elementor-438 .lg-filter-brand li.chosen > a::before{
  border-color:#171717; background:#171717
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/10px 10px no-repeat;
}
.elementor-438 .lg-filter-cats .count,
.elementor-438 .lg-filter-brand .count{ margin-left:auto; color:#9A938D; font-size:11px; }

/* ---------- size: chips ---------- */
.elementor-438 .lg-filter-size ul{ display:flex; flex-wrap:wrap; gap:7px; }
.elementor-438 .lg-filter-size li > a{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:34px; height:31px; padding:0 8px;
  border:1px solid #E6DBD3; border-radius:7px; background:#fff;
  color:#5D554F; font:700 11px Manrope, sans-serif; text-decoration:none;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.elementor-438 .lg-filter-size li > a:hover,
.elementor-438 .lg-filter-size li.chosen > a{
  border-color:#171717; background:#171717; color:#fff;
}
.elementor-438 .lg-filter-size .count{ display:none; }

/* ---------- price ---------- */
.elementor-438 .lg-filter-price form{ margin:0; }
.elementor-438 .lg-filter-price .price_slider_wrapper{
  margin:0 0 17px; padding:14px 14px 13px;
  border:1px solid #DDD9D4; border-radius:13px;
  background:#FAF9F7; box-shadow:0 9px 18px rgba(0,0,0,.047);
}
/* label row: "Price Up To" on the left, the value in a black pill */
.elementor-438 .lg-filter-price .price_slider_amount{
  display:flex !important; align-items:center; justify-content:space-between;
  gap:8px; margin:0; padding:0; font-size:0;
}
.elementor-438 .lg-filter-price .price_slider_amount label,
.elementor-438 .lg-filter-price .price_slider_amount input,
.elementor-438 .lg-filter-price .price_slider_amount .button,
.elementor-438 .lg-filter-price .price_slider_amount .clear,
.elementor-438 .lg-filter-price .price_label .from{ display:none !important; }
.elementor-438 .lg-filter-price .price_label{
  display:flex !important; align-items:center; justify-content:space-between;
  order:2; width:100%; margin:0; font-size:0;
}
.elementor-438 .lg-filter-price .price_label::before{
  content:"Price Up To"; color:#776963; font:800 11px Manrope, sans-serif;
}
.elementor-438 .lg-filter-price .price_label .to{
  padding:5px 9px; border-radius:7px;
  background:#171717; color:#fff; font:800 12px Manrope, sans-serif;
}
/* the track sits below the label row */
.elementor-438 .lg-filter-price .price_slider{
  order:3; height:6px; margin:12px 0 2px;
  border:0; border-radius:999px;
  background:linear-gradient(90deg,#171717,#717171);
  position:relative;
}
.elementor-438 .lg-filter-price .price_slider_wrapper{ display:flex; flex-direction:column; }
.elementor-438 .lg-filter-price .price_slider_wrapper > .price_slider{ order:2; }
.elementor-438 .lg-filter-price .price_slider_wrapper > form,
.elementor-438 .lg-filter-price .price_slider_wrapper > .price_slider_amount{ order:1; }
.elementor-438 .lg-filter-price .ui-slider-range{ background:transparent; }
.elementor-438 .lg-filter-price .ui-slider-handle{
  width:18px; height:18px; top:-6px; margin-left:-9px;
  border:4px solid #fff; border-radius:50%; background:#171717;
  box-shadow:0 3px 8px rgba(48,48,48,.5); cursor:pointer;
}

/* ---------- active filters ---------- */
.elementor-438 .lg-filter-active ul{ display:flex; flex-wrap:wrap; gap:7px; }
.elementor-438 .lg-filter-active li > a{
  display:inline-flex; align-items:center; gap:5px;
  padding:5px 9px; border-radius:7px; background:#F4F1EE;
  color:#171717; font:700 11px Manrope, sans-serif; text-decoration:none;
}
.elementor-438 .lg-filter-active:not(:has(li)){ display:none; }

/* ---------- reset link in the head ---------- */
.elementor-438 .lg-filter-reset .lg-reset{
  display:inline-block; padding:5px 0; color:#171717;
  font:800 11px Manrope, sans-serif; text-decoration:none;
}
.elementor-438 .lg-filter-reset .lg-reset:hover{ text-decoration:underline; }

/* ---------- clear all filters ---------- */
.elementor-438 .lg-filter-clear{ border-top:1px solid #EEE5DF; padding-top:0; }
.elementor-438 .lg-clear{
  display:flex; align-items:center; justify-content:center;
  width:100%; min-height:40px; margin-top:16px;
  border:1px solid #171717; border-radius:8px; background:#fff;
  color:#171717; font:800 12px Manrope, sans-serif; text-decoration:none;
  cursor:pointer; transition:background .2s ease, color .2s ease;
}
.elementor-438 .lg-clear:hover{ background:#171717; color:#fff; }


/* ---------- 4 - TOOLBAR ---------- */
.elementor-438 .lg-toolbar-count{ flex:0 1 auto; min-width:0; }
.elementor-438 .lg-toolbar-count .lg-count{
  margin:0; color:#70665F; font-size:13px; line-height:1.3; white-space:nowrap;
}
.elementor-438 .lg-toolbar-right{ flex:0 0 auto; }
.elementor-438 .lg-toolbar-count .lg-count b{ color:#171717; }
.elementor-438 .lg-toolbar-sort form,
.elementor-438 .lg-toolbar-sort .woocommerce-ordering{ margin:0; }
.elementor-438 .lg-toolbar-sort select{
  height:38px; padding:0 31px 0 11px;
  border:1px solid #E4D9D2; border-radius:8px; background:#fff;
  color:#171717; font:700 12px Manrope, sans-serif;
  outline-color:#171717; cursor:pointer;
}
.elementor-438 .lg-filter-toggle{ display:none; }
.elementor-438 .lg-filter-toggle .elementor-button{
  /* .elementor-button is inline-block, so a fixed height alone leaves
     the label stuck at the top - it has to become a flex box */
  display:flex; align-items:center; justify-content:center;
  height:38px; padding:0 14px; border:0; border-radius:8px;
  background:#171717; color:#fff; line-height:1; transition:background .2s ease;
}
.elementor-438 .lg-filter-toggle .elementor-button-content-wrapper{
  display:flex; align-items:center; justify-content:center;
}
.elementor-438 .lg-filter-toggle .elementor-button:hover{ background:#3B3B3B; }

/* ---------- 5 - PAGINATION ---------- */
.elementor-438 .lg-shop-grid .elementor-pagination{ margin-top:26px; text-align:center; }
.elementor-438 .lg-shop-grid .page-numbers{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:36px; height:36px; margin:0 3px; padding:0 8px;
  border:1px solid #E4D9D2; border-radius:8px; background:#fff;
  color:#5D554F; font:700 12px Manrope, sans-serif; text-decoration:none;
  transition:background .18s ease, color .18s ease, border-color .18s ease;
}
.elementor-438 .lg-shop-grid .page-numbers:hover,
.elementor-438 .lg-shop-grid .page-numbers.current{
  border-color:#171717; background:#171717; color:#fff;
}

/* ---------- 6 - TABLET AND MOBILE ---------- */
@media (max-width:850px){
  .elementor-438 .lg-shop-body{ flex-wrap:wrap; padding-top:25px; }
  .elementor-438 .lg-shop-results{ flex:1 1 100%; }
  .elementor-438 .lg-filter-toggle{ display:block; }

  /* dim layer behind the drawer */
  .elementor-438 .lg-shop-body::before{
    content:""; position:fixed; z-index:10000; inset:0;
    background:rgba(24,19,15,.44);
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .25s ease, visibility .25s ease;
  }
  body.lg-filters-open .elementor-438 .lg-shop-body::before{
    opacity:1; visibility:visible; pointer-events:auto;
  }

  /* the sidebar becomes the slide-in filter drawer */
  .elementor-438 .lg-shop-sidebar{
    position:fixed; z-index:10001; top:0; left:0; bottom:0;
    flex:none; width:min(370px,90vw); max-width:none;
    margin:0; padding:25px 22px 20px; overflow:auto;
    border:0; border-radius:0;
    box-shadow:18px 0 34px rgba(0,0,0,.15);
    transform:translateX(-100%);
    transition:transform .32s cubic-bezier(.2,.8,.2,1);
  }
  body.lg-filters-open .elementor-438 .lg-shop-sidebar{ transform:none; }
  body.lg-filters-open{ overflow:hidden; }
}

/* the reference keeps three columns between 701 and 850 */
@media (max-width:850px) and (min-width:701px){
  .elementor-438 .lg-shop-grid .elementor-grid{ --grid-columns:3; }
}

@media (max-width:700px){
  .elementor-438 .lg-shop-hero{ width:auto; max-width:none; margin:14px 10px 0; border-radius:18px; }
  .elementor-438 .lg-shop-hero::before{ width:122px; height:122px; top:-76px; right:3%; }
  .elementor-438 .lg-shop-hero::after{ width:154px; height:154px; bottom:-111px; right:12%; }
  .elementor-438 .lg-shop-toolbar{ align-items:flex-start; min-height:auto; }
  .elementor-438 .lg-toolbar-right{ flex-direction:column; align-items:flex-end; gap:7px; }
  .elementor-438 .lg-toolbar-count .lg-count{ font-size:12px; }
  .elementor-438 .lg-toolbar-sort select{ height:34px; font-size:11px; }
  .elementor-438 .lg-shop-body{ padding-bottom:60px; }
}

/* ---------- 7 - MOBILE FILTER DRAWER CHROME ---------- */
/* the X and the apply button belong to the drawer only */
.elementor-438 .lg-filter-close,
.elementor-438 .lg-filter-apply{ display:none; }
.elementor-438 .lg-filter-close .elementor-icon{
  display:grid; width:41px; height:41px; place-items:center;
  border-radius:10px; background:#F7F7F7; color:#171717;
  cursor:pointer; transition:background .2s ease, color .2s ease;
}
.elementor-438 .lg-filter-close .elementor-icon:hover{ background:#171717; color:#fff; }
.elementor-438 .lg-filter-close .elementor-icon svg{ width:17px; height:17px; fill:currentColor; }
.elementor-438 .lg-apply{
  position:sticky; bottom:0; width:100%; min-height:44px; margin-top:17px;
  padding:0 15px; border:0; border-radius:8px;
  background:#171717; color:#fff; font:800 12px Manrope, sans-serif;
  cursor:pointer; box-shadow:0 -10px 18px #fff; transition:background .2s ease;
}
.elementor-438 .lg-apply:hover{ background:#3B3B3B; }

@media (max-width:850px){
  .elementor-438 .lg-filter-close,
  .elementor-438 .lg-filter-apply{ display:block; }
  /* nothing between the drawer and the viewport may contain it */
  .elementor-438 .lg-shop-body{ contain:none; content-visibility:visible; filter:none; perspective:none; }
  .elementor-438 .lg-shop-sidebar{ display:flex; flex-direction:column; }
  .elementor-438 .lg-filter-head{ padding-bottom:17px; }
}/* End custom CSS */