/* ============================================================
   PVGroup.pl — warstwa wizualna archiwum marki (/marka/{slug}/)
   Design system: IBM Carbon (kanciasty, navy/pomarancz).

   Zrodlo makiety: makieta HTML zatwierdzona 2026-08-25
   (_raporty/marka-growatt-2026-08-25/07-WDROZENIE-DESIGN.md).

   Arkusz laduje sie WYLACZNIE na is_tax('marka') i tylko wtedy, gdy opis
   termu zawiera marker `npv-hero` — patrz
   NovaPVGroup_Shop_Layout::brand_design_active().

   Zasady, ktore trzymaja ten plik przy zyciu:
   1. Wszystko jest zagniezdzone pod `.npv-brand` — opis marki idzie przez
      wp_filter_post_kses, wiec markup nie moze polegac na <style> ani <script>,
      a klasy `npv-*` sa krotkie i moglyby kolidowac z innymi arkuszami.
   2. ZERO wartosci sterujacych w atrybucie style="" w tresci. kses przepuszcza
      style, ale safecss_filter_attr wycina custom properties (--pct) i czesc
      wlasciwosci. Kazda zmienna wizualna ma tu wlasny modyfikator klasy.
   3. Pelna szerokosc sekcji robimy przez box-shadow + clip-path, NIE przez
      100vw — 100vw liczy sie z paskiem przewijania i dawaloby poziomy scroll.
   4. Brak trybu ciemnego. Makieta miala przelacznik motywu dla recenzenta;
      serwis jest jasny, wiec @media (prefers-color-scheme: dark) tylko
      rozjechalby sie z motywem Astra.
   5. Brak IBM Plex Mono — motyw potomny hostuje wylacznie IBM Plex Sans
      (astra-child/fonts, waga zmienna 300–600). Liczby ida systemowym
      monospace z cyframi tabelarycznymi.
   ============================================================ */

.npv-brand{
  --npv-navy:#1B2A4A;
  --npv-orange:#F28C00;
  --npv-orange-ink:#8a5000;
  --npv-green:#6EB92B;

  --npv-bg:#ffffff;
  --npv-surface:#f4f4f4;
  --npv-surface-2:#e8e8e8;
  --npv-border:#c6c6c6;
  --npv-border-soft:#dcdcdc;
  --npv-text:#1B2A4A;
  --npv-text-2:#525252;
  --npv-text-3:#6f6f6f;

  --npv-dark:#1B2A4A;
  --npv-dark-2:#22335a;
  --npv-dark-3:#2b3f6b;
  --npv-dark-border:#374c7a;
  --npv-on-dark:#ffffff;
  --npv-on-dark-2:#b9c4d8;

  --npv-sec:clamp(40px,6vw,80px);
  --npv-mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;

  font-family:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  font-size:16px;
  line-height:1.6;
  color:var(--npv-text);
}

.npv-brand *,
.npv-brand *::before,
.npv-brand *::after{box-sizing:border-box}

.npv-brand img{max-width:100%; height:auto; display:block}
.npv-brand a{color:inherit}
.npv-brand h2,
.npv-brand h3,
.npv-brand h4{margin:0; line-height:1.18; letter-spacing:-.01em; font-weight:400; color:var(--npv-text)}
.npv-brand p{margin:0 0 1em}
.npv-brand p:last-child{margin-bottom:0}
.npv-brand ul,
.npv-brand ol{margin:0; padding:0; list-style:none}
.npv-brand li{margin:0}
.npv-brand strong{font-weight:600}
.npv-brand [id]{scroll-margin-top:96px}
.npv-brand .mono{font-family:var(--npv-mono); font-variant-numeric:tabular-nums}
.npv-brand .npv-vh{position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0}

/* ------------------------------------------------------------
   Sekcje pelnej szerokosci (bleed) + KONTRAKT WARSTW.

   TECHNIKA. Tlo wychodzi poza kontener motywu przez box-shadow (maluje
   kolor w bok) + clip-path (przycina go do wysokosci sekcji). Po audycie
   2026-08-25 technika ZOSTAJE, bo jako jedyna nie powieksza obszaru
   przewijania: cien to sam tusz, nie pudelko — nie wchodzi do scrollable
   overflow. Alternatywy odrzucone pomiarem, nie z gustu:
     - `width:100vw` / `margin-inline:calc(50% - 50vw)` — 100vw liczy sie
       z paskiem przewijania, wiec na desktopie daje poziomy scroll;
     - `::before{position:absolute; inset:0 -100vmax}` — pseudo-element
       wychodzacy w PRAWO powieksza obszar przewijania: ten sam skutek;
     - tlo na kontenerze nadrzednym — czesc opisu renderuje sie POD petla
       produktow, wewnatrz kolumny `.pvg-shop-main` siatki filtrow, wiec
       nie ma tu kontenera pelnej szerokosci, na ktorym mozna je namalowac.

   KONTRAKT WARSTW — naprawa 2026-08-25, regresja wprowadzona w v3.216.0.
   `clip-path` tworzy kontekst nakladania, a element tworzacy taki kontekst
   bez `position` maluje sie tak, jakby mial `z-index:0` — czyli w tej samej
   warstwie co przyklejony `.pvg-sidebar` (`position:sticky`, `z-index:auto`
   w shop-v2.css). W jednej warstwie wygrywa element pozniejszy w drzewie,
   a opis marki idzie pod petla produktow, WEWNATRZ `.pvg-shop-main` — czyli
   za paskiem filtrow. Skutek na produkcji: przy przewijaniu tlo sekcji
   zamalowywalo pasek filtrow (pomiar: 48 z 54 sond w obrysie paska mialo
   kolor #1B2A4A). Dlatego kolejnosc warstw jest tu ustalona jawnie:
     - `.pvg-shop-main` dostaje wlasny kontekst nakladania, wiec zadna
       sekcja nie moze sie z niego wydostac,
     - `.pvg-sidebar` idzie nad ten kontekst,
     - sekcje dostaja jawne `z-index:0`, zeby nie liczyc na kolejnosc w DOM.
   `isolation:isolate` zamiast `position:relative` — nie zmienia bloku
   zawierajacego dla pozycjonowanych potomkow siatki produktow.
   Ponizej 961 px `.pvg-sidebar` jest szuflada `position:fixed; z-index:9999`
   z podkladem 9998 (shop-v2.css) — nasza regula ma wyzsza specyficznosc,
   wiec MUSI byc zamknieta w `min-width:961px`, inaczej szuflada wpadnie
   pod wlasny podklad.
   ------------------------------------------------------------ */
.npv-brand .npv-sec{padding-block:var(--npv-sec)}
.npv-brand .npv-shell{max-width:100%}

body.npv-brand-design .pvg-shop-main{isolation:isolate}
@media (min-width:961px){
  body.npv-brand-design .pvg-sidebar{z-index:3}
}
.npv-brand .npv-sec--surface,
.npv-brand .npv-sec--dark,
.npv-brand .npv-stats{position:relative; z-index:0}
.npv-brand .npv-hero,
.npv-brand .npv-final{z-index:0}

.npv-brand .npv-sec--surface{
  background:var(--npv-surface);
  box-shadow:0 0 0 100vmax var(--npv-surface);
  clip-path:inset(0 -100vmax);
}
.npv-brand .npv-sec--dark{
  background:var(--npv-dark);
  box-shadow:0 0 0 100vmax var(--npv-dark);
  clip-path:inset(0 -100vmax);
  color:var(--npv-on-dark);
}
.npv-brand .npv-sec--dark h2,
.npv-brand .npv-sec--dark h3,
.npv-brand .npv-sec--dark h4{color:var(--npv-on-dark)}
.npv-brand .npv-sec--dark p{color:var(--npv-on-dark-2)}
.npv-brand .npv-sec--dark p strong{color:var(--npv-on-dark)}

/* ------------------------------------------------------------
   HERO (renderowany NAD lista produktow)
   ------------------------------------------------------------ */
/* Blok nad lista produktow: H1 motywu + hero. H1 zostaje w DOM motywu
   (jeden H1 na stronie), tu tylko dostaje skale typograficzna makiety. */
body.npv-brand-design .woocommerce-products-header__title{
  font-family:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  font-size:clamp(28px,4.2vw,42px);
  font-weight:300;
  letter-spacing:-.02em;
  line-height:1.12;
  color:#1B2A4A;
  max-width:22ch;
  margin-bottom:4px;
}
.npv-brand.pvg-marka-lead{margin-bottom:0}
/* znacznik podzialu opisu — nosnik dla PHP, nie element wizualny */
.npv-brand .npv-split{display:none}

.npv-brand .npv-hero{
  position:relative;
  background:var(--npv-dark);
  box-shadow:0 0 0 100vmax var(--npv-dark);
  clip-path:inset(0 -100vmax);
  color:var(--npv-on-dark);
  margin-top:20px;
}
.npv-brand .npv-hero__in{
  position:relative;
  display:grid;
  gap:clamp(24px,4vw,56px);
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  align-items:center;
  padding-block:clamp(32px,4.5vw,56px);
}
@media (max-width:900px){.npv-brand .npv-hero__in{grid-template-columns:1fr}}

.npv-brand .npv-hero__logo{height:clamp(24px,3.2vw,32px); width:auto; margin-bottom:22px}
.npv-brand .npv-hero p{color:var(--npv-on-dark-2)}
.npv-brand .npv-hero__lead{font-size:clamp(16px,1.5vw,18px); max-width:56ch; font-weight:300}
.npv-brand .npv-hero__lead strong{color:var(--npv-on-dark); font-weight:600}

.npv-brand .npv-eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--npv-mono); font-size:11.5px; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:var(--npv-orange);
  margin-bottom:16px;
}
.npv-brand .npv-eyebrow::before{content:""; width:26px; height:2px; background:var(--npv-orange)}

/* certyfikat w hero */
.npv-brand .npv-cert{
  margin-top:26px; display:grid; grid-template-columns:auto 1fr;
  border:1px solid var(--npv-dark-border); background:rgba(255,255,255,.035);
}
.npv-brand .npv-cert__mark{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:16px 20px; border-right:1px solid var(--npv-dark-border); background:rgba(110,185,43,.10);
  font-family:var(--npv-mono); font-size:9.5px; letter-spacing:.1em; color:var(--npv-on-dark-2);
}
/* ptaszek rysowany CSS-em — inline <svg> nie przechodzi przez kses */
.npv-brand .npv-cert__mark::before{
  content:""; width:9px; height:16px; margin-bottom:8px;
  border:solid var(--npv-green); border-width:0 2px 2px 0; transform:rotate(42deg);
}
.npv-brand .npv-cert__body{padding:14px 18px; min-width:0}
.npv-brand .npv-cert__no{
  font-family:var(--npv-mono); font-size:clamp(18px,2.4vw,24px); font-weight:500;
  letter-spacing:.02em; word-break:break-all; color:var(--npv-on-dark);
}
.npv-brand .npv-cert__meta{font-size:13px; color:var(--npv-on-dark-2); margin:2px 0 0}
.npv-brand .npv-cert__meta a{color:var(--npv-orange); text-decoration:underline; text-underline-offset:3px}
@media (max-width:520px){
  .npv-brand .npv-cert{grid-template-columns:1fr}
  .npv-brand .npv-cert__mark{flex-direction:row; gap:10px; justify-content:flex-start; border-right:0; border-bottom:1px solid var(--npv-dark-border)}
  .npv-brand .npv-cert__mark::before{margin-bottom:0}
}

/* hero — kompozycja zdjec */
.npv-brand .npv-hero__art{position:relative; display:grid; grid-template-columns:repeat(12,1fr); align-items:end}
.npv-brand .npv-hero__art > div{position:relative; margin:0}
.npv-brand .npv-hero__art img{width:100%; height:auto; filter:drop-shadow(0 26px 46px rgba(0,0,0,.5))}
.npv-brand .npv-hero__inv{grid-column:4 / 13; grid-row:1; justify-self:end; z-index:2; width:100%; max-width:400px}
.npv-brand .npv-hero__bat{grid-column:1 / 8; grid-row:1; justify-self:start; z-index:1; width:100%; max-width:250px; padding-bottom:38px; opacity:.95}
.npv-brand .npv-hero__cap{
  font-family:var(--npv-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--npv-on-dark-2); margin:10px 0 0; text-align:center;
}
@media (max-width:900px){.npv-brand .npv-hero__art{max-width:460px; margin-inline:auto}}

/* ------------------------------------------------------------
   Pasek liczb producenta
   ------------------------------------------------------------ */
.npv-brand .npv-stats{
  background:var(--npv-dark-2); color:var(--npv-on-dark);
  box-shadow:0 0 0 100vmax var(--npv-dark-2);
  clip-path:inset(0 -100vmax);
  border-top:1px solid var(--npv-dark-border);
  padding-bottom:4px;
}
.npv-brand .npv-stats__grid{display:grid; grid-template-columns:repeat(6,1fr); border-left:1px solid var(--npv-dark-border)}
@media (max-width:900px){.npv-brand .npv-stats__grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.npv-brand .npv-stats__grid{grid-template-columns:repeat(2,1fr)}}
.npv-brand .npv-stat{padding:20px 16px; border-right:1px solid var(--npv-dark-border); border-bottom:1px solid var(--npv-dark-border)}
.npv-brand .npv-stat b{display:block; font-family:var(--npv-mono); font-size:clamp(19px,2.4vw,25px); font-weight:500; letter-spacing:-.01em; color:var(--npv-on-dark)}
.npv-brand .npv-stat span{display:block; font-size:12.5px; color:var(--npv-on-dark-2); margin-top:4px; line-height:1.4}
.npv-brand .npv-stats__note{
  padding:12px 0 18px; margin:0; font-size:12px; color:var(--npv-on-dark-2);
  font-family:var(--npv-mono); letter-spacing:.03em;
}

/* ------------------------------------------------------------
   Nawigacja kotwicowa (statyczna — motyw ma wlasny naglowek,
   drugi element sticky zaslanialby cel skoku)
   ------------------------------------------------------------ */
.npv-brand .npv-anchors{border-block:1px solid var(--npv-border); margin-bottom:8px}
.npv-brand .npv-anchors__in{display:flex; gap:0; overflow-x:auto; scrollbar-width:thin}
.npv-brand .npv-anchors a{
  flex:none; text-decoration:none; font-size:13.5px; color:var(--npv-text-2) !important;
  padding:14px 18px; border-bottom:2px solid transparent; white-space:nowrap;
}
.npv-brand .npv-anchors a:first-child{padding-left:0}
.npv-brand .npv-anchors a:hover{color:var(--npv-text) !important; border-bottom-color:var(--npv-orange)}

/* ------------------------------------------------------------
   Typografia sekcji
   ------------------------------------------------------------ */
.npv-brand .npv-kicker{
  font-family:var(--npv-mono); font-size:11.5px; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:var(--npv-orange-ink);
  display:flex; align-items:center; gap:12px; margin-bottom:14px;
}
.npv-brand .npv-sec--dark .npv-kicker{color:var(--npv-orange)}
.npv-brand .npv-kicker::before{content:""; width:28px; height:2px; background:currentColor; flex:none}

.npv-brand .npv-h2{font-size:clamp(24px,3.2vw,32px); font-weight:400; letter-spacing:-.02em; max-width:22ch}
.npv-brand .npv-h2--wide{max-width:32ch}
.npv-brand .npv-h3{font-size:clamp(18px,2.1vw,22px); font-weight:600; letter-spacing:-.01em}
.npv-brand .npv-h3--sm{font-size:19px}
.npv-brand .npv-sub{margin-top:16px; font-size:clamp(15.5px,1.4vw,17px); color:var(--npv-text-2); max-width:68ch; font-weight:300}
.npv-brand .npv-sec--dark .npv-sub{color:var(--npv-on-dark-2)}

.npv-brand .npv-block{margin-top:clamp(24px,3.4vw,44px)}
.npv-brand .npv-block--tight{margin-top:clamp(18px,2.4vw,28px)}

.npv-brand .npv-prose{max-width:74ch; color:var(--npv-text-2)}
.npv-brand .npv-prose--sm{font-size:14.5px; margin-top:16px}
.npv-brand .npv-prose strong{color:var(--npv-text)}
.npv-brand .npv-sec--dark .npv-prose strong{color:var(--npv-on-dark)}
.npv-brand .npv-prose a,
.npv-brand .npv-tlink{color:var(--npv-orange-ink) !important; text-decoration:underline; text-underline-offset:3px}
.npv-brand .npv-sec--dark .npv-prose a,
.npv-brand .npv-sec--dark .npv-tlink{color:var(--npv-orange) !important}
.npv-brand .npv-tlink{font-weight:600; text-decoration:none; border-bottom:1px solid currentColor; white-space:nowrap}
.npv-brand .npv-tlink:hover{border-bottom-width:2px}

.npv-brand .npv-2col{display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:clamp(22px,3.2vw,44px); align-items:start}
@media (max-width:860px){.npv-brand .npv-2col{grid-template-columns:1fr}}

/* ------------------------------------------------------------
   Karty, siatki, listy
   ------------------------------------------------------------ */
.npv-brand .npv-card{background:var(--npv-bg); border:1px solid var(--npv-border); padding:22px 24px}
.npv-brand .npv-card--wide{padding:28px}
.npv-brand .npv-sec--dark .npv-card{background:var(--npv-dark-2); border-color:var(--npv-dark-border)}
.npv-brand .npv-card__t{font-size:15px; font-weight:600; letter-spacing:-.005em; margin-bottom:8px}
.npv-brand .npv-sec--dark .npv-card__t{color:var(--npv-on-dark)}
.npv-brand .npv-card__d{font-size:14.5px; color:var(--npv-text-2)}
.npv-brand .npv-sec--dark .npv-card__d{color:var(--npv-on-dark-2)}
.npv-brand .npv-card__no{
  font-family:var(--npv-mono); font-size:clamp(21px,3vw,29px); font-weight:500;
  letter-spacing:.01em; word-break:break-all; margin:0 0 10px; color:var(--npv-text);
}

.npv-brand .npv-grid{display:grid; gap:1px; background:var(--npv-border); border:1px solid var(--npv-border)}
.npv-brand .npv-grid > *{background:var(--npv-bg)}
.npv-brand .npv-sec--dark .npv-grid{background:var(--npv-dark-border); border-color:var(--npv-dark-border)}
.npv-brand .npv-sec--dark .npv-grid > *{background:var(--npv-dark)}
.npv-brand .npv-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.npv-brand .npv-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.npv-brand .npv-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:940px){
  .npv-brand .npv-grid--4,
  .npv-brand .npv-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:620px){
  .npv-brand .npv-grid--2,
  .npv-brand .npv-grid--3,
  .npv-brand .npv-grid--4{grid-template-columns:1fr}
}

.npv-brand .npv-cell{padding:24px}
.npv-brand .npv-cell--good{border-top:3px solid var(--npv-green)}
.npv-brand .npv-cell--plain{border-top:3px solid var(--npv-border)}
.npv-brand .npv-cell__n{font-family:var(--npv-mono); font-size:12px; color:var(--npv-orange-ink); letter-spacing:.08em; display:block; margin-bottom:10px}
.npv-brand .npv-sec--dark .npv-cell__n{color:var(--npv-orange)}
.npv-brand .npv-cell__t{font-size:16px; font-weight:600; margin-bottom:8px; letter-spacing:-.005em}
.npv-brand .npv-sec--dark .npv-cell__t{color:var(--npv-on-dark)}
.npv-brand .npv-cell__d{font-size:14.5px; color:var(--npv-text-2)}
.npv-brand .npv-sec--dark .npv-cell__d{color:var(--npv-on-dark-2)}

.npv-brand .npv-list{display:grid; gap:2px}
.npv-brand .npv-list--tight{margin-top:6px}
.npv-brand .npv-list li{
  position:relative; padding:14px 0 14px 30px; font-size:15.5px; color:var(--npv-text-2);
  border-bottom:1px solid var(--npv-border-soft);
}
.npv-brand .npv-list li strong{color:var(--npv-text)}
.npv-brand .npv-sec--dark .npv-list li{color:var(--npv-on-dark-2); border-bottom-color:var(--npv-dark-border)}
.npv-brand .npv-sec--dark .npv-list li strong{color:var(--npv-on-dark)}
.npv-brand .npv-list li::before{content:""; position:absolute; left:0; top:22px; width:14px; height:2px; background:var(--npv-orange)}

.npv-brand .npv-fact{
  border-left:3px solid var(--npv-orange); background:var(--npv-surface);
  padding:18px 22px; font-size:15px; color:var(--npv-text-2);
}
.npv-brand .npv-sec--surface .npv-fact{background:var(--npv-bg)}
.npv-brand .npv-sec--dark .npv-fact{background:var(--npv-dark-2); color:var(--npv-on-dark-2)}
.npv-brand .npv-fact strong{color:var(--npv-text)}
.npv-brand .npv-sec--dark .npv-fact strong{color:var(--npv-on-dark)}

/* ------------------------------------------------------------
   Przyciski. Uwaga na motyw: Astra maluje kazdy <button> i .button,
   dlatego CTA to <a class="npv-btn"> — nigdy klasa .button.
   Motyw potomny wstrzykuje inline <style id="pvgroup-design">
   z regula a{color:#F28C00 !important} (astra-child/functions.php:157),
   ktora bije kazda specyficznosc — stad !important przy color.
   ------------------------------------------------------------ */
.npv-brand .npv-cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:24px}
.npv-brand .npv-btn{
  display:inline-flex; align-items:center; gap:10px; text-decoration:none;
  font-size:15px; font-weight:600; padding:14px 22px; border:1px solid transparent; border-radius:0;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.npv-brand .npv-btn--arrow::after{
  content:""; width:8px; height:8px; flex:none;
  border:solid currentColor; border-width:2px 2px 0 0; transform:rotate(45deg);
}
.npv-brand .npv-btn--primary{background:var(--npv-orange); color:#1B2A4A !important}
.npv-brand .npv-btn--primary:hover{background:#ffa524; color:#1B2A4A !important}
.npv-brand .npv-btn--ghost{border-color:rgba(255,255,255,.32); color:#fff !important}
.npv-brand .npv-btn--ghost:hover{background:rgba(255,255,255,.10); border-color:#fff; color:#fff !important}
.npv-brand .npv-btn--solid{background:var(--npv-navy); color:#fff !important; margin-top:18px}
.npv-brand .npv-btn--solid:hover{background:#253960; color:#fff !important}

/* ------------------------------------------------------------
   Tabele
   ------------------------------------------------------------ */
.npv-brand .npv-tablewrap{
  border:1px solid var(--npv-border); background:var(--npv-bg);
  overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%;
}
.npv-brand .npv-sec--dark .npv-tablewrap{border-color:var(--npv-dark-border); background:var(--npv-dark-2)}
.npv-brand table.npv-table{width:100%; border-collapse:collapse; min-width:640px; font-size:14.5px; margin:0; table-layout:auto}
.npv-brand .npv-table th,
.npv-brand .npv-table td{padding:14px 18px; text-align:left; vertical-align:top; border-bottom:1px solid var(--npv-border-soft); border-right:0; border-left:0}
.npv-brand .npv-table thead th{
  background:var(--npv-navy); color:#fff; font-weight:600; font-size:12px;
  letter-spacing:.08em; text-transform:uppercase; white-space:nowrap;
}
.npv-brand .npv-table tbody tr:last-child th,
.npv-brand .npv-table tbody tr:last-child td{border-bottom:0}
.npv-brand .npv-table tbody tr:nth-child(even){background:var(--npv-surface)}
.npv-brand .npv-sec--dark .npv-table tbody tr:nth-child(even){background:var(--npv-dark-3)}
.npv-brand .npv-table td{color:var(--npv-text-2)}
.npv-brand .npv-sec--dark .npv-table td{color:var(--npv-on-dark-2)}
.npv-brand .npv-table td:first-child{font-weight:600; color:var(--npv-text); min-width:190px}
.npv-brand .npv-sec--dark .npv-table td:first-child{color:var(--npv-on-dark)}

.npv-brand .npv-scrollhint{
  font-family:var(--npv-mono); font-size:11.5px; letter-spacing:.06em;
  color:var(--npv-text-3); margin:10px 0 0; display:flex; align-items:center; gap:10px;
}
.npv-brand .npv-scrollhint::before{
  content:""; width:7px; height:7px; flex:none;
  border:solid currentColor; border-width:2px 2px 0 0; transform:rotate(45deg);
}
@media (min-width:720px){.npv-brand .npv-scrollhint{display:none}}

/* kod modelu */
.npv-brand .sku{
  font-family:var(--npv-mono); font-size:.92em; font-weight:500;
  background:var(--npv-surface-2); color:var(--npv-text); padding:1px 4px;
  white-space:nowrap;
}
.npv-brand .npv-sec--dark .sku,
.npv-brand .npv-hero .sku{background:rgba(255,255,255,.10); color:#fff}
.npv-brand .npv-table .sku{background:transparent; padding:0}

/* ------------------------------------------------------------
   Serie produktowe
   ------------------------------------------------------------ */
.npv-brand .npv-fam{
  display:grid; grid-template-columns:minmax(0,320px) minmax(0,1fr);
  gap:clamp(22px,3.4vw,48px); align-items:start;
  padding-block:clamp(26px,3.4vw,40px); border-top:1px solid var(--npv-border);
}
.npv-brand .npv-fam--first{border-top:0; padding-top:0}
.npv-brand .npv-fam--full{grid-template-columns:1fr}
@media (max-width:820px){.npv-brand .npv-fam{grid-template-columns:1fr}}

.npv-brand .npv-fam__art{
  border:1px solid #16223c; background-color:#1B2A4A;
  background-image:radial-gradient(72% 78% at 50% 22%, rgba(255,255,255,.09), transparent 62%);
  display:flex; align-items:center; justify-content:center; padding:26px; min-height:220px;
}
.npv-brand .npv-fam__art img{max-height:250px; width:auto; object-fit:contain; filter:drop-shadow(0 14px 26px rgba(0,0,0,.45))}
.npv-brand .npv-fam__art--duo{display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:center}
.npv-brand .npv-fam__art--duo img{max-height:180px; margin-inline:auto}
.npv-brand .npv-fam__art--trio{display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:center}
.npv-brand .npv-fam__art--trio img{max-height:150px; margin-inline:auto}
.npv-brand .npv-fam__art--trio img:last-child{grid-column:1 / -1; max-height:175px}
.npv-brand .npv-fam__art--tall{min-height:340px; align-items:end}
.npv-brand .npv-fam__art--tall img:first-child{max-height:300px}
.npv-brand .npv-fam__art--tall img:last-child{max-height:360px}
.npv-brand .npv-fam__art--flat{min-height:0; padding:18px}
.npv-brand .npv-fam__art--flat img{max-height:190px}

.npv-brand .npv-fam__head{display:flex; flex-wrap:wrap; align-items:baseline; gap:12px; margin-bottom:14px}
.npv-brand .npv-fam__tag{
  font-family:var(--npv-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color:#1B2A4A; background:var(--npv-orange); padding:3px 8px;
}

.npv-brand .npv-cell__ph{
  margin:-24px -24px 20px; padding:22px; display:flex; align-items:center; justify-content:center;
  background-color:#1B2A4A; background-image:radial-gradient(70% 80% at 50% 20%, rgba(255,255,255,.09), transparent 62%);
  border-bottom:1px solid #16223c; min-height:180px;
}
.npv-brand .npv-cell__img{
  height:136px; width:auto; max-width:100%; object-fit:contain;
  filter:drop-shadow(0 12px 22px rgba(0,0,0,.45));
}

.npv-brand .npv-specs{display:flex; flex-wrap:wrap; gap:1px; background:var(--npv-border); border:1px solid var(--npv-border); margin-top:18px}
.npv-brand .npv-sec--dark .npv-specs{background:var(--npv-dark-border); border-color:var(--npv-dark-border)}
.npv-brand .npv-spec{background:var(--npv-bg); padding:12px 16px; flex:1 1 158px; min-width:0}
.npv-brand .npv-sec--dark .npv-spec{background:var(--npv-dark-2)}
.npv-brand .npv-spec b{display:block; font-family:var(--npv-mono); font-size:17px; font-weight:500; letter-spacing:-.01em; color:var(--npv-text)}
.npv-brand .npv-sec--dark .npv-spec b{color:var(--npv-on-dark)}
.npv-brand .npv-spec span{display:block; font-size:11.5px; color:var(--npv-text-3); letter-spacing:.04em; text-transform:uppercase; margin-top:3px}
.npv-brand .npv-sec--dark .npv-spec span{color:var(--npv-on-dark-2)}

/* porownanie 500 ms vs 10 ms */
.npv-brand .npv-vs{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--npv-border); border:1px solid var(--npv-border); margin-top:20px}
@media (max-width:620px){.npv-brand .npv-vs{grid-template-columns:1fr}}
.npv-brand .npv-vs__c{background:var(--npv-bg); padding:24px}
.npv-brand .npv-vs__c--good{border-top:3px solid var(--npv-green)}
.npv-brand .npv-vs__c--warn{border-top:3px solid var(--npv-orange)}
.npv-brand .npv-vs__t{font-family:var(--npv-mono); font-size:clamp(25px,3.4vw,33px); font-weight:500; letter-spacing:-.02em}
.npv-brand .npv-vs__l{font-size:13px; color:var(--npv-text-3); text-transform:uppercase; letter-spacing:.08em; margin:4px 0 12px}
.npv-brand .npv-vs__d{font-size:14.5px; color:var(--npv-text-2)}

/* zakres mocy */
.npv-brand .npv-range{margin-top:26px; border:1px solid var(--npv-border); background:var(--npv-bg); padding:26px 24px 20px}
.npv-brand .npv-range--flush{margin-top:0}
.npv-brand .npv-range__bar{height:6px; background:linear-gradient(90deg,var(--npv-green),var(--npv-orange)); margin-bottom:4px}
.npv-brand .npv-range__marks{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:14px}
@media (max-width:620px){.npv-brand .npv-range__marks{grid-template-columns:repeat(2,1fr); row-gap:18px}}
.npv-brand .npv-range__m b{display:block; font-family:var(--npv-mono); font-size:16px; font-weight:500}
.npv-brand .npv-range__m span{display:block; font-size:12.5px; color:var(--npv-text-2); margin-top:2px}

/* ------------------------------------------------------------
   Gwarancja — wykres slupkowy.
   Dlugosci slupkow to modyfikatory klas, nie zmienne w style="".
   ------------------------------------------------------------ */
.npv-brand .npv-warr{display:grid; gap:1px; background:var(--npv-dark-border); border:1px solid var(--npv-dark-border)}
.npv-brand .npv-warr__row{
  display:grid; grid-template-columns:96px minmax(120px,1fr) minmax(0,1.5fr);
  align-items:center; background:var(--npv-dark); padding:0; border:0;
}
@media (max-width:760px){
  .npv-brand .npv-warr__row{grid-template-columns:88px minmax(0,1fr)}
  .npv-brand .npv-warr__what{grid-column:1 / -1; padding:0 20px 16px 18px}
}
.npv-brand .npv-warr__n{
  padding:18px; font-family:var(--npv-mono); font-size:25px; font-weight:500;
  color:#fff; letter-spacing:-.02em; white-space:nowrap;
}
.npv-brand .npv-warr__n small{display:block; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--npv-on-dark-2); font-weight:400; margin-top:1px}
.npv-brand .npv-warr__track{height:10px; background:rgba(255,255,255,.08); margin-right:22px; position:relative}
.npv-brand .npv-warr__fill{position:absolute; inset:0 auto 0 0; background:var(--npv-orange)}
.npv-brand .npv-warr__fill--p100{width:100%; background:var(--npv-green)}
.npv-brand .npv-warr__fill--p83{width:83%}
.npv-brand .npv-warr__fill--p42{width:42%; background:#5d7196}
.npv-brand .npv-warr__fill--p17{width:17%; background:#3f5279}
.npv-brand .npv-warr__fill--p8{width:8%; background:#3f5279}
.npv-brand .npv-warr__fill--split{
  width:83%;
  background:linear-gradient(90deg,var(--npv-orange) 0 50%,transparent 50%),
             repeating-linear-gradient(135deg,#5d7196 0 5px,transparent 5px 10px);
  background-color:rgba(93,113,150,.28);
}
.npv-brand .npv-warr__what{padding:16px 20px 16px 0; font-size:14.5px; color:var(--npv-on-dark-2); margin:0}
.npv-brand .npv-warr__what strong{color:#fff}

/* rozklad 150 pozycji */
.npv-brand .npv-dist{margin-top:clamp(26px,3.4vw,40px); border:1px solid var(--npv-dark-border); background:var(--npv-dark-2); padding:24px}
.npv-brand .npv-dist__h{display:flex; flex-wrap:wrap; gap:8px 16px; align-items:baseline; margin:0 0 18px}
.npv-brand .npv-dist__h b{font-family:var(--npv-mono); font-size:22px; font-weight:500; color:#fff}
.npv-brand .npv-dist__h span{font-size:13.5px; color:var(--npv-on-dark-2)}
.npv-brand .npv-dist__bar{display:flex; height:30px; width:100%; overflow:hidden}
.npv-brand .npv-dist__seg{height:100%; min-width:2px}
.npv-brand .npv-dist__legend{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px 20px; margin-top:18px}
.npv-brand .npv-dist__li{display:flex; align-items:flex-start; gap:9px; font-size:13px; color:var(--npv-on-dark-2); border:0; padding:0}
.npv-brand .npv-dist__li::before{display:none}
.npv-brand .npv-dist__sw{width:12px; height:12px; flex:none; margin-top:3px}
.npv-brand .npv-dist__li b{color:#fff; font-family:var(--npv-mono); font-weight:500}

.npv-brand .npv-dist__seg--y10,.npv-brand .npv-dist__sw--y10{background:#F28C00}
.npv-brand .npv-dist__seg--y5,.npv-brand  .npv-dist__sw--y5{background:#7b95bd}
.npv-brand .npv-dist__seg--y2,.npv-brand  .npv-dist__sw--y2{background:#4a5f87}
.npv-brand .npv-dist__seg--y12,.npv-brand .npv-dist__sw--y12{background:#6EB92B}
.npv-brand .npv-dist__seg--y1,.npv-brand  .npv-dist__sw--y1{background:#35486d}
.npv-brand .npv-dist__seg--y510,.npv-brand .npv-dist__sw--y510{background:repeating-linear-gradient(135deg,#7b95bd 0 4px,#2b3a52 4px 8px)}
.npv-brand .npv-dist__seg--y10{width:52.7%}
.npv-brand .npv-dist__seg--y5{width:16.7%}
.npv-brand .npv-dist__seg--y2{width:13.3%}
.npv-brand .npv-dist__seg--y12{width:7.3%}
.npv-brand .npv-dist__seg--y1{width:7.3%}
.npv-brand .npv-dist__seg--y510{width:2.7%}

/* ------------------------------------------------------------
   Stopien ochrony magazynu
   ------------------------------------------------------------ */
.npv-brand .npv-ip{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--npv-border); border:1px solid var(--npv-border); margin-top:20px}
@media (max-width:720px){.npv-brand .npv-ip{grid-template-columns:1fr}}
.npv-brand .npv-ip__c{background:var(--npv-bg); padding:22px 24px}
.npv-brand .npv-ip__k{font-family:var(--npv-mono); font-size:22px; font-weight:500; letter-spacing:-.01em}
.npv-brand .npv-ip__s{font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--npv-text-3); margin:2px 0 12px}
.npv-brand .npv-ip__d{font-size:14.5px; color:var(--npv-text-2)}
.npv-brand .npv-ip__c--out{border-top:3px solid var(--npv-green)}
.npv-brand .npv-ip__c--mid{border-top:3px solid var(--npv-orange)}
.npv-brand .npv-ip__c--in{border-top:3px solid var(--npv-border)}

/* ------------------------------------------------------------
   FAQ — markup pochodzi z shortcode'u [pvg_category_faq]
   (wariant accordion: <details>/<summary>).
   ------------------------------------------------------------ */
.npv-brand .npv-faqhead{padding-bottom:0}
.npv-brand .pvg-cat-faq{border-top:1px solid var(--npv-border); margin:clamp(20px,3vw,32px) 0 0; padding-bottom:var(--npv-sec)}
.npv-brand .pvg-cat-faq__item{border-bottom:1px solid var(--npv-border); padding:0}
.npv-brand .pvg-cat-faq__q{
  display:flex; align-items:flex-start; gap:16px;
  padding:20px 0; margin:0; font-size:clamp(16px,1.7vw,18px); font-weight:600; letter-spacing:-.005em;
  line-height:1.35; color:var(--npv-text);
}
.npv-brand .pvg-cat-faq__item > summary{
  display:block; cursor:pointer; list-style:none;
  transition:color .15s ease;
}
.npv-brand .pvg-cat-faq__item > summary::-webkit-details-marker{display:none}
.npv-brand .pvg-cat-faq__item > summary::marker{content:""}
.npv-brand .pvg-cat-faq__item > summary:hover .pvg-cat-faq__q{color:var(--npv-orange-ink)}
.npv-brand .npv-faq__ico{
  flex:none; width:22px; height:22px; margin-top:3px; position:relative;
  border:1px solid var(--npv-border);
}
.npv-brand .npv-faq__ico::before,
.npv-brand .npv-faq__ico::after{content:""; position:absolute; background:var(--npv-orange); left:50%; top:50%; transform:translate(-50%,-50%)}
.npv-brand .npv-faq__ico::before{width:10px; height:2px}
.npv-brand .npv-faq__ico::after{width:2px; height:10px; transition:transform .18s ease}
.npv-brand details[open] .npv-faq__ico::after{transform:translate(-50%,-50%) scaleY(0)}
.npv-brand details[open] .npv-faq__ico{border-color:var(--npv-orange)}
.npv-brand .pvg-cat-faq__a{padding:0 0 24px 38px; max-width:80ch; color:var(--npv-text-2); font-size:15.5px}
@media (max-width:520px){.npv-brand .pvg-cat-faq__a{padding-left:0}}

/* ------------------------------------------------------------
   CTA koncowe
   ------------------------------------------------------------ */
.npv-brand .npv-final{
  background:var(--npv-navy); color:#fff; position:relative;
  box-shadow:0 0 0 100vmax var(--npv-navy);
  clip-path:inset(0 -100vmax);
}
.npv-brand .npv-final__in{
  display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  gap:clamp(24px,4vw,48px); align-items:center; padding-block:clamp(40px,5vw,68px);
}
@media (max-width:860px){.npv-brand .npv-final__in{grid-template-columns:1fr}}
.npv-brand .npv-final h2{font-size:clamp(25px,3.4vw,34px); font-weight:300; letter-spacing:-.02em; max-width:20ch; color:#fff}
.npv-brand .npv-final p{color:#c3cddf; margin:16px 0 0; max-width:56ch; font-weight:300}
.npv-brand .npv-final__box{border:1px solid rgba(255,255,255,.20); padding:26px; background:rgba(0,0,0,.18)}
.npv-brand .npv-final__box dl{margin:0; display:grid; gap:14px}
.npv-brand .npv-final__box dt{font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:#9fb0cb; font-family:var(--npv-mono)}
.npv-brand .npv-final__box dd{margin:2px 0 0; font-size:15.5px; color:#fff}

/* znak marki na karcie autoryzacji */
.npv-brand .npv-brandmark{display:flex; align-items:center; gap:18px; margin-bottom:20px}
.npv-brand .npv-brandmark img{height:26px; width:auto}

/* ------------------------------------------------------------
   Ruch
   ------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce){
  .npv-brand *,
  .npv-brand *::before,
  .npv-brand *::after{transition-duration:.001ms !important; animation-duration:.001ms !important}
}

/* ─── Galeria zdjęć własnych (v3.217.0) ───────────────────────────────
   Zdjęcia z siedziby: mobilne centrum Growatt. Pierwsze kadr szeroki,
   dwa pozostałe obok siebie. Na wąskim ekranie jedna kolumna. */
.npv-brand .npv-gal{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:18px;
}
.npv-brand .npv-gal__item{
  margin:0;
  overflow:hidden;
  border:1px solid var(--npv-brd,#c6c6c6);
  background:var(--npv-surf,#f4f4f4);
  line-height:0;
}
.npv-brand .npv-gal__item--wide{ grid-column:1 / -1; }
.npv-brand .npv-gal__item img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
  transition:transform .35s ease;
}
.npv-brand .npv-gal__item--wide img{ aspect-ratio:16/7; }
.npv-brand .npv-gal__item:not(.npv-gal__item--wide) img{ aspect-ratio:4/3; }
.npv-brand .npv-gal__item:hover img{ transform:scale(1.02); }
@media (max-width:640px){
  .npv-brand .npv-gal{ grid-template-columns:1fr; }
  .npv-brand .npv-gal__item--wide img{ aspect-ratio:4/3; }
}
@media (prefers-reduced-motion:reduce){
  .npv-brand .npv-gal__item img{ transition:none; }
  .npv-brand .npv-gal__item:hover img{ transform:none; }
}

/* ============================================================
   AUDYT WIZUALNY 2026-08-25 — poprawki po ogladzie zywej strony
   Raport: _raporty/marka-growatt-2026-08-25/08-AUDYT-WIZUALNY.md

   ZAKRES: odstepy, proporcje, waskie ekrany.
   POZA ZAKRESEM (rownolegla praca dewelopera): z-index oraz technika
   tla pelnej szerokosci (box-shadow + clip-path). Nic ponizej ich
   nie dotyka.
   ============================================================ */

/* [A1] Puste akapity po wpautop.
   Komentarze HTML w opisie termu (np. "CTA: sekcja koncowa") wpautop
   opakowuje w <p></p>. Zmierzone na produkcji: 4 sztuki, kazdy
   height 0 i margin-bottom 16px, czyli 64px przypadkowej przerwy
   rozsypanej po rytmie sekcji. */
.npv-brand p:empty{display:none}

/* [A2] Zakres mocy — rozjazd toru siatki.
   repeat(4,1fr) to w praktyce minmax(auto,1fr): tresc czwartego
   znacznika ("szafa ACE 209H-2H") nie miesci sie w torze i wychodzi
   poza kontener. Zmierzone przy oknie 1024 px: prawa krawedz
   znacznika 1046 px, document.scrollWidth 1046 — czyli poziomy pasek
   przewijania na calej stronie. minmax(0,1fr) przywraca rowne tory,
   a lamanie dlugiego kodu modelu trzyma tekst w torze. */
@media (min-width:621px){
  .npv-brand .npv-range__marks{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:620px){
  .npv-brand .npv-range__marks{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.npv-brand .npv-range__m b,
.npv-brand .npv-range__m span{overflow-wrap:anywhere}

/* [A3] Pasmo z przyklejonym paskiem filtrow.
   Opis marki renderuje sie w kolumnie .pvg-shop-main, a nie na pelnej
   szerokosci okna. Zmierzone szerokosci kolumny tresci:
     okno  960 -> 920 px  (pasek filtrow schowany poza ekran)
     okno 1024 -> 672 px
     okno 1100 -> 748 px
     okno 1180 -> 828 px
     okno 1280 i wyzej -> 888 px (stala)
   Wszystkie media query w tym arkuszu pisano przy zalozeniu
   "kontener mniej wiecej rowna sie oknu". W pasmie 961–1180 px
   zalozenie nie zachodzi i komponenty trzymaja uklad o jeden stopien
   za szeroki: karty po 222 px, kolumna tekstu w npv-fam wezsza niz
   kafel ze zdjeciem. Ponizej te same progi przeliczone na realna
   szerokosc kontenera. */
@media (min-width:961px) and (max-width:1180px){
  .npv-brand .npv-grid--4,
  .npv-brand .npv-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .npv-brand .npv-2col{grid-template-columns:1fr}
  .npv-brand .npv-fam{grid-template-columns:1fr}
  .npv-brand .npv-final__in{grid-template-columns:1fr}
}
@media (min-width:961px) and (max-width:1072px){
  .npv-brand .npv-ip{grid-template-columns:1fr}
  .npv-brand .npv-range__marks{grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:18px}
  .npv-brand .npv-warr__row{grid-template-columns:88px minmax(0,1fr)}
  .npv-brand .npv-warr__what{grid-column:1 / -1; padding:0 20px 16px 18px}
}

/* [A4] Naglowek FAQ bez listy pytan.
   Na produkcji sekcja "faq" renderuje sam kicker i naglowek — shortcode
   pvg_category_faq nie zwrocil ani jednego pytania (zero elementow
   pvg-cat-faq__item, zero blokow FAQPage). To blad TRESCI opisany
   w raporcie, nie stylu: osiem naglowkow w pliku zrodlowym nie konczy
   sie znakiem zapytania, a extract_faq_pairs() przyjmuje wylacznie
   naglowki-pytania. Regula ponizej wylacznie lagodzi skutek wizualny
   (naglowek stykal sie z sekcja CTA, bo npv-faqhead ma
   padding-bottom zero w oczekiwaniu na liste). Po naprawie tresci
   selektor przestaje pasowac i odstep wraca do listy pytan. */
.npv-brand .npv-faqhead:not(:has(.pvg-cat-faq)){padding-bottom:var(--npv-sec)}

/* [A5] Galeria uzywala nazw zmiennych, ktorych ten arkusz nie definiuje
   (npv-brd, npv-surf). Wartosci zapasowe akurat zgadzaly sie z paleta,
   wiec bledu nie bylo widac — ale kazda zmiana tokenu ominelaby galerie. */
.npv-brand .npv-gal__item{
  border-color:var(--npv-border);
  background:var(--npv-surface);
}

/* ═══════════════════════════════════════════════════════════════
   TRYB LANDINGU — archiwum marki bez paska filtrów (v3.219.0)

   Od v3.219.0 `NovaPVGroup_Shop_Filters::should_render()` nie renderuje
   filtrów na `is_tax('marka')`, więc znika też opakowanie `.pvg-shop-layout`
   / `.pvg-shop-main`. Treść przestaje siedzieć w kolumnie 888 px i dostaje
   szerokość kontenera motywu.

   Ograniczamy ją do 1200 px, bo tyle miała makieta i tyle wynosi wygodna
   długość wiersza — bez tego przy monitorze 1920 px akapity ciągnęłyby się
   przez ~1700 px, co czyta się źle niezależnie od tego, jak ładnie wygląda.
   ═══════════════════════════════════════════════════════════════ */

.npv-brand{
  max-width:1200px;
  margin-inline:auto;
}

/* Sekcje pełnej szerokości muszą przebić to ograniczenie — tło rozlewa się
   cieniem, ale wewnętrzna kolumna trzyma się środka. */
.npv-brand .npv-shell{
  max-width:1200px;
  margin-inline:auto;
}

/* Gdy filtry jednak wrócą (NPV_BRAND_FILTERS_ON), opakowanie znów istnieje —
   wtedy oddajemy szerokość kolumnie sklepowej, żeby nic nie wystawało. */
.pvg-shop-main .npv-brand{
  max-width:none;
  margin-inline:0;
}