.shop-hero{
  position:relative; overflow:hidden;
  padding:150px 56px 40px; text-align:center;
  background:radial-gradient(circle at 50% 0%, var(--pink-pale-2), var(--pink-pale) 70%);
}
.shop-hero-eyebrow{ position:relative; z-index:2; font-size:var(--fs-micro); font-weight:500; letter-spacing:var(--ls-eyebrow); line-height:1.4; text-transform:uppercase; color:var(--pink-deep); margin-bottom:14px; }
.shop-hero-title{
  position:relative; z-index:2; font-family:var(--font-display); font-size:var(--fs-display-2); font-weight:600;
  letter-spacing:var(--ls-display-sm); line-height:var(--lh-title); color:var(--ink); text-wrap:balance;
}
.shop-hero-deco{
  position:absolute; bottom:-18px; z-index:1; width:150px;
  filter:drop-shadow(0 20px 26px rgba(214,89,124,0.28));
  pointer-events:none;
}
.shop-hero-deco-left{ left:6%; transform:rotate(-10deg); }
.shop-hero-deco-right{ right:6%; transform:rotate(10deg); }

.shop-layout{
  max-width:1320px; margin:0 auto; padding:130px 56px 120px;
  display:grid; grid-template-columns:260px 1fr; gap:44px; align-items:flex-start;
}

.shop-filters{
  position:sticky; top:110px;
  background:var(--white); border:1px solid var(--line); border-radius:22px;
  padding:26px 24px; display:flex; flex-direction:column; gap:28px;
}
.filter-group-title{ font-size:var(--fs-micro); font-weight:600; color:var(--ink); margin-bottom:14px; text-transform:uppercase; letter-spacing:var(--ls-label); }
.filter-check{
  display:flex; align-items:center; gap:10px; font-size:var(--fs-body-sm); font-weight:400; line-height:1.45; color:var(--ink-soft);
  margin-bottom:12px; cursor:pointer; user-select:none;
}
.filter-check:last-child{ margin-bottom:0; }
.filter-check input{ width:16px; height:16px; accent-color:var(--pink-deep); cursor:pointer; flex-shrink:0; }
.filter-check.active-label{ color:var(--ink); font-weight:600; }

.price-range-values{
  display:flex; justify-content:space-between; font-size:var(--fs-micro); color:var(--ink); font-weight:600;
  font-variant-numeric:tabular-nums; margin-bottom:12px;
}
.price-range-values span{ background:var(--pink-pale); padding:6px 10px; border-radius:10px; }
.price-range-slider{ position:relative; height:34px; }
.price-range-slider input[type="range"]{
  position:absolute; top:12px; left:0; width:100%; margin:0;
  -webkit-appearance:none; appearance:none; background:none; pointer-events:none;
}
.price-range-slider input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none; pointer-events:auto;
  width:16px; height:16px; border-radius:50%; background:var(--pink-deep);
  border:2px solid var(--white); box-shadow:0 2px 6px rgba(58,37,48,0.3); cursor:pointer;
}
.price-range-slider input[type="range"]::-moz-range-thumb{
  pointer-events:auto; width:16px; height:16px; border-radius:50%; background:var(--pink-deep);
  border:2px solid var(--white); box-shadow:0 2px 6px rgba(58,37,48,0.3); cursor:pointer;
}
.price-range-track{
  position:absolute; top:16px; left:0; right:0; height:4px; border-radius:2px; background:var(--line);
}
.price-range-fill{
  position:absolute; top:16px; height:4px; border-radius:2px; background:var(--pink-deep);
}
.filter-reset{
  font-family:var(--font-sans);
  font-size:var(--fs-caption); font-weight:500; color:var(--ink-soft); text-decoration:underline;
  text-underline-offset:3px; background:none; border:none;
  cursor:pointer; padding:0; text-align:left;
}
.filter-reset:hover{ color:var(--pink-deep); }

.shop-mobile-actions{ display:none; }
.shop-filters-head{ display:none; }
.filters-apply{ display:none; }
.filters-overlay{ display:none; }

.shop-toolbar{
  display:flex; justify-content:space-between; align-items:center; margin-bottom:26px; flex-wrap:wrap; gap:14px;
}
.shop-count{ font-size:var(--fs-caption); font-weight:400; letter-spacing:0.01em; color:var(--ink-soft); }
.custom-select{ position:relative; }
.custom-select-trigger{
  display:flex; align-items:center; justify-content:space-between; gap:12px; min-width:210px;
  border:1px solid var(--line); border-radius:999px; padding:10px 18px; font-size:var(--fs-caption); font-weight:500; color:var(--ink);
  background:var(--white); cursor:pointer; font-family:var(--font-sans); transition:border-color 0.2s ease;
}
.custom-select-trigger:hover{ border-color:var(--pink-deep); }
.custom-select-chevron{ width:15px; height:15px; flex-shrink:0; color:var(--ink-soft); transition:transform 0.25s ease; }
.custom-select-trigger[aria-expanded="true"] .custom-select-chevron{ transform:rotate(180deg); }
.custom-select-menu{
  position:absolute; top:calc(100% + 10px); right:0; z-index:50; min-width:230px;
  background:var(--white); border:1px solid var(--line); border-radius:18px;
  box-shadow:0 20px 44px rgba(58,37,48,0.16); padding:8px; margin:0; list-style:none;
  opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease;
}
.custom-select-menu.open{ opacity:1; visibility:visible; transform:translateY(0); }
.custom-select-menu li{
  padding:11px 14px; border-radius:11px; font-size:var(--fs-caption); font-weight:400; color:var(--ink); cursor:pointer;
  transition:background 0.15s ease, color 0.15s ease;
}
.custom-select-menu li:hover{ background:var(--pink-pale); }
.custom-select-menu li.active{ background:var(--pink-deep); color:var(--white); font-weight:600; }

.shop-grid{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:22px;
}
.shop-empty{ text-align:center; padding:80px 20px; color:var(--ink-soft); font-size:var(--fs-body); font-weight:400; line-height:var(--lh-lead); grid-column:1/-1; }

.shop-card{
  background:var(--white); border-radius:28px; overflow:hidden;
  box-shadow:0 16px 40px rgba(58,37,48,0.10);
  display:flex; flex-direction:column;
  text-decoration:none; color:inherit; cursor:pointer;
  transition:transform 0.35s cubic-bezier(.22,.61,.36,1), box-shadow 0.35s ease;
}
.shop-card:hover{ transform:translateY(-6px); box-shadow:0 26px 54px rgba(58,37,48,0.18); }

.shop-card-photo{ position:relative; width:100%; height:300px; overflow:hidden; background:var(--white); box-sizing:border-box; padding:44px; }
.shop-card-photo img{
  width:100%; height:100%; object-fit:contain;
  transition:transform 0.5s cubic-bezier(.22,.61,.36,1);
}
.shop-card:hover .shop-card-photo img{ transform:scale(1.05); }

.shop-card-badge{
  position:absolute; top:18px; left:18px; z-index:2;
  background:rgba(255,255,255,0.85); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  color:var(--pink-deep);
  font-size:0.625rem; letter-spacing:var(--ls-label); line-height:1; text-transform:uppercase; font-weight:600;
  padding:8px 16px; border-radius:999px;
}
.shop-card-wish{
  position:absolute; top:18px; right:18px; z-index:2;
  width:38px; height:38px; border-radius:50%; border:none;
  background:rgba(255,255,255,0.9); color:var(--ink-soft); cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:color 0.2s ease, transform 0.2s ease;
}
.shop-card-wish svg{ width:17px; height:17px; }
.shop-card-wish.active{ color:var(--pink-deep); }
.shop-card-wish:hover{ transform:scale(1.08); }

.shop-card-eyebrow{ font-size:var(--fs-nano); letter-spacing:var(--ls-label); text-transform:uppercase; color:var(--pink-deep); font-weight:600; margin-bottom:7px; }
.shop-card-name{ font-family:var(--font-sans); font-size:1.125rem; font-weight:600; letter-spacing:-0.012em; color:var(--ink); line-height:1.3; margin-bottom:8px; text-wrap:balance; }
.shop-card-tagline{ font-size:var(--fs-caption); font-weight:400; color:var(--ink-soft); line-height:1.65; margin-bottom:16px; text-wrap:pretty; }
.shop-card-volume{
  display:inline-block; font-size:var(--fs-nano); font-weight:500; letter-spacing:0.04em; color:var(--ink-soft);
  border:1px solid var(--line); padding:5px 14px; border-radius:999px; margin-bottom:18px;
}

.shop-card-body{ padding:24px 24px 24px; }
.shop-card-price-row{
  display:flex; align-items:center; justify-content:space-between;
  padding-top:16px; border-top:1px solid var(--line); margin-bottom:16px;
}
.shop-card-price{
  font-family:var(--font-sans); font-size:1.1875rem; font-weight:700; letter-spacing:-0.015em;
  font-variant-numeric:tabular-nums; line-height:1.2; color:var(--pink-deep);
}
.shop-card-rating{ display:flex; align-items:center; gap:5px; font-size:var(--fs-caption); font-weight:500; font-variant-numeric:tabular-nums; color:var(--ink-soft); }
.shop-card-rating svg{ width:13px; height:13px; fill:var(--gold); stroke:none; }
.shop-card-add{
  width:100%; padding:16px; border-radius:999px; border:none;
  background:var(--pink-deep); color:var(--white); font-family:var(--font-sans);
  font-size:var(--fs-micro); letter-spacing:var(--ls-button); line-height:1; text-transform:uppercase; font-weight:600;
  cursor:pointer; transition:background 0.3s ease; display:flex; align-items:center; justify-content:center; gap:10px;
}
.shop-card-add:hover{ background:var(--ink); }
.shop-card-add svg{ width:15px; height:15px; }

header{
  background:rgba(255,255,255,0.88);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  padding:16px 56px;
  box-shadow:0 4px 30px rgba(214,89,124,0.08);
}
.logo{ color:var(--pink-deep); }
nav a{ color:var(--ink); }
.nav-cart{ border-color:var(--line); color:var(--pink-deep); }
.burger span{ background:var(--ink); }

@media (max-width: 1100px){
  .shop-layout{ grid-template-columns:1fr; }
  .shop-filters{ position:relative; top:0; }
  .shop-grid{ grid-template-columns:repeat(2, 1fr); }
  .shop-hero-deco{ width:110px; }
}
@media (max-width: 640px){
  .shop-hero{ padding:130px 24px 32px; }
  .shop-layout{ padding:110px 24px 80px; gap:28px; }
  .shop-hero-deco{ display:none; }

  /* mobil: Kategoriya / Filtrlar tugmalari */
  .shop-mobile-actions{
    display:flex; gap:10px; margin:0 0 16px;
  }
  .shop-mobile-btn{
    flex:1; display:flex; align-items:center; justify-content:center; gap:7px;
    border:1px solid var(--line); border-radius:999px; background:var(--white);
    color:var(--ink); font-family:var(--font-sans); font-size:var(--fs-caption); font-weight:600; letter-spacing:0.01em; padding:11px 10px;
    cursor:pointer;
  }
  .shop-mobile-btn svg{ width:15px; height:15px; flex-shrink:0; }

  /* mobil: filtr paneli - o'ngdan chiquvchi tortma */
  .filters-overlay{
    display:block; position:fixed; inset:0; z-index:190;
    background:rgba(58,37,48,0.4); opacity:0; visibility:hidden;
    transition:opacity 0.3s ease, visibility 0.3s ease;
  }
  .filters-overlay.open{ opacity:1; visibility:visible; }

  .shop-filters{
    position:fixed; top:0; right:0; bottom:0; z-index:200;
    width:min(320px, 84vw); height:100%; max-height:none;
    border-radius:0; border:none; top:0;
    transform:translateX(100%); transition:transform 0.4s cubic-bezier(.22,.61,.36,1);
    overflow-y:auto; padding:22px 20px 100px;
  }
  .shop-filters.open{ transform:translateX(0); }
  .shop-filters-head{
    display:flex; align-items:center; justify-content:space-between;
    font-size:var(--fs-body); font-weight:600; letter-spacing:-0.005em; color:var(--ink); margin-bottom:6px;
  }
  .shop-filters-close{
    width:32px; height:32px; border-radius:50%; border:1px solid var(--line); background:var(--white);
    color:var(--ink-soft); font-size:20px; line-height:1; cursor:pointer;
  }
  .filters-apply{
    display:block; position:absolute; left:20px; right:20px; bottom:20px;
    padding:15px; border-radius:999px; border:none; background:var(--pink-deep); color:var(--white);
    font-family:var(--font-sans);
    font-size:var(--fs-micro); font-weight:600; letter-spacing:var(--ls-button); line-height:1; text-transform:uppercase; cursor:pointer;
  }

  /* mobil: 2 ustunli ixcham mahsulot kartalari */
  .shop-grid{ grid-template-columns:repeat(2, 1fr); gap:12px; }
  .shop-card{ border-radius:16px; box-shadow:0 8px 20px rgba(58,37,48,0.08); }
  .shop-card-photo{ height:180px; padding:24px; }
  .shop-card-badge{ padding:5px 10px; font-size:0.5625rem; letter-spacing:0.1em; top:8px; left:8px; }
  .shop-card-wish{ width:26px; height:26px; top:8px; right:8px; }
  .shop-card-wish svg{ width:12px; height:12px; }
  .shop-card-body{ padding:10px 12px 12px; }
  .shop-card-eyebrow{ font-size:0.5625rem; letter-spacing:0.1em; margin-bottom:3px; }
  .shop-card-name{
    font-size:var(--fs-body-sm); line-height:1.3; margin-bottom:4px;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  .shop-card-tagline{ display:none; }
  .shop-card-volume{ display:none; }
  .shop-card-price-row{
    flex-direction:column; align-items:flex-start; gap:4px;
    padding-top:8px; margin-bottom:10px;
  }
  .shop-card-price{ font-size:var(--fs-body); }
  .shop-card-rating{ font-size:0.625rem; gap:3px; }
  .shop-card-rating svg{ width:9px; height:9px; }
  /* Narrow 2-up cards: modest tracking so the label stays on one line. */
  .shop-card-add{ padding:9px; font-size:0.625rem; letter-spacing:0.04em; gap:4px; }
  .shop-card-add svg{ width:11px; height:11px; }
}

/* Embedded catalog on the homepage: section heading above provides the spacing */
.shop-layout.embedded{ padding-top:36px; }
@media (max-width: 860px){
  .shop-layout.embedded{ padding-top:20px; }
}