/* =================================================================
   /catalog/{slug}/ (parent-category) — редизайн по Figma 257-13740
   Пилюли подкатегорий не трогаются — только секции и SEO-блок.
   ================================================================= */

:root {
    --pc-bg: #F5F7F8;
    --pc-card: #FFFFFF;
    --pc-card-strip: #EFEEEA;     /* бежевый strip как у viewed/top */
    --pc-accent: #8074C5;
    --pc-accent-hover: #6F62B8;
    --pc-text: #111112;
    --pc-muted: #5A656E;
    --pc-muted-2: #898E92;
    --pc-border: #D4DFE1;
}

/* ===== Заголовок страницы — название + (N товарів) + (N відгуків) ===== */
.parent-category__header {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px;
    padding: 24px 4px 12px;
    margin-bottom: 18px;
}
.parent-category__title {
    font-weight: 700;
    font-size: 44px;
    line-height: 1;
    margin: 0;
    color: var(--pc-text);
}
.parent-category__meta {
    display: inline-flex;
    align-items: center;
    gap: 24px;
    color: var(--pc-muted);
    font-size: 14px;
    padding-top: 14px;
}
.parent-category__count {
    color: var(--pc-muted);
}
.parent-category__rating {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--pc-text);
    font-weight: 500;
}
.parent-category__rating svg { color: #FFB800; }
.parent-category__reviews { color: var(--pc-muted-2); margin-left: 4px; }

/* ===== Каждая «strip»-секция подкатегории (как Block 3 на странице товара) ===== */
.subcategory-section {
    position: relative;
    border-radius: 48px;
    padding: 24px 24px 36px;
    margin: 0 0 24px;
    isolation: isolate;
}
/* Чередование фонов: нечетные — бежевый, четные — голубой (как в Figma) */
.subcategory-section:nth-of-type(odd)  { background: #EFEEEA; }   /* warm beige */
.subcategory-section:nth-of-type(even) { background: #E6F1F3; }   /* cool blue-grey */

/* Кнопка «Подивитись всі» в правом верхнем углу */
.subcategory-section__all {
    position: absolute;
    top: 24px; right: 24px;
    display: inline-flex; align-items: center; gap: 10px;
    padding: 12px 24px;
    background: #fff;
    border-radius: 36px;
    color: var(--pc-text);
    text-decoration: none;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    z-index: 3;
    transition: background .15s, color .15s;
}
.subcategory-section__all:hover {
    background: var(--pc-accent);
    color: #fff;
}
.subcategory-section__all svg { width: 16px; height: 16px; }

/* Header — Title + Description в центр */
.subcategory-section__header {
    display: block;          /* override старого flex justify-between */
    text-align: center;
    padding: 12px 240px 24px;
    margin: 0;
}
.subcategory-section__info {
    text-align: center;
}
.subcategory-section__title {
    font-weight: 700;
    font-size: 44px;
    line-height: 1.1;
    margin: 0 0 8px;
    color: var(--pc-text);
}
.subcategory-section__title a {
    color: var(--pc-text);
    text-decoration: none;
}
.subcategory-section__title a:hover {
    color: var(--pc-accent);
}
.subcategory-section__desc {
    font-weight: 300;
    font-size: 18px;
    line-height: 24px;
    color: var(--pc-muted);
    margin: 0 auto;
    max-width: 720px;
}

/* Pagination над товарами */
.subcategory-section__pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 18px;
}
.subcategory-section__pager-btn {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: #fff;
    border: 0;
    color: var(--pc-text);
    cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background .15s, color .15s;
}
.subcategory-section__pager-btn:hover { background: var(--pc-accent); color: #fff; }
.subcategory-section__pager-btn:disabled { opacity: .35; cursor: default; pointer-events: none; }
.subcategory-section__pager-dots {
    display: inline-flex; align-items: center; gap: 6px;
    background: #fff;
    border-radius: 36px;
    padding: 0 18px;
    height: 36px;
}
.subcategory-section__pager-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #D4DFE1;
    transition: background .2s;
}
.subcategory-section__pager-dot.is-active { background: var(--pc-accent); }

/* Карточки товаров — 4 в ряд (Figma) */
.subcategory-section__products {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
}
.subcategory-section__products .product-card,
.subcategory-section__products .product-card--compact {
    background: #fff;
    border-radius: 36px;
    padding: 12px 12px 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: relative;
    transition: transform .2s, box-shadow .2s;
}
.subcategory-section__products .product-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(17,17,18,0.06);
}
.subcategory-section__products .product-card__image {
    aspect-ratio: 1 / 1;
    background: #fff;
    border-radius: 24px;
    overflow: hidden;
    display: block;
}
.subcategory-section__products .product-card__image img {
    width: 100%; height: 100%; object-fit: contain;
}
.subcategory-section__products .product-card__badge {
    position: absolute;
    top: 22px; left: 22px;
    background: #E8E7E5;
    color: var(--pc-text);
    border-radius: 24px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
    z-index: 2;
}
.subcategory-section__products .product-card__favorite {
    position: absolute;
    top: 22px; right: 22px;
    width: 36px; height: 36px;
    border-radius: 50%;
    background: #fff;
    border: 0;
    color: var(--pc-muted);
    cursor: pointer;
    z-index: 2;
    display: inline-flex; align-items: center; justify-content: center;
    transition: color .2s;
}
.subcategory-section__products .product-card__favorite:hover { color: #e11d48; }
.subcategory-section__products .product-card__favorite.is-active {
    color: #fff; background: #e11d48;
}
.subcategory-section__products .product-card__content {
    display: flex; flex-direction: column; gap: 10px;
    padding: 0 12px;
}
.subcategory-section__products .product-card__title {
    font-size: 16px;
    line-height: 24px;
    color: var(--pc-text);
    text-decoration: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 48px;
}
.subcategory-section__products .product-card__title:hover { color: var(--pc-accent); }
.subcategory-section__products .product-card__rating {
    display: inline-flex; gap: 1px;
}
.subcategory-section__products .product-card__rating svg.empty { fill: #D4DFE1; }
.subcategory-section__products .product-card__rating svg.filled { fill: #FFB800; }
.subcategory-section__products .product-card__price-row {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px;
    margin-top: auto;
}
.subcategory-section__products .product-card__price {
    display: flex; flex-direction: column; gap: 2px;
}
.subcategory-section__products .product-card__old-price {
    font-size: 12px;
    line-height: 12px;
    color: var(--pc-muted);
    text-decoration: line-through;
}
.subcategory-section__products .product-card__current-price {
    font-weight: 700;
    font-size: 24px;
    line-height: 24px;
    color: var(--pc-text);
}
.subcategory-section__products .product-card__cart-btn {
    background: var(--pc-accent);
    color: #fff;
    border: 0;
    width: 42px; height: 42px;
    border-radius: 36px;
    cursor: pointer;
    flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background .15s, transform .1s;
}
.subcategory-section__products .product-card__cart-btn:hover { background: var(--pc-accent-hover); }
.subcategory-section__products .product-card__cart-btn:active { transform: scale(0.92); }

/* Бренды внизу секции — горизонтальный список логотипов */
.subcategory-section__brands {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin: 24px 0 0;
    padding: 0;
    order: 99;             /* Гарантируем что бренды снизу */
}
.subcategory-section__brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 24px;
    min-width: 140px;
    background: #fff;
    border-radius: 999px;
    color: var(--pc-text);
    text-decoration: none;
    font-weight: 500;
    font-size: 14px;
    transition: background .15s, color .15s;
}
.subcategory-section__brand:hover {
    background: var(--pc-accent);
    color: #fff;
}

/* Включаем flex чтобы order работал */
.subcategory-section {
    display: flex;
    flex-direction: column;
}

/* ===== SEO-баннер ===== */
.category-seo-content--seo-text {
    margin: 24px 0 0;
}
.category-seo-content__inner {
    background: #fff;
    border-radius: 48px;
    padding: 48px 56px;
    position: relative;
}
.category-seo-content__text {
    max-width: 1200px;
    color: var(--pc-muted);
    font-size: 15px;
    line-height: 1.6;
}
.category-seo-content__text h2,
.category-seo-content__text h3 {
    color: var(--pc-text);
    font-weight: 700;
    margin: 18px 0 12px;
}
.category-seo-content__text h2 { font-size: 24px; }
.category-seo-content__text h3 { font-size: 18px; }
.category-seo-content__text p { margin: 0 0 14px; }

/* ===== Адаптив ===== */
@media (max-width: 1200px) {
    .subcategory-section__header { padding: 12px 120px 24px; }
    .subcategory-section__products { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
    .subcategory-section { border-radius: 32px; padding: 18px 18px 24px; }
    .subcategory-section__all {
        position: static;
        margin: 0 auto 12px;
    }
    .subcategory-section__header { padding: 0 0 18px; }
    .subcategory-section__title { font-size: 32px; }
    .subcategory-section__desc { font-size: 16px; }
    .subcategory-section__products { grid-template-columns: repeat(2, 1fr); }
    .parent-category__title { font-size: 32px; }
    .category-seo-content__inner { padding: 28px 24px; border-radius: 32px; }
}
@media (max-width: 600px) {
    .subcategory-section__title { font-size: 26px; }
    .subcategory-section__products { grid-template-columns: 1fr; gap: 12px; }
    .subcategory-section__brands { gap: 6px; }
    .subcategory-section__brand { padding: 8px 14px; font-size: 13px; min-width: 0; }
}