/* Czarna Karta - styl wzorowany na szablonie "Heim" (Envato, 21.10.2026 Danusia: "w takim stylu zrob"):
   czern z nuta bordo, czerwone swiatlo "zza sceny" jak reflektor, zaokraglone ciemne karty, czerwone kola z numerami,
   przyciski-pigulki (czerwony + grafitowy), duza liczba ze skosna linia, FAQ ze strzalka.
   Fonty wybrane przez Danusie: Eragoti (tytuly, od 21.10 w miejsce Toxide) + Familjen Grotesk (tekst).
   Portret: czarno-bialy pod czerwonym swiatlem (mix-blend), jak samochod w Heim. Zdjecia ilustracyjne - dopisek w stopce. */
.sklep-czarna{--r:22px;--btn-r:999px;--czerwien:#c8141f;--czerwien2:#8e0b13;--grafit:#1d1416}
.sklep-czarna body,.sklep-czarna{background:var(--tlo)}
.sklep-czarna h1,.sklep-czarna h2,.sklep-czarna h3,.sklep-czarna .logo,.sklep-czarna .karta-prod__nazwa{font-weight:400;letter-spacing:0}

/* naglowek: przezroczysty nad czerwonym swiatlem */
.sklep-czarna .naglowek{background:rgba(11,5,6,.72);backdrop-filter:blur(10px);border-bottom:1px solid var(--linia)}
.sklep-czarna .logo{font-family:var(--font-h);font-size:26px}
.sklep-czarna .logo__znak{color:var(--czerwien)}
.sklep-czarna .nav-link{color:var(--tekst2)}
.sklep-czarna .nav-link[aria-current]{color:var(--tekst)}

/* przyciski: pigulki */
.sklep-czarna .btn--akcent{background:var(--czerwien);border:0;font-weight:600;letter-spacing:.01em}
.sklep-czarna .btn--akcent:hover{background:#dd1b27;box-shadow:0 10px 30px rgba(200,20,31,.35)}
.sklep-czarna .btn--obrys{background:var(--grafit);border-color:transparent;color:var(--tekst)}
.sklep-czarna .btn--obrys:hover{border-color:rgba(200,20,31,.6)}

/* HERO: czerwone swiatlo z prawej, tekst po lewej, portret w czerwieni */
.sklep-czarna .hero{background:radial-gradient(55% 85% at 78% 45%,rgba(200,20,31,.55),rgba(142,11,19,.25) 45%,transparent 72%),linear-gradient(180deg,#120607 0%,var(--tlo) 100%);padding:64px 0 80px}
.sklep-czarna .hero__h1{font-size:clamp(46px,7.4vw,92px);line-height:.98;margin-bottom:22px}
.sklep-czarna .kicker{color:var(--tekst2);letter-spacing:.24em;text-transform:uppercase;font-size:12px;font-weight:600}
.sklep-czarna .kicker::before{content:'';display:inline-block;width:46px;height:1px;background:var(--czerwien);vertical-align:middle;margin-right:12px}
.sklep-czarna .hero__lead{color:#cbbfba}
.sklep-czarna .hero__punkty .ikona{color:var(--czerwien)}
.sklep-czarna .hero__od strong{color:var(--tekst)}
.sklep-czarna .hero__foto{isolation:isolate;border-radius:28px;overflow:visible}
.sklep-czarna .hero__foto img{aspect-ratio:4/5;object-position:50% 18%;border-radius:28px;filter:grayscale(1) contrast(1.12) brightness(1.08);box-shadow:0 0 0 1px rgba(255,255,255,.06),0 40px 120px rgba(200,20,31,.35)}
.sklep-czarna .hero__foto::before{content:'';position:absolute;inset:0;z-index:1;border-radius:28px;background:radial-gradient(75% 65% at 50% 35%,#fff 0%,#fff 38%,#e0222d 78%,#7d0a11 100%);mix-blend-mode:multiply;pointer-events:none}
.sklep-czarna .hero__foto::after{content:'';position:absolute;inset:0;z-index:2;border-radius:28px;background:linear-gradient(180deg,transparent 72%,rgba(11,5,6,.75));pointer-events:none}
/* odznaka jak "250+ Restored" w Heim: duza liczba ze skosna linia */
.sklep-czarna .hero__odznaka{z-index:3;left:auto;right:-10px;bottom:34px;background:transparent;box-shadow:none;padding:0;flex-direction:column;align-items:flex-end;gap:2px;color:var(--tekst);font:400 15px/1.2 var(--font-t)}
.sklep-czarna .hero__odznaka .ikona{display:none}
.sklep-czarna .hero__odznaka::before{content:'4 h';font:400 54px/1 var(--font-t);letter-spacing:-.02em;color:#fff}
.sklep-czarna .hero__odznaka::after{content:'';position:absolute;right:120px;top:22px;width:120px;height:34px;border-top:1px solid rgba(255,255,255,.5);border-left:1px solid rgba(255,255,255,.5);transform:skewX(-40deg);transform-origin:left top}
@media(min-width:900px){.sklep-czarna .uk-hero-foto .hero__w,.sklep-czarna.uk-hero-foto .hero__w{grid-template-columns:1.1fr .9fr;gap:64px}.sklep-czarna .hero__foto{max-width:470px;margin-left:auto}}
@media(max-width:899px){.sklep-czarna .hero__odznaka{right:14px}.sklep-czarna .hero__odznaka::after{display:none}}

/* sekcje */
.sklep-czarna .sekcja{padding:84px 0}
.sklep-czarna .sekcja--tlo2{background:radial-gradient(60% 60% at 15% 0%,rgba(142,11,19,.18),transparent 70%),var(--tlo2)}
.sklep-czarna .sekcja__tyt{font-size:clamp(34px,5vw,58px);line-height:1.05}
.sklep-czarna .sekcja__lead{color:var(--tekst2)}

/* karty rozkladow: ciemne, zaokraglone, czerwona pigulka */
.sklep-czarna .karta-prod{background:linear-gradient(180deg,#1d1214,#140b0d);border:1px solid rgba(255,255,255,.06);border-radius:var(--r);padding:18px 18px 18px;box-shadow:none}
.sklep-czarna .karta-prod:hover{transform:translateY(-4px);border-color:rgba(200,20,31,.55);box-shadow:0 24px 60px rgba(200,20,31,.18)}
.sklep-czarna .karta-prod__img img,.sklep-czarna .karta-prod img{border-radius:16px;filter:saturate(.75) contrast(1.05)}
.sklep-czarna .karta-prod__plak{background:var(--czerwien)!important;color:#fff;border:0;border-radius:999px;font-size:11px}
.sklep-czarna .karta-prod__nazwa{font-size:27px}
.sklep-czarna .karta-prod__cena{font:400 26px/1 var(--font-t);color:#fff}
.sklep-czarna .karta-prod__dol{border-top-color:rgba(255,255,255,.07)}
.sklep-czarna .karta-prod__czas{color:var(--tekst2)}

/* kroki: szklane karty z czerwonymi kolami */
.sklep-czarna .krok{background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.07);border-radius:var(--r);padding:28px 26px;backdrop-filter:blur(6px)}
.sklep-czarna .krok__nr{width:52px;height:52px;background:var(--czerwien);color:#fff;font:600 20px/1 var(--font-t);box-shadow:0 10px 26px rgba(200,20,31,.35)}
.sklep-czarna .krok__grafika{opacity:.75}
.sklep-czarna .krok__tyt{font-size:24px}

/* "Czego tu nie znajdziesz": numery w czerwonych kolach */
.sklep-czarna .lista-sekcja{background:var(--tlo)}
.sklep-czarna .lista-sekcja__el li{background:#160c0e;border:1px solid rgba(255,255,255,.06);border-radius:18px;padding:20px 22px}
.sklep-czarna .lista-sekcja__nr{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--czerwien);color:#fff;font:600 15px/1 var(--font-t);flex:none}

/* o nas */
.sklep-czarna .o-nas-skrot__foto{border-radius:var(--r);filter:grayscale(.6) contrast(1.1) brightness(.85);box-shadow:0 30px 80px rgba(200,20,31,.2)}

/* FAQ jak w Heim: zaokraglone wiersze ze strzalka */
.sklep-czarna .faq{gap:14px}
.sklep-czarna .faq__el{background:#1a1012;border:1px solid rgba(255,255,255,.05);border-radius:20px;padding:0 22px}
.sklep-czarna .faq__el summary{font-weight:400;font-size:17px;padding:20px 34px 20px 0}
.sklep-czarna .faq__el summary::after{content:'↗';font-size:18px;top:20px;color:var(--tekst2);transition:transform .2s}
.sklep-czarna .faq__el[open] summary::after{content:'↗';transform:rotate(90deg);color:var(--czerwien)}

/* CTA i stopka */
.sklep-czarna .sekcja--cta{background:radial-gradient(60% 120% at 50% 100%,rgba(200,20,31,.45),transparent 70%),#0e0607;border-top:1px solid var(--linia)}
.sklep-czarna .stopka{background:#090405;color:#8f8582;border-top:1px solid rgba(255,255,255,.08)}
.sklep-czarna .stopka__nazwa{font-family:var(--font-h);font-size:24px;color:var(--tekst)}
.sklep-czarna .stopka__tyt{color:var(--tekst)}
.sklep-czarna .stopka a{color:#a99c98}
.sklep-czarna .stopka__nota{font-size:10px;opacity:.4}

/* formularze jak w Heim: ciemne pola, zaokraglone */
.sklep-czarna input,.sklep-czarna select,.sklep-czarna textarea{background:#140b0d;border:1px solid rgba(255,255,255,.12);color:var(--tekst);border-radius:12px}
.sklep-czarna input:focus,.sklep-czarna textarea:focus{border-color:var(--czerwien);outline:none}
.sklep-czarna ::selection{background:var(--czerwien);color:#fff}
/* newsletter: zdanie zachety czytelnym krojem, nie gotykiem (gotyk w malym rozmiarze sie zlewa) */
.sklep-czarna .newsletter__lead{font-family:var(--font-t);font-weight:600;font-size:17px;color:var(--tekst)}

/* 21.10.2026 roze od Danusi jako tla („do czarnych kart na tla by pasowalo”): zdjecia w grafiki/czarna/tlo-*.webp */
/* „Jak to działa”: krzew roz mocno przyciemniony pod szklanymi kartami */
.sklep-czarna .sekcja--tlo2:has(.kroki){background:linear-gradient(180deg,rgba(11,5,6,.9) 0%,rgba(11,5,6,.72) 45%,rgba(11,5,6,.92) 100%),url(grafiki/czarna/tlo-roze-krzew.webp) 70% 55%/cover no-repeat,var(--tlo2)}
.sklep-czarna .sekcja--tlo2:has(.kroki) .krok{background:rgba(20,10,12,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
/* „Czego tu nie znajdziesz”: pojedyncza roza na lodydze pod naglowkiem (komputer) */
@media(min-width:900px){
  .sklep-czarna .lista-sekcja:not(.w-liscie) .lista-sekcja__glowa::after{content:'';display:block;width:min(100%,300px);aspect-ratio:700/932;margin-top:30px;background:url(grafiki/czarna/tlo-roza-lodyga.webp) center/cover no-repeat;-webkit-mask-image:radial-gradient(70% 60% at 50% 45%,#000 55%,transparent 100%);mask-image:radial-gradient(70% 60% at 50% 45%,#000 55%,transparent 100%)} /* czern zdjecia rozjasniona do koloru strony (#0b0506) - bez prostokata */
}
/* ostatnia sekcja (motto + przycisk): szeroka roza po prawej, tekst w czerni po lewej */
.sklep-czarna .sekcja--cta{min-height:440px;display:flex;align-items:center;text-align:left;border-top:0;background:linear-gradient(90deg,#0b0506 0%,#0b0506 32%,rgba(11,5,6,.55) 55%,rgba(11,5,6,0) 75%),url(grafiki/czarna/tlo-roza-szeroka.webp) right center/cover no-repeat,#0b0506}
.sklep-czarna .sekcja--cta .kontener--waski{max-width:var(--szer);width:100%}
.sklep-czarna .sekcja--cta .cta-koniec__tyt{max-width:520px;font-size:clamp(34px,4.6vw,56px);line-height:1.05;margin:0 0 26px;text-align:left}
@media(max-width:899px){
  .sklep-czarna .sekcja--cta{min-height:520px;align-items:flex-end;text-align:center;background:linear-gradient(180deg,rgba(11,5,6,0) 0%,rgba(11,5,6,.35) 45%,#0b0506 80%),url(grafiki/czarna/tlo-roza-szeroka-m.webp) 78% top/auto 70% no-repeat,#0b0506}
  .sklep-czarna .sekcja--cta .cta-koniec__tyt{margin-inline:auto;text-align:center}
}

/* 21.10.2026 ekspres na czerni: czerwona ramka zamiast tla */
.sklep-czarna .ekspres,.sklep-czarna .ekspres-pasek{background:#160809;border-color:rgba(200,20,31,.6)}

/* 21.10.2026 „Wiemy, do czego zdolni sa ludzie”: pionowe zdjecie z papierosem obok tekstu (4:5), bez szarosci - widac czerwone usta i swiece */
.sklep-czarna .o-nas-skrot{align-items:center}
.sklep-czarna .o-nas-skrot__foto{aspect-ratio:4/5;width:100%;max-width:420px;height:auto;object-fit:cover;filter:contrast(1.05) brightness(.95) saturate(.85)}
.sklep-czarna .o-nas-skrot p{font-size:18px;line-height:1.65}
@media(max-width:760px){.sklep-czarna .o-nas-skrot__foto{max-width:100%}}
@media(min-width:768px){.sklep-czarna .o-nas-skrot{grid-template-columns:minmax(260px,400px) 1fr;gap:48px;max-width:1040px}}
/* ciemny podklad: przed wczytaniem zdjecia warstwa multiply (bialy srodek) dawala biala plame */
.sklep-czarna .hero__foto{background:#0b0506;border-radius:28px}

/* 21.10.2026 Danusia: „pogrubien w tym foncie prawie nie widac wiec moze dawaj czerwone tlo” - fraza na czerwonym pasku */
.sklep-czarna main :is(p,li,dd,.faq__el p) strong{background:#c8141f;color:#fff;font-weight:600;padding:.05em .3em;border-radius:3px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.sklep-czarna main :is(.ekspres,.ekspres-pasek,.opcja,.produkt__termin,.wc-block-components-totals-item) strong{background:none;color:inherit;padding:0}
.sklep-czarna .produkt__termin strong{color:#ff4a54}