/* ============================================================
   MW Motyw — TOKENY WSPÓLNE dla wszystkich widoków sklepu.
   JEDNO miejsce na paletę, typografię i odstępy — zmiana tutaj
   przechodzi na kartę produktu, kategorię, koszyk, konto itd.

   Dla agencji: to jest plik, który zmieniacie, żeby przemalować
   sklep. Nie szukajcie kolorów po pozostałych arkuszach.

   Scope: `.mw-widok` (wspólna klasa opakowania każdego widoku, także karty).
   ============================================================ */

.mw-widok{
  /* --- kolory marki (paleta zamknięta 20.05.2026, CZTERY kolory) --- */
  --mw-black:#0F0F0F;
  --mw-ecru:#EFE7D5;
  --mw-taupe:#8A7968;
  --mw-choco:#3A2D24;      /* czwarty kolor palety: hover ciemnych CTA, akcenty */
  /* --- pochodne funkcjonalne (kontrast AA) --- */
  --mw-ink:var(--mw-black);
  --mw-ink-3:#5E574C;      /* tekst drugorzedny i podpisy ~6:1 */
  /* Tło sklepu: BIAŁE (decyzja Michała 19.07). Ecru zostaje kolorem marki
     — używamy go na pasku ogłoszeń i w stopce, nie jako tła stron. */
  --mw-paper:#FFFFFF;
  --mw-surface-2:#F7F5F1;  /* tło pola, wiersza, sekcji wyróżnionej, kadru zdjęcia */
  --mw-line:#E4E0D8;       /* hairline na bieli */
  --mw-line-2:#CFC8BC;
  /* --- stany (komunikat = tekst + tło + ramka, trzy tokeny na stan) --- */
  --mw-ok:#2E6B4F;         /* na stanie */
  --mw-ok-bg:#F1F7F3;
  --mw-ok-line:#A9C3B4;
  --mw-error:#7A2E2E;      /* błąd formularza i koszyka */
  --mw-error-bg:#FBF3F3;
  --mw-error-line:#CFA9A9;
  --mw-muted:#9C968C;      /* TYLKO kontrolka wyłączona (2,94:1 — WCAG zwalnia nieaktywne).
                              Tekst informacyjny bierze --mw-ink-3 (7,13:1). Defekt 5 */
  --mw-promo:#8C2F2F;      /* przecena — AA na ecru i na bieli */
  /* --- na zdjęciu / ciemnym (para do --mw-ink i --mw-line) --- */
  --mw-on-dark:#FAFAF7;    /* wraca: hero, baner kolekcji, blok redakcyjny */
  --mw-on-dark-fade:color-mix(in srgb,var(--mw-on-dark) 55%,transparent);  /* ramka i kontrolka na zdjeciu */
  --mw-scrim:linear-gradient(180deg,   /* WCAG 1.4.3 — zdjęcie bywa jasne pod napisem */
    color-mix(in srgb,var(--mw-black) 26%,transparent) 0%,
    color-mix(in srgb,var(--mw-black) 6%,transparent) 38%,
    color-mix(in srgb,var(--mw-black) 62%,transparent) 100%);
  /* --- przezroczystosci i cienie (bylo 12 recznych rgba w 5 plikach) --- */
  --mw-overlay:color-mix(in srgb,var(--mw-black) 35%,transparent);  /* zaslona pod modalem, panelem, minikoszykiem */
  --mw-milk:color-mix(in srgb,var(--mw-paper) 85%,transparent);     /* mleczna plytka: szyba naglowka, zaslony okien, arkusze, pasek kafelka, stopka (glass scalony 15.10) */
  /* fiolet tophat w podpisie stopki: oryginal #8C52FF ciut ciemniej, 4,6:1 na panelu (Tomek 07.10) */
  --mw-tophat-violet:#7F3FFF;
  --mw-shadow-0:0 4px 16px color-mix(in srgb,var(--mw-black) 7%,transparent);    /* kadr zdjecia na jasnym tle */
  --mw-shadow-3:0 18px 48px color-mix(in srgb,var(--mw-black) 16%,transparent);  /* modal, minikoszyk */
  --mw-shadow-strong:0 10px 30px color-mix(in srgb,var(--mw-black) 12%,transparent); /* mocniejszy cien kart (wpis bloga) */
  --mw-shadow-on-photo:0 0 0 1px color-mix(in srgb,var(--mw-on-dark) 70%,transparent), 0 1px 4px color-mix(in srgb,var(--mw-black) 35%,transparent); /* maly element na zdjeciu (probka koloru) */
  /* --- typografia --- */
  --mw-serif:"Cormorant Garamond","Cormorant Garamond Fallback","Iowan Old Style","Palatino Linotype",Georgia,serif;
  /* tekst i UI — Cormorant przy 11-16 px jest za cienki; kroj tresci bezszeryfowy */
  --mw-body:"Alegreya Sans","Alegreya Sans Fallback",sans-serif;
  /* skala pisma, 9 stopni: 14/15/16/18/20/24/32/36-44/40-64 (Tomek 14.09, 07.10). Innych nie ma */
  /* dol 14 od 28.08: klientki 50+, drobny druk nigdzie (call 27.08); bylo 10,5 w badge */
  --mw-fs-xs:.875rem;    /* 14 — TYLKO wersaliki z rozstrzeleniem (etykiety, badge, przyciski) */
  --mw-fs-sm:.9375rem;   /* 15 — cena, meta, linki stopki, kontrolki drugorzedne, drobny druk; zdania min. 16 */
  --mw-fs-base:1rem;     /* 16 — tresc, nawigacja, CTA */
  --mw-fs-md:1.125rem;   /* 18 — akapit wyrozniony, lid krotki */
  --mw-fs-ml:1.25rem;    /* 20 — h3 tresci na telefonie (Tomek 07.10) */
  --mw-fs-lg:1.5rem;     /* 24 — h2, logo, nazwa marki */
  --mw-fs-xl:2rem;       /* 32 — manifest na telefonie, stopien miedzy lg a display */
  --mw-fs-display:clamp(2.25rem,4.5vw,2.75rem);   /* 36 → 44 px od ~980 px w górę */
  --mw-fs-hero:clamp(2.5rem,5.5vw,4rem);          /* 40 → 64 — tytuł sekcji-bohatera, tylko strona główna */
  /* skala interlinii: 3 stopnie, innych nie ma */
  --mw-lh-tight:1.05;    /* naglowki display */
  --mw-lh-snug:1.3;      /* lid, nazwy produktow, nawigacja */
  --mw-lh-base:1.55;     /* tekst ciagly, reset */
  /* --- rytm --- */
  --mw-ease:cubic-bezier(.4,0,.2,1);
  --mw-dur-fast:.15s;    /* hover koloru, linki */
  --mw-max:1360px;
  --mw-gap:clamp(.5rem,2vw,1rem);
  /* gutter, jeden dla wszystkich widokow: 2,5vw (1440 = 36, FHD 48, QHD 64), podloga 32, sufit 64; telefon 8 nizej (Tomek 30.09) */
  --mw-page-pad:max(clamp(var(--mw-s5),2.5vw,var(--mw-s8)), var(--mw-safe-x));
  /* kafelek produktu: pas home, siatka listingu, polecane w koszyku; rem, wiec przy 150% rosnie sam (280/420 -> 420/630) */
  /* 20vw: na Full HD 4 kafelki jak duze sklepy odziezowe (18vw z MW-25 cofniete, Tomek 30.09) */
  --mw-tile-w:clamp(17.5rem,20vw,26.25rem);
  /* odstep miedzy kafelkami i kadrami sekcji: siatka, karuzela, pory roku, kategorie, opinie, pasy; 32 desktop, 24 ponizej 900 (Tomek 30.09) */
  --mw-tile-gap:var(--mw-s5);
  /* skala odstepow: wielokrotnosci 8, wyjatkowo 4. Innych wartosci nie ma. */
  --mw-s1:.25rem;   /* 4 */
  --mw-s2:.5rem;    /* 8 */
  --mw-s3:1rem;     /* 16 */
  --mw-s4:1.5rem;   /* 24 */
  --mw-s5:2rem;     /* 32 */
  --mw-s6:2.5rem;   /* 40 */
  --mw-s7:3rem;     /* 48 */
  --mw-s8:4rem;     /* 64 */
  --mw-s9:5rem;     /* 80 */
  --mw-accordion-gap:var(--mw-s3);
  --mw-section-gap:6rem;  /* 96 — jedyny odstep miedzy sekcjami strony */
  --mw-header-h:4rem;  /* 64 desktop: logo 28 + 18 oddechu (Tomek 08.10; bylo 72) */
  --mw-header-gap:clamp(var(--mw-s3), 5vw - 2rem, var(--mw-s5)); /* menu i narzedzia: 16 przy 900 do 32 przy 1280, bez scisku przy logo (14.10) */
  --mw-logo-h:round(down, clamp(1.375rem, .625rem + 1.5vw, 1.75rem), 1px); /* 22 -> 28 plynnie (ok. 800-1200), 4k 42 z rem; pelny piksel, maska SVG na ulamku sie rozmywa (Tomek 14.10) */
  --mw-sticky-top:calc(var(--mw-header-h) + var(--mw-s4)); /* pod przyklejonym naglowkiem + 24: sticky i kotwice */
  --mw-bar-h:2rem;       /* 32 — wysokosc paska ogloszen, rezerwowana od pierwszej klatki */
  --mw-dock-h:2.75rem;   /* 44 — dolny pasek na telefonie, wysokosc pola dotyku */
  /* strefa Home iPhone'a minus 16: menu nizej (Tomek 08.10); dziala z viewport-fit=cover */
  --mw-dock-safe:max(0px, env(safe-area-inset-bottom) - var(--mw-s3));
  /* wyciecie aparatu przy telefonie poziomo */
  --mw-safe-x:max(env(safe-area-inset-left), env(safe-area-inset-right));
  /* odstep tekstu od podkreslenia: w em, wiec trzyma sie kroju niezaleznie od stopnia pisma */
  --mw-underline-gap:.27em;     /* jeden odstep kreski linkow na calej stronie: regula :where nizej (Tomek 15.10) */
  --mw-ls-caps:.2em;     /* rozstrzelenie etykiet i przyciskow wersalikami (Tomek 15.10: 0,2) */
  --mw-ls-caps-sm:.1em;  /* drobne wersaliki: liczniki, plakietki, okruszki, meta, naglowki tabel (14.10) */
  --mw-link-line:1px;    /* kreska linkow: etykiety (::after) i link w tekscie (background); jedna wartosc (17.10) */
  --mw-link-duration:.25s;    /* czas wjazdu i zjazdu tej kreski */
  /* jeden czas na caly ruch nakladki */
  --mw-megamenu-move:.3s;
  --mw-control-h:2.75rem;   /* 44 px: jedna wysokosc kontrolki: przycisk, pole, submit szukajki; 44 = WCAG, nie 48 (Tomek 14.09); rem, zeby rosla z pismem od 3000 */
  --mw-prose-w:40em;       /* kolumna prozy: strony treściowe, regulamin, wpis bloga (jedna szerokość, Tomek 17.10) */
  --mw-drawer-w:30rem;      /* 480 — szuflada koszyka i szukajki (kolumna koszyka); na telefonie min(…, 100% - s6) */
  --mw-drawer-aside-w:calc(var(--mw-drawer-pick-w) + 2 * var(--mw-s4)); /* 251,7 — kolumna polecanych obok koszyka: kafelek + 24 z boków */
  --mw-drawer-pick-w:12.73125rem; /* 203,7 — kafelek polecanego w tej kolumnie, szeroki jak jej tytul */
  --mw-drawer-head-h:calc(var(--mw-s5) + 2 * var(--mw-s3) + 1px); /* 65 — glowa panelu z kreska */
  --mw-radius:0;         /* kanty proste — decyzja Tomka 25.08 */
  --mw-field-bg:color-mix(in srgb, var(--mw-surface-2) 50%, var(--mw-paper)); /* tlo pola: polowa surface-2 na bieli (Tomek 02.10) */
}
/* ponizej 900: gutter 16 (Tomek 30.09; wczesniej telefon 8, tablet 24); naglowek 56, samo logo (Tomek 08.10) */
@media (width < 900px){ /* bp:desktop */ .mw-widok{ --mw-page-pad:max(var(--mw-s3), var(--mw-safe-x)); --mw-tile-gap:var(--mw-s4); --mw-section-gap:var(--mw-s9); --mw-header-h:3.5rem; } }
/* ---- reset lokalny (tylko wewnątrz naszych widoków) ----
   Nie obnizac specyficznosci (0,1,1): komponenty na tagach z resetem (button/ul/a/li)
   piszemy jako `.mw-widok .mw-klasa` (0,2,0). */
.mw-widok *,.mw-widok *::before,.mw-widok *::after{ box-sizing:border-box; }
/* kroj bazowy z --mw-body na kazdym widoku */
.mw-widok{ margin:0; font-family:var(--mw-body); font-variant-numeric:lining-nums; font-size:var(--mw-fs-base); line-height:var(--mw-lh-base);
  color:var(--mw-ink); background:var(--mw-paper); -webkit-font-smoothing:antialiased; }
.mw-widok img{ max-width:100%; display:block; }
.mw-widok button{ font:inherit; color:inherit; background:none; border:none; padding:0; cursor:pointer; }
.mw-widok a{ color:inherit; }
/* podkreslenie (utility): jeden odstep na kazdym elemencie, em liczony od jego pisma; specyficznosc 0, bez lokalnych nadpisan */
:where(.mw-widok, .mw-widok *, .mw-checkout-view, .mw-checkout-view *){ text-underline-offset:var(--mw-underline-gap); }
/* pogrubienie 500 w calym sklepie (Tomek 07.10) */
.mw-widok :is(strong, b){ font-weight:500; }
.mw-widok h1,.mw-widok h2,.mw-widok h3,.mw-widok p,.mw-widok ul,.mw-widok ol{ margin:0; }
.mw-widok ul,.mw-widok ol{ padding:0; list-style:none; }

/* ---- focus widoczny (WCAG 2.4.7) ---- */
.mw-widok a:focus-visible,.mw-widok button:focus-visible,.mw-widok input:focus-visible,
.mw-widok select:focus-visible,.mw-widok textarea:focus-visible,.mw-widok summary:focus-visible,.mw-widok [tabindex]:focus-visible{
  outline:2px solid var(--mw-ink); outline-offset:2px; border-radius:var(--mw-radius);
}
/* po kliknieciu mysza bez ramki (Tomek 01.10); Tab zdejmuje .mw-pointer i ramka wraca; klasa z szkielet.js */
html.mw-pointer .mw-widok :focus{ outline:none; }

/* ---- tylko dla czytników ekranu ---- */
.mw-sr, .screen-reader-text{ position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* ---- cień kadru zdjęcia (utility): klasa w O nas, kadry home, kafelek, opinia, autorka, zdjecia w tresci, podsumowanie checkoutu, chipy na zdjeciu ---- */
.mw-shadow, .mw-view :is(.mw-seasons__item, .mw-cats__shot), .mw-tile__frame, .mw-reviews__item, .mw-post-author__frame,
.mw-strona__tresc .wp-block-image img, .mw-checkout-view .mw-checkout__main .wp-block-woocommerce-checkout-order-summary-block,
.mw-widok .mw-choice-group--card button{ box-shadow:var(--mw-shadow-0); }

/* ---- pas przewijany w bok (utility): siega brzegu ekranu, tresc od guttera; rodzic z paddingiem --mw-page-pad ---- */
.mw-view .mw-track{ display:grid; grid-auto-flow:column; grid-auto-columns:78%; gap:var(--mw-s2) var(--mw-s3); align-content:start;
  margin-inline:calc(-1 * var(--mw-page-pad)); padding-inline:var(--mw-page-pad); scroll-padding-inline:var(--mw-page-pad);
  scroll-snap-type:x mandatory; overscroll-behavior-x:contain; }
/* ---- pas bez paska przewijania (utility): wspolny przodek pasow; selektory jak w plikach komponentow, wiec waga bez zmian ---- */
.mw-view .mw-track, .mw-view .mw-carousel__track, .mw-view .mw-seasons__track,
.mw-widok .mw-reviews__list, .mw-lightbox .mw-lightbox__track, .mw-pdp__shots,
.mw-widok .mw-polecane__tasma{ overflow-x:auto; overflow-y:hidden; scrollbar-width:none; } /* tylko w bok: schowany rzad rozmiarow wystaje pod kafelek */
:is(.mw-track, .mw-carousel__track, .mw-seasons__track, .mw-reviews__list, .mw-lightbox__track, .mw-pdp__shots, .mw-polecane__tasma)::-webkit-scrollbar{ display:none; }
/* ---- mleko z rozmyciem (utility): szyba naglowka, zaslony okien, arkusz rozmiarow; karta kupna na telefonie ma swoje w pdp.css ---- */
.mw-header::before, .mw-widok .mw-modal__tlo, .mw-widok #cmplz-cookiebanner-container.cmplz-soft-cookiewall,
.mw-view .mw-sheet, .mw-lightbox[data-mw-lightbox], .mw-pdp .mw-notify-dialog, .mw-konto__quote{
  background:var(--mw-milk); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
/* ---- etykieta wersalikami (utility): pasek, menu, dock, szuflady, linki-etykiety; reszta wygladu w regule komponentu ---- */
.mw-view .mw-hero__link, .mw-menu a, .mw-menu__link, .mw-widok .mw-header__tools a, .mw-widok .mw-header__szukaj-btn,
.mw-widok .mw-search-drawer__label, .mw-szw__grupa, .mw-widok .mw-dock__item, .mw-widok .mw-megamenu__back,
.mw-widok .mw-menu-dol, .mw-widok .mw-photo-bar__cta,
.mw-manifesto__eyebrow, .mw-seasons__edge-label, .mw-frame-label__lead, .mw-widok .mw-cart-drawer__link,
.mw-about__social .mw-about__social-handle, .mw-post-card__meta, .mw-post__meta, .mw-post-author__label{
  font-size:var(--mw-fs-base); letter-spacing:var(--mw-ls-caps); text-transform:uppercase; }
/* ---- etykieta serif 18/500 (utility): autorka opinii, cytat w koncie, Kolor / Rozmiar na karcie (Tomek 15.10) ---- */
.mw-widok .mw-reviews__author,
.mw-konto__main .mw-konto__quote footer, .mw-pdp .mw-pdp__label{ font-family:var(--mw-serif); font-weight:500; font-size:var(--mw-fs-md); line-height:var(--mw-lh-snug); }
/* ---- strzalka na zdjeciu (utility): kafelek, karta, powiekszenie; przezroczystosc i ruch w regule komponentu ---- */
.mw-view .mw-tile__arrow, .mw-lightbox .mw-lightbox__arrow, .mw-pdp .mw-pdp__arrow{ position:absolute; inset-block-start:50%; translate:0 -50%;
  display:grid; place-items:center; inline-size:var(--mw-s4); block-size:var(--mw-s4); color:var(--mw-ink); }
.mw-tile__arrow--prev, .mw-lightbox .mw-lightbox__arrow--prev, .mw-pdp__arrow--prev{ inset-inline-start:0; }
.mw-tile__arrow--next, .mw-lightbox .mw-lightbox__arrow--next, .mw-pdp__arrow--next{ inset-inline-end:0; }
/* ---- kwadratowy przycisk 44 (utility): strzalki polecanych, strzalki i X powiekszenia; galeria karty 44 tylko na telefonie (lightbox.css) ---- */
.mw-widok .mw-polecane__strzalka, .mw-lightbox :is(.mw-lightbox__arrow, .mw-lightbox__x){
  display:grid; place-items:center; inline-size:var(--mw-control-h); block-size:var(--mw-control-h); }
/* ---- kreska od lewej (utility): wjazd (menu, zakladki) i zjazd (linki hero i karuzeli, tabela rozmiarow); stan w regule komponentu ---- */
.mw-header__in :is(.mw-menu > li > a, .mw-header__tools a, .mw-header__szukaj-btn)::after, .mw-view .mw-tab::after,
.mw-view :is(.mw-hero__link, .mw-carousel__more, .mw-cats__more, .mw-feature__cta)::after, .mw-pdp .mw-link-line::after, .mw-widok .mw-post-card__more::after,
.mw-widok .mw-choice-group--size .mw-choice-group__label::after, .mw-widok .mw-choice-group .mw-swatch::after,
.mw-checkout-view .mw-checkout__main .wc-block-components-address-card__edit::after,
.mw-konto__main :is(.woocommerce-Address .edit, .woocommerce-LostPassword a, .mw-konto__new-link, :is(.woocommerce-orders-table, tfoot) a.button:not(.pay), .woocommerce-info a.button, :is(.order-again, .mw-konto-opinie) a.button)::after{
  content:""; position:absolute; inset-inline:0; inset-block-end:0; block-size:var(--mw-link-line); background:currentColor;
  transform-origin:left; transition:transform var(--mw-link-duration) var(--mw-ease); }
/* zjazd: kreska stoi i chowa sie do lewej */
.mw-view :is(.mw-hero__link, .mw-carousel__more, .mw-cats__more, .mw-feature__cta):is(:hover, :focus-visible)::after,
.mw-widok .mw-post-card__more:is(:hover, :focus-visible)::after,
.mw-checkout-view .mw-checkout__main .wc-block-components-address-card__edit:is(:hover, :focus-visible)::after,
.mw-konto__main :is(.woocommerce-Address .edit, .woocommerce-LostPassword a, .mw-konto__new-link, :is(.woocommerce-orders-table, tfoot) a.button:not(.pay), .woocommerce-info a.button, :is(.order-again, .mw-konto-opinie) a.button):is(:hover, :focus-visible)::after{ transform:scaleX(0); }
/* ---- etykieta 15 wersalikami (utility): link-etykiety nizej, Filtruj, naglowki sekcji filtrow ---- */
.mw-view .mw-tab, .mw-view :is(.mw-carousel__more, .mw-cats__more), .mw-widok .mw-post-card__more, .mw-widok .mw-blog__main :is(.page-numbers.prev, .page-numbers.next),
.mw-checkout-view .mw-checkout__main .wc-block-components-address-card__edit,
.mw-konto__main :is(.woocommerce-Address .edit, .woocommerce-LostPassword a, .mw-konto__new-link, :is(.woocommerce-orders-table, tfoot) a.button:not(.pay), .woocommerce-info a.button, :is(.order-again, .mw-konto-opinie) a.button),
.mw-widok .mw-btn-filtry, .mw-widok .mw-filtry__etykieta{
  font-family:var(--mw-body); font-size:var(--mw-fs-sm); letter-spacing:var(--mw-ls-caps); text-transform:uppercase; }
/* ---- link-etykieta (utility): zobacz wszystko, czytaj wiecej, nowsze/starsze, edytuj adres; miejsce na kreske od lewej; bez filtrow (padding 4 zmienia Filtruj) ---- */
.mw-view .mw-tab, .mw-view :is(.mw-carousel__more, .mw-cats__more), .mw-widok .mw-post-card__more, .mw-widok .mw-blog__main :is(.page-numbers.prev, .page-numbers.next),
.mw-checkout-view .mw-checkout__main .wc-block-components-address-card__edit,
.mw-konto__main :is(.woocommerce-Address .edit, .woocommerce-LostPassword a, .mw-konto__new-link, :is(.woocommerce-orders-table, tfoot) a.button:not(.pay), .woocommerce-info a.button, :is(.order-again, .mw-konto-opinie) a.button){
  position:relative; padding-block-end:var(--mw-s1); }
/* ---- link w tresci (utility): komunikaty i regulamin checkoutu, paginacja bloga, stopka na najazd ---- */
.mw-checkout-view .mw-checkout__main :is(.woocommerce-info, .woocommerce-message) a, .mw-checkout-view .mw-checkout__main .woocommerce-terms-and-conditions-link,
.mw-widok .mw-blog__main :is(.page-numbers.current, a.page-numbers:is(:hover, :focus-visible)),
.mw-footer__linki :is(a, button):hover, .mw-footer__dol a:hover{ color:var(--mw-ink); text-decoration:underline; }
/* ---- link w tekscie (utility): kreska pod literami z lewej, na hover znika w lewo (background, bo dziala na zawinietej linii); proza, zgoda kontaktu, opis karty ---- */
.mw-strona__tresc a:not(.mw-siatka *, .mw-btn, :has(> img), [href$=".pdf"], [href$=".doc"], [href$=".docx"]),
.mw-contact-form__consent a, .mw-pdp .mw-pdp__text a:not(.mw-link-line){
  color:var(--link-c, var(--mw-ink)); text-decoration:none; box-decoration-break:clone; -webkit-box-decoration-break:clone;
  background:linear-gradient(currentColor, currentColor) left bottom / var(--link-w, 100%) var(--mw-link-line) no-repeat;
  transition:background-size var(--mw-link-duration) var(--mw-ease), color var(--mw-dur-fast) var(--mw-ease); }
/* stan: zmienne czyta tylko utility wyzej; hover tylko dla myszy, bo na dotyku zostaje po tapnieciu */
.mw-widok a:focus-visible{ --link-w:0; }
@media (hover: hover){ .mw-widok a:hover{ --link-w:0; --link-c:var(--mw-taupe); } }
/* ---- lista wierszy z kreska (utility): dzialy na home, menu konta na desktopie; uklad i stany w regule komponentu ---- */
/* spoczynek pelna czernia: wygaszenie do 55% dawalo 4,23:1, ponizej AA; nazwa stopien nizej niz naglowek sekcji */
.mw-view .mw-cats__list, .mw-konto__main .woocommerce-MyAccount-navigation ul{ border-block-start:1px solid var(--mw-line); }
.mw-view .mw-cats__row, .mw-konto__main .woocommerce-MyAccount-navigation a{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--mw-s4);
  padding-block:var(--mw-s2); border-block-end:1px solid var(--mw-line); text-decoration:none; color:var(--mw-ink); transition:color .3s var(--mw-ease); }
.mw-cats__name, .mw-konto__main .woocommerce-MyAccount-navigation a{ line-height:1.1; }
/* ---- karta biala (utility): adres i punkt odbioru w checkoucie, karty adresow i kokpitu w koncie, opinia na home, karta wpisu; padding w regule komponentu ---- */
.mw-checkout-view .mw-checkout__main :is(#apaczka_selected_point_data, #easypack_selected_point_data, .wc-block-components-address-card),
.mw-konto__main :is(.woocommerce-Address, .mw-konto__card),
.mw-reviews__item, .mw-post-card{ border:1px solid var(--mw-line); border-radius:var(--mw-radius); background:var(--mw-paper); }
/* ---- zdjecie wypelnia kadr (utility): podpowiedzi szukajki, dzialy i kolekcje na home, galeria karty i w tresci, karta wpisu ---- */
.mw-szw__foto img, .mw-view .mw-cats__shot, .mw-view .mw-collection__image, .mw-galeria__img,
.mw-post-card__media img{ inline-size:100%; block-size:100%; object-fit:cover; }
/* ---- naglowek 24/500 serif (utility): tytuly sekcji, szuflad, krokow, kart, „Razem"; interlinia i odstepy w regule komponentu ---- */
.mw-h2, .mw-koszyk__pusty-tyt, .mw-checkout-view .mw-checkout__main :is(h2, h3), .mw-customer-details .woocommerce-column__title,
.mw-cats__name, .mw-konto__main .woocommerce-MyAccount-navigation a,
.mw-cats__desc-title, .mw-about__value .mw-about__value-name, .mw-post-card__title, .mw-widok .mw-footer__kol-tyt, .mw-checkout-view .p24-payment-status__title,
.mw-widok :is(.mw-drawer__title,.mw-cart-drawer__title), .mw-checkout-view .wc-block-checkout__sidebar .wc-block-components-checkout-order-summary__title-text, .mw-koszyk__podsumowanie::before, .mw-checkout-view .jBox-Modal .jBox-title,
.mw-megamenu__group, .mw-widok .mw-blog__main .page-numbers, .mw-post-author__name,
.mw-checkout-view .mw-checkout__main .wc-block-components-checkout-step__title,
.mw-konto__main .woocommerce-MyAccount-content h2, .mw-konto__main .woocommerce-MyAccount-content h3,
.mw-konto__main .woocommerce > h2, .mw-konto__main #customer_login h2, .mw-konto__card-title, .mw-konto__main .woocommerce-EditAccountForm legend, .mw-konto__main .mw-konto__new .mw-konto__new-title,
.mw-cart-drawer__total, .mw-sumy .mw-sumy__wiersz--razem,
.mw-checkout-view .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-totals-item.wc-block-components-totals-footer-item,
.mw-konto__main .woocommerce table.shop_table tfoot tr:has(.mw-razem) :is(th, td),
.mw-about__social .mw-about__social-title, .mw-strona__tresc h3{ font-family:var(--mw-serif); font-weight:500; font-size:var(--mw-fs-lg); }
/* ---- tytul nad akapitem (utility): dzialy na home, wartosci w O nas, karty wpisow; odstepy w regule komponentu ---- */
.mw-cats__desc-title, .mw-about__value .mw-about__value-name, .mw-post-card__title, .mw-widok .mw-footer__kol-tyt, .mw-checkout-view .p24-payment-status__title{
  line-height:var(--mw-lh-tight); color:var(--mw-ink); }
/* ---- tekst pomocniczy 15 (utility): zgody, podpowiedzi pol, dane punktu, VAT pod suma, kupon, stepper ---- */
.mw-contact-form__consent, .mw-konto__main #account_display_name_description, .mw-konto__main .woocommerce-form__label-for-checkbox,
.mw-checkout-view .mw-checkout__main :is(#apaczka_selected_point_data, #easypack_selected_point_data), .mw-checkout-view .mw-checkout__main .wc-block-components-address-card,
.mw-widok .mw-tax-note, .mw-checkout-view .mw-checkout__main .wc-block-components-totals-footer-item .wc-block-components-totals-item__description,
.mw-cart-item:has(.mw-qty__field:not([value="1"])) .mw-cart-item__price, .mw-widok .mw-qty__button,
.mw-kupon__etykieta, .mw-kupony__poz, .mw-widok .mw-koszyk__wroc, .mw-oceny__txt, .mw-widok .mw-uwaga{ font-size:var(--mw-fs-sm); color:var(--mw-ink-3); }
/* ---- notka 16 (utility): dopiski koszyka, prog dostawy, pusty koszyk, jak mierzyc w tabeli rozmiarow; 16 = minimum tekstu czytanego ---- */
.mw-cart-drawer__note, .mw-koszyk__dopisek, .mw-prog-dostawy__txt, .mw-koszyk__pusty-txt,
.mw-pdp .mw-modal--tr :is(.mw-tr-how, .mw-tr-steps li, .mw-tr-empty, .mw-tr-finder-note){ font-size:var(--mw-fs-base); color:var(--mw-ink-3); }
/* ---- drobny druk 14 (utility): meta pozycji, ilosc, liczniki filtrow, zgody pod formularzem ---- */
.mw-cart-item__meta, .mw-cart-item__preorder, .mw-cart-item__price-old,
.mw-checkout-view .wc-block-components-order-summary :is(.wc-block-components-product-metadata, .wc-block-components-order-summary-item__regular-individual-price),
.mw-checkout-view .mw-checkout__main .wc-block-components-order-summary :is(.wc-block-components-product-metadata, .wc-block-components-product-details),
.mw-checkout-view .wc-block-components-order-summary .wc-block-components-order-summary-item__quantity,
.mw-filtry__licznik, .mw-szw__meta, .mw-konto__main :is(.mw-konto__privacy, .mw-recaptcha-note),
.mw-konto__main .woocommerce-table--order-details .wc-item-meta{ font-size:var(--mw-fs-xs); color:var(--mw-ink-3); }
/* ---- drobna etykieta wersalikami 14 / 0,2 (utility): napis paska kafelka, etykieta arkusza, chipy na zdjeciu, etapy checkoutu ---- */
.mw-view .mw-tile__buy-cta, .mw-view .mw-sheet__label,
.mw-checkout-steps__label{ font-size:var(--mw-fs-xs); letter-spacing:var(--mw-ls-caps); text-transform:uppercase; }
/* ---- drobny druk wersalikami 14 / 0,1 (utility): okruszki, liczniki, sortowanie, naglowki tabel, plakietka promocji ---- */
.mw-okruszki, .mw-licznik-wynikow, .mw-sortuj__select, .mw-doladuj__info, .mw-view .mw-tile__badge,
.mw-cennik-tab thead th, .mw-konto__main .shop_table thead th{ font-size:var(--mw-fs-xs); letter-spacing:var(--mw-ls-caps-sm); text-transform:uppercase; }

/* ---- skip link ---- */
/* drugi selektor: w widoku reset przyciskow (0,1,1) zjadal tlo i padding */
.mw-skip, .mw-widok .mw-skip{ position:absolute; left:-9999px; top:0; background:var(--mw-ink); color:var(--mw-on-dark);
  padding:.6rem 1rem; z-index:100; }
.mw-skip:focus, .mw-widok .mw-skip:focus{ left:.5rem; top:.5rem; }

/* ---- szanuj „ogranicz ruch" (WCAG 2.3.3) ---- */
@media (prefers-reduced-motion:reduce){
  .mw-widok *,.mw-widok *::before,.mw-widok *::after{
    animation-duration:.01ms!important; animation-iteration-count:1!important;
    transition-duration:.01ms!important; scroll-behavior:auto!important;
  }
}

/* ============================================================
   CHROM WSPÓLNY: pasek ogłoszeń, nagłówek, stopka, wspólne nagłówki.
   Przeniesione 19.07 z pdp.css, żeby KAŻDY widok (kategoria, koszyk,
   konto, 404) miał ten sam szkielet bez kopiowania stylów.
   ============================================================ */
/* jedna linia na kazdej szerokosci, bo tresc jedzie tasma i nie zawija — wysokosc stala */
/* ciemne mleczko nad hero: rozmycie ma co rozmywac dopiero, gdy zdjecie siega gornej krawedzi */
.mw-announce{position:relative; z-index:50;
  background:var(--mw-black); color:var(--mw-ecru);
  font-size:var(--mw-fs-xs); letter-spacing:var(--mw-ls-caps); text-transform:uppercase; /* 14 (Tomek 08.10) */
  block-size:var(--mw-bar-h); display:grid; align-items:center; overflow:clip;}
/* mleczko tylko nad hero (home): na bialych stronach axe nie liczy kontrastu na polprzezroczystym tle */
.mw-home .mw-announce{background:color-mix(in srgb, var(--mw-black) 85%, transparent); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);}
/* pas z dwiema kopiami tresci; przesuniecie o polowe wraca do punktu wyjscia */
.mw-widok .mw-announce__track{display:flex; inline-size:max-content;
  animation:mw-announce-scroll 45s linear infinite;}
.mw-widok .mw-announce__item,
.mw-widok .mw-announce__track::after{flex:0 0 auto; white-space:nowrap;
  padding-inline:var(--mw-s9);}
/* druga kopia tresci jako pseudo (data-text z szkielet.php): axe nie liczy jej kontrastu offscreen */
.mw-widok .mw-announce__track::after{content:attr(data-text);}
@keyframes mw-announce-scroll{to{transform:translateX(-50%);}}
/* link z panelu: (0,2,0) bije reset a{color:inherit}, inaczej ciemny tekst na czarnym pasku */
.mw-widok .mw-announce--link{color:var(--mw-ecru); text-decoration:none;}
/* podkreslenie, bo caly pasek jest linkiem i nic tego nie zapowiadalo */
.mw-widok .mw-announce--link:hover .mw-announce__item{text-decoration:underline;}
/* tasma jest wylacznie na telefonie: na desktopie tresc miesci sie i stoi wysrodkowana */
@media (width >= 900px){ /* bp:desktop */
  .mw-widok .mw-announce__track{animation:none; inline-size:100%; justify-content:center;}
  .mw-widok .mw-announce__item{padding-inline:var(--mw-s3);}
  .mw-widok .mw-announce__track::after{display:none;}
}
/* „ogranicz ruch" na telefonie: tasma stoi, wiec tekst zawija sie zamiast ucinac na „DO PUNKTÓW O…" (02.10) */
@media (prefers-reduced-motion:reduce) and (width < 900px){ /* bp:desktop */
  .mw-widok .mw-announce{block-size:auto; min-block-size:var(--mw-bar-h); padding-block:var(--mw-s1);}
  .mw-widok .mw-announce__track{inline-size:100%; justify-content:center;}
  .mw-widok .mw-announce__item{flex:0 1 auto; max-inline-size:100%; white-space:normal; text-align:center; padding-inline:var(--mw-s3); line-height:var(--mw-lh-snug);}
  .mw-widok .mw-announce__track::after{display:none;}
}
/* jeden naglowek na cala strone: tlo = mleko z ::before, nie biel; kreska zostaje poza home (Tomek 17.09) */
/* telefon: naglowek odjezdza z trescia (nawigacja w dolnym pasku); od 900 sticky */
.mw-header{border-bottom:1px solid var(--mw-line);
  position:relative; inset-block-start:0; z-index:40;}
/* bez max-width i marginu bocznego: pasek ma isc przez cala szerokosc okna */
/* `relative` + warstwa wyzej: nakladka lezy pod trescia paska, bo zaczyna sie na jego gornej krawedzi */
.mw-header__in{display:flex; align-items:center; gap:var(--mw-s2); position:relative; z-index:1;
  padding:var(--mw-s3) var(--mw-s4); min-block-size:var(--mw-header-h);}
/* logo w osi OKNA, nie miedzy sasiadami: hamburger i narzedzia maja rozne szerokosci,
   wiec przy zwyklym `margin:auto` logo siadalo obok srodka */
.mw-header__logo{font-family:var(--mw-serif); font-size:var(--mw-fs-lg);
  text-decoration:none; line-height:1; order:2; flex:0 0 auto;
  position:absolute; inset-inline-start:50%; translate:-50% 0;}
.mw-header__logo-img{display:block; block-size:var(--mw-logo-h); aspect-ratio:1152.59/146.51;
  background:currentColor;
  -webkit-mask:url(img/logo-mw.svg?v=2) no-repeat center / contain; /* ?v: Cloudflare i przegladarka trzymaja stary SVG 30 dni, przy kolejnej zmianie logo podbij */
  mask:url(img/logo-mw.svg?v=2) no-repeat center / contain;}
.mw-header__nav{order:1; flex:1 1 0; min-inline-size:0;}
/* telefon: narzedzia w dolnym pasku (Figma 261:68); `0 1 auto`, bo `1 1 0` rozpychalo narzedzia na logo */
.mw-header__tools{order:3; flex:0 1 auto; min-inline-size:0; display:none; align-items:center;
  justify-content:flex-end; gap:var(--mw-s3);}
.mw-menu{display:flex; gap:var(--mw-s4);}
/* menu i narzedzia naglowka: kroj naglowkow, nie tresci */
.mw-menu a,.mw-menu__link,
.mw-widok .mw-header__tools a,
.mw-widok .mw-header__szukaj-btn{
  text-decoration:none; font-family:var(--mw-serif); color:var(--mw-ink); white-space:nowrap;}
/* podkreslenie jak w zakladkach karuzeli: kreska rosnie od lewej, nic sie nie wygasza */
.mw-header__in :is(.mw-menu > li > a, .mw-header__tools a, .mw-header__szukaj-btn){
  position:relative; padding-block:var(--mw-underline-gap); font-weight:500; } /* symetrycznie: tekst w osi paska, nie razem z kreska (Tomek 08.10) */
/* menu jak narzedzia: wysokosc z linii i paddingu, nie z samego kroju */
.mw-header__in .mw-menu > li > a{ display:inline-block; }
/* pole klikniecia 44 w pionie, wyglad bez zmian; w poziomie nie, pozycje stoja 24-32 od siebie */
.mw-header__in :is(.mw-menu > li > a, .mw-header__tools a, .mw-header__szukaj-btn)::before{
  content:""; position:absolute; inset-inline:0; inset-block-start:50%; block-size:var(--mw-control-h); translate:0 -50%; }
.mw-header__in :is(.mw-menu > li > a, .mw-header__tools a, .mw-header__szukaj-btn)::after{ transform:scaleX(0); }
.mw-header__in :is(.mw-menu > li > a, .mw-header__tools a, .mw-header__szukaj-btn):is(:hover,:focus-visible)::after{
  transform:scaleX(1);}

/* ---- WYSZUKIWARKA w nagłówku (lupa + rozwijany pasek) ---- */
/* bez stalych 40x40 z czasow lupy: przycisk niesie dzis slowo, ktore wylewalo sie poza swoj box
   i nachodzilo na logo. Wysokosc z linii tekstu, szerokosc z tresci */
.mw-header__szukaj-btn{display:inline-flex; align-items:center;}
.mw-header__szukaj-btn:hover{color:var(--mw-ink-3);}
/* ===== SZUFLADA z prawej: jedna powloka dla koszyka, szukajki i filtrow (Tomek 29.09) ===== */
/* koszyk przez alias .mw-cart-drawer*: jego znaczniki sa w inc/koszyk.php (teren Michala) */
.mw-widok:is(.mw-drawer,.mw-cart-drawer){ --mw-drawer-pad:var(--mw-s3); position:fixed; inset:0; z-index:80; display:flex; justify-content:flex-end;
  background:transparent; margin:0; }
.mw-widok:is(.mw-drawer,.mw-cart-drawer)[hidden]{ display:none; }
/* tlo rozmyte: uwaga zostaje w szufladzie */
:is(.mw-drawer__backdrop,.mw-cart-drawer__backdrop){ position:absolute; inset:0; background:var(--mw-overlay); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
  animation:mw-drawer-fade .3s var(--mw-ease); }
/* wejscie: panel wsuwa sie z prawej, tlo sie wygasza; animation, nie transition (reveal wg regul agencji) */
@keyframes mw-drawer-fade{ from{ opacity:0; } }
@keyframes mw-drawer-slide{ from{ translate:100% 0; } }
/* telefon: s6 strony zostaje widoczne z lewej (zmierzone 14.09: 38, token 40) */
/* podsumowanie = panel: checkout (sidebar blokow WC) i koszyk (aside z inc/koszyk.php); uklad w trybie skupienia nizej */
:is(.mw-drawer__panel,.mw-cart-drawer__panel), .mw-checkout-view .wc-block-checkout__sidebar, .mw-koszyk__podsumowanie{ position:relative; display:flex; flex-direction:column; width:100%; max-width:min(var(--mw-drawer-w), calc(100% - var(--mw-s6)));
  height:100%; overflow-y:auto; overscroll-behavior:none; background:var(--mw-paper);
  box-shadow:-1px 0 0 var(--mw-line); animation:mw-drawer-slide .3s var(--mw-ease); }
:is(.mw-drawer__head,.mw-cart-drawer__head), .mw-checkout-view .wc-block-checkout__sidebar .wc-block-components-checkout-order-summary__title, .mw-koszyk__podsumowanie::before, .mw-checkout-view .jBox-Modal .jBox-title{ position:sticky; top:0; z-index:2; display:flex; align-items:center; justify-content:space-between;
  gap:var(--mw-s2); padding:var(--mw-s3) var(--mw-drawer-pad); background:var(--mw-paper); border-bottom:1px solid var(--mw-line); }
.mw-widok :is(.mw-drawer__title,.mw-cart-drawer__title), .mw-checkout-view .wc-block-checkout__sidebar .wc-block-components-checkout-order-summary__title-text, .mw-koszyk__podsumowanie::before, .mw-checkout-view .jBox-Modal .jBox-title{ margin:0; line-height:var(--mw-lh-tight); }
/* X 44 = cel dotyku (Tomek 29.09), bez ramki; ujemny margines w pionie trzyma naglowek na 64 */
.mw-widok :is(.mw-drawer__close,.mw-cart-drawer__close){ display:grid; place-items:center; flex:0 0 auto; width:var(--mw-control-h); height:var(--mw-control-h);
  margin-block:calc((var(--mw-s5) - var(--mw-control-h)) / 2); margin-inline-end:calc(-1 * var(--mw-s2));
  padding:0; border:0; background:none; color:var(--mw-ink-3); cursor:pointer; }
.mw-widok :is(.mw-drawer__close,.mw-cart-drawer__close):hover{ color:var(--mw-ink); }
@media (width >= 900px){ /* bp:desktop */
  .mw-widok:is(.mw-drawer,.mw-cart-drawer){ --mw-drawer-pad:var(--mw-s4); }
}
/* telefon: przy polu w szufladzie reszta strony schowana, bo klawiatura iOS odslania ja w pasie pod szuflada */
@media (width < 900px){ /* bp:desktop */
  html:has(:is(.mw-drawer,.mw-cart-drawer) input:focus) body > :not(.mw-drawer,.mw-cart-drawer){ visibility:hidden; }
  html:has(:is(.mw-drawer,.mw-cart-drawer) input:focus) :is(.mw-drawer,.mw-cart-drawer){ visibility:visible; }
}

/* ---- SZUKAJKA jako szuflada z prawej (powloka: .mw-drawer wyzej), Tomek 18.09, wzor Figma 297-2/297-43 ---- */
/* panel = kolumna: pole (sticky), wyniki albo „Popularne", stopka „zobacz wszystkie" sticky na dole */
.mw-search-drawer__panel{ padding-inline:var(--mw-drawer-pad); }
.mw-szukajka{ display:flex; flex-direction:column; flex:1 1 auto; }
/* wrap = .mw-drawer__head; tu tylko wyjscie poza padding panelu i miejsce na X z prawej */
.mw-szukajka__wrap{ justify-content:flex-start;
  margin-inline:calc(-1 * var(--mw-drawer-pad)); padding-inline-end:calc(var(--mw-drawer-pad) + var(--mw-control-h)); }
/* pole jak tytul koszyka: fs-lg serif 500, pole dotyku 48 wchodzi w padding wrapa */
.mw-szukajka__pole{ flex:1 1 auto; min-width:0; min-height:var(--mw-s7); margin-block:calc(-1 * var(--mw-s2)); padding:0; font:inherit;
  font-family:var(--mw-serif); font-weight:500; font-size:var(--mw-fs-lg); line-height:var(--mw-lh-tight);
  border:0; background:transparent; color:var(--mw-ink); }
.mw-szukajka__pole::placeholder,
.mw-kupon__pole::placeholder,
.mw-checkout-view .mw-checkout__main .wc-block-components-totals-coupon input::placeholder{ color:var(--mw-ink-3); opacity:1; }
/* pole tekstowe zawsze dostaje :focus-visible, wiec ramka bylaby na kazdym otwarciu; fokus pokazuje kreska pod naglowkiem */
.mw-widok .mw-szukajka__pole:focus,.mw-widok .mw-szukajka__pole:focus-visible{ outline:none; }
.mw-szukajka__pole::-webkit-search-cancel-button{ -webkit-appearance:none; }
.mw-szukajka__submit{ position:relative; display:inline-grid; place-items:center; width:var(--mw-s5); height:var(--mw-s5); flex:0 0 auto; }
/* pole dotyku 40x48: w bok tylko 4, bo pole i X stoja 8 obok */
.mw-szukajka__submit::before{ content:''; position:absolute; inset:calc(-1 * var(--mw-s2)) calc(-1 * var(--mw-s1)); }
.mw-szukajka__submit:hover{ color:var(--mw-ink); }
/* X = .mw-drawer__close; poza formem (fokus najpierw w pole), wiec stoi absolutnie w rogu naglowka */
.mw-widok .mw-search-drawer__close{ position:absolute; top:var(--mw-s3); right:var(--mw-drawer-pad); z-index:3; }

/* wyniki live plyna w panelu; „zobacz wszystkie" na koncu listy (nasz .mw-btn--solid) */
.mw-szw[hidden]{ display:none; }
/* uklad wiersza (siatka, odstep, padding, kreska) wspolny z pozycja koszyka: lista przy .mw-cart-item w koszyk.css */
.mw-szw__poz{ text-decoration:none; color:var(--mw-ink); }
.mw-szw__poz:hover .mw-szw__nazwa,.mw-szw__poz:focus-visible .mw-szw__nazwa{ text-decoration:underline; }
.mw-szw__info{ display:flex; flex:1 1 auto; flex-wrap:nowrap; align-items:baseline; justify-content:space-between; gap:var(--mw-s1) var(--mw-s3); min-width:0; }
.mw-szw__nazwa{ min-width:0; font-family:var(--mw-serif); font-size:var(--mw-fs-base); line-height:var(--mw-lh-snug); }
.mw-szw__cena{ font-family:var(--mw-body); font-size:var(--mw-fs-sm); color:var(--mw-ink); white-space:nowrap; }
.mw-szw__cena del{ color:var(--mw-ink-3); margin-right:var(--mw-s1); }
/* „zobacz wszystkie" = nasz .mw-btn--solid (selektor dopisany przy .mw-btn nizej), tu tylko odstep */
.mw-widok .mw-szw__wiecej{ margin-top:var(--mw-s3); }
.mw-widok .mw-szw__pusto{ margin:0; padding:var(--mw-s4) 0; font-size:var(--mw-fs-base); color:var(--mw-ink-3); }

/* „Popularne" = kategorie, zawsze na dole szuflady (Tomek 18.09); wyniki przewijaja sie nad nim */
.mw-search-drawer__popular{ position:sticky; bottom:0; z-index:2; padding-block:var(--mw-s4); background:var(--mw-paper); }
/* podpowiedzi na ekranie: "Popularne" tylko przy pustym polu, inaczej zaslania dol wynikow */
.mw-search-drawer__panel:has([data-mw-szw]:not([hidden])) .mw-search-drawer__popular{ display:none; }
/* .mw-widok przed klasa: reset p/ul (0,1,1) inaczej zjada margines i padding (pulapka 1) */
/* kreska nad etykieta, nie pod nia */
.mw-widok .mw-search-drawer__label{ margin:0 0 var(--mw-s2); padding-block-start:var(--mw-s3); border-top:1px solid var(--mw-line);
  font-family:var(--mw-serif); font-weight:500; color:var(--mw-ink-3); }
.mw-widok .mw-search-drawer__list{ padding:0; }
.mw-widok .mw-search-drawer__list li{ margin-block-start:var(--mw-s2); }
.mw-search-drawer__list a{ font-size:var(--mw-fs-base); text-decoration:none; color:var(--mw-ink); }
.mw-search-drawer__list a:hover{ text-decoration:underline; }

/* kręcące się kółko w otwartym okienku podpowiedzi (na czas ładowania) */
.mw-szw__laduje{display:flex; justify-content:center; padding:var(--mw-s4);}
.mw-spinner{width:var(--mw-s4); height:var(--mw-s4); border:2px solid var(--mw-line-2); border-top-color:var(--mw-ink);
  border-radius:50%; animation:mw-spin .7s linear infinite;}
@keyframes mw-spin{to{transform:rotate(360deg);}}

/* sekcja „Z bloga" na końcu podpowiedzi */
.mw-szw__grupa{padding:var(--mw-s4) 0 var(--mw-s2); font-family:var(--mw-body); color:var(--mw-ink-3);}
.mw-szw__poz.mw-szw__poz--wpis{padding-top:var(--mw-s2); padding-bottom:var(--mw-s2); grid-template-columns:minmax(0, 1fr);}
.mw-szw__poz--wpis .mw-szw__info{ flex-wrap:wrap; }
/* tytul sekcji; checkout: naglowki stron klasycznych WC (podziekowanie, zaplac); kroj z listy naglowka 24/500 */
.mw-h2,.mw-koszyk__pusty-tyt,
.mw-checkout-view .mw-checkout__main :is(h2, h3),
.mw-customer-details .woocommerce-column__title{margin-bottom:var(--mw-s3);}
/* ---- adres z etykietami (utility, nasz order-details-customer.php): dziekujemy, mail, szczegoly zamowienia w koncie ---- */
.mw-address-list{ display:grid; grid-template-columns:auto 1fr; gap:var(--mw-s1) var(--mw-s3); margin:0; font-size:var(--mw-fs-sm); line-height:var(--mw-lh-base); }
.mw-address-list dt{ color:var(--mw-ink-3); white-space:nowrap; }
.mw-address-list dd{ margin:0; color:var(--mw-ink); overflow-wrap:anywhere; }
/* ---- STOPKA: mleczny panel na tle, tlo docelowo zdjecie od klienta (Figma 275:2) ---- */
/* panel sticky do dolu okna, w spoczynku na dole stopki; spacer ::before daje droge przejazdu */
.mw-footer{ position:relative; isolation:isolate; background:var(--mw-taupe); color:var(--mw-ink); margin-top:var(--mw-s8); padding:var(--mw-s4) var(--mw-page-pad); display:flex; flex-direction:column;
  /* cien w dol maluje taupe pod koncem strony (gumka iOS), a nie wydluza przewijania */
  box-shadow:0 33vh 0 0 var(--mw-taupe), 0 66vh 0 0 var(--mw-taupe), 0 99vh 0 0 var(--mw-taupe); }
.mw-footer::before{ content:""; flex:0 0 13rem; } /* 208: droga panelu stopki po tle, stala */
/* zdjecie pod panelem od 900; ponizej taupe (Tomek 07.10) */
.mw-widok .mw-footer__bg{ position:absolute; inset:0; z-index:-1; inline-size:100%; block-size:100%; max-width:none; object-fit:cover; }
/* szkielet lightboxa Customer Reviews bez jego CSS (wydajnosc.php) robil 50 px pod stopka */
.mw-widok .cr-pswp:not(.pswp--open){ display:none; }
.mw-footer__in{ position:sticky; bottom:var(--mw-s4); inline-size:100%; margin-inline:auto; background:var(--mw-milk); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  padding:var(--mw-s4); }

/* trzy kolumny do 240 (proporcja 300/1672); newsletter reszta, min 288: na 1024 mial 192 i pole e-mail sie ucinalo (01.10) */
.mw-footer__kolumny{ display:grid; grid-template-columns:repeat(3,minmax(0,15rem)) minmax(18rem,1fr); }
.mw-widok .mw-footer__kol-tyt{ margin:0 0 var(--mw-s3); }
.mw-footer__linki{ display:flex; flex-direction:column; gap:var(--mw-s2); font-size:var(--mw-fs-base); line-height:var(--mw-lh-snug); color:var(--mw-ink-3); }
.mw-footer__linki :is(a, button){ text-decoration:none; transition:color var(--mw-dur-fast) var(--mw-ease); }

/* newsletter: pole z dolna kreska, przycisk w linii */
.mw-footer__newsletter{ justify-self:end; width:100%; max-width:32rem; padding-inline-start:var(--mw-s6); }
/* interlinia jak .mw-footer__linki: pierwszy wiersz w linii z pierwszym linkiem kolumn (Tomek 07.10) */
.mw-widok .mw-footer__lead{ font-size:var(--mw-fs-base); line-height:var(--mw-lh-snug); color:var(--mw-ink-3); margin:0 0 var(--mw-s3); }
.mw-footer__row{ display:flex; align-items:center; border-bottom:1px solid var(--mw-taupe); transition:border-color var(--mw-dur-fast) var(--mw-ease); }
.mw-widok .mw-footer__field{ flex:1 1 auto; min-width:0; min-height:var(--mw-control-h); padding:var(--mw-s2) 0;
  font:inherit; font-size:var(--mw-fs-base); color:var(--mw-ink);
  background:none; border:0; }
/* wersaliki tylko w podpowiedzi, wpisany adres normalnie (Tomek 07.10) */
.mw-footer__field::placeholder{ color:var(--mw-ink-3); letter-spacing:var(--mw-ls-caps); text-transform:uppercase; }
/* fokus pola = kreska taupe -> czarna zamiast ramki (Tomek 07.10) */
.mw-widok .mw-footer__field:focus{ outline:none; }
.mw-footer__row:has(.mw-footer__field:focus){ border-bottom-color:var(--mw-ink); }
/* ghost CTA: typografia .mw-btn w Garamondzie (Tomek 07.10) */
.mw-widok .mw-footer__submit{ min-height:var(--mw-control-h); padding:0 var(--mw-s2); font-family:var(--mw-serif); font-size:var(--mw-fs-base);
  font-weight:500; letter-spacing:var(--mw-ls-caps); text-transform:uppercase; white-space:nowrap; }
.mw-widok .mw-footer__submit:hover{ text-decoration:underline; }
/* status zapisu wstawia JS Michala (mw-newsletter) za formularzem */
.mw-footer__newsletter .mw-newsletter__status{ margin-top:var(--mw-s2); font-size:var(--mw-fs-base); color:var(--mw-ok); }
.mw-footer__newsletter .mw-newsletter__status--blad{ color:var(--mw-error); }

/* dol: copyright z lewej, realizacja z prawej; regulaminy w kolumnie Pomoc i zakupy (Tomek 07.10) */
.mw-widok .mw-footer__dol{ display:flex; align-items:center; justify-content:space-between; gap:var(--mw-s2) var(--mw-s5); flex-wrap:wrap; margin-block-start:var(--mw-s7);
  font-size:var(--mw-fs-base); color:var(--mw-ink-3); }
.mw-footer__dol a{ text-decoration:none; }
.mw-footer__credit a{ font-weight:500; }
.mw-footer__agency{ color:var(--mw-tophat-violet); }

@media (width < 900px){ /* bp:desktop */
  /* panel klei sie nad dolnym paskiem, nie pod nim; dluzszy przejazd = zdjecie na pol ekranu */
  .mw-footer__in{ bottom:calc(var(--mw-dock-h) + var(--mw-dock-safe) + var(--mw-s4)); }
  .mw-footer::before{ flex-basis:45svh; }
  .mw-widok .mw-footer__bg{ display:none; }
  .mw-footer__kolumny{ grid-template-columns:1fr 1fr; gap:var(--mw-s5) var(--mw-s6); }
  .mw-footer__newsletter{ grid-column:1 / -1; justify-self:start; padding-inline-start:0; }
  .mw-widok .mw-footer__kol-tyt{ margin-bottom:var(--mw-s2); }
}
/* telefon: newsletter na gorze, kolumny rozwiniete bez akordeonu (Tomek 07.10), regulaminy nad copyright */
@media (width < 600px){ /* bp:phone */
  /* panel wyzszy niz ekran: bez sticky i bez przejazdu, od gory stopki (Tomek 07.10) */
  .mw-footer::before{ content:none; }
  .mw-footer__in{ position:static; padding:var(--mw-s4) var(--mw-s3); }
  .mw-footer__kolumny{ display:flex; flex-direction:column; gap:var(--mw-s5); }
  .mw-footer__newsletter{ order:-1; max-width:none; margin-bottom:var(--mw-s2); }
  .mw-widok .mw-footer__dol{ flex-direction:column; align-items:flex-start; gap:var(--mw-s2); margin-block-start:var(--mw-s5); }
}
/* ---- MENU MOBILNE (mobile first: wartosci telefonu w bazie naglowka wyzej) ---- */
/* DOLNY PASEK. skrajne pola przy krawedziach, MENU na srodku; 16 + 8 paddingu = tekst rowno z trescia strony (24) */
/* nie 25/50/25 (Figma 261:50): "KOSZYK (1)" ma 94 px i w polu 25% z paddingiem 8 nie miesci sie na 390 (Tomek 15.09) */
.mw-dock{ position:fixed; inset-inline:0; inset-block-end:0; z-index:45;
  display:flex; justify-content:space-between; padding-inline:max(var(--mw-s3), var(--mw-safe-x));
  /* kreska tlem, nie ramka: pasek ma rowno 44 */
  background:linear-gradient(var(--mw-line), var(--mw-line)) top / 100% 1px no-repeat, var(--mw-paper);
  padding-block-end:var(--mw-dock-safe); }
/* dock staly na calej stronie, bez chowania przy przewijaniu (Tomek 29.09) */
/* auto-flow column: tekst i span licznika to dwa elementy siatki, bez tego "KOSZYK" i "(1)" ida w dwa rzedy */
.mw-widok .mw-dock__item{ display:grid; grid-auto-flow:column; place-items:center; column-gap:.3em;
  min-block-size:var(--mw-dock-h); padding-inline:var(--mw-s2); white-space:nowrap;
  font-family:var(--mw-serif); font-weight:500; color:var(--mw-ink); text-decoration:none; text-align:center; }
/* koszyk slowem „KOSZYK (1)" w docku (18.09) i w naglowku (02.10): licznik w tekscie, nawiasy z CSS */
.mw-koszyk-licznik{ font-weight:700; }
.mw-koszyk-licznik:not(:empty)::before{ content:"("; font-weight:500; }
.mw-koszyk-licznik:not(:empty)::after{ content:")"; font-weight:500; } /* liczba 700, nawias jak slowo obok (Tomek 15.10) */
.mw-widok .mw-dock__item--wide{ padding-inline:var(--mw-s4); }
/* tresc strony nie moze konczyc sie pod paskiem; overlay (role=dialog, np. szuflada koszyka) ma go przykryc */
.mw-widok:not([role="dialog"]){ padding-block-end:calc(var(--mw-dock-h) + var(--mw-dock-safe)); }

/* PANEL MENU. krok 1 to lista, krok 2 wjezdza z prawej */
.mw-header__nav{ display:none; }
/* warstwa nad naglowkiem, pod dolnym paskiem: ten sam przycisk zamyka panel */
.mw-header__nav.is-otwarte{ display:grid; grid-template-rows:auto auto; align-content:start; overflow-y:auto;
  position:fixed; inset:0; z-index:42; background:var(--mw-paper);
  padding:var(--mw-s4) var(--mw-s3); }
.mw-header__nav.is-otwarte .mw-menu{ flex-direction:column; gap:var(--mw-s4);
  align-content:start; overflow-y:auto; }
/* pozycje krokiem 32 px jak manifest, kroj szeryfowy, duze litery, nie wersaliki */
.mw-header__nav.is-otwarte :is(.mw-menu > li > a, .mw-menu-dol){ font-family:var(--mw-serif);
  font-size:var(--mw-fs-xl); font-weight:300; line-height:1.15;
  letter-spacing:0; text-transform:none; }
/* menu otwarte: pasek ogloszen schowany (visibility, bez przesuniecia strony), inaczej zaslania gore panelu */
body:has(.mw-header__nav.is-otwarte) .mw-announce{ visibility:hidden; }
/* podkreslenie z paska nie ma sensu na liscie panelu */
.mw-header__nav.is-otwarte .mw-menu > li > a::after{ display:none; }
/* strona stoi pod otwartym menu i pod oknem modalnym; klasa na <html>, bo iOS ignoruje overflow na <body> */
.mw-scroll-lock{ overflow:hidden; }
/* blokada przewijania nie zabiera paska, siatka nie zmienia szerokosci */
html{ scrollbar-gutter:stable; }

/* KROK 2. kadr na caly ekran, poza ekranem do czasu otwarcia pozycji */
.mw-header__nav.is-otwarte .mw-megamenu{ position:fixed; inset:0; z-index:1;
  margin:0; background:var(--mw-paper); overflow-y:auto;
  padding:var(--mw-s7) var(--mw-page-pad) var(--mw-dock-h);
  translate:100% 0; visibility:hidden;
  transition:translate var(--mw-megamenu-move) var(--mw-ease), visibility var(--mw-megamenu-move); }
.mw-header__nav.is-otwarte .mw-menu > li.is-open > .mw-megamenu{ translate:0 0; visibility:visible; }
/* powrot: strzalka plus tytul dzialu */
.mw-widok .mw-megamenu__back{ display:flex; align-items:center; gap:var(--mw-s2);
  min-block-size:var(--mw-control-h); margin-block-end:var(--mw-s3); color:var(--mw-ink); }

/* KONTO w panelu: nie miesci sie w pasku, stoi pod lista jak jej pozycja (kroj i rozmiar z regul wyzej) */
.mw-widok .mw-menu-dol{ display:inline-block; justify-self:start; margin-block-start:var(--mw-s4);
  padding-block:var(--mw-underline-gap); color:var(--mw-ink); text-decoration:none; }

/* Panel ma biale tlo, wiec tresc musi byc ciemna — na stronie glownej pasek jedzie jasnymi
   literami na zdjeciu i bez tego pozycje panelu byly niewidoczne */
.mw-header__nav.is-otwarte :is(.mw-menu > li > a, .mw-megamenu a){ color:var(--mw-ink); opacity:1; }

/* naglowek grupy takze na telefonie: bez tego „Kategorie" wyglada jak zwykla pozycja */
.mw-megamenu__group{ line-height:1.2; color:var(--mw-ink); margin-block-end:var(--mw-s2); }
.mw-megamenu__list .mw-megamenu__group > a{ font-family:inherit; font-size:inherit;
  color:inherit; padding-block:0; }

@media (width >= 900px){ /* bp:desktop */
  .mw-header{ position:sticky; }
  /* fokus i kotwice dosuwane pod przyklejony naglowek (72 + 16); bez tokenu, bo html nie dziedziczy --mw-* z body (02.10) */
  html{ scroll-padding-block-start:calc(var(--mw-header-h) + var(--mw-s3)); }
  .mw-header__nav{ display:block; }
  .mw-header__tools{ display:flex; }
  /* naglowek w linii tresci: ten sam gutter co strona (do 18.09 sztywne 24, na 3440 rozjazd 36 vs 64) */
  .mw-header__in{ gap:var(--mw-s4); padding:0 var(--mw-page-pad); }
  .mw-header__in :is(.mw-menu, .mw-header__tools){ gap:var(--mw-header-gap); }
  /* dolny pasek, powrot i dol panelu istnieja tylko na telefonie */
  .mw-dock{ display:none; }
  .mw-widok:not([role="dialog"]){ padding-block-end:0; }
  .mw-widok .mw-megamenu__back{ display:none; }
  .mw-widok .mw-menu-dol{ display:none; }
  .mw-menu > li.mw-menu__start{ display:none; }
}

/* ---- Ivory Search dokleja pole wyszukiwania w wp_footer nad paskiem ogloszen: chowamy ---- */
.mw-widok :is(.is-search-form, .is-form-style, .is-search-icon, .is-ajax-search, .is-menu, #is-popup-wrapper){ display:none !important; }

/* ---- AKORDEON (details): FAQ listingu, bloki „Szczegóły” w prozie, odpowiedz sklepu pod opinia ---- */
:is(.mw-faq__item,.mw-strona__tresc details,.mw-reviews__reply){ border-bottom:1px solid var(--mw-line); }
:is(.mw-faq__item,.mw-strona__tresc details,.mw-reviews__reply) > summary{ display:flex; align-items:center; justify-content:space-between;
  gap:var(--mw-s3); min-height:var(--mw-control-h); padding-block:var(--mw-s3); color:var(--mw-ink); cursor:pointer; list-style:none; }
:is(.mw-faq__item,.mw-strona__tresc details,.mw-reviews__reply) > summary::-webkit-details-marker{ display:none; }
/* znak + i – z linii 1 px; FAQ, details, opinie, akordeony karty */
:is(.mw-faq__item,.mw-strona__tresc details,.mw-reviews__reply) > summary::after, .mw-pdp__acc::after{ content:""; flex:none; --mw-sign-line:linear-gradient(var(--mw-ink),var(--mw-ink));
  inline-size:var(--mw-s3); block-size:var(--mw-s3);
  background:var(--mw-sign-line) center / var(--mw-s3) 1px no-repeat, var(--mw-sign-line) center / 1px var(--mw-s3) no-repeat; }
:is(.mw-faq__item,.mw-strona__tresc details,.mw-reviews__reply)[open] > summary::after, .mw-pdp__acc[aria-expanded="true"]::after{ background:var(--mw-sign-line) center / var(--mw-s3) 1px no-repeat; }
:is(.mw-faq__item,.mw-strona__tresc details,.mw-reviews__reply) > :not(summary){ color:var(--mw-ink-3); }

/* ---- RYTM SEKCJI (utility, Tomek 07.10): main = stos sekcji, row-gap --mw-section-gap (96 / 80) miedzy nimi i przed stopka ---- */
/* :where = zero specyficznosci, widok moze nadpisac uklad (blog: 2 kolumny); .mw-section-block = sekcja z manifestem i trescia */
:where(.mw-sections, .mw-section-block){ display:grid; grid-template-columns:minmax(0,1fr); row-gap:var(--mw-section-gap); }
:where(.mw-sections){ padding-block-end:var(--mw-section-gap); }
/* gutter <main> widokow bez wlasnego ukladu (home, O nas, wpis maja inny) */
.mw-404__main, .mw-sklep__main, .mw-strona__main, .mw-konto__main{ padding-inline:var(--mw-page-pad); }
.mw-widok:has(.mw-sections) .mw-footer{ margin-block-start:0; }

/* ---- OKRUSZKI + TYTUŁ WIDOKU (wspólne: listing, koszyk, konto…) ----
   Przeniesione ze sklep.css (22.07) — koszyk ich potrzebuje, a nie ładuje
   arkusza listingu. JEDNA definicja tutaj. ---- */
.mw-okruszki{ display:flex; flex-wrap:wrap; gap:var(--mw-s2); align-items:center;
  color:var(--mw-ink-3); padding:var(--mw-s3) 0; } /* pismo: drobny druk wersalikami */
.mw-okruszki a{ text-decoration:none; }
.mw-okruszki a:hover{ text-decoration:underline; }
.mw-okruszki [aria-current]{ color:var(--mw-ink); }
.mw-listing__head{ padding:var(--mw-s2) 0 var(--mw-s4); }
/* h1 listingu jedzie na tym samym stopniu co kazdy h1 widoku — bylo osobne clamp do 64 px */
.mw-listing__h1, .mw-strona__h1{ font-family:var(--mw-serif); font-weight:500;
  font-size:var(--mw-fs-display); line-height:var(--mw-lh-tight); }

/* ---- PRZYCISKI (utility): baza .mw-btn = obrys; --solid, --outline, --block ---- */
/* .mw-szw__wiecej: link z odpowiedzi AJAX Michala (szukaj-ajax.php) bez naszej klasy, wiec dopisany do selektora */
/* geometria przycisku */
.mw-widok :is(.mw-btn,.mw-szw__wiecej){ flex:1; display:grid; place-items:center; text-decoration:none; }
/* skora przycisku; baner zgod Complianz dopiety selektorami (markup wtyczki bez naszych klas, :not = sila ponad arkusz wtyczki) */
.mw-widok :is(.mw-btn,.mw-szw__wiecej),
.mw-widok .cmplz-cookiebanner .cmplz-buttons .cmplz-btn,
.mw-widok .cmplz-cookiebanner .cmplz-buttons .cmplz-btn:not(.cmplz-accept,.cmplz-deny),
/* checkout: przyciski blokow WC, wtyczek punktow i klasycznego #place_order */
.mw-checkout-view .mw-checkout__main .wc-block-components-button.wc-block-components-checkout-place-order-button,
.mw-checkout-view .mw-checkout__main :is(.easypack_show_geowidget, .apaczka_pl_geowidget_block),
.mw-checkout-view .mw-checkout__main #place_order,
.mw-checkout-view .mw-checkout__main .wc-block-components-button.wc-block-components-totals-coupon__button,
.mw-checkout-view :is(#inp_pl_close_modal_button, #apaczka_pl_close_modal_button),
.mw-checkout-view .mw-checkout__main :is(.p24-payment-status__pay, .p24-payment-status__retry),
/* konto: przyciski WC (0,3,1 bije .woocommerce a.button 0,2,1) */
.mw-konto__main .woocommerce :is(a.button, button.button, button[type="submit"]){ min-height:var(--mw-control-h); padding-block:0; padding-inline:var(--mw-s4);
  font-family:inherit; font-size:var(--mw-fs-base); font-weight:500; line-height:var(--mw-lh-snug); letter-spacing:var(--mw-ls-caps); text-transform:uppercase;
  cursor:pointer; border-radius:var(--mw-radius); border:1px solid var(--mw-ink); box-shadow:none;
  background:var(--mw-paper); color:var(--mw-ink);
  transition:background var(--mw-dur-fast) var(--mw-ease), color var(--mw-dur-fast) var(--mw-ease), border-color var(--mw-dur-fast) var(--mw-ease); }
.mw-widok .mw-btn--block{ inline-size:100%; }
/* wtyczki InPost i Apaczka maja !important na skorze: te same wartosci co wyzej i nizej */
.mw-checkout-view :is(.easypack_show_geowidget, #easypack_block_type_geowidget, .apaczka_pl_geowidget_block, #apaczka_pl_geowidget_block, #inp_pl_close_modal_button, #apaczka_pl_close_modal_button){
  font-size:var(--mw-fs-xs) !important; color:var(--mw-ecru) !important;
  background:var(--mw-black) !important; border:1px solid var(--mw-black) !important; border-radius:var(--mw-radius) !important; box-shadow:none !important; }
.mw-checkout-view :is(#inp_pl_close_modal_button, #apaczka_pl_close_modal_button){ padding:0 var(--mw-s4) !important; } /* styl inline wtyczki */
.mw-checkout-view :is(.easypack_show_geowidget, #easypack_block_type_geowidget, .apaczka_pl_geowidget_block, #apaczka_pl_geowidget_block, #inp_pl_close_modal_button, #apaczka_pl_close_modal_button):hover{
  background:var(--mw-choco) !important; border-color:var(--mw-choco) !important; }
.mw-widok .mw-btn--outline:hover,
.mw-checkout-view .mw-checkout__main .p24-payment-status__retry:hover,
.mw-widok .cmplz-cookiebanner .cmplz-buttons .cmplz-btn:not(.cmplz-accept,.cmplz-deny):hover,
.mw-checkout-view .mw-checkout__main .wc-block-components-button.wc-block-components-totals-coupon__button:hover{ background:var(--mw-ink); color:var(--mw-paper); }
.mw-widok :is(.mw-btn--solid,.mw-szw__wiecej),
.mw-widok .cmplz-cookiebanner .cmplz-buttons .cmplz-btn:is(.cmplz-accept,.cmplz-deny),
.mw-checkout-view .mw-checkout__main .wc-block-components-button.wc-block-components-checkout-place-order-button,
.mw-checkout-view .mw-checkout__main :is(.easypack_show_geowidget, .apaczka_pl_geowidget_block),
.mw-checkout-view .mw-checkout__main #place_order,
.mw-checkout-view .mw-checkout__main .p24-payment-status__pay,
.mw-konto__main .woocommerce :is(a.button, button.button, button[type="submit"]){ background:var(--mw-black); color:var(--mw-ecru); border-color:var(--mw-black); }
/* hover na czekoladzie — poprzedni czarny hover byl nieodrozalny od tla przycisku */
.mw-widok :is(.mw-btn--solid,.mw-szw__wiecej):hover,
.mw-widok .cmplz-cookiebanner .cmplz-buttons .cmplz-btn:is(.cmplz-accept,.cmplz-deny):hover,
.mw-checkout-view .mw-checkout__main .wc-block-components-button.wc-block-components-checkout-place-order-button:hover,
.mw-checkout-view .mw-checkout__main :is(.easypack_show_geowidget, .apaczka_pl_geowidget_block):hover,
.mw-checkout-view .mw-checkout__main #place_order:hover,
.mw-checkout-view .mw-checkout__main .p24-payment-status__pay:hover,
.mw-konto__main .woocommerce :is(a.button, button.button, button[type="submit"]):hover{ background:var(--mw-choco); border-color:var(--mw-choco); }
.mw-widok .mw-btn:disabled,
.mw-widok .mw-btn[aria-disabled="true"]{ background:var(--mw-surface-2); color:var(--mw-muted);
  border-color:var(--mw-line); cursor:not-allowed; }

/* honeypot formularzy (kontakt, zamowienie indywidualne, powiadom): poza ekranem, nie display:none, bo boty pomijaja ukryte */
.mw-contact-form__hp, .mw-powiadom__hp{ position:absolute; inset-inline-start:-9999px; inline-size:1px; block-size:1px; overflow:hidden; }

/* ---- POLE TEKSTOWE (checkout, kupon w koszyku, formularze kontaktu): ramka taupe, wysokosc kontrolki, padding 8 (Tomek 12.10); WC ma 0,3,1 i height 50 ---- */
/* ramka taupe ok. 4:1 na tle pola (WCAG 1.4.11, C3 Tomek 13.10); wczesniej line-2 1,6:1 */
.mw-widok .mw-kupon__pole,
.mw-widok .mw-filtry__pole input,
.mw-widok .mw-contact-form :is(input[type="text"], input[type="email"], input[type="tel"]),
.mw-widok .mw-contact-form textarea,
.mw-konto__main .woocommerce .form-row :is(input.input-text, input[type="password"]),
.mw-checkout-view .mw-checkout__main :is(.wc-block-components-form, .wc-block-components-totals-coupon) :is(.wc-block-components-text-input input, .wc-blocks-components-select__select, .wc-block-components-textarea){
  block-size:var(--mw-control-h); min-block-size:var(--mw-control-h); padding:var(--mw-s2); font-size:var(--mw-fs-base); color:var(--mw-ink); background:var(--mw-field-bg); /* 16: iOS nie przybliza */
  border:1px solid var(--mw-taupe); border-radius:var(--mw-radius); box-shadow:none; }
/* etykieta wcieta w gorna ramke pola; tlo strony nad ramka, pola pod nia */
.mw-checkout-view .mw-checkout__main .wc-block-components-form :is(.wc-block-components-text-input label, .wc-blocks-components-select__label),
.mw-widok .mw-contact-form__field > span,
.mw-widok .mw-filtry__pole > span,
.mw-konto__main .woocommerce .form-row > label:not(.woocommerce-form__label-for-checkbox){
  top:0; inset-inline-start:calc(var(--mw-s2) - var(--mw-s1)); transform:translateY(-50%);
  padding-inline:var(--mw-s1); font-size:var(--mw-fs-xs); line-height:1;
  background:linear-gradient(var(--mw-paper) 50%, var(--mw-field-bg) 50%); }
/* fokus pola = ciemna ramka 1 px, bez obrysu (Tomek 13.10: 2 px za grubo); pole z bledem zostaje czerwone */
.mw-checkout-view .mw-checkout__main :is(.wc-block-components-form, .wc-block-components-totals-coupon) :is(.wc-block-components-text-input input, .wc-blocks-components-select__select, .wc-block-components-textarea):focus,
.mw-widok .mw-contact-form :is(input:not([type="checkbox"]), textarea):focus,
.mw-widok :is(.mw-kupon__pole, .mw-filtry__pole input):not([aria-invalid="true"]):focus,
.mw-konto__main .woocommerce .form-row input:not([type="checkbox"]):focus{ border:1px solid var(--mw-ink); box-shadow:none; outline:none; }
/* blad pola: nasza czerwien, min. pisma 15, ramka pola w kolorze bledu */
.mw-field-error,
.mw-checkout-view .mw-checkout__main .wc-block-components-validation-error,
.mw-checkout-view .mw-checkout__main .wc-block-components-validation-error > p{ color:var(--mw-error); font-size:var(--mw-fs-sm); }
.mw-widok .mw-kupon__pole[aria-invalid="true"],
.mw-checkout-view .mw-checkout__main :is(.wc-block-components-form, .wc-block-components-totals-coupon) .wc-block-components-text-input.has-error input,
.mw-checkout-view .mw-checkout__main :is(.wc-block-components-form, .wc-block-components-totals-coupon) .has-error .wc-blocks-components-select__select{ border-color:var(--mw-error); }

/* ---- CHECKBOX i RADIO: jeden wzor (filtry, checkout, konto, formularze): 24, kwadrat, ramka taupe, zaznaczony czern z ptaszkiem ecru (14.10) ---- */
/* lista selektorow, nie :is(): kazdy zachowuje swoja specyficznosc (probka koloru w filtrach i WC :checked 0,4,0) */
.mw-widok .mw-filtry__opcja input,
.mw-widok .mw-konto__main input[type="checkbox"],
.mw-widok .mw-contact-form__consent input[type="checkbox"],
.mw-checkout-view .mw-checkout__main :is(.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"], .wc-block-components-radio-control .wc-block-components-radio-control__input){
  -webkit-appearance:none; appearance:none; inline-size:var(--mw-s4); block-size:var(--mw-s4);
  border:1px solid var(--mw-taupe); border-radius:var(--mw-radius); background:var(--mw-paper); cursor:pointer; }
.mw-widok .mw-filtry__opcja input:checked,
.mw-widok .mw-konto__main input[type="checkbox"]:checked,
.mw-widok .mw-contact-form__consent input[type="checkbox"]:checked,
.mw-checkout-view .mw-checkout__main :is(.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"], .wc-block-components-radio-control .wc-block-components-radio-control__input):checked{
  border-color:var(--mw-ink); background:var(--mw-ink) no-repeat center / var(--mw-s3)
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23EFE7D5' stroke-width='3'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E"); } /* ptaszek ecru w hex: url() nie bierze var() */

/* ---- KUPON (checkout: panel WC, koszyk i szuflada: .mw-kupon): bialy pas na cala szerokosc panelu (Tomek 06.10) ---- */
.mw-widok .mw-kupon,
.mw-checkout-view .mw-checkout__main .wc-block-checkout__sidebar .wc-block-components-totals-coupon{
  padding:var(--mw-drawer-pad); border-block:1px solid var(--mw-line); background:var(--mw-paper); /* gora i dol jak boki (Tomek 09.10); kolor kresek jeden (14.10) */
  font-size:var(--mw-fs-sm); line-height:var(--mw-lh-base); }
.mw-widok button.mw-kupon__etykieta,
.mw-checkout-view .mw-checkout__main .wc-block-components-totals-coupon .wc-block-components-panel__button{ font-size:var(--mw-fs-md); line-height:var(--mw-lh-snug); color:var(--mw-ink); }
/* wiersz: pole rosnie, przycisk z tresci; 16 pod przelacznikiem i miedzy polem a przyciskiem */
.mw-widok .mw-kupon__wiersz,
.mw-checkout-view .mw-checkout__main .wc-block-components-totals-coupon__form{ display:flex; gap:var(--mw-s3); }
.mw-widok .mw-kupon__etykieta[aria-expanded] + .mw-kupon__wiersz{ margin-block-start:var(--mw-s3); }
/* telefon: wiersz 8 (Tomek 08.10); przycisk 44 wchodzi w padding, padding od tekstu (09.10) */
@media (width < 900px){ /* bp:desktop */
  .mw-widok .mw-kupon__etykieta[aria-expanded] + .mw-kupon__wiersz{ margin-block-start:var(--mw-s2); }
  .mw-widok .mw-kupon button.mw-kupon__etykieta,
  .mw-checkout-view .mw-checkout__main .wc-block-components-totals-coupon .wc-block-components-panel__button{ margin-block:calc((1lh - var(--mw-control-h)) / 2); vertical-align:top; } /* top: inline-flex WC dawal 2 px pod linia */
}
.mw-widok .mw-kupon__zastosuj,
.mw-checkout-view .mw-checkout__main .wc-block-components-button.wc-block-components-totals-coupon__button{ flex:none; inline-size:auto; min-inline-size:0; padding-inline:var(--mw-s4); }
/* „Zastosuj” nieaktywne do wpisania kodu, w obu miejscach (Tomek 06.10): skora .mw-btn:disabled, bez hovera */
.mw-widok .mw-kupon__zastosuj:disabled:hover,
.mw-checkout-view .mw-checkout__main .wc-block-components-button.wc-block-components-totals-coupon__button:disabled{
  opacity:1; background:var(--mw-surface-2); color:var(--mw-muted); border-color:var(--mw-line); cursor:not-allowed; }
/* pole: placeholder jak w koszyku zamiast plywajacej etykiety WC (etykieta zostaje dla czytnika), fokus ciemniejsza ramka */
.mw-checkout-view .mw-checkout__main .wc-block-components-totals-coupon .wc-block-components-text-input label{
  clip-path:inset(50%); inline-size:1px; block-size:1px; overflow:hidden; white-space:nowrap; }
.mw-checkout-view .mw-checkout__main .wc-block-components-totals-coupon .wc-block-components-text-input input{ line-height:var(--mw-lh-base); }
/* ---- CHIP WYBORU: 35 + 8 pod kreske + 1 kreska = 44; stany z aria/disabled/data-stan ---- */
.mw-widok .mw-choice-group{ display:flex; flex-wrap:wrap; gap:0 var(--mw-s2); }
.mw-widok .mw-choice-group button{ position:relative; box-sizing:content-box;
  min-block-size:calc(var(--mw-control-h) - var(--mw-s2) - 1px); min-inline-size:var(--mw-control-h); padding:0 0 var(--mw-s2);
  font-size:var(--mw-fs-sm); color:var(--mw-ink);
  border-block-end:1px solid transparent; transition:border-color var(--mw-dur-fast) var(--mw-ease), color var(--mw-dur-fast) var(--mw-ease), background var(--mw-dur-fast) var(--mw-ease); }
.mw-widok .mw-choice-group :is([aria-pressed="true"],[aria-checked="true"]){ border-block-end-color:var(--mw-ink); }
.mw-widok .mw-choice-group button[data-stan="backorder"]:not([aria-pressed="true"]){ border-block-end:1px dotted var(--mw-line-2); }
.mw-widok .mw-choice-group button:disabled{ color:var(--mw-ink-3); cursor:not-allowed;
  text-decoration:line-through; text-decoration-color:var(--mw-ink); text-decoration-thickness:1px; }
/* najazd: szara kreska pod rozmiarem, wybrany zostaje czarny; jeden rozmiar na kafelku i karcie, bez probek (aria-checked) (Tomek 30.09) */
@media (hover:hover){ .mw-widok .mw-choice-group button:not(:disabled):not([aria-checked]):not([aria-pressed="true"]):hover{ border-block-end-color:var(--mw-line-2); } }
/* --size: rozmiar 16/500 na srodku pola 44x44; wybrany, najazd i fokus = kreska linku, 4 px szersza od tekstu (Tomek 15.10) */
.mw-widok .mw-choice-group--size button{ box-sizing:border-box; min-block-size:var(--mw-control-h); padding:0; border:0;
  font-size:var(--mw-fs-base); font-weight:500; text-decoration:none; }
.mw-widok .mw-choice-group--size .mw-choice-group__label{ position:relative; display:inline-block; padding-block-end:var(--mw-underline-gap); }
.mw-widok .mw-choice-group--size .mw-choice-group__label::after{ inset-inline:calc(-1 * var(--mw-s1)); transform:scaleX(0); }
.mw-widok .mw-choice-group--size button[aria-pressed="true"] .mw-choice-group__label::after,
.mw-widok .mw-choice-group--size button:not(:disabled):not([data-stan="niedostepny"]):is(:hover,:focus-visible) .mw-choice-group__label::after{ transform:scaleX(1); }
/* niedostepny szary z czarnym przekresleniem; wybrany (powiadom) czarny, przekreslony, z kreska */
.mw-widok .mw-choice-group--size button:is(:disabled,[data-stan="niedostepny"]){ color:var(--mw-ink-3); font-weight:400; }
.mw-widok .mw-choice-group--size button:is(:disabled,[data-stan="niedostepny"]) .mw-choice-group__label{
  text-decoration:line-through; text-decoration-color:var(--mw-ink); text-decoration-thickness:1px; }
.mw-widok .mw-choice-group--size button[data-stan="niedostepny"][aria-pressed="true"]{ color:var(--mw-ink); }
/* probka: pole klikalne 44, kwadrat 32 (pdp.css), kreska 40 w odstepie linku; kwadrat z kreska na srodku pola (Tomek 15.10) */
.mw-widok .mw-choice-group .mw-swatch{ box-sizing:border-box; display:grid; place-items:center;
  inline-size:var(--mw-control-h); block-size:var(--mw-control-h); min-inline-size:0; min-block-size:0;
  padding:0 0 calc(var(--mw-underline-gap) + 1px); border:0; }
.mw-widok .mw-choice-group .mw-swatch::after{ inset-inline:calc(50% - var(--mw-s5) / 2 - var(--mw-s1));
  inset-block-end:calc((var(--mw-control-h) - var(--mw-s5) - var(--mw-underline-gap) - 1px) / 2); transform:scaleX(0); }
.mw-widok .mw-choice-group .mw-swatch[aria-checked="true"]::after{ transform:scaleX(1); }
@media (hover:hover){ .mw-widok .mw-choice-group .mw-swatch:hover::after{ transform:scaleX(1); } }
/* --fill: miesci sie = bez zmian; nie miesci = rzad po rowno bez odstepu, min 44 (Tomek 15.10, wariant A); --n = widoczne */
.mw-widok .mw-choice-group--fill{ --mw-fill-w:calc(var(--n, 1) * var(--mw-control-h) + (var(--n, 1) - 1) * var(--mw-s2));
  gap:0 clamp(0px, (100% - var(--mw-fill-w)) * 1000, var(--mw-s2)); }
.mw-widok .mw-choice-group--fill button{ flex:1 1 0; min-inline-size:var(--mw-control-h);
  max-inline-size:max(var(--mw-control-h), (var(--mw-fill-w) - 100%) * 1000); }
.mw-widok .mw-choice-group--fill:has(> :nth-child(7 of :not([hidden]))){ --n:7; }
.mw-widok .mw-choice-group--fill:has(> :nth-child(8 of :not([hidden]))){ --n:8; }
.mw-widok .mw-choice-group--fill:has(> :nth-child(9 of :not([hidden]))){ --n:9; }
.mw-widok .mw-choice-group--fill:has(> :nth-child(10 of :not([hidden]))){ --n:10; }
/* pasek na zdjeciu: szyba + etykieta 44 wersalikami (kafelek, polecane) */
.mw-widok .mw-photo-bar{ background:color-mix(in srgb, var(--mw-paper) 72%, transparent);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
.mw-widok .mw-photo-bar__cta{ display:grid; place-items:center; inline-size:100%; min-block-size:var(--mw-control-h);
  padding-inline:var(--mw-s2); color:var(--mw-ink); }
/* --card: biala karta 36, bez kreski */
.mw-widok .mw-choice-group--card button{ box-sizing:border-box; min-inline-size:calc(var(--mw-control-h) - var(--mw-s2));
  block-size:calc(var(--mw-control-h) - var(--mw-s2)); padding:0 var(--mw-s1); border:0; display:grid; place-items:center;
  font-size:var(--mw-fs-xs); letter-spacing:var(--mw-ls-caps); text-transform:uppercase; background:var(--mw-paper); } /* pismo tu, nie w liscie: baza .mw-choice-group button (ta sama sila) stoi nizej; cien: .mw-shadow */
.mw-widok .mw-choice-group--card button:not(:disabled):is(:hover,:focus-visible){ color:var(--mw-on-dark);
  background:color-mix(in srgb, var(--mw-black) 86%, transparent); }
.mw-widok .mw-choice-group--card button:disabled{ background:var(--mw-surface-2); box-shadow:none; }
.mw-widok .mw-choice-group--card button[data-stan="backorder"]{ outline:1px dashed var(--mw-line-2); outline-offset:-1px; }

/* ---- POPUP: wspolna skora okna (karta, tabela rozmiarow, powiadomienie). Z pdp.css 23.09 ---- */
/* markup: .mw-modal > .mw-modal__tlo + .mw-modal__panel > .mw-modal__head (.mw-h2 + .mw-modal__x) + .mw-modal__body */
.mw-widok .mw-modal{ position:fixed; inset:0; z-index:75; display:grid; place-items:center; padding:var(--mw-s3); }
.mw-widok .mw-modal[hidden]{ display:none; }
.mw-widok .mw-modal__tlo{ position:absolute; inset:0; }
/* zaslona jak pod dialogiem powiadomienia (Tomek 18.09): mleko z utility na gorze pliku, nie czern; ta sama pod banerem zgod */
.mw-widok .mw-modal__panel{ position:relative; max-inline-size:var(--mw-drawer-w); inline-size:100%; } /* 480 jak szuflady (Tomek 14.10) */
/* obrys jak w dialogu powiadomienia: na mlecznej zaslonie sama biel panelu nie odcina sie od tla; ta sama skora banera zgod */
.mw-widok .mw-modal__panel,
.mw-widok .cmplz-cookiebanner{ background:var(--mw-paper);
  padding:var(--mw-s4); border:1px solid var(--mw-line); border-radius:var(--mw-radius); box-shadow:var(--mw-shadow-3); }
.mw-widok .mw-modal__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:var(--mw-s3);
  margin-block-end:var(--mw-s3); }
/* X: kwadrat 36 jak w szkicu, cel dotyku 44 dokladany pseudoelementem (jak chipy rozmiaru) */
.mw-widok .mw-modal__x{ position:relative; display:grid; place-items:center;
  inline-size:calc(var(--mw-control-h) - var(--mw-s2)); block-size:calc(var(--mw-control-h) - var(--mw-s2));
  margin:0 0 0 var(--mw-s2); padding:0; font-size:var(--mw-fs-lg); line-height:1; color:var(--mw-ink-3);
  transition:color var(--mw-dur-fast) var(--mw-ease); }
.mw-widok .mw-modal__x::before{ content:""; position:absolute; inset:calc(-1 * var(--mw-s1)); }
.mw-widok .mw-modal__x:hover{ color:var(--mw-ink); }
.mw-widok .mw-modal__body p{ margin-block-end:var(--mw-s2); }

/* ---- MEGA-MENU: nakladka pelnej szerokosci pod paskiem ---- */
/* punkt odniesienia to .mw-header__in, nie pozycja listy: nakladka ma isc przez cala szerokosc */
.mw-menu__has-children{ position:static; }

/* telefon: podpozycje wciete, zawsze widoczne w rozwinietym menu */
.mw-megamenu{ margin-block:var(--mw-s2) var(--mw-s3); }
/* podpis kadru jak nazwa pod kafelkiem: kroj tresci na kazdym ekranie */
.mw-megamenu__caption{ display:block; padding-block-start:var(--mw-s2); font-family:var(--mw-body); }
.mw-megamenu__list{ display:flex; flex-direction:column; gap:0;
  margin-inline-start:var(--mw-s3); }
/* wiersz 44 (Tomek 02.10, bylo: napis 19 px w podzialce 32); desktop nadpisuje nizej */
.mw-megamenu__list a{ display:flex; align-items:center; min-block-size:var(--mw-control-h);
  font-family:var(--mw-body); font-size:var(--mw-fs-sm); color:var(--mw-ink-3);
  text-transform:none; letter-spacing:0; text-decoration:none; }
.mw-megamenu__frames,.mw-megamenu__word{ display:none; }
/* telefon: pozycje w dwoch kolumnach (kolejnosc w dol), naglowki grup na calej szerokosci */
@media (width < 900px){ /* bp:desktop */
  .mw-megamenu__list{ display:block; columns:2; column-gap:var(--mw-s3); }
  .mw-megamenu__list > li{ break-inside:avoid; }
  .mw-megamenu__list > .mw-megamenu__group{ column-span:all; }
}

/* JEDNA plaszczyzna paska i nakladki, kazdy widok i szerokosc (home na telefonie: pod przyklejonym paskiem) */
/* jedyna definicja od 14.09; wczesniej kopia w front.css tylko dla .mw-home */
/* dwa elementy z backdrop-filter ucinaly rozmycie na wspolnej krawedzi i rysowaly kreske */
/* clip-path, nie wysokosc: zero przeliczen ukladu; will-change z gory, inaczej pierwsze klatki gubia rozmycie */
.mw-header::before{ content:""; position:absolute; inset-inline:0; inset-block-start:0;
  block-size:calc(100% + var(--mw-megamenu-h, 0px)); z-index:-1;
  clip-path:inset(0 0 100% 0); will-change:clip-path; contain:paint;
  transition:clip-path .3s ease-in; }
/* poza home pasek = mleko z rozmyciem jak home po przewinieciu (Tomek 17.09, zadanie 158) */
/* :not(--panel): przy otwartej nakladce plaszczyzna ma zjechac w dol, nie stac przycieta do paska */
.mw-widok:not(.mw-home) .mw-header:not(.mw-header--panel)::before{ clip-path:inset(0 0 calc(100% - var(--mw-header-h)) 0); }

@media (width >= 900px){ /* bp:desktop */
  /* biel niesie plaszczyzna paska, panel jest przezroczysty i tylko przesuwa tresc w bok */
  .mw-header{ overflow-x:clip; }
  /* pasek i nakladka jednym przejazdem, od gornej krawedzi po dol nakladki */
  .mw-header.mw-header--panel::before{ clip-path:inset(0); transition-duration:var(--mw-megamenu-move); }
  .mw-megamenu{ position:absolute; inset-inline:0; inset-block-start:0; z-index:-1; margin:0;
    padding-block-start:var(--mw-header-h);
    overflow:clip; clip-path:inset(0 0 100% 0); visibility:hidden;
    opacity:0; pointer-events:none;
    /* ten sam czas i ta sama krzywa co plaszczyzna, inaczej tresc wyprzedza biel */
    transition:clip-path var(--mw-megamenu-move) ease-in, opacity 0s linear var(--mw-megamenu-move),
      visibility var(--mw-megamenu-move), translate var(--mw-megamenu-move) ease-in; }
  /* panel spoza kolejki czeka po tej stronie, z ktorej ma wjechac */
  .mw-header[data-panel="1"] .mw-menu__has-children--2 > .mw-megamenu{ translate:100%; }
  .mw-header[data-panel="2"] .mw-menu__has-children--1 > .mw-megamenu{ translate:-100%; }
  /* widoczna tylko nakladka wskazana przez JS — nie surowy hover, bo ten gasnie przy przejezdzie */
  /* zwloka krycia dotyczy tylko panelu schodzacego; wchodzacy pokazuje sie od razu */
  .mw-header[data-panel="1"] .mw-menu__has-children--1 > .mw-megamenu,
  .mw-header[data-panel="2"] .mw-menu__has-children--2 > .mw-megamenu{
    translate:0; opacity:1; pointer-events:auto; transition-delay:0s; }
  .mw-header--panel{ border-block-end-color:transparent; }
  .mw-header--panel .mw-megamenu{ clip-path:inset(0 0 0 0); visibility:visible; }
  /* tablet bez kursora: dotkniecie prowadzi do dzialu, nakladka nie miga po drodze */
  @media (hover:none){ .mw-megamenu{ display:none; } }

  /* wysokosc niesie kadr, nie ta reguła — lista dluzsza od kadru i tak rozepnie wiersz */
  /* cztery rowne kolumny: dwie na liste, dwie na kadry, zero dziury posrodku */
  .mw-megamenu__in{ position:relative;
    display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:var(--mw-s4);
    padding:var(--mw-s6) var(--mw-page-pad) var(--mw-s4); }
  .mw-megamenu__list{ grid-column:1 / 3; grid-row:1; align-self:start;
    display:block; column-gap:var(--mw-s4); margin:0; }
  .mw-megamenu__list:has(.mw-megamenu__group){ columns:2; }
  .mw-megamenu__list li{ break-inside:avoid; }

  /* naglowek grupy; druga grupa otwiera nowa kolumne */
  .mw-megamenu__group ~ .mw-megamenu__group{ break-before:column; margin-block-start:0; }
  /* link na cala szerokosc kolumny (kursor schodzi pionowo, nie w lewo), kreska w kolumnie siatki szerokiej jak tekst */
  /* align-content: wiersze nie rosna z wysokoscia 44, kreska o underline-gap pod tekstem jak w hero */
  .mw-megamenu__list a{ display:grid; grid-template-columns:fit-content(100%); align-content:center; row-gap:var(--mw-underline-gap);
    font-size:clamp(var(--mw-fs-base), calc(.4rem + .55vw), 1.5rem); color:var(--mw-ink); }
  /* naglowki grup rosna razem z lista: cztery rowne kolumny na kazdym ekranie (01.10) */
  .mw-megamenu__group{ font-size:clamp(var(--mw-fs-lg), calc(.6rem + .8vw), 2.25rem); }
  .mw-megamenu__list li:not(.mw-megamenu__group) a::after{
    content:""; block-size:1px; margin-block-end:-1px;
    background:currentColor; transform:scaleX(0); transform-origin:left;
    transition:transform .25s var(--mw-ease);}
  .mw-megamenu__list li:not(.mw-megamenu__group) a:is(:hover,:focus-visible)::after{ transform:scaleX(1);}

  /* kadr zawsze 2:3 jak kafelek: szerokosc kolumny z wysokosci, nie z komorki (na 4K wychodzily kwadraty; Michal 18.09) */
  .mw-megamenu__frames{ grid-column:3 / 5; grid-row:1 / 3;
    display:grid; grid-template-columns:repeat(2, minmax(0, calc((70svh - var(--mw-header-h)) * 2 / 3))); gap:var(--mw-s4); /* kadr do 70svh: bezpiecznik ultrawide */
    justify-content:end; align-self:end;
    animation:mw-drawer-fade .6s var(--mw-ease); } /* odslaniany zestaw wchodzi z zanikania */
  /* zestawy kadrow per kategoria leza w tej samej komorce; klasa bije [hidden] z UA */
  .mw-megamenu__frames[hidden]{ display:none; }
  /* kategoria z jednym produktem: kadr przy prawej krawedzi, nie przy liscie */
  .mw-megamenu__frame:only-child{ grid-column:2; }
  /* „Wszystkie…": kadry znikaja, ale trzymaja wysokosc nakladki */
  .mw-megamenu__in--blank .mw-megamenu__frames{ visibility:hidden; }
  /* kadr to <a> w menu, wiec bez tego resetu lapie wersaliki z `.mw-menu a` */
  .mw-megamenu__frame{ display:grid; grid-template-rows:minmax(0,1fr) auto;
    text-decoration:none; text-transform:none; letter-spacing:normal; white-space:normal; }
  /* rowne kadry: wysokosc z tokenu, szerokosc z kolumny, nadmiar przyciety */
  /* kadr 2:3 bez przycinania; przy braku wysokosci (ultrawide) wezsze kolumny kadrow, odstep 24 jak wszedzie (01.10) */
  .mw-megamenu__image{ display:block; inline-size:100%; block-size:auto; aspect-ratio:2/3;
    object-fit:cover; background:var(--mw-surface-2);
    /* nasz cien kadru jak kafelek (Tomek 30.09) */
    box-shadow:var(--mw-shadow-0); }
  /* wlasna regula na spanie, bo `.mw-menu a` (0,1,1) bije reset na samym kadrze (0,1,0) */
  /* podpis plynny miedzy sm a md: nazwa produktu ma 40+ znakow, na 1270 px sztywne 18 px nie miesci sie w kadrze */
  .mw-megamenu__caption{
    font-family:var(--mw-body); font-size:clamp(var(--mw-fs-sm), 1.3vw, var(--mw-fs-md)); color:var(--mw-ink);
    text-transform:none; letter-spacing:0;
    /* jedna linia z wielokropkiem: podpis tuz pod kadrem, dol podpisu = dol duzego slowa (Tomek 21.09) */
    min-block-size:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

  /* napis dzialu siedzi w kolumnie listy, dosuniety do dolu — czyli na linii podpisow kadrow */
  /* slowo w osobnym wierszu pod lista: przy niskim oknie (1024x768) nachodzilo na ostatnia pozycje (Tomek 21.09) */
  .mw-megamenu__word{ display:block; grid-column:1; grid-row:2; align-self:end;
    font-family:var(--mw-serif); font-weight:300;
    font-size:var(--mw-fs-display); line-height:1; color:var(--mw-ink); pointer-events:none; }
}
/* zakladki z kreska od lewej: wzorzec wspolny karuzeli home i dzialow na /sklep/ (Tomek 17.09); na hover, wybranej i biezacej */
.mw-view .mw-tabs{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--mw-s5); }
.mw-view .mw-tab{ color:var(--mw-ink-3); text-decoration:none; transition:color .2s var(--mw-ease); }
.mw-view .mw-tab::after{ transform:scaleX(0); }
.mw-view .mw-tab:is(:hover,:focus-visible,[aria-selected="true"],[aria-current]){ color:var(--mw-ink); }
.mw-view .mw-tab:is(:hover,:focus-visible,[aria-selected="true"],[aria-current])::after{ transform:scaleX(1); }
/* telefon: 13 px, 16 odstepu, tasma przewijana bez paska (decyzje Tomka 10.09 i 14.09) */
@media (width < 900px){ /* bp:desktop */
  .mw-view .mw-tabs{ flex-wrap:nowrap; gap:var(--mw-s3); overflow-x:auto; scrollbar-width:none; }
  .mw-view .mw-tabs::-webkit-scrollbar{ display:none; }
  .mw-view .mw-tab{ flex:0 0 auto; font-size:var(--mw-fs-xs); }
}

/* 4k: pismo 150%; .mw-view ma font-size w rem, wiec skaluje sie samo (do 18.09 bylo 16px i wymagalo nadpisania tutaj) */
@media (width >= 3000px) and (height >= 1500px){ /* bp:4k - i wysokosc: 3440x1440 ma piksel jak QHD, 150% robilo z niego karty 630 (Tomek 18.09 00:44) */ html{ font-size:150%; } .mw-widok{ --mw-page-pad:var(--mw-s6); } }

/* ---- manifest: naglowek-zdanie z eyebrow (home: sekcje; karta: opinie). Z front.css 18.09 ---- */
.mw-manifesto{ padding-inline:var(--mw-page-pad); }
/* 85rem = 1360 przy 16 px; rem, zeby na 4K rosla z pismem */
.mw-manifesto__text{ max-width:85rem; font-family:var(--mw-serif); font-weight:400; font-size:var(--mw-fs-display); line-height:var(--mw-lh-tight); text-wrap:pretty; }
/* drugi blok przy prawej krawedzi, zeby oba nie zaczynaly sie w tym samym miejscu */
.mw-manifesto--right{ text-align:end; }
.mw-manifesto--right .mw-manifesto__text{ margin-inline-start:auto; }
/* akcent w zdaniu (utility): kursywa, jak w manifestach */
.mw-manifesto__text em, .mw-hero__title-accent{ font-style:italic; }
/* manifest z linkiem: link pod zdaniem, przy jego krawedzi (Tomek 14.09) */
.mw-manifesto--with-link{ display:grid; grid-template-columns:minmax(0,1fr); row-gap:var(--mw-s3); }
.mw-manifesto--with-link .mw-manifesto__link{ justify-self:end; }
/* eyebrow w linii ze zdaniem, srodek w polowie wersalikow zdania (Tomek 30.09); wersaliki: Cormorant .625, Alegreya .64 (pomiar) */
.mw-manifesto__eyebrow{ --mw-manifesto-fs:var(--mw-fs-display); font-family:var(--mw-body); color:var(--mw-ink-3); margin-inline-end:var(--mw-s2); white-space:nowrap; vertical-align:calc((var(--mw-manifesto-fs) * .625 - 1em * .65) / 2); }
/* 24 na telefonie: 32 dawalo 8-9 wierszy na 390 (Tomek 15.09) */
@media (width < 900px){ /* bp:desktop */ .mw-manifesto__text{ font-size:var(--mw-fs-lg); font-weight:500; } .mw-manifesto__eyebrow{ --mw-manifesto-fs:var(--mw-fs-lg); font-weight:400; margin-inline-end:0; } }

/* ---- ZGODY: baner Complianz (MW-15, /sandbox/cookies); skora z utilities wyzej, tu adapter wtyczki ---- */
/* zmienne wtyczki: tekst, linki, przelaczniki; odstepy wtyczki w px zamienione na tokeny */
.mw-widok .cmplz-cookiebanner{
  --cmplz_text_color:var(--mw-ink); --cmplz_hyperlink_color:var(--mw-ink); --cmplz_banner_margin:var(--mw-s2);
  --cmplz_text_font_size:var(--mw-fs-sm); --cmplz_link_font_size:var(--mw-fs-sm); --cmplz_category_body_font_size:var(--mw-fs-sm);
  --cmplz_title_font_size:var(--mw-fs-md); --cmplz_category_header_title_font_size:var(--mw-fs-base); --cmplz_category_header_active_font_size:var(--mw-fs-xs);
  --cmplz_category_header_always_active_color:var(--mw-ok);
  --cmplz_slider_active_color:var(--mw-ink); --cmplz_slider_inactive_color:var(--mw-line-2); --cmplz_slider_bullet_color:var(--mw-paper);
  gap:0; max-block-size:calc(100svh - 2 * var(--mw-page-pad)); overflow-y:auto; scrollbar-color:var(--mw-line-2) transparent; }
/* siatka wtyczki ma puste wiersze (naglowek, linie) i kazdy dostawal gap; rytm robia marginesy blokow */
.mw-widok .cmplz-cookiebanner .cmplz-message{ margin:0; }
.mw-widok .cmplz-cookiebanner :is(.cmplz-documents,.cmplz-categories){ margin-block-start:var(--mw-s3); }
.mw-widok .cmplz-cookiebanner .cmplz-buttons{ margin-block-start:var(--mw-s4); }
.mw-widok .cmplz-cookiebanner .cmplz-categories .cmplz-category{ background:var(--mw-surface-2); }
/* tytul widoczny tylko na desktopie; odstep pod nim zamiast gapu siatki */
.mw-widok .cmplz-cookiebanner .cmplz-title{ margin-block-end:var(--mw-s3); }
/* tekst bez limitu 55vh wtyczki (pasek z zaokraglenia wiersza); przewija sie caly baner, gdy nie miesci sie w ekranie */
.mw-widok .cmplz-cookiebanner .cmplz-body{ max-block-size:none; overflow:visible; }
.mw-widok .cmplz-cookiebanner .cmplz-categories .cmplz-category:not(:last-child){ margin-block-end:var(--mw-s2); }
/* przycisk: wysokosc z .mw-btn (min 44), nie 45 px, 10 px i waga 500 z wtyczki */
.mw-widok .cmplz-cookiebanner .cmplz-buttons .cmplz-btn{ block-size:auto; } /* odstep 24 i grubosc 500 z bazy .mw-btn (15.10) */
/* telefon: 8 px od bokow jak karta kupna; bez translateX, bo baner nie jest juz centrowany w poziomie */
@media (width < 900px){ /* bp:desktop */
  .mw-widok .cmplz-cookiebanner{ inline-size:auto; inset-inline:var(--mw-page-pad); margin:0; transform:translateY(-50%); }
}

/* ===== TRYB SKUPIENIA (koszyk, checkout): bez nawigacji i rozpraszaczy, naglowek z etapami ===== */
/* body .mw-focus-view + mw_motyw_checkout_head() w szkielet.php */
.mw-focus-view :is(.mw-header, .mw-announce, .mw-dock){ display:none; } /* stopki tu nie ma (szkielet.php, Tomek 06.10) */
.mw-widok.mw-focus-view{ padding-block-end:env(safe-area-inset-bottom); }
/* kontener tresc + panel (1360 + 480) na srodku ekranu; ponizej ok. 1900 margines boczny = 0 (Tomek 05.10) */
/* ponytail: 100vw liczy pasek przewijania (Windows), margines wychodzi o ok. 8 px wiekszy; macOS i telefony bez roznicy */
.mw-focus-view{ --mw-focus-max:calc(var(--mw-max) + var(--mw-drawer-w)); --mw-focus-gutter:max(0px, (100vw - var(--mw-focus-max)) / 2); }
.mw-focus-view #mw-glowna{ inline-size:100%; max-width:var(--mw-focus-max); margin-inline:auto; }
.mw-focus-view #mw-glowna > :not(.mw-checkout-head){ max-width:var(--mw-max); } /* tresc do --mw-max od lewej kontenera */
/* panel podsumowania (koszyk, checkout): od 1200 w prawej kolumnie kontenera, nizej karta w kolumnie */
.mw-focus-view #mw-glowna :is(.wc-block-checkout__sidebar, .mw-koszyk__podsumowanie){ animation:none; } /* panel stoi, nie wjezdza */
@media (width >= 1200px){ /* bp:wyjatek - formularz obok panelu 480 miesci karty dostawy od 1200 */
  /* panel przy prawej krawedzi kontenera, strona zostawia na niego miejsce; prawa kreska przy krawedzi ekranu wypada poza widok */
  body.mw-focus-view:has(:is(.wc-block-checkout__sidebar, .mw-koszyk__podsumowanie)){ padding-inline:var(--mw-focus-gutter) calc(var(--mw-drawer-w) + var(--mw-focus-gutter)); }
  .mw-focus-view #mw-glowna :is(.wc-block-checkout__sidebar, .mw-koszyk__podsumowanie){ --mw-drawer-pad:var(--mw-s4); position:fixed; inset-inline-end:var(--mw-focus-gutter); z-index:5;
    flex:none; width:var(--mw-drawer-w); max-width:none; margin:0; padding:0; box-shadow:-1px 0 0 var(--mw-line), 1px 0 0 var(--mw-line); }
  /* checkout: panel na cala wysokosc ekranu (bez stopki od 06.10); koszyk: koszyk.css */
  .mw-focus-view #mw-glowna .wc-block-checkout__sidebar{ inset-block:0; align-self:stretch; height:auto; }
}
@media (width < 1200px){ /* bp:wyjatek - jak wyzej */
  .mw-focus-view #mw-glowna :is(.wc-block-checkout__sidebar, .mw-koszyk__podsumowanie){ --mw-drawer-pad:var(--mw-s3); max-width:none; height:auto; overflow:visible; box-shadow:none; }
}
/* naglowek: logo z lewej, etapy koszyk / dostawa / platnosc */
.mw-checkout-head{ display:flex; align-items:center; gap:var(--mw-s4);
  padding-block:var(--mw-s5) var(--mw-s6); }
.mw-checkout-head .mw-checkout-head__logo{ position:static; translate:none; order:-1; flex:none; color:var(--mw-ink); } /* logo w naglowku ma order 2 */
/* etapy rowno miedzy logo a prawa krawedzia tresci (panel podsumowania albo okno), bez marginesu strony */
.mw-checkout-steps{ flex:1 1 auto; min-inline-size:0; margin-inline-end:calc(var(--mw-s4) - var(--mw-page-pad)); } /* gap od logo oddany z prawej */
.mw-checkout-head .mw-header__logo-img{ block-size:var(--mw-s6); } /* pelne piksele: maska SVG na ulamku sie rozmywa */
/* etapy jak okruszki i menu sklepu: numer w serifie, nazwa wersalikami, cienka linia miedzy */
.mw-checkout-steps__list{ display:flex; justify-content:center; align-items:center; gap:var(--mw-s4); margin:0; padding:0; list-style:none; }
.mw-checkout-steps__item{ display:flex; align-items:center; gap:var(--mw-s4); }
.mw-checkout-steps__item + .mw-checkout-steps__item::before{ content:""; inline-size:var(--mw-s7); block-size:1px; background:var(--mw-line); }
/* numer i nazwa na wspolnej linii pisma; wrap + align-content centruje te linie w polu 44 */
.mw-widok .mw-checkout-steps__step{ display:inline-flex; flex-wrap:wrap; align-items:baseline; align-content:center; gap:var(--mw-s2); min-block-size:var(--mw-control-h);
  color:var(--mw-ink-3); text-decoration:none; }
.mw-checkout-steps__num{ font-family:var(--mw-serif); font-weight:500; font-size:var(--mw-fs-md); font-variant-numeric:lining-nums; }
.mw-checkout-steps__label{ padding-block-end:var(--mw-underline-gap); }
.mw-widok .mw-checkout-steps__item.is-done .mw-checkout-steps__step{ color:var(--mw-ink-3); }
.mw-widok .mw-checkout-steps__item.is-current .mw-checkout-steps__step{ color:var(--mw-ink); }
.mw-checkout-steps__item.is-current .mw-checkout-steps__label{ border-block-end:1px solid currentColor; }
.mw-widok a.mw-checkout-steps__step:hover{ color:var(--mw-ink); }
.mw-widok a.mw-checkout-steps__step:hover .mw-checkout-steps__label{ text-decoration:underline; }
@media (width < 900px){ /* bp:desktop */
  .mw-checkout-head{ flex-direction:column; padding-block:var(--mw-s4); }
  .mw-checkout-head .mw-header__logo-img{ block-size:var(--mw-s5); }
  .mw-checkout-steps{ inline-size:100%; margin-inline-end:0; }
}
@media (width < 600px){ /* bp:phone */
  /* telefon: nazwa tylko przy biezacym etapie, reszta sam numer */
  .mw-checkout-steps__list, .mw-checkout-steps__item{ gap:var(--mw-s3); }
  .mw-checkout-steps__item + .mw-checkout-steps__item::before{ inline-size:var(--mw-s5); }
  /* tylko dla czytnika: licznik wynikow (aria-live), „Promocja" na kafelku, nazwy nieaktywnych etapow */
  .mw-pasek-narzedzi .mw-licznik-wynikow, .mw-tile__badge-full,
  .mw-checkout-steps__item:not(.is-current) .mw-checkout-steps__label{ position:absolute; inline-size:1px; block-size:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
}

/* ---- HERO (utility): home, O nas, wpis bloga. Z front.css 06.10; na koncu pliku, bo bije naglowek ---- */
/* svh nie vh (pasek adresu); zdjecie pod paskiem ogloszen; clip, nie hidden (bez scroll-containera) */
.mw-hero{ position:relative; min-height:100svh; margin-block-start:calc(-1 * var(--mw-bar-h)); overflow:clip; background:var(--mw-black); }
/* kadr od gory (utility): zdjecie wypelnia ramke, glowa zostaje; hero, kadr logowania i kokpitu; ramka w regule komponentu */
.mw-hero__image, .mw-konto__photo img, .mw-konto__photo-side img{ position:absolute; inset:0; inline-size:100%; block-size:100%; object-fit:cover; object-position:center 28%; }
/* jasne zdjecie przyciemnione w calosci, zeby tekst byl czytelny (O nas, wpis) */
.mw-hero--dim .mw-hero__image{ filter:brightness(.65); }
/* WCAG 1.4.3: zdjecie bywa jasne pod napisem */
.mw-hero::after{ content:""; position:absolute; inset:0; background:var(--mw-scrim); pointer-events:none; }
.mw-hero__inner{ position:absolute; z-index:1; inset-block-start:42%; inset-inline-start:var(--mw-page-pad);
  max-width:calc(100% - 2 * var(--mw-page-pad)); color:var(--mw-on-dark); }
.mw-hero__title{ font-family:var(--mw-serif); font-weight:300; font-size:var(--mw-fs-hero); line-height:var(--mw-lh-tight); text-wrap:balance; }
.mw-hero__lead{ padding-block-start:var(--mw-s3); font-size:var(--mw-fs-lg); line-height:var(--mw-lh-snug); }
.mw-hero__actions{ display:flex; flex-wrap:wrap; gap:var(--mw-s3) var(--mw-s5); padding-block-start:var(--mw-s5); }
/* 0,2,0: reset na tagu a (0,1,1) bije sama klase */
.mw-view .mw-hero__link{ position:relative;
  color:var(--mw-on-dark); text-decoration:none; padding-block-end:var(--mw-underline-gap); }
.mw-hero__note{ position:absolute; z-index:1; inset-block-end:var(--mw-page-pad); inset-inline-end:var(--mw-page-pad); max-width:26rem; text-align:end;
  font-size:var(--mw-fs-base); line-height:var(--mw-lh-base); color:var(--mw-on-dark); }
/* obrys z resetu czarny, na zdjeciu niewidoczny (WCAG 2.4.7) */
.mw-hero :is(a, button):focus-visible{ outline-color:var(--mw-on-dark); outline-offset:3px; }
.mw-hero__scroll{ position:absolute; z-index:2; inset-block-end:var(--mw-s5); inset-inline-start:50%; translate:-50% 0;
  color:var(--mw-on-dark-fade); pointer-events:none; }
.mw-hero__scroll svg{ width:var(--mw-s5); height:var(--mw-s5); animation:mw-scroll-hint 2.4s ease-in-out infinite; }
@keyframes mw-scroll-hint{ 0%, 70%, 100%{ translate:0 0; } 35%{ translate:0 6px; } }

/* naglowek na zdjeciu hero (.mw-home): ujemny margines zdejmuje jego wysokosc z przeplywu */
.mw-home .mw-header{ margin-block-end:calc(-1 * var(--mw-header-h)); background:transparent; border-block-end:0; } /* bez kreski pod naglowkiem nad zdjeciem */
.mw-home :is(.mw-menu > li > a, .mw-header__tools a, .mw-header__logo),
.mw-home .mw-header__in button{ color:var(--mw-on-dark); }
/* dwa czasy: kolor przenika tyle, ile front bieli pokonuje sam pasek */
.mw-home .mw-header__in :is(.mw-menu > li > a, .mw-header__tools a, .mw-header__logo, .mw-header__szukaj-btn){
  transition:color .3s ease-in, opacity .3s var(--mw-ease); }
.mw-home .mw-header--panel .mw-header__in :is(.mw-menu > li > a, .mw-header__tools a, .mw-header__logo, .mw-header__szukaj-btn){
  transition-duration:var(--mw-bar-sweep, .12s), var(--mw-megamenu-move); }
/* mega-menu ma jasne tlo: tresc ciemna takze na hero */
.mw-home .mw-megamenu a,
.mw-home .mw-header__in .mw-megamenu__back{ color:var(--mw-ink); }
/* sam pasek po przyklejeniu; :not(--panel), inaczej bije regule panelu wyzej */
.mw-home .mw-header:is(.mw-header--stuck, .mw-header--bar):not(.mw-header--panel)::before{ clip-path:inset(0 0 calc(100% - var(--mw-header-h)) 0); }
.mw-home .mw-header:is(.mw-header--stuck, .mw-header--bar) :is(.mw-menu > li > a, .mw-header__tools a, .mw-header__logo),
.mw-home .mw-header:is(.mw-header--stuck, .mw-header--bar) .mw-header__in button{ color:var(--mw-ink); }

@media (width < 900px){ /* bp:desktop */
  /* naglowek nie klei sie na telefonie; logo zostaje jasne nad zdjeciem */
  .mw-home .mw-header::before{ display:none; }
  .mw-view.mw-home .mw-header:is(.mw-header--stuck, .mw-header--bar) .mw-header__logo{ color:var(--mw-on-dark); }
  /* tresc na srodku w pionie; lid 16 */
  .mw-hero__inner{ inset-block-start:50%; inset-block-end:auto; inset-inline-end:var(--mw-page-pad); translate:0 -50%; }
  .mw-hero__lead{ font-size:var(--mw-fs-base); }
  /* nota z lewej nad dolnym paskiem; bez wskaznika scrolla (nachodzil na note) */
  .mw-hero__note{ text-align:start; inset-inline-start:var(--mw-page-pad); inset-block-end:calc(var(--mw-page-pad) + var(--mw-dock-h)); }
  .mw-hero__scroll{ display:none; }
}