/* sklep.MarketerPlus.pl: nowy front, wersja testowa (główna + 2 karty). */

@font-face { font-family: 'Mona Sans'; font-style: normal; font-weight: 200 900; font-stretch: 75% 125%; font-display: swap; src: url(/assets/fonts/mona-sans-latin-standard-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Mona Sans'; font-style: normal; font-weight: 200 900; font-stretch: 75% 125%; font-display: swap; src: url(/assets/fonts/mona-sans-latin-ext-standard-normal.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Golos Text'; font-style: normal; font-weight: 400 900; font-display: swap; src: url(/assets/fonts/golos-text-latin-wght-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Golos Text'; font-style: normal; font-weight: 400 900; font-display: swap; src: url(/assets/fonts/golos-text-latin-ext-wght-normal.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  /* Grafit i czerwień ze starego sklepu (#232323, #e22626), niebieski plus z logo (#0093dd). */
  --tlo: #ffffff;
  --szary: #f3f3f1;
  --szary-2: #e9e9e6;
  --tusz: #1d1d1f;
  --tusz-2: #55555c;
  --linia: #e1e1dd;
  --czerwony: #d61f1f;
  --czerwony-tlo: #fdecec;
  --niebieski: #0083c7;
  --niebieski-tlo: #e6f3fb;
  --ciemny: #17171a;
  --ciemny-2: #232327;
  --ciemny-tekst: #c9c9cf;
  --mplus: #e8f0cd;
  --ewp: #d9eee5;
  --zielony: #1f7a4d;
  --zielony-tlo: #e5f3ec;
  --szer: 1320px;
  --rog: 6px;
  --cien-okladki: 0 2px 4px rgb(20 20 25 / .12), 0 24px 40px -14px rgb(20 20 25 / .38);
  --cien: 0 18px 40px -20px rgb(20 20 25 / .3);
  --wyjazd: cubic-bezier(.16, 1, .3, 1);
  --naglowki: 'Mona Sans', 'Arial Narrow', system-ui, sans-serif;
  --sans: 'Golos Text', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 150px; scrollbar-color: #b8b8be transparent; }
body { margin: 0; background: var(--tlo); color: var(--tusz); font: 400 1.125rem/1.6 var(--sans); -webkit-font-smoothing: antialiased; }
img, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-underline-offset: .2em; text-decoration-thickness: 1px; }
button { font: inherit; color: inherit; cursor: pointer; }
h1, h2, h3 { margin: 0; font-family: var(--naglowki); font-weight: 760; font-stretch: 87.5%; line-height: 1.08; letter-spacing: -.015em; text-wrap: balance; }
p { margin: 0 0 1em; }
::selection { background: var(--niebieski); color: #fff; }
:focus-visible { outline: 2px solid var(--niebieski); outline-offset: 3px; }
input { caret-color: var(--niebieski); accent-color: var(--tusz); }
strong { font-weight: 650; }

.w { width: min(100% - 2rem, var(--szer)); margin-inline: auto; }
.waski { width: min(100% - 2rem, 880px); }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pomin { position: absolute; left: -999px; top: 0; z-index: 99; background: var(--tusz); color: #fff; padding: .6rem 1rem; }
.pomin:focus { left: 1rem; }
.ik { width: 1.15em; height: 1.15em; flex: none; fill: currentColor; vertical-align: -.2em; }

/* ---------- przyciski ---------- */
.przycisk { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 3.1rem; padding: .8rem 1.5rem;
  border: 1.5px solid var(--tusz); border-radius: var(--rog); background: var(--tusz); color: #fff; font: 650 1rem/1.1 var(--sans);
  text-decoration: none; transition: background .25s var(--wyjazd), color .25s var(--wyjazd), border-color .25s, transform .25s var(--wyjazd); }
.przycisk:hover { background: #3a3a40; border-color: #3a3a40; }
.przycisk:active { transform: translateY(1px); }
.przycisk .ik { width: 1.2em; height: 1.2em; }
.przycisk--obrys { background: transparent; color: var(--tusz); }
.przycisk--obrys:hover { background: var(--tusz); color: #fff; }
.przycisk--czerwony { background: var(--czerwony); border-color: var(--czerwony); }
.przycisk--czerwony:hover { background: #b51818; border-color: #b51818; }
.przycisk--maly { min-height: 2.6rem; padding: .55rem 1rem; font-size: .92rem; }
.przycisk--duzy { min-height: 3.5rem; font-size: 1.05rem; padding-inline: 1.75rem; }
.przycisk--pelny { width: 100%; }
.przycisk.dodano { background: var(--zielony); border-color: var(--zielony); color: #fff; }
.ikona-przycisk { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border: 0; border-radius: 50%; background: transparent; }
.ikona-przycisk:hover { background: var(--szary); }

/* ---------- ceny (Omnibus: najniższa i regularna w tej samej formie) ---------- */
.cena { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .55rem; font-variant-numeric: tabular-nums; }
.cena__teraz { font-weight: 700; font-size: 1.15rem; }
.cena--promo .cena__teraz { color: var(--czerwony); }
.cena__proc { font-size: .78rem; font-weight: 700; color: var(--czerwony); border: 1px solid currentColor; border-radius: 3px; padding: .05rem .3rem; }
.cena__odn { flex-basis: 100%; font-size: .9rem; color: var(--tusz); line-height: 1.35; }
.wcena, .pcena { margin: 0; display: grid; justify-items: end; gap: .1rem; font-variant-numeric: tabular-nums; }
.wcena__teraz, .pcena__teraz { font-weight: 700; white-space: nowrap; }
.wcena--promo .wcena__teraz, .pcena--promo .pcena__teraz { color: var(--czerwony); }
.wcena__proc, .pcena__proc { display: none; }
.wcena__odn, .pcena__odn { font-size: .82rem; color: var(--tusz); white-space: nowrap; }

/* ---------- pasek info i nagłówek ---------- */
.pasek-info { background: var(--ciemny); color: #e9e9ee; font-size: .85rem; }
.pasek-info__w { width: min(100% - 2rem, var(--szer)); margin-inline: auto; display: flex; justify-content: center; gap: 2.75rem; padding: .5rem 0; }
.pasek-info p { margin: 0; display: flex; align-items: center; gap: .45rem; }
.pasek-info .ik { color: #6cc4f3; }
.naglowek { position: sticky; top: 0; z-index: 30; background: rgb(255 255 255 / .97); border-bottom: 1px solid var(--linia); transition: box-shadow .3s; }
.naglowek.przewiniety { box-shadow: 0 12px 30px -20px rgb(20 20 25 / .4); }
.naglowek__w { width: min(100% - 2rem, var(--szer)); margin-inline: auto; display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 1.5rem; min-height: 4.6rem; }
.logo { display: inline-flex; color: #232323; }
.logo svg { width: 200px; height: auto; }
.szukaj-form { display: flex; align-items: center; border: 1.5px solid var(--linia); border-radius: 99px; background: #fff; overflow: hidden; }
.szukaj-form:focus-within { border-color: var(--tusz); }
.szukaj-form input { flex: 1; min-width: 0; border: 0; padding: .6rem 1rem; font: inherit; font-size: .98rem; background: none; outline: none; }
.szukaj-form button { border: 0; background: none; padding: .55rem .9rem; display: grid; place-items: center; }
.szukaj-form button .ik { width: 1.3rem; height: 1.3rem; }
.naglowek__szukaj { justify-self: stretch; max-width: 30rem; width: 100%; margin-left: 1rem; }
.szukaj-form--duzy { max-width: 40rem; margin-top: 1.25rem; border-radius: var(--rog); padding: .25rem; }
.szukaj-form--duzy input { font-size: 1.1rem; }
.szukaj-form--duzy .przycisk { min-height: 2.8rem; border-radius: var(--rog); padding: .6rem 1.2rem; color: #fff; }
.przycisk-szukaj { display: none; padding: .55rem .7rem; border-radius: var(--rog); }
.przycisk-szukaj .ik { width: 1.5rem; height: 1.5rem; }
.naglowek__tel { justify-self: end; display: flex; align-items: center; gap: .6rem; text-decoration: none; line-height: 1.2; }
.naglowek__tel .ik { width: 1.5rem; height: 1.5rem; color: var(--niebieski); }
.naglowek__tel span { display: grid; }
.naglowek__tel small { font-size: .78rem; color: var(--tusz-2); }
.naglowek__akcje { display: flex; align-items: center; gap: .4rem; }
.przycisk-konto, .przycisk-koszyk { position: relative; display: inline-flex; align-items: center; gap: .45rem; padding: .55rem .7rem; border-radius: var(--rog); text-decoration: none; font-weight: 550; font-size: .98rem; }
.przycisk-konto:hover, .przycisk-koszyk:hover { background: var(--szary); }
.przycisk-konto .ik, .przycisk-koszyk .ik { width: 1.5rem; height: 1.5rem; }
.przycisk-koszyk__licznik { position: absolute; top: .15rem; left: 1.55rem; min-width: 1.25rem; height: 1.25rem; padding: 0 .3rem; border-radius: 1rem; background: var(--czerwony); color: #fff; font-size: .72rem; font-weight: 700; line-height: 1.25rem; text-align: center; }
.przycisk-koszyk__licznik.podskok { animation: podskok .5s var(--wyjazd); }
@keyframes podskok { 30% { transform: scale(1.45); } }
.przycisk-menu { display: none; border: 0; background: none; padding: .5rem; border-radius: var(--rog); }
.przycisk-menu .ik { width: 1.65rem; height: 1.65rem; }
.menu { border-top: 1px solid var(--linia); }
.menu__w { width: min(100% - 2rem, var(--szer)); margin-inline: auto; display: flex; justify-content: space-between; align-items: center; }
.menu a { font-size: 1.09rem; font-weight: 550; text-decoration: none; padding: .8rem 0; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.menu a:hover { border-color: var(--tusz); }
.menu .menu__promo { display: inline-flex; align-items: center; gap: .35rem; padding: .35rem .85rem; margin: .4rem 0; border: 0; border-radius: 99px; background: var(--czerwony); color: #fff; }
.menu .menu__promo:hover { background: #b51818; }

/* ---------- sekcje ---------- */
.sekcja { padding-block: clamp(3.5rem, 2rem + 4vw, 6.5rem); }
.naglowek-sekcji { text-align: center; font-size: clamp(2rem, 1.4rem + 2vw, 3.05rem); margin-bottom: .55em; }
.sekcja__opis { text-align: center; color: var(--tusz-2); max-width: 54ch; margin: -.5rem auto 2.75rem; }
.sekcja__wiecej { text-align: center; margin: 2.75rem 0 0; }
.proza { max-width: 70ch; }
.proza h2 { font-size: clamp(1.8rem, 1.4rem + 1.3vw, 2.5rem); margin: 1.6em 0 .6em; }
.proza h2:first-child { margin-top: 0; }
.proza h3 { font-size: 1.45rem; margin: 1.4em 0 .5em; }
.proza ul { padding-left: 1.2rem; }
.proza p { font-size: 1.18rem; }

/* ---------- hero ---------- */
.hero { background: linear-gradient(180deg, var(--szary) 0, var(--szary) 100%); overflow: hidden; }
.hero__w { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; padding-block: clamp(3rem, 2rem + 4vw, 5.5rem); }
.hero h1 { font-size: clamp(2.4rem, 1.5rem + 2.8vw, 4.1rem); line-height: 1.04; margin-bottom: .5em; }
.hero__lead { font-size: 1.25rem; color: var(--tusz-2); max-width: 46ch; }
.hero__przyciski { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.hero__zalety { list-style: none; padding: 0; margin: 2rem 0 0; display: flex; flex-wrap: wrap; gap: .6rem 1.75rem; font-size: .98rem; }
.hero__zalety li { display: flex; align-items: center; gap: .45rem; }
.hero__zalety .ik { color: var(--niebieski); width: 1.3rem; height: 1.3rem; }
.hero__stol { position: relative; aspect-ratio: 1 / .92; }
.hero__okladka { position: absolute; width: 58%; display: block; box-shadow: var(--cien-okladki); transition: transform .8s var(--wyjazd); }
.hero__okladka img { width: 100%; aspect-ratio: 330 / 422; object-fit: cover; }
.hero__okladka--a { left: 0; top: 8%; transform: rotate(-4deg); z-index: 1; }
.hero__okladka--b { right: 0; top: 0; transform: rotate(3deg); }
.hero__okladka--a:hover { transform: rotate(-2deg) translateY(-6px); z-index: 3; }
.hero__okladka--b:hover { transform: rotate(1deg) translateY(-6px); z-index: 3; }
.hero__plakietka { position: absolute; z-index: 4; right: 2%; bottom: 0; margin: 0; display: inline-flex; align-items: center; gap: .5rem; background: #fff; padding: .6rem 1rem; border-radius: 99px; font-size: .95rem; font-weight: 600; box-shadow: var(--cien); }
.hero__plakietka .ik { color: var(--niebieski); }

/* ---------- liczby ---------- */
.pas-liczb { margin-top: clamp(2.5rem, 5vw, 4rem); }
.liczby { list-style: none; margin: 0; padding: 2.25rem 0; display: grid; grid-template-columns: repeat(4, 1fr); border-block: 1px solid var(--linia); }
.liczby li { text-align: center; padding: 0 1rem; display: grid; gap: .4rem; align-content: start; }
.liczby li + li { border-left: 1px solid var(--linia); }
.liczby strong { font-family: var(--naglowki); font-weight: 780; font-stretch: 87.5%; font-size: clamp(2.1rem, 1.5rem + 2vw, 3.2rem); line-height: 1; font-variant-numeric: tabular-nums; }
.liczby span { font-size: 1rem; color: var(--tusz-2); }

/* ---------- znaczki ---------- */
.znaczki { display: flex; flex-wrap: wrap; gap: .35rem; }
.znaczek { display: inline-block; background: var(--tusz); color: #fff; font-size: .75rem; font-weight: 650; padding: .28rem .55rem; border-radius: 3px; }
.znaczek--promo { background: var(--czerwony); }
.znaczek--brak { background: #fff; color: var(--tusz-2); border: 1px solid var(--linia); }
.opcja--brak { opacity: .55; cursor: not-allowed; }
.znaczek--tytul { background: var(--niebieski-tlo); color: #0a5a86; }

/* ---------- kafle ---------- */
.siatka { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.5rem 1.25rem; }
.kafel { position: relative; display: flex; flex-direction: column; min-width: 0; }
.kafel__foto { display: flex; align-items: center; justify-content: center; overflow: hidden; aspect-ratio: 1; background: var(--szary); border-radius: var(--rog); margin-bottom: 1rem; padding: 9%; }
.kafel__foto img { width: auto; height: auto; max-width: 100%; max-height: 100%; box-shadow: var(--cien-okladki); transition: transform .9s var(--wyjazd); }
.kafel:hover .kafel__foto img { transform: translateY(-5px) scale(1.04); }
.kafel .znaczki { position: absolute; top: .7rem; left: .7rem; }
.kafel__tytul { margin: 0 0 .25rem; font-size: .85rem; color: var(--tusz-2); }
.kafel__nazwa { font-size: 1.3rem; margin-bottom: .35rem; }
.kafel__nazwa a { text-decoration: none; }
.kafel__nazwa a::after { content: ''; position: absolute; inset: 0; }
.kafel__opis { font-size: .95rem; color: var(--tusz-2); line-height: 1.45; margin: 0 0 .75rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kafel__dol { margin-top: auto; display: flex; justify-content: space-between; align-items: flex-end; gap: .75rem; }
.kafel__dol .cena { flex-direction: column; flex-wrap: nowrap; align-items: flex-start; gap: .1rem; }
.kafel__dol .cena__odn { font-size: .82rem; }
.kafel__dodaj { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: .35rem; border: 1.5px solid var(--tusz); border-radius: var(--rog); background: #fff; padding: .45rem .7rem; font-size: .88rem; font-weight: 600; text-decoration: none; white-space: nowrap; transition: background .2s, color .2s; }
.kafel__dodaj:hover { background: var(--tusz); color: #fff; }
.kafel__dodaj.dodano { background: var(--zielony); border-color: var(--zielony); color: #fff; }

/* ---------- nowe numery ---------- */
.nowe__siatka { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.numer { display: grid; grid-template-columns: minmax(0, .62fr) minmax(0, 1fr); grid-template-areas: 'okl tresc' 'pak pak'; gap: clamp(1.25rem, 3vw, 2.5rem); padding: clamp(1.5rem, 3vw, 2.5rem); border-radius: 10px; }
.numer--mplus { background: var(--mplus); }
.numer--ewp { background: var(--ewp); }
.numer__okladka { grid-area: okl; align-self: start; display: block; box-shadow: var(--cien-okladki); transform: rotate(-2deg); transition: transform .8s var(--wyjazd); }
.numer__okladka:hover { transform: rotate(0) translateY(-4px); }
.numer__tresc { grid-area: tresc; min-width: 0; }
.numer__dol { grid-area: pak; }

.numer__tytul { margin: 0 0 .35rem; font-size: .95rem; font-weight: 600; color: #3d4a2b; }
.numer--ewp .numer__tytul { color: #1f4c3b; }
.numer h3 { font-size: clamp(1.6rem, 1.3rem + 1vw, 2.1rem); margin-bottom: .5rem; }
.numer h3 a { text-decoration: none; }
.numer h3 a:hover { text-decoration: underline; }
.numer__opis { color: var(--tusz-2); font-size: 1rem; }
.numer__kup { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: .6rem; }
.numer__kup .cena__teraz { font-size: 1.5rem; }
.numer__pak { margin: 1rem 0 .5rem; font-size: .92rem; font-weight: 600; }
.numer__pakiety { list-style: none; padding: 0; margin: 0; display: grid; gap: .4rem; }
.npak { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .3rem .75rem; align-items: center; background: rgb(255 255 255 / .7); border-radius: var(--rog); padding: .55rem .55rem .55rem .85rem; }
.npak__nazwa { grid-column: 1 / -1; display: grid; line-height: 1.3; font-size: .95rem; }
.npak .wcena { justify-items: start; grid-auto-flow: column; align-items: baseline; gap: .6rem; }
.npak__dodaj { grid-column: 2; grid-row: 2; }
.npak__nazwa span { font-size: .8rem; color: var(--tusz-2); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.npak__dodaj { background: #fff; border: 1.5px solid var(--tusz); width: 2.3rem; height: 2.3rem; }
.npak__dodaj:hover { background: var(--tusz); color: #fff; }
.npak__dodaj.dodano { background: var(--zielony); border-color: var(--zielony); color: #fff; }
.nowe__promo { margin: 1.5rem auto 0; max-width: 60ch; font-size: 1.02rem; text-align: center; }
.nowe__promo .ik { color: var(--czerwony); width: 1.3rem; height: 1.3rem; margin-right: .4rem; }

/* ---------- prenumeraty ---------- */
.prenumeraty { background: var(--szary); }
.zakladki { display: flex; justify-content: center; gap: .5rem; margin-bottom: 2rem; }
.zakladki button { display: grid; justify-items: center; border: 1.5px solid var(--linia); background: #fff; border-radius: 99px; padding: .65rem 1.4rem; font-weight: 650; font-size: 1.02rem; line-height: 1.2; }
.zakladki button span { font-size: .78rem; font-weight: 400; color: var(--tusz-2); }
.zakladki button[aria-selected="true"] { background: var(--tusz); border-color: var(--tusz); color: #fff; }
.zakladki button[aria-selected="true"] span { color: #cfcfd5; }
.pkarty { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; align-items: stretch; }
.js .pkarty[hidden] { display: none; }
.pkarta { position: relative; min-width: 0; display: flex; flex-direction: column; background: #fff; border-radius: 10px; padding: 1.25rem; border: 1.5px solid transparent; }
.pkarta--wyr { border-color: var(--tusz); }
.pkarta__wst { position: absolute; top: -.8rem; left: 50%; transform: translateX(-50%); margin: 0; background: var(--tusz); color: #fff; font-size: .78rem; font-weight: 650; padding: .25rem .7rem; border-radius: 99px; white-space: nowrap; }
.pkarta__foto { display: block; overflow: hidden; aspect-ratio: 330 / 422; border-radius: var(--rog); margin-bottom: 1rem; background: var(--szary); }
.pkarta__foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--wyjazd); }
.pkarta:hover .pkarta__foto img { transform: scale(1.05); }
.pkarta h3 { font-size: 1.3rem; margin-bottom: .35rem; }
.pkarta h3 a { text-decoration: none; }
.pkarta__opis { font-size: .95rem; color: var(--tusz-2); margin-bottom: .9rem; }
.pkarta .cena { margin-top: auto; margin-bottom: 1rem; }
.pkarta .cena__teraz { font-size: 1.4rem; }
.oba { margin-top: 1.25rem; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1.25rem; align-items: center; background: #fff; border-radius: 10px; padding: .9rem 1.5rem .9rem .9rem; text-decoration: none; transition: box-shadow .3s; }
.oba:hover { box-shadow: var(--cien); }
.oba__foto img { width: 4.5rem; aspect-ratio: 330 / 422; object-fit: cover; border-radius: 4px; }
.oba__tekst { display: grid; }
.oba__tekst strong { font-family: var(--naglowki); font-stretch: 87.5%; font-weight: 750; font-size: 1.3rem; }
.oba__tekst span { color: var(--tusz-2); font-size: .95rem; }
.oba__cena { display: flex; align-items: center; gap: .6rem; font-weight: 700; font-size: 1.2rem; white-space: nowrap; }
.oba__cena .ik { transition: transform .3s var(--wyjazd); }
.oba:hover .oba__cena .ik { transform: translateX(4px); }

/* ---------- Marketer+ PRO ---------- */
.pro { background: var(--ciemny); color: #fff; padding-block: clamp(3.5rem, 2rem + 4vw, 6rem); }
.pro__w { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.pro__foto { border-radius: 10px; overflow: hidden; }
.pro__foto img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 20%; }
.pro h2 { font-size: clamp(2rem, 1.4rem + 1.9vw, 3rem); margin-bottom: .55em; }
.pro__lead { color: var(--ciemny-tekst); font-size: 1.15rem; max-width: 52ch; }
.pro__cechy { list-style: none; padding: 0; margin: 2rem 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem 2rem; }
.pro__cechy li { display: grid; grid-template-columns: auto 1fr; gap: .9rem; }
.pro__cechy .ik { width: 1.6rem; height: 1.6rem; color: #6cc4f3; margin-top: .1rem; }
.pro__cechy strong { display: block; margin-bottom: .2rem; }
.pro__cechy p { margin: 0; font-size: .95rem; color: var(--ciemny-tekst); line-height: 1.5; }
.pro__plany { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.plan { display: grid; gap: .3rem; align-content: start; padding: 1rem 1.1rem; border: 1px solid #3a3a42; border-radius: 10px; text-decoration: none; transition: border-color .3s, background .3s; }
.plan:hover { border-color: #fff; }
.plan--wyr { background: var(--ciemny-2); border-color: #6cc4f3; }
.plan__okres { font-family: var(--naglowki); font-stretch: 87.5%; font-weight: 750; font-size: 1.25rem; }
.plan .pcena { justify-items: start; }
.plan .pcena__teraz { font-size: 1.3rem; color: #fff; }
.plan .pcena--promo .pcena__teraz { color: #ff8a80; }
.plan .pcena__odn { color: var(--ciemny-tekst); white-space: normal; }
.plan__mies { font-size: .85rem; color: #6cc4f3; }

/* ---------- książka i planer ---------- */
.duet__w { display: grid; grid-template-columns: 1fr 1fr; gap: 0 clamp(1.5rem, 3vw, 2.5rem); }
.duet__w { border-block: 1px solid var(--linia); }
.duet__el { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1fr); gap: 1.75rem; align-items: center; padding: clamp(1.5rem, 3vw, 2.5rem) 0; }
.duet__el + .duet__el { border-left: 1px solid var(--linia); padding-left: clamp(1.5rem, 3vw, 2.5rem); }
.duet__foto { display: block; }
.duet__foto img { box-shadow: var(--cien-okladki); transition: transform .9s var(--wyjazd); }
.duet__foto:hover img { transform: translateY(-5px); }
.duet h2 { font-size: clamp(1.45rem, 1.2rem + .8vw, 1.9rem); margin-bottom: .6rem; }
.duet p { color: var(--tusz-2); font-size: 1rem; }
.duet__ceny { list-style: none; padding: 0; margin: 0; display: grid; gap: .3rem; }
.duet__ceny li { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: .45rem 0; border-bottom: 1px solid var(--linia); }
.duet__ceny a { font-weight: 600; }
.duet__plannery { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.duet__mini { display: grid; gap: .4rem; text-decoration: none; font-size: .88rem; color: var(--tusz-2); text-align: center; }
.duet__mini img { border-radius: var(--rog); box-shadow: var(--cien); transition: transform .9s var(--wyjazd); }
.duet__mini:hover img { transform: translateY(-4px); }
.duet__kup { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.duet__kup .cena__teraz { font-size: 1.4rem; }

/* ---------- archiwum ---------- */
.archiwum { border-top: 1px solid var(--linia); }
.archiwum__w { display: grid; grid-template-columns: minmax(0, 22rem) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.archiwum h2 { font-size: clamp(2rem, 1.4rem + 1.8vw, 2.9rem); margin-bottom: .55em; }
.archiwum__tekst p { color: var(--tusz-2); }
.archiwum__linki { display: flex; flex-wrap: wrap; gap: .5rem; }
.archiwum__mozaika { display: flex; justify-content: center; padding: 1rem 0 2rem; }
.archiwum__el { flex: 0 0 auto; width: clamp(110px, 13vw, 170px); margin-left: clamp(-60px, -4vw, -32px); box-shadow: var(--cien-okladki); transition: transform .6s var(--wyjazd); }
.archiwum__el:first-child { margin-left: 0; }
.archiwum__el:nth-child(odd) { transform: rotate(-3deg) translateY(10px); }
.archiwum__el:nth-child(even) { transform: rotate(2deg); }
.archiwum__el:hover { transform: translateY(-16px) rotate(0); z-index: 2; }
.archiwum__el img { width: 100%; aspect-ratio: 330 / 422; object-fit: cover; }

/* ---------- seo ---------- */
.seo { border-top: 1px solid var(--linia); }
.seo__w { margin-inline: auto; }
.seo h2 { font-size: clamp(1.6rem, 1.3rem + 1vw, 2.2rem); }
.seo p { font-size: 1.05rem; color: var(--tusz-2); }
.seo__wiecej summary { list-style: none; display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; font-weight: 650; border-bottom: 1.5px solid; padding-bottom: .2rem; margin-bottom: 2rem; }
.seo__wiecej summary::-webkit-details-marker { display: none; }
.seo__wiecej[open] summary { display: none; }

/* ---------- karta: hero ---------- */
.okruszki { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; font-size: .88rem; color: var(--tusz-2); padding-block: 1.1rem; }
.okruszki .ik { width: .8em; }
.okruszki a { text-decoration: none; }
.okruszki a:hover { text-decoration: underline; }
.karta-hero { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); grid-template-areas: 'galeria tytul' 'galeria zakup'; grid-template-rows: auto 1fr; column-gap: clamp(2rem, 4vw, 4.5rem); padding-bottom: 4rem; }
.karta-hero > * { min-width: 0; }
.karta-hero__tytul { grid-area: tytul; margin-bottom: 1.5rem; }
.karta-hero h1 { font-size: clamp(1.9rem, 1.4rem + 1.6vw, 2.7rem); line-height: 1.08; margin: .8rem 0 .7rem; }
.karta-hero__lead { color: var(--tusz-2); font-size: 1.1rem; margin: 0; }
.galeria { grid-area: galeria; align-self: start; position: sticky; top: 9.5rem; display: grid; place-items: center; background: var(--szary); border-radius: 10px; padding: clamp(1.5rem, 5vw, 4.5rem); }
.galeria__el { display: block; padding: 0; border: 0; background: none; cursor: zoom-in; box-shadow: var(--cien-okladki); max-width: 460px; }
.galeria__el img { width: 100%; transition: transform .9s var(--wyjazd); }
.galeria__el:hover img { transform: scale(1.02); }

.zakup { grid-area: zakup; }
.zakup__cena { padding-bottom: 1.1rem; margin-bottom: 1.1rem; border-bottom: 1px solid var(--linia); }
.zakup__cena .cena__teraz { font-family: var(--naglowki); font-stretch: 87.5%; font-weight: 780; font-size: 2.3rem; line-height: 1; }
.zakup__cena .cena__proc { font-size: .9rem; }
.zakup__cena .cena__odn { font-size: 1rem; }
.zakup__cechy { list-style: none; padding: 0; margin: 0 0 1.4rem; display: grid; gap: .5rem; font-size: 1rem; }
.zakup__cechy li { display: flex; gap: .7rem; align-items: center; }
.zakup__cechy .ik { width: 1.3rem; height: 1.3rem; color: var(--niebieski); }

.wybor { border: 0; padding: 0; margin: 0 0 1.35rem; min-width: 0; }
.wybor legend { font-weight: 650; font-size: 1rem; margin-bottom: .65rem; padding: 0; }
.wybor legend strong { font-weight: 450; color: var(--tusz-2); }
.opcja { position: relative; cursor: pointer; border: 1.5px solid var(--linia); border-radius: var(--rog); background: #fff; transition: border-color .2s, background .2s; }
.opcja:hover { border-color: #a9a9b0; }
.opcja:has(input:checked) { border-color: var(--tusz); background: var(--szary); }
.opcja:has(input:focus-visible) { outline: 2px solid var(--niebieski); outline-offset: 2px; }
.opcja input { position: absolute; opacity: 0; pointer-events: none; }
.wybor__start { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.opcja--start { display: grid; grid-template-columns: auto 1fr; gap: .7rem; align-items: center; padding: .55rem .7rem; }
.opcja__foto { display: grid; place-items: center; width: 2.4rem; aspect-ratio: 330 / 422; background: var(--szary-2); border-radius: 3px; overflow: hidden; }
.opcja__foto img { width: 100%; height: 100%; object-fit: cover; }
.opcja__tekst { display: grid; line-height: 1.25; font-size: .95rem; }
.opcja__tekst span { font-size: .82rem; color: var(--tusz-2); }
.wybor__osoby { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.opcja--osoby { display: grid; justify-items: center; gap: .15rem; padding: .7rem .4rem; text-align: center; font-size: .95rem; }
.opcja--osoby .ik { width: 1.5rem; height: 1.5rem; }
.opcja--osoby span { font-size: .85rem; color: var(--tusz-2); font-variant-numeric: tabular-nums; }
.wybor__ksiazki { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .45rem; }
.opcja--ksiazka { display: grid; gap: .35rem; padding: .45rem .35rem .5rem; text-align: center; }
.opcja__okladka { display: grid; place-items: center; aspect-ratio: 93 / 130; }
.opcja__okladka img { max-height: 100%; width: auto; }
.opcja__nazwa { font-size: .72rem; line-height: 1.2; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.wybor__wiecej { display: inline-flex; align-items: center; gap: .3rem; margin-top: .55rem; font-size: .88rem; }
.wybor--wersje { display: grid; gap: .45rem; }
.wersja { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .75rem; align-items: center; padding: .75rem .9rem; border: 1.5px solid var(--linia); border-radius: var(--rog); cursor: pointer; transition: border-color .2s, background .2s; }
.wersja:hover { border-color: #a9a9b0; }
.wersja:has(input:checked) { border-color: var(--tusz); background: var(--szary); }
.wersja input { margin: 0; width: 1.1rem; height: 1.1rem; }
.wersja__tekst { display: grid; line-height: 1.3; }
.wersja__tekst > span { font-size: .84rem; color: var(--tusz-2); }
.wersja__tekst .wersja__zysk { color: var(--zielony); font-weight: 600; }

.dobierz { border: 0; padding: 0; margin: 0 0 1.25rem; display: grid; gap: .45rem; }
.dobierz legend { font-weight: 650; font-size: 1rem; margin-bottom: .65rem; padding: 0; }
.dob { display: grid; grid-template-columns: auto auto 1fr auto; align-items: center; gap: .8rem; padding: .6rem .85rem; border: 1.5px solid var(--linia); border-radius: var(--rog); cursor: pointer; transition: border-color .2s, background .2s; }
.dob:hover { border-color: #a9a9b0; }
.dob:has(input:checked) { border-color: var(--tusz); background: var(--szary); }
.dob input { width: 1.1rem; height: 1.1rem; margin: 0; }
.dob__foto { width: 2.6rem; aspect-ratio: 330 / 422; overflow: hidden; border-radius: 3px; background: var(--szary); }
.dob__foto img { width: 100%; height: 100%; object-fit: cover; }
.dob__tekst { display: grid; line-height: 1.3; font-size: .95rem; }
.dob__tekst span { color: var(--tusz-2); font-size: .82rem; }
.dob__cena { font-weight: 650; font-size: .95rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.zakup__razem { display: flex; justify-content: space-between; align-items: baseline; font-size: 1rem; margin-bottom: .8rem; }
.zakup__razem strong { font-size: 1.3rem; font-variant-numeric: tabular-nums; }
.zakup__kup { display: grid; grid-template-columns: auto 1fr; gap: .6rem; }
.ilosc { display: flex; border: 1.5px solid var(--tusz); border-radius: var(--rog); }
.ilosc button { width: 2.6rem; border: 0; background: none; display: grid; place-items: center; }
.ilosc button:hover { background: var(--szary); }
.ilosc input { width: 2.4rem; border: 0; text-align: center; font: inherit; background: none; -moz-appearance: textfield; }
.ilosc input::-webkit-inner-spin-button, .ilosc input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.zakup__teraz { display: block; text-align: center; width: 100%; margin-top: .55rem; padding: .7rem; border: 0; background: none; font-weight: 600; font-size: .95rem; text-decoration: underline; text-underline-offset: .25em; }
.zakup__teraz .ik { color: var(--czerwony); margin-right: .4rem; }
.zakup__dostawa { list-style: none; padding: 0; margin: 1.1rem 0 0; display: grid; border: 1px solid var(--linia); border-radius: var(--rog); font-size: .95rem; }
.zakup__dostawa li { display: flex; gap: .75rem; align-items: flex-start; padding: .8rem 1rem; }
.zakup__dostawa li + li { border-top: 1px solid var(--linia); }
.zakup__dostawa .ik { width: 1.3rem; height: 1.3rem; margin-top: .15rem; color: var(--niebieski); }

/* ---------- spis sekcji ---------- */
.spis { position: sticky; top: 7.6rem; z-index: 20; background: #fff; border-block: 1px solid var(--linia); }
.spis__w { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 3.5rem; gap: 1rem; }
.spis__linki { position: relative; display: flex; gap: 2rem; overflow-x: auto; scrollbar-width: none; }
.spis__linki a { white-space: nowrap; font-size: 1.05rem; font-weight: 550; text-decoration: none; padding: 1rem 0; border-bottom: 2px solid transparent; }
.spis__linki a.aktywny, .spis__linki a:hover { border-color: var(--tusz); }
.spis__produkt { display: flex; align-items: center; gap: .7rem; opacity: 0; transition: opacity .3s; font-weight: 600; font-size: .95rem; line-height: 1.25; }
.spis__produkt img { width: 2.2rem; height: auto; box-shadow: var(--cien); }
.spis__kup { justify-self: end; opacity: 0; pointer-events: none; transition: opacity .3s; }
.spis.pokaz .spis__produkt, .spis.pokaz .spis__kup { opacity: 1; pointer-events: auto; }

/* ---------- karta: prenumerata ---------- */
.proza--wstep { margin-inline: auto; text-align: center; }
.proza--wstep p { font-size: 1.25rem; }
.dostajesz { list-style: none; padding: 0; margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; max-width: 1100px; }
.dostajesz li { display: grid; grid-template-columns: auto 1fr; gap: .9rem; padding: 1.25rem; background: var(--szary); border-radius: 10px; }
.dostajesz .ik { width: 1.75rem; height: 1.75rem; color: var(--niebieski); }
.dostajesz p { margin: 0; font-size: 1.05rem; line-height: 1.5; }
.uwaga { max-width: 1100px; margin: 1.25rem auto 0; display: flex; gap: .7rem; align-items: flex-start; padding: 1rem 1.25rem; background: var(--czerwony-tlo); border-radius: 10px; font-size: 1.02rem; }
.uwaga .ik { color: var(--czerwony); width: 1.4rem; height: 1.4rem; margin-top: .1rem; }
.ksiazki { background: var(--szary); }
.ksiazki__siatka { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1.25rem; }
.ksiazka { display: flex; flex-direction: column; align-items: center; text-align: center; }
.ksiazka__okladka { display: grid; place-items: end center; aspect-ratio: 3 / 4; width: 100%; margin-bottom: 1rem; }
.ksiazka__okladka img { width: auto; height: 82%; max-width: 100%; filter: drop-shadow(0 16px 16px rgb(20 20 25 / .28)); transition: transform .8s var(--wyjazd); }
/* packshoty ze sklepu mają własne białe tło z podpisem */
.ksiazki__siatka--packshot .ksiazka__okladka img { height: auto; width: 100%; filter: none; box-shadow: var(--cien); border-radius: var(--rog); }
.ksiazka:hover .ksiazka__okladka img { transform: translateY(-6px); }
.ksiazka h3 { font-size: 1.1rem; margin-bottom: .3rem; }
.ksiazka p { font-size: .9rem; color: var(--tusz-2); margin-bottom: .9rem; }
.ksiazka .przycisk { margin-top: auto; }
.dlaczego { background: var(--ciemny); color: #fff; }
.dlaczego__w { display: grid; grid-template-columns: minmax(0, 22rem) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.dlaczego h2 { font-size: clamp(2rem, 1.4rem + 1.9vw, 3rem); margin-bottom: 2rem; }
.dlaczego__okladka { width: 78%; transform: rotate(-3deg); box-shadow: 0 30px 50px -20px #050507; }
.dlaczego__lista { list-style: none; counter-reset: d; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1.6rem 2.25rem; }
.dlaczego__lista li { position: relative; padding-top: 1.1rem; border-top: 1px solid #3a3a42; font-size: 1.08rem; color: var(--ciemny-tekst); line-height: 1.5; }
.dlaczego__lista strong { color: #fff; }
.porownanie__ramka { position: relative; overflow-x: auto; border-radius: 10px; border: 1px solid var(--linia); }
.porownanie table { width: 100%; border-collapse: collapse; min-width: 760px; }
.porownanie th, .porownanie td { padding: 1rem; text-align: center; border-bottom: 1px solid var(--linia); }
.porownanie thead th { vertical-align: bottom; font-weight: 400; }
.porownanie thead a { display: block; font-family: var(--naglowki); font-stretch: 87.5%; font-weight: 750; font-size: 1.15rem; text-decoration: none; margin-bottom: .35rem; }
.porownanie thead a:hover { text-decoration: underline; }
.porownanie .pcena { justify-items: center; }
.porownanie tbody th { text-align: left; font-weight: 500; }
.porownanie tbody tr:last-child > * { border-bottom: 0; }
.porownanie td .ik { width: 1.4rem; height: 1.4rem; color: var(--zielony); }
.porownanie__nie { color: #a3a3aa; }
.porownanie .wyrozniona { background: var(--szary); }
.porownanie__ta { display: inline-block; margin-bottom: .5rem; font-size: .75rem; font-weight: 650; background: var(--tusz); color: #fff; padding: .2rem .55rem; border-radius: 99px; }

/* ---------- karta: numer ---------- */
.fakty { list-style: none; padding: 0; margin: 0 auto 3.5rem; display: grid; grid-template-columns: repeat(4, 1fr); max-width: 1100px; border-block: 1px solid var(--linia); }
.fakty li { display: grid; gap: .3rem; padding: 1.5rem 1rem; text-align: center; }
.fakty li + li { border-left: 1px solid var(--linia); }
.fakty span { font-size: .9rem; color: var(--tusz-2); }
.fakty strong { font-family: var(--naglowki); font-stretch: 87.5%; font-weight: 760; font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem); line-height: 1.1; }
.proza { margin-inline: auto; }
.dowiesz { background: var(--ewp); }
.dowiesz__kolumny { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); max-width: 1180px; margin: 0 auto; }
.dowiesz h3 { font-size: 1.5rem; margin-bottom: 1.1rem; }
.ptaszki { list-style: none; padding: 0 !important; margin: 0; display: grid; gap: .65rem; }
.ptaszki li { position: relative; padding-left: 2rem; font-size: 1.06rem; line-height: 1.45; }
.ptaszki li::before { content: ''; position: absolute; left: .15rem; top: .32em; width: .95rem; height: .5rem; border-left: 2px solid var(--zielony); border-bottom: 2px solid var(--zielony); transform: rotate(-45deg); }
.toc { background: var(--ciemny); color: #fff; }
.toc__w { display: grid; grid-template-columns: minmax(0, 20rem) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.toc__glowa { position: sticky; top: 12rem; }
.toc h2 { font-size: clamp(1.9rem, 1.4rem + 1.6vw, 2.7rem); margin-bottom: 2rem; }
.toc__okladka { width: 80%; transform: rotate(-3deg); box-shadow: 0 30px 50px -20px #050507; }
.toc__dzial + .toc__dzial { margin-top: 2.75rem; }
.toc__dzial h3 { font-size: 1.05rem; font-weight: 650; font-stretch: 100%; letter-spacing: 0; color: #6cc4f3; padding-bottom: .8rem; border-bottom: 1px solid #3a3a42; }
.toc ol { list-style: none; padding: 0; margin: 0; }
.toc ol li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .4rem 2rem; padding: 1rem 0; border-bottom: 1px solid #2c2c33; }
.toc__tytul { font-size: 1.08rem; line-height: 1.45; }
.toc__tytul strong { color: #6cc4f3; font-weight: 600; }
.toc__autor { font-size: .92rem; color: var(--ciemny-tekst); white-space: nowrap; text-align: right; }
.toc__autorzy { margin-top: 4rem; padding-top: 2.5rem; border-top: 1px solid #3a3a42; text-align: center; }
.toc__autorzy h3 { font-size: 1.5rem; margin-bottom: 1.25rem; }
.toc__autorzy ul { list-style: none; padding: 0; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; max-width: 1000px; }
.toc__autorzy li { padding: .4rem .85rem; border: 1px solid #3a3a42; border-radius: 99px; font-size: .95rem; }
.toc__puenta { margin-top: 3rem; text-align: center; }
.toc__puenta p { font-size: 1.15rem; color: var(--ciemny-tekst); margin: 0 auto; }
.pakiety__siatka { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; max-width: 1100px; margin: 0 auto; }
.pakiet { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 1.5rem; background: var(--szary); border-radius: 10px; }
.pakiet__foto { width: 100%; margin-bottom: 1.1rem; overflow: hidden; border-radius: var(--rog); }
.pakiet__foto img { width: 100%; aspect-ratio: 330 / 422; object-fit: cover; transition: transform .9s var(--wyjazd); }
.pakiet:hover .pakiet__foto img { transform: scale(1.04); }
.pakiet h3 { font-size: 1.4rem; margin-bottom: .35rem; }
.pakiet__sklad { font-size: .95rem; color: var(--tusz-2); }
.pakiet .cena { justify-content: center; margin: auto 0 1rem; }
.pakiet .cena__teraz { font-size: 1.5rem; }
.pakiet .cena__odn { text-align: center; }
.pren-pas { background: var(--szary); }
.pren-pas__w { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.pren-pas h2 { font-size: clamp(1.9rem, 1.4rem + 1.5vw, 2.6rem); margin-bottom: .6em; }
.pren-pas__tekst p { color: var(--tusz-2); }
.pren-pas__lista { display: grid; gap: .6rem; }
.pren { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1rem; align-items: center; background: #fff; border-radius: 10px; padding: .75rem 1.25rem .75rem .75rem; text-decoration: none; transition: box-shadow .3s; }
.pren:hover { box-shadow: var(--cien); }
.pren__foto img { width: 3.6rem; aspect-ratio: 330 / 422; object-fit: cover; border-radius: 3px; }
.pren__tekst { display: grid; line-height: 1.3; }
.pren__tekst strong { font-size: 1.05rem; }
.pren__tekst span { font-size: .88rem; color: var(--tusz-2); }
.pren__cena { display: flex; align-items: center; gap: .5rem; font-weight: 700; white-space: nowrap; }

/* ---------- akordeon, FAQ ---------- */
.akordeon details { border-bottom: 1px solid var(--linia); }
.akordeon summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.15rem 0; cursor: pointer; font-weight: 600; font-size: 1.1rem; }
.akordeon summary::-webkit-details-marker { display: none; }
.akordeon summary .ik { transition: transform .3s var(--wyjazd); }
.akordeon details[open] summary .ik { transform: rotate(180deg); }
.akordeon details > :not(summary) { margin: 0 0 1.4rem; color: var(--tusz-2); font-size: 1.05rem; }
.chipy { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-bottom: 2rem; }
.chip { border: 1.5px solid var(--linia); background: #fff; border-radius: 99px; padding: .55rem 1.15rem; font-size: 1rem; font-weight: 550; }
.chip[aria-pressed="true"] { background: var(--tusz); border-color: var(--tusz); color: #fff; }
.faq__grupa h3 { font-size: 1.5rem; margin: 2rem 0 .3rem; }
.js .faq__grupa h3 { display: none; }
.js .faq__grupa[hidden] { display: none; }
.faq__wiecej { text-align: center; margin: 2rem 0 0; color: var(--tusz-2); }
.podobne { border-top: 1px solid var(--linia); }

/* ---------- paski na telefonie ---------- */
.pasek-kup, .koszyk-pasek { position: fixed; z-index: 25; left: 0; right: 0; bottom: 0; display: none; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem 1rem calc(.7rem + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid var(--linia); box-shadow: 0 -12px 30px -18px rgb(20 20 25 / .4); }
.pasek-kup div, .koszyk-pasek div { display: grid; line-height: 1.25; min-width: 0; }
.pasek-kup span, .koszyk-pasek span { font-size: .85rem; color: var(--tusz-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pasek-kup strong, .koszyk-pasek strong { font-size: 1.25rem; font-variant-numeric: tabular-nums; }

/* ---------- newsletter i stopka ---------- */
.newsletter { position: relative; z-index: 1; margin-bottom: -4rem; padding-top: 2rem; }
.newsletter__w { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; background: #00669c; color: #fff; border-radius: 14px; padding: clamp(1.75rem, 4vw, 3rem); box-shadow: var(--cien); }
.newsletter h2 { font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.5rem); margin-bottom: .5em; }
.newsletter__tekst p { margin: 0; color: #fff; }
.newsletter__etykieta { display: block; font-weight: 600; font-size: .95rem; margin-bottom: .4rem; }
.newsletter__pola { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem; }
.newsletter input[type="email"] { font: inherit; padding: .8rem 1rem; border: 0; border-radius: var(--rog); min-width: 0; }
.newsletter input::placeholder { color: #6b6b73; }
.newsletter .przycisk { border-color: var(--tusz); background: var(--tusz); }
.newsletter__zgoda, .newsletter__nota { margin: .75rem 0 0; font-size: .82rem; line-height: 1.45; color: #fff; }
.newsletter :focus-visible { outline-color: #fff; }
.stopka { background: var(--ciemny); color: var(--ciemny-tekst); font-size: .98rem; padding-top: 4rem; }
.stopka__pas { border-bottom: 1px solid #2c2c33; }
.stopka__pas-w { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; padding-block: 3rem 2.25rem; }
.stopka__logo { color: #fff; width: 220px; height: auto; }
.stopka__tytuly { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; }
.stopka__tytul-kanal { display: flex; align-items: center; gap: .4rem; }
.stopka__tytul-kanal a { display: inline-grid; place-items: center; min-width: 2.3rem; height: 2.3rem; border-radius: 50%; text-decoration: none; color: #fff; }
.stopka__tytul-kanal a:first-child { min-width: 0; border-radius: 0; margin-right: .4rem; font-weight: 650; }
.stopka__tytul-kanal a:not(:first-child):hover { background: #2c2c33; }
.stopka__tytul-kanal .ik { width: 1.3rem; height: 1.3rem; }
.stopka__w { display: grid; grid-template-columns: 1fr 1.9fr 1fr; gap: 2.5rem 3.5rem; padding-block: 3rem; }
.stopka__kol p { font-size: .95rem; line-height: 1.6; }
.stopka__kol a { color: #fff; }
.stopka__naglowek { margin: 0 0 1rem !important; font-family: var(--naglowki); font-stretch: 87.5%; font-weight: 750; font-size: 1.3rem !important; color: #fff; }
.stopka__kontakt { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.stopka__kontakt li { display: flex; gap: .7rem; align-items: flex-start; }
.stopka__kontakt .ik { color: #6cc4f3; width: 1.3rem; height: 1.3rem; margin-top: .15rem; }
.stopka__kontakt span { display: grid; gap: .15rem; }
.stopka__kontakt small { font-size: .85rem; line-height: 1.45; }
.stopka__kol--onas p { columns: 1; }
.stopka__wiecej { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; text-decoration: none; }
.stopka__wiecej:hover { text-decoration: underline; }
.stopka__nav { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 1.75rem; padding-block: 1.5rem; border-top: 1px solid #2c2c33; }
.stopka__nav a { text-decoration: none; color: #fff; font-size: .95rem; }
.stopka__nav a:hover { text-decoration: underline; }
.stopka__dol { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; padding-block: 1.5rem 2rem; border-top: 1px solid #2c2c33; font-size: .88rem; }
.stopka__dol p { margin: 0; }
.stopka__imker { display: inline-flex; align-items: center; gap: .8rem; text-decoration: none; }
.stopka__imker img { width: auto; height: 25px; filter: brightness(0) invert(1); }

/* ---------- zgoda, lightbox, 404, przenosze ---------- */
.zgoda { position: fixed; z-index: 40; left: 1rem; bottom: 1rem; max-width: 26rem; padding: 1.2rem; background: #fff; border-radius: 10px; box-shadow: var(--cien); font-size: .92rem; }
.zgoda__przyciski { display: flex; gap: .5rem; flex-wrap: wrap; }
.lightbox { width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: rgb(15 15 18 / .94); }
.lightbox[open] { display: grid; place-items: center; }
.lightbox img { max-width: 92vw; max-height: 90dvh; width: auto; object-fit: contain; }
.lightbox .ikona-przycisk { position: absolute; color: #fff; background: rgb(255 255 255 / .1); top: 1rem; right: 1rem; }
.blad, .przenosze { text-align: center; min-height: 50vh; }
.blad h1, .przenosze h1 { font-size: clamp(2.2rem, 1.8rem + 2vw, 3.4rem); margin-bottom: .5em; }
.przenosze__ikona .ik { width: 3rem; height: 3rem; animation: podskok 1.2s var(--wyjazd) infinite; }

.komunikat { position: fixed; z-index: 60; left: 50%; bottom: 1.25rem; transform: translateX(-50%); width: min(100% - 2rem, 34rem); margin: 0; padding: .9rem 1.2rem; background: var(--tusz); color: #fff; border-radius: 10px; box-shadow: var(--cien); font-size: .98rem; }
.dprop__low { display: block; font-size: .75rem; font-weight: 400; color: var(--tusz-2); }

/* ---------- strona koszyka ---------- */
.koszyk-ekran { padding-top: clamp(2rem, 1rem + 3vw, 3.5rem); }
.koszyk-ekran h1 { font-size: clamp(2.2rem, 1.6rem + 2vw, 3.2rem); text-align: center; margin-bottom: 2rem; }
.koszyk-strona { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: clamp(1.5rem, 3vw, 3rem); align-items: start; }
.koszyk-strona[hidden] { display: none; }
.koszyk-strona__lewa { min-width: 0; }
.koszyk-lista { display: grid; gap: 1rem; }
.koszyk-lista__glowa { display: flex; justify-content: space-between; align-items: center; gap: 1rem; font-size: .95rem; color: var(--tusz-2); }
.kpoz { display: grid; grid-template-columns: 130px minmax(0, 1fr) auto; gap: 1.5rem; padding: 1.25rem; border: 1px solid var(--linia); border-radius: 10px; background: #fff; transition: border-color .3s; }
.kpoz.nowa { animation: nowa 1.4s var(--wyjazd); }
@keyframes nowa { from { background: var(--zielony-tlo); transform: translateY(-8px); } }
.kpoz__foto { display: flex; align-items: center; justify-content: center; padding: .75rem; background: var(--szary); border-radius: var(--rog); aspect-ratio: 1; }
.kpoz__foto img { max-height: 100%; max-width: 100%; width: auto; height: auto; box-shadow: var(--cien); }
.kpoz__tresc { display: flex; flex-direction: column; min-width: 0; }
.kpoz__nazwa { font-size: 1.4rem; margin-bottom: .35rem; }
.kpoz__nazwa a { text-decoration: none; }
.kpoz__nazwa a:hover { text-decoration: underline; }
.kpoz__opis { color: var(--tusz-2); font-size: .95rem; margin-bottom: .8rem; }
.kpoz__opcje { list-style: none; padding: 0; margin: -.3rem 0 .9rem; display: flex; flex-wrap: wrap; gap: .35rem; }
.kpoz__opcje li { font-size: .82rem; background: var(--szary); padding: .2rem .55rem; border-radius: 3px; }
.kpoz__dol { margin-top: auto; display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.kpoz__cena { margin: 0; font-size: 1.45rem; font-weight: 700; white-space: nowrap; text-align: right; font-variant-numeric: tabular-nums; display: grid; gap: .2rem; align-content: start; }
.kpoz__cena span { font-size: .82rem; font-weight: 400; color: var(--tusz-2); }
.kpoz__cena--promo { color: var(--czerwony); }
.poz__ilosc { display: inline-flex; align-items: center; border: 1.5px solid var(--linia); border-radius: var(--rog); }
.poz__ilosc button { border: 0; background: none; width: 2.3rem; height: 2.3rem; display: grid; place-items: center; }
.poz__ilosc span { min-width: 1.8rem; text-align: center; font-variant-numeric: tabular-nums; }
.poz__usun { border: 0; background: none; color: var(--tusz-2); font-size: .88rem; display: inline-flex; gap: .3rem; align-items: center; text-decoration: underline; text-underline-offset: .2em; }
.koszyk-strona__bok { padding: 1.75rem; background: var(--szary); border-radius: 10px; position: sticky; top: 9.5rem; }
.bok__tytul { font-size: 1.7rem; margin-bottom: 1.1rem; }
.bok__lista { margin: 0 0 1.4rem; display: grid; gap: .6rem; font-variant-numeric: tabular-nums; }
.bok__lista div { display: flex; justify-content: space-between; gap: 1rem; }
.bok__lista dt { color: var(--tusz-2); }
.bok__lista dt small { display: block; font-size: .8rem; }
.bok__lista dd { margin: 0; text-align: right; }
.bok__razem { padding-top: .9rem; margin-top: .3rem; border-top: 1px solid #d6d6d1; }
.bok__razem dt { color: var(--tusz); font-weight: 650; }
.bok__razem dd { font-size: 1.6rem; font-weight: 700; }
.prog { border: 1px solid var(--linia); border-radius: var(--rog); padding: .85rem 1rem; margin-bottom: 1rem; background: #fff; }
.prog__tytul { margin: 0 0 .55rem; font-size: .95rem; display: flex; gap: .5rem; align-items: center; }
.prog__tor { height: 4px; background: var(--szary-2); border-radius: 2px; overflow: hidden; }
.prog__tor span { display: block; height: 100%; background: var(--niebieski); transform-origin: left; transform: scaleX(var(--p, 0)); transition: transform .6s var(--wyjazd); }
.prog--jest { background: var(--zielony-tlo); border-color: #c3e2d2; }
.prog--jest .prog__tytul { color: var(--zielony); margin: 0; }
.bok__zalety { list-style: none; padding: 0; margin: 1.1rem 0 0; display: grid; gap: .55rem; font-size: .95rem; }
.bok__zalety li { display: flex; gap: .65rem; align-items: center; }
.bok__zalety .ik { color: var(--niebieski); }
.bok__nota { margin: 1.1rem 0 0; font-size: .85rem; color: var(--tusz-2); }
.bok__rabat { display: flex; gap: .6rem; align-items: center; margin: 1rem 0 0; font-size: .92rem; background: var(--niebieski-tlo); color: #0a5a86; padding: .7rem .9rem; border-radius: var(--rog); }
.koszyk-sekcja { margin-top: 2.75rem; padding-top: 2.25rem; border-top: 1px solid var(--linia); }
.koszyk-sekcja .naglowek-sekcji { font-size: clamp(1.7rem, 1.4rem + 1vw, 2.2rem); margin-bottom: .4em; }
.koszyk-sekcja .sekcja__opis { margin: 0 auto 1.6rem; }
.kprop-siatka { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 1rem; }
.kprop { text-align: center; display: flex; flex-direction: column; align-items: center; transition: opacity .3s, transform .4s var(--wyjazd); }
.kprop.znika, .dprop.znika { opacity: 0; transform: translateY(12px); }
.kprop__foto { display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 1; padding: 12%; background: var(--szary); border-radius: var(--rog); margin-bottom: .9rem; }
.kprop__foto img { max-height: 100%; max-width: 100%; width: auto; height: auto; box-shadow: var(--cien); transition: transform .9s var(--wyjazd); }
.kprop__foto:hover img { transform: translateY(-4px); }
.kprop__nazwa { font-size: 1.15rem; margin-bottom: .25rem; }
.kprop__nazwa a { text-decoration: none; }
.kprop__opis { font-size: .88rem; color: var(--tusz-2); margin-bottom: .4rem; max-width: 28ch; }
.kprop .cena { justify-content: center; margin-bottom: .9rem; flex-direction: column; flex-wrap: nowrap; align-items: center; }
.kprop .przycisk { margin-top: auto; }
.koszyk-pusty { text-align: center; color: var(--tusz-2); }
.koszyk-pusty > .ik { width: 2.8rem; height: 2.8rem; margin: 0 auto 1rem; display: block; color: var(--tusz); }
.koszyk-pusty .siatka { margin-top: 2.5rem; text-align: left; color: var(--tusz); }
.puls { animation: puls 1.6s var(--wyjazd) 2; }
@keyframes puls { 40% { box-shadow: 0 0 0 6px rgb(0 131 199 / .25); } }

/* ---------- okno „Dodano do koszyka” ---------- */
.dodano { width: min(100% - 2rem, 640px); max-height: min(94dvh, 960px); padding: 0; border: 0; border-radius: 12px; background: #fff; color: var(--tusz); box-shadow: 0 30px 80px -30px rgb(20 20 25 / .55); }
.dodano[open] { display: flex; flex-direction: column; animation: wejscie .45s var(--wyjazd); }
.dodano::backdrop { background: rgb(20 20 25 / .45); backdrop-filter: blur(4px); }
@keyframes wejscie { from { opacity: 0; transform: translateY(18px) scale(.98); } }
html:has(dialog[open]) { overflow: hidden; }
.dodano__glowa { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.5rem .3rem; }
.dodano__tytul { margin: 0; display: flex; align-items: center; gap: .5rem; font-family: var(--naglowki); font-stretch: 87.5%; font-weight: 760; font-size: 1.55rem; }
.dodano__tytul::before { content: ''; width: .55rem; height: .55rem; border-radius: 50%; background: var(--zielony); }
.dodano__zamknij { background: var(--szary); }
.dodano__tresc { overflow-y: auto; padding: .4rem 1.5rem 1rem; overscroll-behavior: contain; scrollbar-width: none; }
.dodano__tresc:focus { outline: none; }
.dodano__produkt { display: grid; grid-template-columns: 64px 1fr; gap: 1rem; align-items: center; }
.dodano__produkt img { width: 64px; box-shadow: var(--cien); }
.dodano__nazwa { margin: 0 0 .3rem; font-weight: 600; line-height: 1.35; }
.dodano__szt { display: inline-block; background: var(--szary-2); font-size: .78rem; font-weight: 650; padding: .05rem .4rem; border-radius: 3px; margin-right: .45rem; }
.dodano__cena { margin: 0; color: var(--tusz-2); font-size: .9rem; }
.dodano__cena strong { color: var(--tusz); font-size: 1.05rem; margin-right: .25rem; }
.dodano__extra { margin: .35rem 0 0; font-size: .85rem; color: var(--tusz-2); }
.dodano__koszyk { margin: 1rem 0 1.1rem; padding: .7rem .9rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: .3rem 1.5rem; font-size: .92rem; background: var(--szary); border-radius: var(--rog); }
.dodano__koszyk div { display: flex; gap: .35rem; }
.dodano__koszyk dt { color: var(--tusz-2); }
.dodano__koszyk dd { margin: 0; }
.belka { font-size: 1.15rem; margin-bottom: .8rem; text-align: center; }
.dprop-siatka { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin-bottom: 1rem; }
.dprop { display: flex; flex-direction: column; text-align: center; transition: opacity .3s, transform .4s var(--wyjazd); }
.dprop__foto { display: flex; align-items: center; justify-content: center; aspect-ratio: 1; padding: 12%; background: var(--szary); border-radius: var(--rog); margin-bottom: .55rem; }
.dprop__foto img { max-height: 100%; max-width: 100%; width: auto; height: auto; box-shadow: var(--cien); }
.dprop__nazwa { font-weight: 600; font-size: .95rem; line-height: 1.3; text-decoration: none; }
.dprop__cena { margin: .3rem 0 .6rem; font-weight: 700; font-size: .95rem; }
.dprop .przycisk { margin-top: auto; padding-inline: .4rem; min-height: 2.4rem; font-size: .85rem; }
.dodano__stopa { padding: .8rem 1.5rem .9rem; border-top: 1px solid var(--linia); }
.dodano__dalej { display: block; width: 100%; margin-top: .25rem; border: 0; background: none; font-weight: 600; font-size: .95rem; padding: .55rem; }
.dodano__dalej:hover { text-decoration: underline; text-underline-offset: .25em; }

/* ---------- kategoria ---------- */
.kat-glowa { padding: .5rem 0 0; }
.kat-glowa h1 { font-size: clamp(2.1rem, 1.5rem + 2vw, 3.3rem); margin-bottom: .45em; max-width: 24ch; }
.kat-glowa__opis { color: var(--tusz-2); max-width: 75ch; margin: 0; }
.kat-glowa__opis p { font-size: 1.08rem; }
.podkategorie { display: flex; gap: 1.75rem; margin-top: 1.75rem; border-bottom: 1px solid var(--linia); overflow-x: auto; scrollbar-width: none; }
.podkategorie a { padding: .75rem 0; border-bottom: 2px solid transparent; margin-bottom: -1px; text-decoration: none; font-weight: 550; font-size: 1.02rem; white-space: nowrap; }
.podkategorie a:hover { border-color: var(--tusz-2); }
.podkategorie a[aria-current] { border-color: var(--tusz); }
.sekcja--lista { padding-top: 1.75rem; }
.lista-narzedzia { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: .75rem; }
.chipy--lewo { justify-content: flex-start; margin: 0; }
.chip span { margin-left: .4rem; font-size: .8rem; color: var(--tusz-2); }
.chip[aria-pressed="true"] span { color: #cfcfd5; }
.sortuj { display: flex; align-items: center; gap: .5rem; font-size: .95rem; color: var(--tusz-2); }
.sortuj select { font: inherit; color: var(--tusz); padding: .5rem 2rem .5rem .75rem; border: 1.5px solid var(--linia); border-radius: var(--rog); background: #fff; }
.lista-licznik { font-size: .92rem; color: var(--tusz-2); margin: 0 0 1.5rem; }
.siatka__el { display: flex; min-width: 0; }
.siatka__el > .kafel { flex: 1; }
.siatka__el[hidden] { display: none; }
.siatka--kategoria .kafel__nazwa { font-size: 1.15rem; }

/* ---------- opis 1:1 ze starego sklepu ---------- */
.proza--opis h2 { font-size: clamp(1.6rem, 1.3rem + 1vw, 2.2rem); }
.proza--opis h3 { font-size: 1.35rem; }
.proza--opis ul, .proza--opis ol { padding-left: 1.3rem; margin: 0 0 1.2em; display: grid; gap: .4rem; }
.proza--opis li { font-size: 1.08rem; line-height: 1.5; }
.proza--opis li > ul { margin: .5rem 0 .2rem; }
.proza--opis li::marker { color: var(--niebieski); }
.proza--opis img { max-width: min(100%, 560px); height: auto; margin: 1.5rem auto; border-radius: var(--rog); }
.proza--opis table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: 1rem; display: block; overflow-x: auto; }
.proza--opis td, .proza--opis th { border: 1px solid var(--linia); padding: .6rem .8rem; text-align: left; vertical-align: top; }
.proza--opis a { color: #0a5a86; }

/* ---------- opcje z szablonu ---------- */
.wybor__siatka { display: grid; grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr)); gap: .5rem; }
.wybor__siatka--lista { grid-template-columns: 1fr; }
.opcja--tekst { display: flex; align-items: center; min-height: 2.9rem; padding: .55rem .85rem; font-size: .95rem; line-height: 1.3; }
.opcja--tekst small { display: block; font-size: .8rem; color: var(--tusz-2); font-variant-numeric: tabular-nums; }
.wybor--tekst { display: grid; gap: .4rem; }
.wybor--tekst label { font-weight: 650; font-size: 1rem; }
.wybor--tekst input, .wybor--tekst textarea { font: inherit; padding: .7rem .85rem; border: 1.5px solid var(--linia); border-radius: var(--rog); background: #fff; }
.wybor--tekst input:focus, .wybor--tekst textarea:focus { border-color: var(--tusz); outline: none; }
.zakup--brak .cena { margin-bottom: 1rem; }
.zakup__niedostepny { display: flex; gap: .6rem; align-items: center; padding: .9rem 1rem; background: var(--szary); border-radius: var(--rog); margin: 0 0 .8rem; }

/* ---------- responsywność ---------- */
@media (max-width: 1180px) {
  .menu a { font-size: .98rem; }
  .siatka, .pkarty { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nowe__siatka, .duet__w { grid-template-columns: 1fr; }
  .duet__el + .duet__el { border-left: 0; padding-left: 0; border-top: 1px solid var(--linia); }
  .ksiazki__siatka { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 2rem; }
  .stopka__w { grid-template-columns: 1fr 1fr; }
  .stopka__kol--onas { grid-column: 1 / -1; order: 3; }
}
@media (max-width: 960px) {
  .naglowek__w { grid-template-columns: 1fr auto; gap: 1rem; min-height: 4rem; }
  .naglowek__tel, .naglowek__szukaj { display: none; }
  .przycisk-szukaj { display: inline-flex; }
  .przycisk-menu { display: block; }
  .menu { position: absolute; top: 100%; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--linia); display: none; }
  .menu.otwarte { display: block; }
  .menu__w { flex-direction: column; align-items: stretch; padding: .25rem 0 1rem; }
  .menu a { font-size: 1.05rem; padding: .85rem 0; border-bottom: 1px solid var(--linia); }
  .menu .menu__promo { align-self: flex-start; margin-top: .9rem; padding: .5rem 1rem; }
  .hero__w { grid-template-columns: 1fr; }
  .hero__stol { max-width: 520px; width: 100%; margin-inline: auto; }
  .karta-hero { grid-template-columns: 1fr; grid-template-areas: 'tytul' 'galeria' 'zakup'; }
  .galeria { position: static; margin-bottom: 1.75rem; }
  .spis { top: 4rem; }
  .spis__w { grid-template-columns: 1fr; }
  .spis__produkt, .spis__kup { display: none; }
  .pro__w, .archiwum__w, .dlaczego__w, .toc__w, .pren-pas__w { grid-template-columns: 1fr; }
  .toc__glowa { position: static; }
  .toc__okladka, .dlaczego__okladka { width: min(60%, 260px); }
  .dostajesz { grid-template-columns: 1fr 1fr; }
  .koszyk-strona { grid-template-columns: 1fr; }
  .koszyk-strona__bok { position: static; }
  .kprop-siatka { grid-template-columns: 1fr 1fr; }
  .newsletter__w { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  body { font-size: 1.0625rem; }
  .pasek-info__w { gap: 1rem; font-size: .8rem; }
  .pasek-info__dalej { display: none !important; }
  .logo svg { width: 156px; }
  .przycisk-koszyk__tekst, .przycisk-konto span { display: none; }
  .hero h1 { font-size: 2.15rem; }
  .hero__lead { font-size: 1.1rem; }
  .hero__przyciski .przycisk { width: 100%; }
  .hero__stol { aspect-ratio: 1 / .95; }
  .liczby { grid-template-columns: 1fr 1fr; row-gap: 1.75rem; }
  .liczby li:nth-child(3) { border-left: 0; }
  .siatka { grid-template-columns: 1fr 1fr; gap: 2rem .75rem; }
  .kafel__nazwa { font-size: 1.1rem; }
  .kafel__opis { font-size: .88rem; }
  .kafel__dol { flex-direction: column; align-items: stretch; gap: .6rem; }
  .kafel__dodaj { justify-content: center; }
  .numer { grid-template-columns: 1fr; grid-template-areas: 'okl' 'tresc' 'pak'; }
  .numer__okladka { width: 62%; margin: 0 auto .5rem; }
  .zakladki button { padding: .55rem .9rem; font-size: .95rem; }
  .pkarty { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: .75rem; padding: 1rem .25rem 1rem; margin-inline: -1rem; padding-inline: 1rem; scrollbar-width: none; }
  .pkarta { flex: 0 0 78%; scroll-snap-align: center; }
  .oba { grid-template-columns: auto minmax(0, 1fr); }
  .oba__cena { grid-column: 2; }
  .pro__cechy { grid-template-columns: 1fr; }
  .pro__plany { grid-template-columns: 1fr; }
  .duet__el { grid-template-columns: 1fr; }
  .duet__foto { width: 60%; margin: 0 auto; }
  .archiwum__el { width: 31vw; margin-left: -18vw; }
  .archiwum__el:nth-child(n+6) { display: none; }
  .wybor__ksiazki { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .opcja__nazwa { font-size: .78rem; }
  .ksiazki__siatka { grid-template-columns: 1fr 1fr; }
  .dostajesz { grid-template-columns: 1fr; }
  .dlaczego__lista { grid-template-columns: 1fr; }
  .fakty { grid-template-columns: 1fr 1fr; }
  .fakty li:nth-child(3) { border-left: 0; }
  .fakty li:nth-child(n+3) { border-top: 1px solid var(--linia); }
  .dowiesz__kolumny, .pakiety__siatka { grid-template-columns: 1fr; }
  .toc ol li { grid-template-columns: 1fr; }
  .toc__autor { text-align: left; white-space: normal; }
  .pren { grid-template-columns: auto minmax(0, 1fr); }
  .pren__cena { grid-column: 2; }
  .wersja { grid-template-columns: auto minmax(0, 1fr); }
  .wersja .wcena { grid-column: 2; justify-items: start; grid-auto-flow: column; align-items: baseline; gap: .6rem; }
  .dob { grid-template-columns: auto auto 1fr; }
  .dob__cena { grid-column: 3; justify-self: start; margin-top: -.5rem; }
  .pasek-kup:not([hidden]), .koszyk-pasek:not([hidden]) { display: flex; }
  .strona-produkt .stopka, .strona-koszyk .stopka { padding-bottom: 5rem; }
  .strona-produkt .zgoda, .strona-koszyk .zgoda { bottom: 5.5rem; }
  .zgoda { left: .75rem; right: .75rem; }
  .newsletter__etykieta { display: block; font-weight: 600; font-size: .95rem; margin-bottom: .4rem; }
.newsletter__pola { grid-template-columns: 1fr; }
  .stopka__w { grid-template-columns: 1fr; }
  .stopka__pas-w { flex-direction: column; align-items: flex-start; }
  .kpoz { grid-template-columns: 96px minmax(0, 1fr); gap: 1rem; padding: 1rem; }
  .kpoz__cena { grid-column: 2; text-align: left; font-size: 1.25rem; }
  .kpoz__nazwa { font-size: 1.2rem; }
  .dodano { width: 100%; max-height: 94dvh; margin-bottom: 0; border-radius: 14px 14px 0 0; }
  .dodano__glowa, .dodano__tresc, .dodano__stopa { padding-inline: 1rem; }
  .dprop-siatka { gap: .5rem; }
  .dprop__nazwa { font-size: .85rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
/* „E-commerce” bez łamania: span nie może przejąć stylów innych span w kontenerze */
.nowrap { all: unset !important; white-space: nowrap !important; }