/* ==========================================================================
   JoKaPROskin - wspólny system landingów linii (identyczny we wszystkich folderach).
   Kolory linii: assets/css/linia.css (tokeny --c-*). Mobile first.
   ========================================================================== */

/* ---------- Fonty (lokalnie, OFL) ---------- */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/inter-400.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/inter-600.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/montserrat-600.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/montserrat-700.woff2") format("woff2")}

@font-face{font-family:"Inter Zapas";src:local("Arial"),local("Helvetica Neue"),local("Helvetica");size-adjust:107.6%;ascent-override:90%;descent-override:22.4%;line-gap-override:0%}
@font-face{font-family:"Montserrat Zapas";src:local("Arial"),local("Helvetica Neue"),local("Helvetica");size-adjust:113.4%;ascent-override:85.8%;descent-override:22.2%;line-gap-override:0%}

/* ---------- Tokeny domyślne (nadpisuje linia.css) ---------- */
:root{
  --c-brand:#8A337E;--c-brand-ink:#3A1226;--c-white:#FFFFFF;
  --c-lead:#8A337E;--c-lead-strong:#8A337E;--c-lead-soft:#F7EEF9;--c-lead-mist:#FCF8FC;
  --c-accent:#8A337E;--c-heading:#3A1226;--c-text:#54454D;--c-muted:#6E5F67;
  --c-bg:#FFFFFF;--c-bg-alt:#FCFCFD;--c-line:#EDE3EA;--c-on-lead:#FFFFFF;--c-pack:#8A337E;
  --c-ciemne:var(--c-brand-ink);--c-na-ciemnym:#F4ECF1;--c-na-ciemnym-muted:#D9C9D3;
  --grad-lead:linear-gradient(90deg,var(--c-lead),var(--c-lead-strong));
  --f-naglowki:"Montserrat","Montserrat Zapas",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --f-tekst:"Inter","Inter Zapas",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --r-s:10px;--r-m:16px;--r-l:24px;--r-xl:32px;--r-pill:999px;
  --cien-s:0 1px 2px rgba(30,20,30,.04),0 4px 14px rgba(30,20,30,.05);
  --cien-m:0 2px 6px rgba(30,20,30,.04),0 14px 36px -12px rgba(30,20,30,.14);
  --cien-l:0 30px 60px -30px rgba(30,20,30,.28);
  --kontener:1200px;
  --gutter:max(16px,env(safe-area-inset-left),env(safe-area-inset-right));
  --sekcja-py:clamp(56px,8vw,112px);
  --naglowek-h:60px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
@media (min-width:1080px){:root{--naglowek-h:72px}}

/* ---------- Reset i podstawy ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--naglowek-h) + 12px)}
body{margin:0;min-height:100dvh;font-synthesis:none;background:var(--c-bg);color:var(--c-text);font-family:var(--f-tekst);font-size:1rem;line-height:1.65;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg,picture{display:block;max-width:100%}
img{height:auto}
a{color:var(--c-lead-strong);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
h1,h2,h3,h4,h5,h6{margin:0;font-family:var(--f-naglowki);color:var(--c-heading);font-weight:700;line-height:1.2;text-wrap:balance;overflow-wrap:break-word}
p{margin:0}
ul,ol{margin:0;padding:0}
ul[role=list],ol[role=list]{list-style:none}
strong{font-weight:600;color:var(--c-heading)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--c-lead-strong);outline-offset:3px;border-radius:4px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.przeskocz{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 16px;border-radius:var(--r-s);background:var(--c-heading);color:#fff;font-weight:600;text-decoration:none;transition:top .2s}
.przeskocz:focus{top:12px}
.ikona{flex:none}

.kontener{width:min(100% - 2 * var(--gutter),var(--kontener));margin-inline:auto}

/* ---------- Typografia ---------- */
.nadtytul{display:inline-flex;align-items:center;gap:10px;margin-bottom:14px;font-family:var(--f-naglowki);font-size:.875rem;font-weight:700;letter-spacing:.06em;color:var(--c-accent);line-height:1.4}
.nadtytul::before{content:"";width:24px;height:2px;border-radius:2px;background:currentColor;flex:none}
.sekcja__glowa{max-width:760px;margin-bottom:clamp(28px,4vw,48px)}
.sekcja__tytul{font-size:clamp(1.625rem,1.15rem + 2.1vw,2.5rem);line-height:1.15;letter-spacing:-.01em}
.sekcja__tytul em,.hero__tytul em{font-style:normal;color:var(--c-lead-strong)}
.sekcja__lead{margin-top:16px;font-size:clamp(1.0625rem,1rem + .35vw,1.1875rem);line-height:1.6;max-width:66ch}
.nota{margin-top:clamp(24px,3vw,36px);font-size:.875rem;line-height:1.6;color:var(--c-muted);max-width:90ch}
.nota--zastrzezenie{padding-top:16px;border-top:1px solid var(--c-line)}
.etykieta-inci{font-weight:600;color:var(--c-muted);font-size:.75rem;letter-spacing:.06em}

/* ---------- Przyciski ---------- */
.przycisk{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border:1.5px solid var(--c-lead-strong);border-radius:var(--r-pill);background:var(--c-lead-strong);color:var(--c-on-lead);font-family:var(--f-tekst);font-size:.9375rem;font-weight:600;line-height:1.2;letter-spacing:.01em;text-align:center;text-decoration:none;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background-color .2s,color .2s}
.przycisk:hover{transform:translateY(-1px);box-shadow:0 10px 22px -12px var(--c-lead-strong)}
.przycisk .ikona--strzalka{transition:transform .2s var(--ease)}
.przycisk:hover .ikona--strzalka{transform:translateX(3px)}
.przycisk--obrys{background:transparent;color:var(--c-lead-strong)}
.przycisk--obrys:hover{background:var(--c-lead-strong);color:var(--c-on-lead)}
.przycisk--odwrocony{background:var(--c-on-lead);border-color:var(--c-on-lead);color:var(--c-lead-strong)}
.przycisk--maly{min-height:44px;padding:0 16px;font-size:.875rem}
.link-strzalka{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:600;color:inherit;text-decoration:underline;text-underline-offset:4px}

/* ---------- Nagłówek (chowa się przy przewijaniu w dół) ---------- */
.naglowek{position:sticky;top:0;z-index:50;height:var(--naglowek-h);background:color-mix(in srgb,var(--c-bg) 90%,transparent);-webkit-backdrop-filter:saturate(150%) blur(12px);backdrop-filter:saturate(150%) blur(12px);border-bottom:1px solid transparent;transition:transform .3s var(--ease),border-color .3s,box-shadow .3s}
@supports not (background:color-mix(in srgb,red 50%,blue)){.naglowek{background:rgba(255,255,255,.92)}}
.naglowek--przewiniety{border-bottom-color:var(--c-line);box-shadow:0 8px 24px -20px rgba(30,20,30,.5)}
.naglowek--ukryty{transform:translateY(-100%)}
.naglowek__wnetrze{height:100%;display:flex;align-items:center;gap:12px}
.naglowek__logo{display:flex;align-items:center;gap:10px;min-height:44px;margin-right:auto;text-decoration:none;min-width:0}
.naglowek__logo-img{height:28px;width:auto}
.naglowek__kreska{width:1px;height:24px;background:var(--c-line);flex:none}
.naglowek__marka-img{height:16px;width:auto}
@media (max-width:359px){.naglowek__kreska,.naglowek__marka-img{display:none}}
.naglowek__logo-tekst{font-family:var(--f-naglowki);font-weight:700;letter-spacing:.08em;color:var(--c-heading)}
.naglowek__cta{gap:6px}
.menu{display:none}
.menu__lista{display:flex;gap:4px}
.menu__lista a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border-radius:var(--r-pill);color:var(--c-heading);font-size:.9375rem;font-weight:600;text-decoration:none}
.menu__lista a:hover{background:var(--c-lead-soft)}
.menu-mobilne{position:relative}
.menu-mobilne summary{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;list-style:none;cursor:pointer;color:var(--c-heading)}
.menu-mobilne summary::-webkit-details-marker{display:none}
.menu-mobilne__zamknij,.menu-mobilne[open] .menu-mobilne__otworz{display:none}
.menu-mobilne[open] .menu-mobilne__zamknij{display:block}
.menu-mobilne__panel{position:fixed;left:0;right:0;top:var(--naglowek-h);max-height:calc(100dvh - var(--naglowek-h));overflow:auto;padding:12px var(--gutter) 24px;background:var(--c-bg);border-bottom:1px solid var(--c-line);box-shadow:0 30px 40px -30px rgba(30,20,30,.35)}
.menu-mobilne__panel li{border-bottom:1px solid var(--c-line)}
.menu-mobilne__panel li:last-child{border:0;padding-top:16px}
.menu-mobilne__panel a:not(.przycisk){display:flex;align-items:center;min-height:52px;color:var(--c-heading);font-family:var(--f-naglowki);font-weight:600;font-size:1.0625rem;text-decoration:none}
.menu-mobilne__panel .przycisk{width:100%}
@media (min-width:1080px){.menu{display:block}.menu-mobilne{display:none}.naglowek__logo-img{height:36px}.naglowek__marka-img{height:18px}.naglowek__kreska{height:28px}}
@media (max-width:379px){.naglowek__cta span{display:none}.naglowek__cta{width:44px;padding:0}}

/* ---------- Sekcje i tła ---------- */
.sekcja{position:relative;padding-block:var(--sekcja-py)}
.tlo--bg{background:var(--c-bg)}
.tlo--alt{background:var(--c-bg-alt)}
.tlo--soft{background:var(--c-lead-mist)}
.tlo--lead{background:var(--c-lead-strong);color:var(--c-on-lead)}
.tlo--ciemne{background:var(--c-ciemne);color:var(--c-na-ciemnym)}
.tlo--lead :is(h2,h3,strong,.sekcja__tytul),.tlo--ciemne :is(h2,h3,strong,.sekcja__tytul){color:inherit}
.tlo--lead .nadtytul{color:inherit}
.tlo--ciemne .nadtytul{color:var(--c-na-ciemnym)}
.tlo--lead .nota{color:inherit}
.tlo--ciemne .nota{color:var(--c-na-ciemnym-muted)}
.tlo--lead a:not(.przycisk),.tlo--ciemne a:not(.przycisk){color:inherit}
.tlo--lead :focus-visible,.tlo--ciemne :focus-visible{outline-color:currentColor}
:is(.tlo--lead,.tlo--ciemne) .przycisk--odwrocony:focus-visible{outline-color:var(--c-on-lead,#fff)}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;background:var(--c-lead-mist);padding-block:clamp(28px,6vw,72px) clamp(40px,7vw,96px)}
.hero__siatka{position:relative;display:grid;gap:clamp(28px,5vw,64px);align-items:center}
.hero__tekst{position:relative;z-index:2;max-width:640px}
.hero__tytul{font-size:clamp(2rem,1.3rem + 3.3vw,3.5rem);line-height:1.08;letter-spacing:-.018em;overflow-wrap:break-word}
h1,h2,h3,.hero__lead,.sekcja__lead{overflow-wrap:break-word}
.hero__lead{margin-top:18px;font-size:clamp(1.0625rem,1rem + .45vw,1.25rem);line-height:1.6;max-width:56ch}
.hero__przyciski{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero__fakty{display:grid;gap:10px;margin-top:28px;list-style:none;font-size:.9375rem;line-height:1.45}
.hero__fakty li{display:flex;gap:10px;align-items:flex-start}
.hero__fakty .ikona{margin-top:2px;color:var(--c-lead-strong)}
.hero__scena{position:relative;display:grid;place-items:center;min-height:260px}
.hero__motyw{position:absolute;inset:6% 4%;border-radius:50%;background:radial-gradient(closest-side,#fff 0%,var(--c-lead-soft) 62%,transparent 100%);filter:saturate(110%)}
.hero__packshot{position:relative;width:min(100%,560px);max-height:min(62dvh,620px);object-fit:contain;filter:drop-shadow(0 30px 34px rgba(30,20,30,.18))}
.hero--foto .hero__foto{position:relative;margin-top:28px;order:2}
.hero--foto{display:flex;flex-direction:column}
.hero--foto .hero__siatka{order:1}
.hero__foto-img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
@media (max-width:519px){.hero__przyciski .przycisk{flex:1 1 100%}}
@media (min-width:900px){
  .hero--scena .hero__siatka{grid-template-columns:1.05fr .95fr}
  .hero--scena{min-height:min(calc(100dvh - var(--naglowek-h)),860px);display:flex;align-items:center}
  .hero--scena .hero__siatka{width:min(100% - 2 * var(--gutter),var(--kontener))}
  .hero--foto{display:block;min-height:min(calc(100dvh - var(--naglowek-h)),860px)}
  .hero--foto .hero__foto{position:absolute;inset:0;margin:0}
  /* Nakładka pełna (100%) do prawej krawędzi kolumny tekstu + 24 px, liczonej z kontenera i szerokości kolumny (nie z procentu ekranu),
     potem zanika do przezroczystości w 16% szerokości. Kontrast tekstu nie zależy od wgranej grafiki (jasnej, ciemnej, pstrokatej)
     przy każdej szerokości od 900 px. Linia może zmienić kolor (--hero-nakladka) i szerokość kolumny (--hero-tekst-max), nie krycie. */
  .hero--foto{--hero-nakladka:var(--c-lead-mist);--hero-tekst-max:640px;--hero-koniec:calc(max(var(--gutter),(100% - var(--kontener)) / 2) + min(var(--hero-tekst-max),100% - 2 * var(--gutter)) + 24px)}
  .hero--foto .hero__tekst{max-width:var(--hero-tekst-max)}
  .hero--foto .hero__foto::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--hero-nakladka) 0,var(--hero-nakladka) var(--hero-koniec),calc(var(--hero-koniec) + 5%),transparent calc(var(--hero-koniec) + 16%))}
  .hero--foto .hero__foto-img,.hero--foto picture{width:100%;height:100%;aspect-ratio:auto;object-fit:cover}
  .hero--foto .hero__siatka{min-height:inherit;padding-block:clamp(48px,7vw,96px)}
}
@media (max-height:520px) and (orientation:landscape){
  :root{--naglowek-h:52px}
  .hero{padding-block:16px 28px}
  .hero__siatka{grid-template-columns:1.1fr .9fr;gap:24px}
  .hero--scena,.hero--foto{min-height:0}
  .hero__tytul{font-size:clamp(1.5rem,4.2vh + .6rem,2.25rem)}
  .hero__lead{margin-top:10px;font-size:1rem}
  .hero__przyciski{margin-top:16px}
  .hero__przyciski .przycisk{flex:0 1 auto}
  .hero__fakty{display:none}
  .hero__scena{min-height:0}
  .hero__packshot{max-height:62vh}
  .hero--foto .hero__foto{display:none}
}

/* ---------- Pasek faktów ---------- */
.sekcja--fakty{padding-block:clamp(24px,3.5vw,40px);border-block:1px solid var(--c-line)}
.fakty{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:14px 24px;list-style:none}
@media (min-width:600px){.fakty[data-liczba="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}.fakty[data-liczba="3"],.fakty[data-liczba="6"]{grid-template-columns:repeat(3,minmax(0,1fr))}
  .fakty[data-liczba="5"]{grid-template-columns:repeat(6,minmax(0,1fr))}.fakty[data-liczba="5"]>*{grid-column:span 2}.fakty[data-liczba="5"]>:nth-child(n+4){grid-column:span 3}}
@media (min-width:1100px){.fakty[data-liczba="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:1200px){.fakty[data-liczba="5"]{grid-template-columns:repeat(5,minmax(0,1fr))}.fakty[data-liczba="5"]>*,.fakty[data-liczba="5"]>:nth-child(n+4){grid-column:auto}}
.fakty__pozycja{display:flex;gap:12px;align-items:center;font-size:.9375rem;font-weight:600;line-height:1.4;color:var(--c-heading)}
.fakty__pozycja .ikona{color:var(--c-lead-strong)}
.fakty__wartosc{font-family:var(--f-naglowki);font-size:1.25rem;color:var(--c-lead-strong)}
.sekcja--fakty .nota{margin-top:16px;font-size:.8125rem}

/* ---------- Karty ---------- */
.karty{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:clamp(14px,2vw,22px)}
.karta-info{position:relative;display:flex;flex-direction:column;gap:10px;padding:clamp(22px,2.4vw,30px);border:1px solid var(--c-line);border-radius:var(--r-m);background:var(--c-bg);box-shadow:var(--cien-s)}
.tlo--bg .karta-info{background:var(--c-bg-alt)}
.karta-info__ikona{display:grid;place-items:center;width:52px;height:52px;margin-bottom:4px;border-radius:50%;background:var(--c-lead-soft);color:var(--c-lead-strong)}
.karta-info__numer{font-family:var(--f-naglowki);font-weight:700;font-size:1.5rem;line-height:1;color:var(--c-lead-strong)}
.karta-info__tytul{font-size:1.125rem;line-height:1.3}
.karta-info__tekst{font-size:.9375rem;line-height:1.6}
.karty--lista{grid-template-columns:minmax(0,1fr);gap:0}
.karty--lista .karta-info{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:4px 16px;padding:18px 0;border:0;border-bottom:1px solid var(--c-line);border-radius:0;background:none;box-shadow:none}
.karty__uklad--z-grafika{display:grid;gap:clamp(24px,4vw,48px);align-items:center}
.karty__grafika-img{width:100%;border-radius:var(--r-l);aspect-ratio:4/5;object-fit:cover}
@media (min-width:900px){.karty__uklad--z-grafika{grid-template-columns:.9fr 1.1fr}.karty__uklad--z-grafika .karty{grid-template-columns:1fr 1fr}}
.karty:is([data-liczba="1"],[data-liczba="3"]):not(.karty--lista){grid-template-columns:minmax(0,1fr)}
@media (min-width:600px){.karty:is([data-liczba="2"],[data-liczba="4"]):not(.karty--lista){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:900px){.karty[data-liczba="3"]:not(.karty--lista){grid-template-columns:repeat(3,minmax(0,1fr))}.karty__uklad--z-grafika .karty[data-liczba="3"]:not(.karty--lista){grid-template-columns:minmax(0,1fr)}}
@media (min-width:1100px){.karty[data-liczba="4"]:not(.karty--lista){grid-template-columns:repeat(4,minmax(0,1fr))}.karty__uklad--z-grafika .karty[data-liczba="4"]:not(.karty--lista){grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- Składniki ---------- */
.skladniki__uklad{display:grid;gap:clamp(24px,4vw,56px)}
.skladniki__bok .sekcja__glowa{margin-bottom:24px}
.skladniki__grafika-img{width:100%;border-radius:var(--r-l);aspect-ratio:1/1;object-fit:cover}
.skladniki{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:clamp(12px,1.6vw,18px)}
.skladnik{padding:22px 22px 20px;border-radius:var(--r-m);background:var(--c-bg);border:1px solid var(--c-line);border-top:3px solid var(--c-lead)}
.tlo--bg .skladnik{background:var(--c-bg-alt)}
.skladnik__nazwa{font-size:1.0625rem;line-height:1.3}
.skladnik__inci{margin-top:6px;font-size:.8125rem;line-height:1.45;color:var(--c-muted);overflow-wrap:anywhere}
.skladnik__funkcja{margin-top:10px;font-size:.9375rem;line-height:1.6}
.skladnik__gdzie{margin-top:10px;font-size:.8125rem;line-height:1.5;color:var(--c-muted)}
.skladnik__gdzie a{color:var(--c-lead-strong);font-weight:600}
@media (min-width:1000px){.skladniki__uklad{grid-template-columns:minmax(280px,.8fr) 1.6fr;align-items:start}.skladniki__bok{position:sticky;top:calc(var(--naglowek-h) + 24px)}.skladniki{grid-template-columns:1fr 1fr}}

/* ---------- Wyniki badań ---------- */
.wyniki{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:clamp(12px,1.6vw,18px)}
.wynik{display:flex;flex-direction:column;gap:6px;padding:24px 22px;border-radius:var(--r-m);background:var(--c-bg);border:1px solid var(--c-line);box-shadow:var(--cien-s)}
.wynik__produkt{font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--c-accent)}
.wynik__wartosc{font-family:var(--f-naglowki);font-weight:700;font-size:clamp(2.25rem,1.8rem + 1.6vw,3rem);line-height:1;letter-spacing:-.02em;color:var(--c-lead-strong);font-variant-numeric:tabular-nums}
.wynik__opis{font-weight:600;color:var(--c-heading);line-height:1.4}
.wynik__badanie{margin-top:auto;padding-top:8px;font-size:.8125rem;line-height:1.5;color:var(--c-muted)}
.tlo--ciemne .wynik,.tlo--lead .wynik{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16);box-shadow:none}
.tlo--ciemne .wynik :is(.wynik__wartosc,.wynik__opis,.wynik__produkt),.tlo--lead .wynik :is(.wynik__wartosc,.wynik__opis,.wynik__produkt){color:inherit}
.tlo--ciemne .wynik__badanie{color:var(--c-na-ciemnym-muted)}
.tlo--lead .wynik__badanie{color:inherit}

/* ---------- Produkty ---------- */
.grupy-nav{position:sticky;top:var(--naglowek-h);z-index:5;margin:0 calc(-1 * var(--gutter)) clamp(20px,3vw,32px);padding:10px var(--gutter);background:color-mix(in srgb,var(--c-bg) 92%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:top .3s var(--ease)}
.tlo--soft .grupy-nav{background:color-mix(in srgb,var(--c-lead-mist) 92%,transparent)}
html.naglowek-schowany .grupy-nav{top:0}
.grupy-nav ul{display:flex;gap:8px;padding:6px;margin:-6px;overflow-x:auto;scroll-padding-inline:16px;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.grupy-nav ul::-webkit-scrollbar{display:none}
.grupy-nav li{scroll-snap-align:start;flex:none}
.grupy-nav a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid var(--c-line);border-radius:var(--r-pill);background:var(--c-bg);color:var(--c-heading);font-weight:600;font-size:.9375rem;text-decoration:none;white-space:nowrap}
.grupy-nav a:hover{border-color:var(--c-lead-strong)}
.grupy-nav a[aria-current="true"]{border-color:var(--c-lead-strong);background:var(--c-lead-soft);color:var(--c-lead-strong);box-shadow:inset 0 0 0 1px var(--c-lead-strong)}
.grupy-nav__liczba{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:var(--r-pill);background:var(--c-lead-soft);color:var(--c-lead-strong);font-size:.75rem}
.grupa+.grupa{margin-top:clamp(40px,6vw,72px)}
.grupa{scroll-margin-top:calc(var(--naglowek-h) + 72px)}
.grupa__glowa{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid var(--c-line)}
.grupa__tytul{font-size:clamp(1.25rem,1.1rem + .6vw,1.5rem)}
.grupa__opis{font-size:.9375rem;color:var(--c-muted)}
.produkty{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(16px,2vw,24px)}
@media (min-width:600px){.produkty{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.produkty{grid-template-columns:repeat(3,minmax(0,1fr))}.produkty[data-liczba="2"],.produkty[data-liczba="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}}
.produkty[data-liczba="1"]{grid-template-columns:minmax(0,1fr)}
@media (min-width:600px) and (max-width:1023px){.produkty:is([data-liczba="3"],[data-liczba="5"],[data-liczba="7"]){grid-template-columns:minmax(0,1fr)}}
/* Karta pozioma: tło zdjęcia na całą wysokość karty, packshot wyśrodkowany (bez pustego pola pod obrazem) */
@media (min-width:600px){
  .produkty[data-liczba="1"] .produkt{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:stretch;max-width:1040px;margin-inline:auto;width:100%}
  .produkty[data-liczba="1"] .produkt__media{aspect-ratio:auto;min-height:340px}
  .produkty[data-liczba="1"] .produkt__img{inset:auto 10%;top:50%;height:auto;max-height:560px;transform:translateY(-50%)}
}
@media (min-width:600px) and (max-width:1023px){
  .produkty:is([data-liczba="3"],[data-liczba="5"],[data-liczba="7"]) .produkt{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:stretch}
  .produkty:is([data-liczba="3"],[data-liczba="5"],[data-liczba="7"]) .produkt__media{aspect-ratio:auto;min-height:320px}
  .produkty:is([data-liczba="3"],[data-liczba="5"],[data-liczba="7"]) .produkt__img{inset:auto 10%;top:50%;height:auto;max-height:520px;transform:translateY(-50%)}
}
.zamiennik-grafiki{position:relative;display:grid;place-items:center;overflow:hidden;border-radius:var(--r-l);background:radial-gradient(circle at 50% 60%,#fff 0%,var(--c-lead-mist) 55%,var(--c-lead-soft) 100%);aspect-ratio:4/5}
.zamiennik-grafiki img{width:84%;height:auto;filter:drop-shadow(0 24px 28px rgba(30,20,30,.16))}
@media (max-width:999px){.zamiennik-grafiki{aspect-ratio:16/10;max-height:340px}.zamiennik-grafiki img{position:absolute;inset:6% 5%;width:90%;height:88%;object-fit:contain}}
.produkt__w-zestawie{margin-top:4px;font-size:.8125rem;color:var(--c-muted)}
.produkt{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--c-line);border-radius:var(--r-l);background:var(--c-bg);box-shadow:var(--cien-s);transition:box-shadow .3s var(--ease),transform .3s var(--ease);scroll-margin-top:calc(var(--naglowek-h) + 80px)}
.produkt:hover{box-shadow:var(--cien-m)}
.produkt__media{position:relative;display:grid;place-items:center;aspect-ratio:1/1;overflow:hidden;background:radial-gradient(circle at 50% 58%,#fff 0%,var(--c-lead-mist) 58%,var(--c-lead-soft) 100%)}
.produkt__img{position:absolute;inset:9% 10% 7%;width:80%;height:84%;object-fit:contain;filter:drop-shadow(0 18px 22px rgba(30,20,30,.14))}
.produkt__brak{color:var(--c-lead)}
.produkt__tresc{display:flex;flex-direction:column;gap:10px;flex:1;padding:clamp(18px,2.4vw,26px)}
.produkt__etykieta{font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--c-accent)}
.produkt__nazwa{font-size:clamp(1.125rem,1.05rem + .3vw,1.3125rem);line-height:1.25}
.produkt__pojemnosc{margin-top:-4px;font-size:.875rem;font-weight:600;color:var(--c-muted)}
.produkt__opis{font-size:.9375rem;line-height:1.6}
.produkt__podtytul{margin-top:4px;font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c-muted)}
.produkt__skladniki{display:flex;flex-wrap:wrap;gap:6px}
.produkt__skladniki li{padding:4px 10px;border-radius:var(--r-pill);background:var(--c-lead-soft);color:var(--c-heading);font-size:.8125rem;font-weight:600;line-height:1.4}
.produkt__kup{margin-top:auto;width:100%}
.rozwin{border-top:1px solid var(--c-line)}
.rozwin:last-of-type{border-bottom:1px solid var(--c-line);margin-bottom:6px}
.rozwin summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;cursor:pointer;list-style:none;font-weight:600;font-size:.9375rem;color:var(--c-heading)}
.rozwin summary::-webkit-details-marker{display:none}
.rozwin summary::after{content:"";width:10px;height:10px;margin-right:4px;border-right:2px solid var(--c-lead-strong);border-bottom:2px solid var(--c-lead-strong);transform:rotate(45deg) translateY(-3px);transition:transform .25s var(--ease);flex:none}
.rozwin[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
.rozwin__tresc{padding:2px 0 16px;font-size:.875rem;line-height:1.6}
.inci{font-size:.8125rem;line-height:1.65;color:var(--c-text);overflow-wrap:anywhere;-webkit-hyphens:manual;hyphens:manual}
.inci mark{background:var(--c-lead-soft);color:var(--c-heading);font-weight:600;padding:0 2px;border-radius:3px}

/* ---------- Zestaw ---------- */
.zestaw{display:grid;overflow:hidden;border:1px solid var(--c-line);border-radius:var(--r-xl);background:var(--c-bg);box-shadow:var(--cien-m);margin-bottom:clamp(28px,4vw,48px);scroll-margin-top:calc(var(--naglowek-h) + 16px)}
.zestaw__media{position:relative;display:grid;place-items:center;min-height:320px;aspect-ratio:1/1;overflow:hidden;background:radial-gradient(circle at 50% 60%,#fff 0%,var(--c-lead-mist) 55%,var(--c-lead-soft) 100%)}
.zestaw__img{position:absolute;inset:7%;width:86%;height:86%;object-fit:contain;filter:drop-shadow(0 26px 30px rgba(30,20,30,.16))}
@media (min-width:900px){.zestaw__media{aspect-ratio:auto}}
.zestaw__tresc{display:flex;flex-direction:column;gap:14px;padding:clamp(22px,4vw,48px)}
.zestaw__nazwa{font-size:clamp(1.5rem,1.2rem + 1.4vw,2.25rem);line-height:1.15}
.zestaw__opis{font-size:1.0625rem;line-height:1.6}
.zestaw__lista{display:grid;gap:8px;padding-left:1.4em}
.zestaw__lista li::marker{color:var(--c-lead-strong);font-weight:700}
.zestaw__lista span{color:var(--c-muted);font-size:.875rem}
.zestaw .przycisk{align-self:flex-start;margin-top:8px}
@media (min-width:900px){.zestaw{grid-template-columns:1fr 1fr}}
.produkty--elementy{margin-top:8px}

/* ---------- Rytuał ---------- */
.kroki{display:grid;gap:14px;counter-reset:krok}
.krok{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr);gap:16px;align-items:start}
.krok__tresc,.pora,.rytual__uklad>*{min-width:0}
.krok__produkt a,.krok__tekst a{overflow-wrap:anywhere}
.krok__numer{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--c-lead-strong);color:var(--c-on-lead);font-family:var(--f-naglowki);font-weight:700;font-size:1.125rem}
.krok:not(:last-child)::before{content:"";position:absolute;left:23px;top:52px;bottom:-14px;width:2px;background:linear-gradient(var(--c-lead),transparent)}
.krok__tresc{padding:10px 0 12px}
.krok__pora{display:inline-flex;align-items:center;gap:6px;margin-bottom:6px;padding:3px 10px;border-radius:var(--r-pill);background:var(--c-lead-soft);color:var(--c-heading);font-size:.75rem;font-weight:600;letter-spacing:.04em}
.krok__tytul{font-size:1.125rem}
.krok__produkt{margin-top:4px;font-weight:600}
.krok__produkt a{color:var(--c-lead-strong)}
.krok__tekst{margin-top:6px;font-size:.9375rem;line-height:1.6}
.pory{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(20px,3vw,32px)}
.pora{padding:clamp(20px,3vw,32px);border-radius:var(--r-l);background:var(--c-bg);border:1px solid var(--c-line)}
.pora__tytul{display:flex;align-items:center;gap:10px;margin-bottom:18px;font-size:1.25rem}
.pora__tytul .ikona{color:var(--c-lead-strong)}
.rytual__uklad{display:grid;gap:clamp(24px,4vw,56px);align-items:start}
.rytual__grafika-img{width:100%;border-radius:var(--r-l);aspect-ratio:4/5;object-fit:cover}
@media (min-width:900px){.pory{grid-template-columns:repeat(2,minmax(0,1fr))}.rytual__uklad{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}}
@media (min-width:1024px){.sekcja--rytual-poziomy .kroki{grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:24px}.sekcja--rytual-poziomy .krok{grid-template-columns:minmax(0,1fr)}.sekcja--rytual-poziomy .krok::before{left:48px;right:-24px;top:23px;bottom:auto;width:auto;height:2px;background:linear-gradient(90deg,var(--c-lead),transparent)}.sekcja--rytual-poziomy .krok:last-child::before{display:none}}

/* ---------- Uwagi ---------- */
.uwagi{padding:clamp(22px,4vw,44px);border-radius:var(--r-l);background:var(--c-bg);border:1px solid var(--c-line);border-left:4px solid var(--c-lead)}
.uwagi .sekcja__glowa,.uwagi__glowa{margin-bottom:20px}
.uwagi__glowa .sekcja__tytul{font-size:clamp(1.375rem,1.1rem + 1.2vw,2rem)}
.uwagi__lista{display:grid;gap:14px}
.uwagi__lista li{display:flex;gap:12px;align-items:flex-start;line-height:1.55}
.uwagi__lista .ikona{margin-top:1px;color:var(--c-lead-strong)}
@media (min-width:900px){.uwagi__lista{grid-template-columns:1fr 1fr;gap:16px 32px}}

/* ---------- FAQ ---------- */
.faq__uklad{display:grid;gap:clamp(16px,3vw,48px)}
@media (min-width:1000px){.faq__uklad{grid-template-columns:minmax(260px,340px) minmax(0,1fr);align-items:start}.faq__uklad .sekcja__glowa{position:sticky;top:calc(var(--naglowek-h) + 24px)}}
.faq{border-top:1px solid var(--c-line)}
.faq__pozycja{border-bottom:1px solid var(--c-line)}
.faq__pozycja summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:14px 0;cursor:pointer;list-style:none}
.faq__pozycja summary::-webkit-details-marker{display:none}
.faq__pytanie{font-size:clamp(1rem,.95rem + .25vw,1.125rem);line-height:1.4;font-weight:600}
.faq__ikona{display:grid;place-items:center;width:36px;height:36px;padding:8px;border-radius:50%;background:var(--c-lead-soft);color:var(--c-lead-strong);transition:background-color .25s}
.faq__ikona path,.faq__ikona line{transform-box:view-box;transform-origin:50% 50%;transition:transform .25s var(--ease)}
.faq__pozycja[open] .faq__ikona{background:var(--c-lead-strong);color:var(--c-on-lead)}
.faq__pozycja[open] .faq__ikona :is(path,line){transform:rotate(45deg)}
.faq__odpowiedz{display:grid;gap:10px;padding:0 0 20px;max-width:70ch;font-size:.9375rem;line-height:1.7}

/* ---------- O marce ---------- */
.sekcja--marka{overflow:hidden}
.marka__uklad{display:grid;gap:clamp(20px,4vw,56px);align-items:center}
.marka__tekst p+p{margin-top:14px}
.marka__tekst>p{max-width:62ch;font-size:1.0625rem}
.marka__haslo{font-family:var(--f-naglowki);font-weight:700;font-size:clamp(2.25rem,1.3rem + 4.4vw,4.75rem);line-height:.98;letter-spacing:-.02em;color:var(--c-brand);text-transform:uppercase;overflow-wrap:anywhere}
.tlo--ciemne .marka__haslo{color:#fff;opacity:.95}
.marka__wartosci{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:1px;margin-top:clamp(32px,5vw,56px);border:1px solid var(--c-line);border-radius:var(--r-m);overflow:hidden;background:var(--c-line)}
.marka__wartosci li{padding:24px 22px;background:var(--c-bg)}
.marka__wartosci h3{font-size:1.0625rem;margin-bottom:8px}
.marka__wartosci p{font-size:.9375rem;line-height:1.6}
.tlo--ciemne .marka__wartosci{border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.16)}
.tlo--ciemne .marka__wartosci li{background:var(--c-ciemne)}
@media (min-width:1000px){.marka__uklad{grid-template-columns:1.2fr 1fr}}
.marka__link{margin-top:24px}

/* ---------- Końcowe CTA ---------- */
.sekcja--cta{overflow:hidden}
.cta{position:relative;max-width:780px;margin-inline:auto;text-align:center}
.cta .sekcja__glowa,.cta__glowa{margin-inline:auto;margin-bottom:28px}
.cta .nadtytul{justify-content:center}
.cta .sekcja__lead{margin-inline:auto}
.cta__przyciski{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px 24px}
.sekcja--cta::before{content:"";position:absolute;inset:auto -20% -60% -20%;height:120%;background:radial-gradient(closest-side,rgba(255,255,255,.14),transparent);pointer-events:none}

/* ---------- Tekst ---------- */
.tekst{max-width:760px}
.tekst p+p{margin-top:14px}

/* ---------- Stopka ---------- */
.stopka{background:var(--c-ciemne);color:var(--c-na-ciemnym);padding-block:clamp(48px,6vw,80px) 28px;font-size:.9375rem}
.stopka a{color:var(--c-na-ciemnym);text-decoration:none}
.stopka__cookies{display:inline-flex;align-items:center;min-height:44px;padding:0;border:0;background:none;font:inherit;color:var(--c-na-ciemnym);cursor:pointer}
.stopka__cookies:hover{text-decoration:underline}
.stopka a:hover{text-decoration:underline}
.stopka :focus-visible{outline-color:#fff}
.stopka__gora{display:grid;gap:32px 40px}
.stopka__logotypy{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.stopka__logo-linii{width:auto;height:44px}
.stopka__logo{width:auto;height:30px}
.stopka__logo-tekst{font-family:var(--f-naglowki);font-weight:700;font-size:1.375rem;color:#fff}
.stopka__claim{margin-top:14px;max-width:40ch;color:var(--c-na-ciemnym-muted);line-height:1.6}
.stopka__haslo{margin-top:16px;font-family:var(--f-naglowki);font-weight:700;letter-spacing:.16em;font-size:.8125rem;color:#fff}
.stopka__tytul{margin-bottom:12px;font-size:.8125rem;letter-spacing:.14em;text-transform:uppercase;color:#fff}
.stopka__kolumna{min-width:0}
.stopka__kolumna li a{display:inline-flex;align-items:center;gap:8px;min-height:44px;min-width:44px;line-height:1.35;max-width:100%;overflow-wrap:anywhere}
.stopka__kontakt{margin-top:10px}
.stopka__dol{display:grid;gap:8px;margin-top:40px;padding-top:24px;border-top:1px solid rgba(255,255,255,.14);font-size:.8125rem;line-height:1.6;color:var(--c-na-ciemnym-muted)}
@media (min-width:700px){.stopka__gora{grid-template-columns:1.4fr 1fr 1fr}.stopka__marka{grid-column:1/-1}}
@media (min-width:1080px){.stopka__gora{grid-template-columns:1.5fr 1fr 1fr 1fr}.stopka__marka{grid-column:auto}}

/* ---------- Ścieżka nawigacyjna ---------- */
.okruszki{margin-bottom:14px;font-size:.8125rem;line-height:1.4}
.okruszki ol{display:flex;flex-wrap:wrap;gap:2px 0;list-style:none}
.okruszki li{display:flex;align-items:center;color:var(--c-muted)}
.okruszki li+li::before{content:"/";margin:0 8px;color:var(--c-muted);opacity:.7}
.okruszki a{display:inline-flex;align-items:center;min-height:44px;color:var(--c-muted);text-decoration:none}
.okruszki a:hover{color:var(--c-lead-strong);text-decoration:underline}
.okruszki [aria-current]{color:var(--c-heading);font-weight:600}
.znacznik-premiery{display:inline-flex;align-items:center;gap:6px;margin-bottom:12px;padding:5px 12px;border-radius:var(--r-pill);background:var(--c-lead-strong);color:var(--c-on-lead);font-size:.8125rem;font-weight:600;letter-spacing:.02em}
.znacznik-premiery--maly{margin:0;align-self:flex-start;padding:3px 10px;font-size:.75rem}

/* ---------- W skrócie ---------- */
.sekcja--skrot{padding-block:clamp(28px,4vw,48px)}
.skrot{display:grid;gap:14px 40px;padding:clamp(20px,3vw,32px);border:1px solid var(--c-line);border-left:4px solid var(--c-lead);border-radius:var(--r-m);background:var(--c-bg-alt)}
.skrot__tytul{font-size:1.125rem;letter-spacing:.02em}
.skrot__tekst{display:grid;gap:8px;font-size:1.0625rem;line-height:1.6;max-width:75ch}
.skrot__lista{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:10px 24px;margin:0}
.skrot__lista div{display:grid;gap:2px}
.skrot__lista dt{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c-muted)}
.skrot__lista dd{margin:0;font-weight:600;color:var(--c-heading);line-height:1.45}
.skrot__data{font-size:.8125rem;color:var(--c-muted)}
.skrot__promocja{margin:0;padding:10px 14px;border-radius:var(--r-s);background:var(--c-lead-soft);color:var(--c-heading);font-size:.9375rem;line-height:1.5}
.skrot__promocja a{color:var(--c-lead-strong);font-weight:600}
.wyniki__wiecej{margin-top:clamp(14px,2vw,22px)}
.wyniki__wiecej>summary{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--c-lead-strong);text-decoration:underline;text-underline-offset:4px}
.wyniki__wiecej[open]>summary{margin-bottom:clamp(14px,2vw,22px)}
.tlo--ciemne .wyniki__wiecej>summary,.tlo--lead .wyniki__wiecej>summary{color:inherit}
@media (min-width:1000px){.skrot{grid-template-columns:220px minmax(0,1fr)}.skrot__tytul{grid-row:span 3}}
@media (min-width:600px){.skrot__lista[data-liczba="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}.skrot__lista:is([data-liczba="3"],[data-liczba="6"]){grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1200px){.skrot__lista[data-liczba="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- Tabela faktów ---------- */
.tabela-faktow__wrap{overflow-x:auto;border:1px solid var(--c-line);border-radius:var(--r-m);background:var(--c-bg)}
.tabela-faktow{width:100%;border-collapse:collapse;font-size:.9375rem;line-height:1.5}
.tabela-faktow th,.tabela-faktow td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--c-line)}
.tabela-faktow thead th{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c-muted);background:var(--c-bg-alt)}
.tabela-faktow tbody th{font-family:var(--f-naglowki);font-weight:600;color:var(--c-heading)}
.tabela-faktow tbody th a{color:var(--c-heading);text-decoration-color:var(--c-lead)}
.tabela-faktow tbody tr:last-child>*{border-bottom:0}
@media (max-width:759px){
  .tabela-faktow__wrap{overflow:visible;border:0;background:none}
  .tabela-faktow thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .tabela-faktow,.tabela-faktow tbody,.tabela-faktow tr,.tabela-faktow th,.tabela-faktow td{display:block}
  .tabela-faktow tbody tr:last-child>*{border-bottom:1px solid var(--c-line)}
  .tabela-faktow tbody tr>:last-child{border-bottom:0}
  .tabela-faktow tr{margin-bottom:12px;border:1px solid var(--c-line);border-radius:var(--r-m);background:var(--c-bg);overflow:hidden}
  .tabela-faktow tbody th{background:var(--c-lead-mist);font-size:1.0625rem}
  .tabela-faktow td{display:grid;grid-template-columns:110px 1fr;gap:12px;padding:10px 16px}
  .tabela-faktow td::before{content:attr(data-etykieta);font-size:.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--c-muted)}
  .tabela-faktow td:empty{display:none}
  /* Kolumna wartości ograniczona do szerokości karty i łamanie długich wyrazów dopiero przy powiększonym tekście (karta
     węższa niż 17em): przy 100% i 320 px długi wyraz (np. „przeciwzmarszczkowy”) zostaje w całości, jak dotąd */
  .tabela-faktow tr{container-type:inline-size}
  .tabela-faktow td{overflow-wrap:normal}
  @container (max-width:17em){.tabela-faktow td{grid-template-columns:110px minmax(0,1fr);overflow-wrap:break-word}}
}

/* ---------- Karta produktu: wyniki, uwagi, kroki ---------- */
.produkt__dla{font-size:.9375rem;line-height:1.55}
.produkt__skladniki li strong{color:var(--c-heading)}
.produkt__skladniki:has(strong){display:grid;gap:6px}
.produkt__skladniki:has(strong) li{padding:0;border-radius:0;background:none;font-weight:400;font-size:.875rem;line-height:1.5}
.produkt__wyniki{display:grid;gap:8px;list-style:none}
.produkt__wyniki li{display:block;padding:8px 12px;border-radius:var(--r-s);background:var(--c-lead-mist);font-size:.875rem;line-height:1.45}
.wynik-maly__wartosc{font-family:var(--f-naglowki);font-weight:700;font-size:1.0625rem;color:var(--c-lead-strong);margin-right:4px}
.wynik-maly__typ{display:block;margin-top:2px;font-size:.75rem;color:var(--c-muted)}
.produkt__wyniki--pelne li{background:var(--c-bg-alt)}
.produkt__pomiar,.produkt__osrodek,.produkt__zastrzezenie{margin-top:8px;font-size:.8125rem;line-height:1.5}
.produkt__zastrzezenie{color:var(--c-muted)}
.produkt__uwaga{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:var(--r-s);background:var(--c-bg-alt);border:1px solid var(--c-line);font-size:.8125rem;line-height:1.5}
.produkt__uwaga .ikona{margin-top:1px;color:var(--c-lead-strong)}
.produkt__kroki{display:grid;gap:6px;padding-left:1.2em}
.inci--brak{color:var(--c-muted)}
.inci--czesci p+p{margin-top:10px}
.inci__czesc{font-weight:600;color:var(--c-heading)}
.stopka__data{color:var(--c-na-ciemnym-muted)}
.stopka__wykonawca{color:var(--c-na-ciemnym-muted)}
.stopka__wykonawca a{color:var(--c-na-ciemnym);text-decoration:underline;text-decoration-color:rgba(255,255,255,.35);text-underline-offset:3px}
.stopka__wykonawca a:hover{text-decoration-color:currentColor}
summary,button,[role=button],label[for]{cursor:pointer}
.wynik__produkt a,.krok__produkt a,.tabela-faktow tbody th a{display:inline-flex;align-items:center;min-height:44px}
.skrot__lista div{align-content:start}
.krok{align-content:start}
.sekcja--rytual-poziomy .krok{grid-template-rows:auto 1fr}
html{scroll-padding-bottom:var(--promo-h,0px)}
/* Przyklejona kolumna składników tylko wtedy, gdy mieści się na ekranie */
@media (min-width:1000px) and (max-height:879px){.skladniki__bok{position:static}}

/* ---------- Wyniki badań produktów (kafle z wizualizacją w CSS, kolory linii) ---------- */
.wp{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(22px,3vw,36px)}
.wp__produkt,.wp__glowa>div{min-width:0}
.wp__produkt{padding:clamp(18px,2.6vw,30px);border:1px solid var(--c-line);border-radius:var(--r-l);background:var(--c-bg);box-shadow:var(--cien-s);scroll-margin-top:calc(var(--naglowek-h) + 24px)}
.wp__glowa{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.wp__packshot{flex:none;width:64px;height:64px;object-fit:contain;border-radius:50%;background:radial-gradient(circle at 50% 60%,#fff 0%,var(--c-lead-mist) 70%)}
.wp__nazwa{font-size:clamp(1.0625rem,1rem + .3vw,1.25rem);line-height:1.3;overflow-wrap:break-word;hyphens:auto}
.wp__liczby{margin-top:2px;font-size:.8125rem;color:var(--c-muted)}
.wp__linki{display:flex;flex-wrap:wrap;gap:0 16px;margin-top:4px;font-size:.875rem;font-weight:600}
.wp__linki a{display:inline-flex;align-items:center;min-height:44px;color:var(--c-lead-strong)}
.wp__wskazowka{display:flex;align-items:center;gap:6px;margin:-6px 0 8px;font-size:.8125rem;color:var(--c-muted)}
.wp__wskazowka .ikona{flex:none;color:var(--c-lead-strong)}
.wp__przewijanie{margin:0 calc(-1 * clamp(18px,2.6vw,30px));padding:4px clamp(18px,2.6vw,30px) 12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:clamp(18px,2.6vw,30px);scrollbar-width:thin}
.wp__przewijanie:focus-visible{outline:3px solid var(--c-lead-strong);outline-offset:-3px;border-radius:var(--r-m)}
.wp__kafle{display:grid;grid-auto-flow:column;grid-auto-columns:max(200px,44%);gap:14px;list-style:none}
.wp__kafle--siatka{grid-auto-flow:row;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin-top:14px}
@media (min-width:900px){
  .wp__wskazowka{display:none}
  .wp__przewijanie{margin:0;padding:0;overflow:visible}
  .wp__kafle{grid-auto-flow:row;grid-template-columns:repeat(4,minmax(0,1fr))}
  .wp__kafle:is([data-liczba="3"],[data-liczba="6"]){grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width:1100px){.wp__kafle[data-liczba="5"]{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media (min-width:900px) and (max-width:1099px){.wp__kafle[data-liczba="5"]{grid-template-columns:repeat(3,minmax(0,1fr))}}
.wp__kafel{--wp-kolor:var(--c-lead-strong);--wp-tor:color-mix(in srgb,var(--c-line) 80%,var(--c-lead-soft));scroll-snap-align:start;display:flex;flex-direction:column;gap:8px;padding:18px 18px 16px;border-radius:var(--r-m);background:linear-gradient(180deg,var(--c-lead-mist),var(--c-bg) 72%);border:1px solid var(--c-line);min-width:0}
/* opinie probantów: ten sam kolor linii, jaśniejsze tło i ciemna liczba (odróżnienie od pomiarów bez obcego koloru) */
.wp__kafel--opinia{background:linear-gradient(180deg,var(--c-lead-soft),var(--c-bg) 78%)}
.wp__wartosc{font-family:var(--f-naglowki);font-weight:700;font-size:clamp(1.75rem,1.5rem + 1vw,2.25rem);line-height:1;letter-spacing:-.02em;color:var(--wp-kolor)}
.wp__kafel--opinia .wp__wartosc{color:var(--c-heading)}
.wp__opis{font-size:.9375rem;line-height:1.45;color:var(--c-heading);overflow-wrap:break-word}
.wp__typ{font-size:.75rem;line-height:1.35;font-weight:600;letter-spacing:.02em;color:var(--c-muted)}
.wp__krag{position:relative;display:grid;place-items:center;width:104px;height:104px;margin-bottom:2px}
.wp__pierscien{--p:0;position:absolute;inset:0;border-radius:50%;background:conic-gradient(var(--wp-kolor) calc(var(--p) * 1%),var(--wp-tor) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 7px),#000 calc(100% - 6px));mask:radial-gradient(farthest-side,transparent calc(100% - 7px),#000 calc(100% - 6px))}
@property --p{syntax:'<number>';inherits:false;initial-value:0}
.wp__pierscien{transition:--p 1.1s var(--ease)}
.wp__krag .wp__wartosc{position:relative;font-size:1.5rem;letter-spacing:-.03em}
.wp__krag .wp__wartosc--dluga{font-size:1.1875rem}
.wp__zmiana{display:flex;align-items:center;gap:8px;height:28px}
.wp__pasek{position:relative;display:block;flex:1;height:10px;border-radius:5px;background:var(--wp-tor);overflow:hidden}
.wp__pasek>span{position:absolute;inset:0 auto 0 0;width:var(--w,0%);border-radius:5px;background:var(--wp-kolor);transform-origin:left center;transition:transform 1s var(--ease)}
.wp__pasek>.wp__przed{background:color-mix(in srgb,var(--wp-kolor) 40%,var(--c-line))}
.wp__strzalka{flex:none;color:var(--wp-kolor);transform:rotate(-90deg)}
.wp__zmiana--spadek .wp__strzalka{transform:rotate(90deg)}
.wp__przed-po{display:grid;gap:8px;padding:6px 0 4px}
.wp__wiersz{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px 8px;font-size:.75rem;color:var(--c-muted)}
.wp__wiersz .wp__pasek{grid-column:1/-1}
.wp__liczba{font-weight:600;color:var(--c-heading);font-variant-numeric:tabular-nums}
.wp__ikona{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--c-lead-soft);color:var(--wp-kolor)}
.wp__wiecej{margin-top:6px}
.wp__zastrzezenie{margin-top:12px;font-size:.8125rem;color:var(--c-muted)}
.produkt__wszystkie-wyniki{margin:0}
.wyniki__dalej{margin-top:clamp(20px,3vw,32px)}
.wyniki__dalej .przycisk{gap:8px}
.wyniki__dalej-ikona{transform:rotate(90deg)}
.wp-kotwica{display:block;height:0;scroll-margin-top:calc(var(--naglowek-h) + 24px)}
@media (max-width:599px){
  .wp__produkt{padding:16px}
  .wp__przewijanie{margin:0 -16px;padding:4px 16px 10px;scroll-padding-inline:16px}
  .wp__glowa{gap:12px;margin-bottom:12px}
  .wp__packshot{width:52px;height:52px}
  .wp__linki{gap:0 14px;font-size:.8125rem}
  /* kafel na ok. 3/4 szerokości: widać, że obok jest następny */
  .wp__kafle{grid-auto-columns:max(200px,74%);gap:10px}
  .wp__glowa{align-items:flex-start}
  .wp__linki{gap:0 14px}
  .wp__kafel{padding:14px 14px 12px;gap:6px}
  .wp__wartosc{font-size:1.625rem}
  .wp__opis{font-size:.875rem}
  .wp__krag{width:88px;height:88px}
  .wp__krag .wp__wartosc{font-size:1.25rem}
  .wp__krag .wp__wartosc--dluga{font-size:1rem}
}
.js .wp__produkt.pojaw:not(.widoczne) .wp__pasek>span{transform:scaleX(0)}
.js .wp__produkt.pojaw:not(.widoczne) .wp__pierscien{--p:0!important}
@supports not ((mask:radial-gradient(#000,#000)) or (-webkit-mask:radial-gradient(#000,#000))){.wp__pierscien{-webkit-mask:none;mask:none;background:none;border:6px solid var(--wp-kolor)}}

/* ---------- Powiększenie samego tekstu do 200% (WCAG 1.4.4, U041): bez poziomego przewijania ----------
   Przy 100% wygląd bez zmian: kolumny siatek i elementy flex dostają dolną granicę 0 zamiast szerokości najdłuższego słowa,
   a słowo łamie się dopiero wtedy, gdy samo nie mieści się w wierszu (overflow-wrap:break-word nie zmienia szerokości min-content;
   anywhere tylko w elementach inline-flex, których szerokość i tak nie przekracza wiersza). */
body{overflow-wrap:break-word}
@media (max-width:999px){.skladniki__uklad,.faq__uklad,.skrot,.marka__uklad{grid-template-columns:minmax(0,1fr)}}
/* Hero i wartości wyników: ograniczenie dopiero przy powiększonym tekście (warunek w em kontenera), żeby przy 100%
   i 320 px długie słowo H1 i liczba „+18,7 p.p.” zachowały się jak dotąd (bez łamania w środku) */
.hero,.wynik{container-type:inline-size}
@container (max-width:19.5em){.hero__siatka{grid-template-columns:minmax(0,1fr)}}
.wynik__wartosc{overflow-wrap:normal}
@container (max-width:14em){.wynik__wartosc{overflow-wrap:break-word}}
@media (max-width:899px){.uwagi__lista{grid-template-columns:minmax(0,1fr)}}
@media (max-width:699px){.stopka__gora{grid-template-columns:minmax(0,1fr)}}
.skrot__tekst,.skrot__lista div,.hero__fakty,.produkt__kroki,.zestaw__lista,.faq__odpowiedz{grid-template-columns:minmax(0,1fr)}
@media (max-width:899px){.zestaw{grid-template-columns:minmax(0,1fr)}}
.fakty__pozycja>*,.hero__fakty li>*,.uwagi__lista li>*,.faq__pozycja summary>*,.grupa__glowa>*,.karty--lista .karta-info>*{min-width:0}
.nadtytul{max-width:100%;overflow-wrap:anywhere}
.pora__tytul{overflow-wrap:anywhere}
/* .wynik ma container-type (wyżej), więc jego szerokość nie zależy od treści */
.wynik__produkt a{max-width:100%;overflow-wrap:anywhere}
@media (max-width:699px){.stopka__kolumna li a{max-width:100%;overflow-wrap:anywhere}}
@media (max-width:759px){.tabela-faktow tbody th a{max-width:100%;overflow-wrap:anywhere}}
/* W linia.css white-space:nowrap przy odnośnikach i wyróżnieniach „w jednym kawałku” działa tylko w zapytaniu @container
   (min-width w em kontenera, np. .krok__tekst:has(a)): przy 100% bez zmian, przy powiększonym tekście łamią się normalnie */

/* wąskie ekrany i tryb odstępów WCAG 1.4.12: długie słowa w nagłówku i leadzie hero łamią się zamiast wychodzić poza ekran */
@media (max-width:399px){.hero h1,.hero__lead,.hero .nadtytul{overflow-wrap:anywhere}}

/* ---------- Zgoda na pliki cookie (decyzja 31): niski pasek na dole, nad paskiem promocji, nie zasłania przycisków hero ---------- */
.cookies{position:fixed;left:0;right:0;bottom:var(--promo-h,0px);z-index:70;padding:12px max(16px,env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));border-top:1px solid var(--c-line);background:var(--c-bg);color:var(--c-text);box-shadow:0 -10px 30px -18px rgba(30,20,30,.35);font-size:.875rem;line-height:1.45}
.cookies{max-height:calc(100dvh - var(--promo-h,0px) - 8px);overflow-y:auto;overscroll-behavior:contain}
.cookies[hidden]{display:none}
/* powracający z zapisanym wyborem (klasa ma-zgode ze skryptu w <head>): baner nie miga przed wczytaniem cookies.js */
html.ma-zgode .cookies:not(.cookies--otwarty){display:none}
/* bez JavaScriptu: zwykły blok informacyjny na początku strony (przyciski i tak nie działają), nie zasłania treści */
html:not(.js) .cookies{position:static;max-height:none;box-shadow:none;border-top:0;border-bottom:1px solid var(--c-line)}
html:not(.js) .cookies__przyciski,html:not(.js) .cookies__link{display:none}
/* baner nie zasłania elementu z fokusem ani końca strony: dopełnienie i scroll-padding o jego wysokość (--cookies-h z cookies.js) */
html.ma-cookies body{padding-bottom:calc(var(--promo-h,0px) + var(--cookies-h,0px))}
html.ma-cookies{scroll-padding-bottom:calc(var(--promo-h,0px) + var(--cookies-h,0px) + 8px)}
.cookies__tytul{margin:0 0 4px;font-family:var(--f-naglowki);font-size:.9375rem;font-weight:700;color:var(--c-heading);outline:none}
.cookies__rzad{display:grid;gap:10px}
.cookies__tekst{margin:0;color:var(--c-text)}
.cookies__tekst a{color:var(--c-lead-strong)}
.cookies__przyciski{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.cookies__przyciski .przycisk{min-height:44px;padding:0 16px;font-size:.875rem;flex:1 1 auto}
.cookies__link{display:inline;padding:0;border:0;background:none;font:inherit;font-weight:600;color:var(--c-lead-strong);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cookies__ustawienia{margin-top:10px;padding-top:10px;border-top:1px solid var(--c-line);max-height:min(50vh,360px);overflow:auto}
.cookies__ustawienia[hidden]{display:none}
.cookies__kategoria{display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 12px;align-items:start;padding:2px 0}
.cookies__kategoria input{width:24px;height:24px;margin:10px 0 0;accent-color:var(--c-lead-strong);cursor:pointer}
.cookies__kategoria label{font-weight:600;color:var(--c-heading);cursor:pointer;min-height:44px;display:flex;align-items:center}
.cookies__kategoria input:disabled+label{cursor:default}
.cookies__opis{grid-column:2;margin:0;font-size:.8125rem;color:var(--c-muted)}
.cookies__zapisz{margin-top:8px}
.cookies-ikona{position:fixed;left:max(12px,env(safe-area-inset-left));bottom:calc(var(--promo-h,0px) + max(12px,env(safe-area-inset-bottom)));z-index:69;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--c-line);border-radius:50%;background:var(--c-bg);color:var(--c-lead-strong);box-shadow:var(--cien-m);cursor:pointer}
.cookies-ikona[hidden]{display:none}
.cookies-ikona:hover{background:var(--c-lead-soft)}
/* ikona w lewym dolnym rogu nie zasłania ostatniego wiersza stopki (podpis wykonawcy) */
@media (max-width:1099px){.cookies-ikona:not([hidden])+.stopka{padding-bottom:calc(28px + 56px)}}
@media (max-width:599px){
  .cookies__przyciski .przycisk{flex:1 1 40%}
  .cookies__ustawienia{max-height:min(46vh,320px)}
}
/* telefon w poziomie: jeden rząd, mniejsze dopełnienia, tytuł tylko dla czytników ekranu */
@media (max-height:500px) and (min-width:600px){
  .cookies{padding-top:6px;padding-bottom:calc(6px + env(safe-area-inset-bottom));font-size:.8125rem}
  .cookies__tytul{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .cookies__przyciski .przycisk{min-height:40px;padding:0 12px;font-size:.8125rem}
}
@media (min-width:600px){
  .cookies{padding-top:10px;padding-bottom:calc(10px + env(safe-area-inset-bottom))}
  .cookies__rzad{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 24px}
  .cookies__tytul{display:inline;margin:0 6px 0 0}
  .cookies__tekst{display:inline}
  .cookies__przyciski{flex-wrap:nowrap}
  .cookies__przyciski .przycisk{flex:none}
  .cookies__ustawienia{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 24px}
  .cookies__ustawienia[hidden]{display:none}
  .cookies__zapisz{grid-column:1/-1;justify-self:start}
}
@media (min-width:600px){.cookies__glowa{display:contents}}
@media (prefers-reduced-motion:no-preference){.cookies{animation:cookies-wejscie .35s var(--ease)}}
@keyframes cookies-wejscie{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* ---------- Podstrona (polityka prywatności): artykuł z tabelą ---------- */
.podstrona{padding-block:clamp(28px,4vw,56px) clamp(48px,6vw,80px)}
.podstrona__glowa{max-width:76ch;margin-bottom:clamp(20px,3vw,32px)}
.podstrona__glowa h1{font-size:clamp(1.75rem,1.4rem + 1.6vw,2.5rem);line-height:1.15;margin:8px 0 12px}
.podstrona__lead{font-size:1.0625rem;color:var(--c-muted)}
.podstrona__data{margin-top:8px;font-size:.8125rem;color:var(--c-muted)}
.artykul{max-width:80ch}
.artykul h2{margin:clamp(28px,4vw,40px) 0 10px;font-size:clamp(1.25rem,1.1rem + .6vw,1.5rem);line-height:1.25}
.artykul h3{margin:20px 0 8px;font-size:1.0625rem}
.artykul p{margin:0 0 12px}
.artykul ul,.artykul ol{margin:0 0 12px;padding-left:22px}
.artykul li{margin-bottom:6px}
.artykul__numer{display:inline-block;min-width:2.2em;margin-right:6px;color:var(--c-lead-strong);font-variant-numeric:tabular-nums}
.artykul address{font-style:normal}
.tabela-polityki{width:100%;border-collapse:collapse;margin:8px 0 16px;font-size:.875rem;line-height:1.5}
.tabela-polityki th,.tabela-polityki td{padding:10px 12px;border:1px solid var(--c-line);vertical-align:top;text-align:left;overflow-wrap:break-word}
.tabela-polityki th{background:var(--c-lead-mist);color:var(--c-heading);font-weight:600}
@media (max-width:759px){
  .tabela-polityki thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tabela-polityki tr{display:block;margin-bottom:12px;border:1px solid var(--c-line);border-radius:var(--r-s)}
  .tabela-polityki td{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;border:0;border-top:1px solid var(--c-line)}
  .tabela-polityki tr td:first-child{border-top:0}
  .tabela-polityki td::before{content:attr(data-etykieta);font-size:.75rem;font-weight:600;letter-spacing:.02em;color:var(--c-lead-strong)}
}

/* ---------- Pojawianie się (tylko z JS i bez ograniczenia ruchu) ---------- */
.js .pojaw{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .pojaw.widoczne{opacity:1;transform:none}
.js .pojaw:focus-within{opacity:1;transform:none;transition:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .js .pojaw{opacity:1;transform:none}
}
@media print{.naglowek,.promo,.menu-mobilne{display:none!important}}