/* Kategoria / sklep (Kategoria.dc.html) */
.ss-shop__head { padding-top: 28px; }
.ss-shop__title { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 32px; align-items: end; margin-top: 20px; }
.ss-theme .ss-shop__title h1 { font-size: 44px; line-height: 1; letter-spacing: -.03em; }
.ss-shop__title p { font-size: 15.5px; line-height: 1.55; color: var(--ss-body-2); text-wrap: pretty; }
.ss-shop__head .ss-chips { margin-top: 28px; }

/* Baner kategorii: zdjęcie na całą szerokość kontenera + tytuł i opis na przyciemnieniu. */
.ss-catban { position: relative; margin-top: 20px; border-radius: var(--ss-r-2xl); overflow: hidden; min-height: 320px; display: flex; align-items: center; background-size: cover; background-position: center; }
.ss-catban::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(26,29,45,.86) 0%, rgba(26,29,45,.72) 38%, rgba(26,29,45,.15) 78%, rgba(26,29,45,0) 100%); }
.ss-catban__copy { position: relative; display: flex; flex-direction: column; gap: 14px; padding: 48px; max-width: 620px; color: #fff; }
.ss-theme .ss-catban h1 { font-size: 44px; line-height: 1.02; letter-spacing: -.03em; color: #fff; margin: 0; }
.ss-catban p { font-size: 15.5px; line-height: 1.6; color: rgba(255,255,255,.88); text-wrap: pretty; margin: 0; }
/* Wariant bez zdjęcia klienta: gradient marki + produkt kategorii po prawej. */
.ss-catban--grad { min-height: 280px; justify-content: space-between; gap: 24px; }
.ss-catban--grad::before { content: none; }
.ss-catban--grad .ss-catban__copy { padding: 40px 48px; color: var(--ss-ink); }
.ss-theme .ss-catban--grad h1 { color: var(--ss-ink); }
.ss-catban--grad p { color: var(--ss-body); }
/* Poświata leży pod produktem: oba elementy mają z-index auto, więc decyduje kolejność
   w DOM. Nie nadawać z-index ani kontekstu układania - zepsułoby mix-blend-mode. */
.ss-catban__glow { position: absolute; right: 40px; top: 50%; transform: translateY(-50%); width: min(440px, 46%); height: 260px; border-radius: 50%; background: radial-gradient(closest-side, rgba(255,255,255,.95) 0%, rgba(255,255,255,.85) 48%, rgba(255,255,255,0) 100%); pointer-events: none; }
.ss-catban__prod { position: relative; flex: none; display: block; width: min(420px, 42%); height: 240px; margin-right: 40px; background-size: contain; background-position: center; background-repeat: no-repeat; mix-blend-mode: multiply; }

@media (max-width: 860px) {
	.ss-catban { min-height: 260px; }
	.ss-catban::before { background: linear-gradient(180deg, rgba(26,29,45,.45) 0%, rgba(26,29,45,.85) 100%); }
	.ss-catban__copy { padding: 28px 24px; max-width: none; }
	.ss-theme .ss-catban h1 { font-size: 32px; }
	.ss-catban--grad { flex-direction: column-reverse; min-height: 0; }
	.ss-catban--grad .ss-catban__copy { padding: 0 24px 28px; }
	.ss-catban__prod { width: 70%; height: 180px; margin: 24px auto 0; }
	.ss-catban__glow { right: auto; left: 50%; top: 24px; transform: translateX(-50%); width: 80%; height: 200px; }
}
.ss-shop__body { padding-top: 32px; padding-bottom: 80px; display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 40px; align-items: start; }

.ss-filters { display: flex; flex-direction: column; gap: 28px; position: sticky; top: 132px; }
.admin-bar .ss-filters { top: 164px; }
.ss-filters__g { display: flex; flex-direction: column; gap: 10px; }
.ss-filters__g:first-child { gap: 12px; }
.ss-filters__h { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ss-muted); }
.ss-filters__price { display: flex; gap: 8px; align-items: center; }
.ss-filters__price span { color: var(--ss-muted); }
.ss-filters__price input { width: 0; flex: 1; height: 42px; border: 1px solid var(--ss-border); border-radius: 8px; padding: 0 12px; background: #fff; font-size: 16px; color: var(--ss-ink); -moz-appearance: textfield; }
.ss-filters__price input::-webkit-inner-spin-button, .ss-filters__price input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.ss-filters input[type=range] { width: 100%; accent-color: var(--ss-ink); margin: 2px 0; }

.ss-shop__main { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.ss-shop__bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.ss-shop__count { font-size: 14px; color: var(--ss-body-2); }
.ss-sort { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--ss-body-2); }
.ss-sort select { height: 40px; border: 1px solid var(--ss-border); border-radius: 8px; padding: 0 12px; background: #fff; color: var(--ss-ink); font-size: 16px; }
.ss-shop__main .ss-grid--3 { gap: 20px 20px; }

.ss-seo { margin-top: 32px; padding: 32px; background: #fff; border: 1px solid var(--ss-border); border-radius: 16px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 32px; }
.ss-theme .ss-seo h2 { font-size: 24px; letter-spacing: -.02em; line-height: 1.15; }
.ss-seo > div { font-size: 14.5px; line-height: 1.65; color: var(--ss-body-2); display: flex; flex-direction: column; gap: 12px; }

.ss-filters__top, .ss-filters-btn, .ss-filters-bg, .ss-filters__cats { display: none; }
@media (max-width: 860px) {
	.ss-theme .ss-filters { position: fixed; top: 0; left: 0; bottom: 0; z-index: 121; width: min(360px, 88vw); display: flex; flex-direction: column; gap: 24px; background: #fff; padding: 16px 20px 32px; overflow-y: auto; transform: translateX(-104%); transition: transform .22s ease; box-shadow: 0 0 40px rgba(42,46,69,.2); }
	.ss-theme .ss-filters.is-open { transform: none; }
	.ss-filters > * { flex-shrink: 0; }
	.ss-filters__top { display: flex; align-items: center; justify-content: space-between; font-family: var(--ss-font-display); font-weight: 700; font-size: 20px; }
	.ss-filters-bg:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 120; background: rgba(42,46,69,.45); }
	.ss-filters-btn { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border: 1px solid var(--ss-ink); border-radius: 8px; background: #fff; color: var(--ss-ink); font-size: 14px; font-weight: 700; }
	.ss-filters-btn span { min-width: 20px; height: 20px; border-radius: 10px; background: var(--ss-ink); color: #fff; font-size: 11px; display: inline-flex; align-items: center; justify-content: center; }
	.ss-shop__bar { gap: 10px; }
	.ss-shop__count { order: 3; flex-basis: 100%; }
	.ss-sort select { max-width: 190px; }
	.ss-shop__head .ss-chips { display: none; }
	.ss-filters__cats { display: flex; gap: 2px; }
	.ss-filters__cats .ss-filters__h { margin-bottom: 6px; }
	.ss-filters__cats a { padding: 10px 12px; border-radius: 8px; font-size: 15px; font-weight: 600; color: var(--ss-ink); }
	.ss-theme .ss-filters__cats a.is-on { background: var(--ss-ink); color: #fff; }
}