/* ==========================================================================
   Категория — баннер, подкатегории, фильтры чипами над сеткой + панель
   «Все фильтры», сортировка, сетка карточек, «Показать ещё», SEO-текст
   ========================================================================== */

/* баннер категории (без листьев — они не должны мешать товарам) */
.cat-hero{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;background:var(--surface);border-radius:var(--r-xl);padding:clamp(20px,3vw,36px) clamp(20px,3.5vw,44px);margin-bottom:clamp(16px,2vw,24px);position:relative;overflow:hidden}
.cat-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(50% 80% at 100% 50%,rgba(141,178,78,.14),transparent 70%);pointer-events:none}
.cat-hero>*{position:relative}
.cat-hero h1{font-size:clamp(28px,3.4vw,44px);margin-bottom:8px}
/* счётчик рядом с заголовком, но не внутри H1 */
.cat-hero__title{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:.3em;margin-bottom:8px}.cat-hero__title h1{margin-bottom:0}
.cat-hero__count{font-size:14px;color:var(--muted);font-weight:500}
.cat-hero p{color:var(--text-2);font-size:15px;max-width:60ch;margin-top:8px}
.cat-hero__img{width:clamp(140px,18vw,240px);height:auto;filter:drop-shadow(0 18px 22px rgba(20,20,20,.14))}
.cat-hero__facts{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px}
.cat-hero__facts span{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--text-2)}
.cat-hero__facts .i{width:16px;height:16px;color:var(--green)}
@media (max-width:640px){.cat-hero{grid-template-columns:1fr;text-align:left}.cat-hero__img{display:none}.cat-hero{padding:18px 18px}}

/* подкатегории */
.subcats{margin-bottom:clamp(16px,2vw,24px)}

/* панель фильтров над сеткой */
.fbar{position:sticky;top:calc(var(--hdr-compact) + 8px);z-index:20;display:flex;align-items:center;gap:10px;padding:10px 12px;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:var(--r-md);margin-bottom:clamp(14px,2vw,20px);border:1px solid var(--hairline)}
.fbar__chips{display:flex;gap:8px;flex:1;flex-wrap:wrap;padding:2px}
.fbar__chips::-webkit-scrollbar{display:none}
.fchip{position:relative;flex:none}
.fchip .chip .i--chev{width:14px;height:14px;opacity:.6;transition:transform .2s}
.fchip.is-open .chip .i--chev{transform:rotate(180deg)}
.fchip .chip .cnt{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--green);color:#fff;font-size:11px;margin-left:2px}
.fchip__pop{position:absolute;left:0;top:calc(100% + 8px);min-width:240px;max-width:320px;background:#fff;border-radius:var(--r-md);box-shadow:var(--shadow-panel);padding:14px;display:none;z-index:30}
.fchip.is-open .fchip__pop{display:block;animation:fadeIn .2s var(--ease)}
.fchip__pop .check{padding:7px 2px}
.fchip__pop .check:hover{color:var(--green)}
.fchip__foot{display:flex;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.fchip__foot .btn{flex:1}
.fbar__all{flex:none}
.fbar__sort{flex:none;display:flex;align-items:center;gap:8px}
.fbar__sort .select{height:40px;padding:0 40px 0 14px;font-size:14px;font-weight:600;border-radius:var(--r-pill);width:auto;background-position:right 12px center}
.fbar__view{display:flex;gap:2px;flex:none;background:var(--surface-2);border-radius:10px;padding:2px}
.fbar__view button{width:36px;height:36px;border-radius:8px;display:grid;place-items:center;color:var(--muted);transition:background .2s,color .2s}
.fbar__view button.is-active{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.fbar__view .i{width:18px;height:18px}
.fbar__all-s,.fbar__sort-ic{display:none}
/* телефон: одна строка — «Фильтры», прокручиваемые чипы, сортировка значком; при прокрутке вниз панель уезжает */
@media (max-width:860px){
  .fbar{flex-wrap:nowrap;top:calc(var(--hdr-compact) + 4px);padding:6px;gap:6px;border-radius:12px;transition:transform .25s var(--ease-out),opacity .2s}
  .fbar.is-away{transform:translateY(calc(-100% - var(--hdr-compact) - 12px));opacity:0;pointer-events:none}
  .fbar__all{order:0;flex:none;height:40px;padding:0 12px}
  .fbar__all-l{display:none}
  .fbar__all-s{display:inline}
  .fbar__chips{order:1;flex:1;min-width:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding:2px 0;-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent)}
  .fbar__chips::-webkit-scrollbar{display:none}
  .fbar__chips .chip{height:36px;padding:0 12px;font-size:13px}
  .fbar__sort{order:2;flex:none;position:relative;width:40px;height:40px;border-radius:var(--r-pill);border:1.5px solid var(--line-2);background:#fff;display:grid;place-items:center}
  .fbar__sort-ic{display:block;width:18px;height:18px}
  .fbar__sort .select{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
  .fbar__view{display:none}
  .fchip__pop{display:none!important}
}

/* активные фильтры */
.active-filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:-4px 0 18px}
.active-filters .chip{background:var(--tint);border-color:transparent;color:var(--green-deep);height:34px;padding:0 10px 0 14px}
.active-filters .chip:hover{color:var(--danger)}
.active-filters .reset{font-size:13px;font-weight:600;color:var(--muted);margin-left:4px}
.active-filters .reset:hover{color:var(--ink)}

/* сетка товаров */
.plist{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.plist.is-list{grid-template-columns:1fr}
.plist.is-list .pcard{flex-direction:row;gap:20px}
.plist.is-list .pcard__media{width:220px;flex:none}
.plist.is-list .pcard__body{padding-top:8px}
.plist.is-list .pcard__name{-webkit-line-clamp:1;min-height:0;font-size:17px}
.plist.is-list .pcard__cta{max-width:340px}
@media (max-width:1100px){.plist{grid-template-columns:repeat(3,1fr)}}
@media (max-width:640px){.plist{grid-template-columns:repeat(2,1fr);gap:10px}}

/* «показать ещё» и пагинация */
.more{display:grid;justify-items:center;gap:14px;margin-top:clamp(24px,3vw,36px)}
.more__bar{width:200px;height:4px;border-radius:2px;background:var(--line)}
.more__bar i{display:block;height:100%;border-radius:2px;background:var(--green);width:var(--p,30%)}
.more small{color:var(--muted)}

/* панель «Все фильтры» */
.fpanel .drawer__body{padding:8px 24px 20px}
.fgroup{border-bottom:1px solid var(--line);padding:14px 0}
.fgroup summary{list-style:none;display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:15px;cursor:pointer;padding:6px 0}
.fgroup summary::-webkit-details-marker{display:none}
.fgroup summary .i{width:18px;height:18px;transition:transform .25s var(--ease);color:var(--muted)}
.fgroup[open] summary .i{transform:rotate(180deg)}
.fgroup__body{padding-top:8px;display:grid;gap:2px}
.fgroup__body .check{padding:6px 2px}
.fgroup__swatches{display:flex;gap:10px;flex-wrap:wrap;padding:8px 2px}
.fgroup__swatches .swatch{width:28px;height:28px}
.range{padding:10px 8px 6px}
.range__inputs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
.range__inputs .input{height:42px;font-size:14px;padding:0 12px}
.noUi-target{border:0;box-shadow:none;background:var(--line-2);height:4px}
.noUi-connect{background:var(--green)}
.noUi-horizontal .noUi-handle{width:22px;height:22px;border-radius:50%;border:3px solid var(--green);background:#fff;box-shadow:none;top:-9px;right:-11px;cursor:grab}
.noUi-handle::before,.noUi-handle::after{display:none}
.fpanel__count{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--text-2)}
.fpanel__count b{color:var(--ink)}

/* SEO-текст и FAQ внизу категории */
.seo-text{background:var(--surface);border-radius:var(--r-xl);padding:clamp(22px,3vw,36px);display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(20px,3vw,40px);margin-top:clamp(32px,5vw,64px)}
.seo-text h2{font-size:clamp(22px,2.4vw,30px);margin-bottom:12px}
.seo-text p{color:var(--text-2);font-size:15px;line-height:1.6}
.seo-text .acc{border:0}
.seo-text .acc__item summary{font-size:15px;padding:14px 0}
@media (max-width:900px){.seo-text{grid-template-columns:1fr}}

/* пустой результат */
.plist-empty{grid-column:1/-1}

/* панель фильтров на мобильном превращается в нижнюю шторку */
@media (max-width:860px){
  .fpanel{top:auto;left:0;right:0;bottom:0;width:100%;max-height:88vh;border-radius:var(--r-xl) var(--r-xl) 0 0;transform:translateY(105%)}
  .fpanel.is-open{transform:none}
  .fpanel .drawer__head{padding:14px 20px}
  .fpanel .drawer__body{padding:4px 20px 16px}
}
/* вход в подбор смартфона из шапки разделов iPhone и Samsung */
.cat-hero__quiz{display:inline-flex;align-items:center;gap:8px;margin:2px 0 12px;font-size:14px;font-weight:600;color:var(--green-deep)}
.cat-hero__quiz .i{width:18px;height:18px;color:var(--green)}
.cat-hero__quiz .i:last-child{width:16px;height:16px;transition:transform .25s var(--ease)}
.cat-hero__quiz:hover .i:last-child{transform:translateX(3px)}
