/* B2: listy produktów Vianek (szybkie przejścia między seriami, wyniki bez trafień). Ładowane po vianek-identity.css. */

/* ---------- serie marki: pasek pod hero ---------- */
.snav { border-bottom: 1px solid var(--line); background: var(--paper); }
.snav ul { display: flex; gap: 8px; margin: 0; padding: 14px var(--pad); list-style: none; overflow-x: auto; scrollbar-width: none; }
.snav ul::-webkit-scrollbar { display: none; }
.snav li { flex: 0 0 auto; }
.snav a { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 16px; border: 1px solid var(--line); background: var(--card, #fff); color: var(--ink); text-decoration: none; transition: border-color .25s, background-color .25s; }
.snav a::before { content: ""; flex: 0 0 auto; width: 10px; height: 10px; border-radius: 50%; background: var(--tint, var(--tint-fallback, #D8D2C8)); }
.snav .sn-all a::before { display: none; }
.snav a:hover { border-color: var(--ink); }
.snav a[aria-current] { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.sn-t { display: grid; gap: 2px; line-height: 1.15; }
.sn-t b { font-weight: 500; font-size: .95rem; }
.sn-t small { color: var(--muted); font-size: .75rem; letter-spacing: .04em; }

/* Vianek: karty serii z packshotem na pastelu z koloru produktu */
.snav-rich ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0; padding: 0; overflow: visible; }
.snav-rich li + li a { border-left: 0; }
.snav-rich a { gap: 14px; min-height: 0; padding: 12px 18px 12px 12px; border-top: 0; border-bottom: 0; background-color: color-mix(in oklab, var(--tint, var(--tint-fallback, #D8D2C8)) 14%, var(--paper)); }
@supports (color: oklch(from red l c h)) {
  .snav-rich a { background-color: oklch(from var(--tint, var(--tint-fallback, #D8D2C8)) .95 min(c, .03) h); }
}
.snav-rich a::before { display: none; }
.snav-rich img { width: 64px; height: 64px; object-fit: contain; mix-blend-mode: multiply; }
.snav-rich .sn-t b { font-size: 1.05rem; letter-spacing: .08em; text-transform: uppercase; }
.snav-rich a:hover, .snav-rich a[aria-current] { border-color: var(--line); box-shadow: inset 0 -3px 0 var(--ink); }
.snav-rich .sn-all a { background: var(--paper); }
@media (max-width: 760px) {
  .snav-rich ul { display: flex; overflow-x: auto; scrollbar-width: none; }
  .snav-rich li { flex: 0 0 auto; }
  .snav-rich a { padding: 10px 16px 10px 10px; }
  .snav-rich img { width: 48px; height: 48px; }
  .snav-rich .sn-t b { font-size: .9rem; }
}

/* ---------- wyniki wyszukiwania bez trafień: komunikat + bestsellery, bez panelu filtrów ---------- */
.plp-plain { display: block; }
.plp-plain .filters, .plp-plain .filters-scrim, .plp-plain .results-top, .plp-plain .active, .plp-plain .more-info { display: none !important; }
.plp-notice { padding: clamp(24px, 3vw, 40px) var(--pad) 8px; }
.plp-notice p { margin: 0 0 8px; max-width: 62ch; color: var(--muted); }
.plp-notice .plp-notice-t { font-size: clamp(1.25rem, 2vw, 1.6rem); color: var(--ink); }
.plp-notice a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.plp-notice .plp-notice-h { margin: clamp(24px, 3vw, 40px) 0 12px; font-size: clamp(1.4rem, 2.4vw, 2rem); font-weight: 400; }
body:has(.plp-plain) .bottomnav [data-act="filters"] { display: none; }

/* ---------- podpowiedzi: brak wyników + bestsellery ---------- */
.sg-fb-h { margin: 0; padding: 10px 16px 4px; font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }

/* telefon: zawsze dwie równe kolumny, także po „Pokaż więcej” */
@media (max-width: 760px) {
  .pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- G08b: wyniki wyszukiwania - zwarty ciemny nagłówek bez zdjęcia, odstęp od menu ---------- */
.cat-hero.is-search { min-height: 0; padding-top: calc(var(--hh) + clamp(28px, 4vw, 56px)); background: var(--ink, #1d1c1a); }
.cat-hero.is-search .cat-hero-shade { display: none; }
.cat-hero.is-search .cat-hero-in { padding-top: 0; padding-bottom: clamp(24px, 3vw, 40px); gap: 8px; }

/* ---------- L09b: długi opis w hero zwinięty do 4 linii + „więcej” ---------- */
.cat-lead.is-clamp { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; line-clamp: 4; overflow: hidden; }
.cat-lead-more { justify-self: start; margin-top: -6px; padding: 4px 0; background: none; border: 0; color: #fff; font: 500 .75rem/1.2 var(--f); letter-spacing: .16em; text-transform: uppercase; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; text-shadow: 0 1px 3px rgba(0, 0, 0, .28), 0 2px 22px rgba(0, 0, 0, .38); }
html:not(.js) .cat-lead.is-clamp { display: block; }
html:not(.js) .cat-lead-more { display: none; }
@media (max-width: 760px) { .cat-lead.is-clamp { -webkit-line-clamp: 5; line-clamp: 5; } }