/* Product catalog */
.product-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: var(--color-white);
    border: 1px solid var(--color-gray-200);
    border-radius: 20px;
    overflow: hidden;
    cursor: pointer;
    box-shadow: var(--shadow-sm);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.product-card:hover {
    transform: translateY(-6px);
    border-color: rgba(198,164,59,.55);
    box-shadow: var(--shadow-lg);
}
.product-image {
    position: relative;
    height: 330px;
    background: linear-gradient(135deg,#f7f5f0,#ece9e2);
    overflow: hidden;
}
.product-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    transition: transform .45s ease;
}
.product-card:hover .product-image > img { transform: scale(1.045); }
.product-variant-count {
    position: absolute;
    top: 14px;
    right: 14px;
    padding: 6px 10px;
    border-radius: 999px;
    color: #fff;
    background: rgba(26,74,63,.9);
    backdrop-filter: blur(8px);
    font-size: 12px;
    font-weight: 600;
}
.product-info { padding: 18px; }
.product-card-top { min-height: 66px; }
.product-title { font-size: 1.05rem; font-weight: 700; line-height: 1.35; color: var(--color-text-dark); }
.product-material { margin-top: 4px; color: var(--color-text-light); font-size: .82rem; }
.product-swatches {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 13px 0;
    min-height: 38px;
}
.product-swatch {
    width: 36px;
    height: 36px;
    padding: 2px;
    border: 1px solid var(--color-gray-300);
    border-radius: 50%;
    overflow: hidden;
    background: #fff;
    cursor: pointer;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.product-swatch:hover { transform: translateY(-2px); }
.product-swatch.active {
    border-color: var(--color-accent);
    box-shadow: 0 0 0 2px rgba(198,164,59,.2);
}
.product-swatch img { width:100%; height:100%; object-fit:cover; border-radius:50%; }
.product-more-variants { font-size: 12px; color: var(--color-text-light); font-weight: 600; }
.product-card-footer { display:flex; align-items:center; gap:12px; margin-top:14px; }
.product-price { flex:1; font-size:1.08rem; font-weight:800; color:var(--color-primary); }
.product-cart-btn, .product-card-footer .btn { padding:11px 15px; font-size:.82rem; white-space:nowrap; }

.products-grid, .category-products-grid {
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
    gap:24px;
    width:100%;
    margin:0 0 48px;
}
.category-filters, .filters {
    display:flex;
    justify-content:flex-start;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    margin:0 0 24px;
}
.category-filter-chip, .filter-chip {
    padding:9px 16px;
    border:1px solid var(--color-gray-300);
    border-radius:999px;
    background:#fff;
    color:var(--color-text-dark);
    cursor:pointer;
    transition:.2s ease;
}
.category-filter-chip:hover, .filter-chip:hover { border-color:var(--color-accent); }
.category-filter-chip.active, .filter-chip.active {
    background:var(--color-primary);
    border-color:var(--color-primary);
    color:#fff;
}
.category-stats {
    text-align:center;
    padding:16px 0 40px;
    color:var(--color-text-light);
    font-size:.9rem;
}
.category-stats span { color:var(--color-primary); font-weight:800; }

/* Collection cards */
.category-card {
    position:relative;
    overflow:hidden;
    background:#fff;
    border:1px solid var(--color-gray-200);
    border-radius:22px;
    cursor:pointer;
    box-shadow:var(--shadow-sm);
    transition:transform .25s ease, box-shadow .25s ease;
}
.category-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); }
.category-image { position:relative; height:250px; padding:14px 18px; box-sizing:border-box; background:#fff; overflow:hidden; }
.category-image img { width:100%; height:100%; object-fit:contain; object-position:center; display:block; transition:transform .35s ease; }
.category-card:hover .category-image img { transform:scale(1.025); }
.category-count {
    position:absolute; top:14px; right:14px;
    padding:6px 10px; border-radius:999px;
    background:rgba(255,255,255,.9); color:var(--color-primary);
    font-size:12px; font-weight:700; backdrop-filter:blur(8px);
}
.category-card-body { padding:18px 20px 20px; }
.category-card-body h3 { font-size:1.05rem; margin:0 0 8px; }
.category-card-body p { color:var(--color-text-light); font-size:.86rem; }
.category-card-body p span { color:var(--color-accent); font-weight:800; }

@media (max-width: 768px) {
    .products-grid, .category-products-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
    .product-image { height:230px; }
    .product-info { padding:14px; }
    .product-card-top { min-height:72px; }
    .product-card-footer { flex-direction:column; align-items:stretch; }
    .product-cart-btn, .product-card-footer .btn { width:100%; }
}
@media (max-width: 520px) {
    .products-grid, .category-products-grid { grid-template-columns:1fr; }
    .product-image { height:290px; }
}

/* Подкатегории каталога */
.sidebar-subcategories {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    padding: 4px 14px 14px 52px;
}
.sidebar-subcategories button {
    border: 0;
    background: transparent;
    padding: 7px 8px;
    border-radius: 8px;
    text-align: left;
    color: var(--color-text-light, #777);
    cursor: pointer;
    font: inherit;
    transition: background .2s ease, color .2s ease;
}
.sidebar-subcategories button:hover {
    background: rgba(0,0,0,.05);
    color: var(--color-text, #222);
}
.category-filter-chip {
    white-space: nowrap;
}
@media (max-width: 700px) {
    .sidebar-subcategories { padding-left: 42px; }
}

/* Main-page popular slider: four equal, premium cards on desktop. */
.slider-track .product-card {
    flex: 0 0 calc((100% - 84px) / 4);
    min-width: 250px;
}

@media (max-width: 1100px) {
    .slider-track .product-card { flex-basis: 280px; }
}

@media (max-width: 600px) {
    .slider-track .product-card { flex-basis: min(82vw, 320px); min-width: 0; }
}