/* Ciekawiej: kolory z okładki (morze, magenta) i tęczy z oka w logo, kroje Outfit i Newsreader hostowane lokalnie. */

@font-face { font-family: 'Outfit'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(/assets/fonts/outfit-latin-ext-wght-normal.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, 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: 'Outfit'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(/assets/fonts/outfit-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+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Newsreader'; font-style: normal; font-weight: 200 800; font-display: swap; src: url(/assets/fonts/newsreader-latin-ext-wght-normal.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, 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: 'Newsreader'; font-style: normal; font-weight: 200 800; font-display: swap; src: url(/assets/fonts/newsreader-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+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Newsreader'; font-style: italic; font-weight: 200 800; font-display: swap; src: url(/assets/fonts/newsreader-latin-ext-wght-italic.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, 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: 'Newsreader'; font-style: italic; font-weight: 200 800; font-display: swap; src: url(/assets/fonts/newsreader-latin-wght-italic.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --tusz: #14161b;
  --tusz-2: #1f232b;
  --tekst: #1d2027;
  --tekst-2: #4f5663;
  --linia: #dbe4e9;
  --mgla: #eaf3f7;
  --mgla-2: #d9ebf2;
  --morze: #00a8e4;
  --morze-ciemne: #006f99;
  --magenta: #f02484;
  --magenta-ciemna: #c4126a;
  --zielony: #0d6e4f;
  --tecza: linear-gradient(90deg, #d3c823 0%, #eb8609 22%, #e14194 50%, #832e83 74%, #0f93c3 100%);
  --kroj: 'Outfit', ui-sans-serif, system-ui, sans-serif;
  --kroj-proza: 'Newsreader', Georgia, 'Times New Roman', serif;
  --r: 18px;
  --r-maly: 10px;
  --gutter: clamp(16px, 4vw, 40px);
  --wys-naglowka: 76px;
  --cien: 0 1px 2px rgba(20, 40, 55, .06), 0 8px 24px -10px rgba(20, 40, 55, .18);
  --cien-duzy: 0 24px 60px -20px rgba(10, 30, 45, .45);
  --wyjscie: cubic-bezier(.16, 1, .3, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--wys-naglowka) + 64px); }
body { margin: 0; background: #fff; color: var(--tekst); font-family: var(--kroj); font-size: 1.125rem; line-height: 1.55; -webkit-font-smoothing: antialiased; overflow-x: clip; }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3, p, ul, ol, figure, blockquote, dl, dd { margin: 0; }
h1, h2, h3 { font-family: var(--kroj); font-weight: 750; letter-spacing: -.02em; line-height: 1.05; color: var(--tusz); text-wrap: balance; }
h2 { font-size: clamp(1.9rem, 1.4rem + 1.8vw, 2.9rem); }
h3 { font-size: 1.3rem; line-height: 1.2; }
p { text-wrap: pretty; }
a { color: var(--morze-ciemne); text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { color: var(--tusz); }
button { font: inherit; color: inherit; cursor: pointer; }
strong { font-weight: 650; }
::selection { background: var(--magenta); color: #fff; }
:focus-visible { outline: 3px solid var(--morze); outline-offset: 3px; border-radius: 4px; }
.ik { width: 1.15em; height: 1.15em; flex: none; fill: currentColor; vertical-align: -.18em; }
[hidden] { display: none !important; }

.w { width: min(1240px, 100% - 2 * var(--gutter)); margin-inline: auto; }
.w-waska { width: min(860px, 100% - 2 * var(--gutter)); margin-inline: auto; }
.pomin { position: absolute; left: -9999px; top: 8px; z-index: 100; background: var(--tusz); color: #fff; padding: 10px 16px; border-radius: var(--r-maly); }
.pomin:focus { left: 8px; }
.srodek { text-align: center; }
.nobr { white-space: nowrap; }

/* ---------- przyciski ---------- */

.przycisk { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 24px; border: 2px solid var(--tusz); border-radius: 999px; background: var(--tusz); color: #fff; font-family: var(--kroj); font-weight: 600; font-size: 1.04rem; text-decoration: none; white-space: nowrap; transition: background .25s, color .25s, border-color .25s, transform .25s var(--wyjscie); }
.przycisk:hover { background: var(--morze-ciemne); border-color: var(--morze-ciemne); color: #fff; }
.przycisk:active { transform: scale(.97); }
.przycisk .ik { width: 1.2em; height: 1.2em; }
.przycisk--duzy { min-height: 58px; padding: 0 30px; font-size: 1.1rem; }
.przycisk--maly { min-height: 42px; padding: 0 18px; font-size: .98rem; gap: 8px; }
.przycisk--obrys { background: transparent; color: var(--tusz); }
.przycisk--obrys:hover { background: var(--tusz); border-color: var(--tusz); color: #fff; }
.przycisk--jasny { background: #fff; border-color: #fff; color: var(--tusz); }
.przycisk--jasny:hover { background: var(--mgla); border-color: var(--mgla); color: var(--tusz); }
.przycisk--granat { background: var(--tusz); }
.przycisk--pelny { width: 100%; }
.przycisk--dodano, .przycisk--dodano:hover { background: var(--zielony); border-color: var(--zielony); color: #fff; }
.link-strzalka { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--tusz); text-decoration: none; border-bottom: 2px solid var(--magenta); padding-bottom: 2px; }
.link-strzalka:hover .ik { transform: translateX(4px); }
.link-strzalka .ik { transition: transform .3s var(--wyjscie); }

/* ---------- cena, znaczek ---------- */

.cena { display: flex; align-items: baseline; gap: 10px; margin: 0; font-variant-numeric: tabular-nums; }
.cena__stara { color: var(--tekst-2); font-size: 1.02rem; text-decoration-color: var(--magenta); text-decoration-thickness: 2px; }
.cena__teraz { font-weight: 700; font-size: 1.3rem; color: var(--tusz); }
.cena--duza .cena__teraz { font-size: 2.2rem; letter-spacing: -.02em; }
.cena--duza .cena__stara { font-size: 1.2rem; }
.znaczek { position: absolute; top: 14px; left: 14px; background: var(--magenta-ciemna); color: #fff; font-weight: 650; font-size: .9rem; padding: 4px 12px; border-radius: 999px; }

/* ---------- nagłówek ---------- */

.naglowek { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, .96); transition: box-shadow .3s; }
.naglowek::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--tecza); }
.naglowek.przewiniety { box-shadow: 0 10px 30px -18px rgba(10, 30, 45, .45); }
.naglowek__w { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; width: min(1320px, 100% - 2 * var(--gutter)); margin-inline: auto; padding-block: 14px 17px; }
.logo { justify-self: start; display: block; }
.logo img { width: 196px; }
.menu { display: flex; gap: 4px; }
.menu a { position: relative; padding: 8px 14px; color: var(--tusz); text-decoration: none; font-weight: 550; font-size: 1.04rem; border-radius: 999px; }
.menu a:hover { background: var(--mgla); }
.menu a[aria-current="page"] { background: var(--tusz); color: #fff; }
.naglowek__akcje { justify-self: end; display: flex; align-items: center; gap: 10px; }
.przycisk-koszyk { position: relative; display: inline-flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 18px; border: 2px solid var(--linia); border-radius: 999px; color: var(--tusz); text-decoration: none; font-weight: 600; }
.przycisk-koszyk:hover { border-color: var(--tusz); color: var(--tusz); }
.przycisk-koszyk .ik { width: 1.35em; height: 1.35em; }
.przycisk-koszyk__suma { font-variant-numeric: tabular-nums; }
.przycisk-koszyk__licznik { position: absolute; top: -8px; right: -8px; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 999px; background: var(--magenta-ciemna); color: #fff; font-size: .8rem; font-weight: 700; display: grid; place-items: center; }
.przycisk-menu { display: none; width: 48px; height: 46px; border: 2px solid var(--linia); border-radius: 999px; background: #fff; place-items: center; }
.przycisk-menu__kreski { display: grid; gap: 4px; width: 20px; }
.przycisk-menu__kreski span { display: block; height: 2px; background: var(--tusz); border-radius: 2px; transition: transform .3s var(--wyjscie), opacity .2s; }
.menu-otwarte .przycisk-menu__kreski span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.menu-otwarte .przycisk-menu__kreski span:nth-child(2) { opacity: 0; }
.menu-otwarte .przycisk-menu__kreski span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ---------- sekcje ---------- */

.sekcja { padding-block: clamp(56px, 7vw, 96px); }
.sekcja--mgla { background: var(--mgla); }
.sekcja--bez-gory { padding-top: 0; }
.naglowek-sekcji { text-align: center; max-width: 760px; margin: 0 auto clamp(28px, 4vw, 44px); }
.sekcja__opis { margin-top: 14px; color: var(--tekst-2); font-size: 1.15rem; }
.naglowek-sekcji--jasny h2 { color: #fff; }
.naglowek-sekcji--jasny .sekcja__opis { color: rgba(255, 255, 255, .78); }
.wiecej { text-align: center; margin-top: 32px; }
.okruszki { display: flex; flex-wrap: wrap; gap: 8px; font-size: .95rem; color: var(--tekst-2); margin-bottom: 18px; }
.okruszki a { color: var(--tekst-2); text-decoration: none; }
.okruszki a:hover { color: var(--tusz); text-decoration: underline; }
.okruszki [aria-current] { color: var(--tusz); }
.naglowek-strony { padding-block: clamp(32px, 4.5vw, 60px) clamp(28px, 3.5vw, 44px); text-align: center; }
.naglowek-strony .okruszki { justify-content: center; }
.naglowek-strony h1 { font-size: clamp(2.6rem, 1.8rem + 3vw, 4.4rem); letter-spacing: -.03em; }
.naglowek-strony__opis { max-width: 680px; margin: 16px auto 0; color: var(--tekst-2); font-size: 1.2rem; }

/* ---------- hero główna ---------- */

.hero { padding-block: clamp(28px, 4vw, 56px) clamp(48px, 6vw, 80px); }
.hero__w { display: grid; grid-template-columns: 1.08fr .92fr; gap: clamp(32px, 5vw, 80px); align-items: center; }
.hero h1 { font-size: clamp(3rem, 1.8rem + 5vw, 6rem); font-weight: 800; letter-spacing: -.04em; line-height: .92; }
.hero__glos { margin-top: 28px; color: var(--tekst-2); font-size: 1.12rem; }
.negocjacje { list-style: none; padding: 0; margin: 10px 0 0; display: flex; flex-wrap: wrap; gap: 4px 22px; font-family: var(--kroj-proza); font-style: italic; font-size: clamp(1.45rem, 1.2rem + .9vw, 2rem); color: var(--tusz); }
.negocjacje s { text-decoration: none; background: linear-gradient(var(--magenta), var(--magenta)) no-repeat 0 56% / 100% 3px; }
.hero__opis { margin-top: 24px; max-width: 34em; font-size: 1.2rem; }
.hero__przyciski { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.hero__foto { position: relative; justify-self: end; width: 100%; max-width: 500px; }
.hero__foto img { width: 100%; aspect-ratio: 596 / 860; object-fit: cover; border-radius: 26px; }
.plakietka { position: absolute; left: 16px; right: 16px; bottom: 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #fff; border-radius: 999px; padding: 8px 8px 8px 22px; box-shadow: var(--cien); font-weight: 550; }
.plakietka a { display: inline-flex; align-items: center; gap: 8px; background: var(--tusz); color: #fff; text-decoration: none; padding: 10px 16px; border-radius: 999px; white-space: nowrap; }
.plakietka a:hover { background: var(--morze-ciemne); color: #fff; }

/* Jedyny autorski ruch strony: kreski przez „negocjacje” rysują się po kolei. */
@media (prefers-reduced-motion: no-preference) {
  .negocjacje s { animation: skresl .7s var(--wyjscie) both; }
  .negocjacje li:nth-child(1) s { animation-delay: .45s; }
  .negocjacje li:nth-child(2) s { animation-delay: .8s; }
  .negocjacje li:nth-child(3) s { animation-delay: 1.15s; }
  @keyframes skresl { from { background-size: 0 3px; } to { background-size: 100% 3px; } }
}

/* ---------- manifest ---------- */

.manifest { padding-top: clamp(24px, 3vw, 40px); }
.manifest__w { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(32px, 6vw, 96px); align-items: start; }
.manifest__haslo { position: sticky; top: calc(var(--wys-naglowka) + 32px); font-size: clamp(2.2rem, 1.5rem + 2.6vw, 3.6rem); letter-spacing: -.035em; }
.manifest__haslo span { display: block; }
.manifest__haslo small { display: block; margin-top: 18px; font-size: 1.25rem; font-weight: 400; letter-spacing: 0; line-height: 1.4; }
.manifest__lista { list-style: none; padding: 0; font-family: var(--kroj-proza); font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem); line-height: 1.45; }
.manifest__lista li { padding: 22px 0; border-top: 1px solid var(--linia); }
.manifest__lista li:first-child { border-top: 0; padding-top: 0; }
.manifest__lista strong { font-weight: 650; }

/* ---------- wersje: kafle formatów i pakiety ---------- */

.formaty { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 2vw, 24px); }
.format { display: flex; flex-direction: column; background: #fff; border-radius: var(--r); padding: 12px 12px 20px; box-shadow: var(--cien); }
.format__foto { position: relative; display: block; aspect-ratio: 1; overflow: hidden; border-radius: 12px; background: var(--mgla-2); }
.format__foto img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; transition: transform .6s var(--wyjscie); }
.format:hover .format__foto img { transform: scale(1.06); }
.format__ikony { display: flex; align-items: center; gap: 8px; margin: 18px 8px 4px; color: var(--morze-ciemne); font-weight: 600; font-size: .98rem; }
.format__ikony .ik { width: 1.35em; height: 1.35em; }
.format__nazwa { margin: 0 8px; font-size: 1.55rem; }
.format__nazwa a { color: inherit; text-decoration: none; }
.format__nazwa a::after { content: ''; }
.format__nazwa a:hover { text-decoration: underline; text-decoration-color: var(--magenta); text-decoration-thickness: 2px; }
.format__czas { display: flex; align-items: center; gap: 6px; margin: 6px 8px 18px; color: var(--tekst-2); font-size: 1rem; }
.format__dol { margin: auto 8px 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.sekcja:not(.sekcja--mgla) .format { box-shadow: none; border: 1.5px solid var(--linia); }

.pakiety { margin-top: clamp(20px, 3vw, 32px); display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pakiety__tytul { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; gap: 10px; font-weight: 650; font-size: 1.15rem; margin-bottom: 4px; }
.pakiety__tytul .ik { color: var(--magenta); width: 1.4em; height: 1.4em; }
.pakiet { display: grid; grid-template-columns: 112px 1fr; gap: 6px 18px; align-items: center; background: #fff; border-radius: var(--r); padding: 12px; border: 2px solid transparent; transition: border-color .25s; }
.sekcja:not(.sekcja--mgla) .pakiet { border-color: var(--linia); }
.pakiet:hover { border-color: var(--tusz); }
.pakiet__foto { grid-row: span 2; display: block; aspect-ratio: 1; border-radius: 12px; overflow: hidden; background: var(--mgla-2); }
.pakiet__foto img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; }
.pakiet__nazwa { font-size: 1.25rem; }
.pakiet__nazwa a { color: inherit; text-decoration: none; }
.pakiet__srodek p { font-size: .98rem; color: var(--tekst-2); margin-top: 4px; }
.pakiet__prawo { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
.pakiet__zysk { font-size: .92rem; font-weight: 600; color: var(--magenta-ciemna); }
.pakiet__prawo .przycisk { margin-left: auto; }

.indziej { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px 18px; margin-top: 32px; color: var(--tekst-2); }
.indziej a { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; color: var(--tusz); }

/* ---------- oś 30 dni ---------- */

.os { background: var(--tusz); color: #fff; position: relative; overflow: hidden; }
.os__dni { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(30, 1fr); gap: 4px; margin-bottom: 28px; }
.dzien { position: relative; height: 54px; border-left: 1px solid rgba(255, 255, 255, .18); }
.dzien span { position: absolute; left: 6px; bottom: 0; font-size: .8rem; color: rgba(255, 255, 255, .5); font-variant-numeric: tabular-nums; }
.dzien--glos { border-left: 4px solid var(--kolor); }
.dzien--glos span { color: #fff; font-weight: 700; font-size: .95rem; }
.os__glosy { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; counter-reset: glos; }
.glos { background: var(--tusz-2); border-radius: var(--r); padding: 22px 24px 24px; border: 1px solid rgba(255, 255, 255, .07); }
.glos__dzien::before { content: ''; display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--kolor); margin-right: 8px; }
.glos__dzien { display: inline-flex; align-items: center; font-weight: 700; font-size: 1rem; color: var(--tusz); background: #fff; border-radius: 999px; padding: 3px 12px; margin-bottom: 14px; }
.glos blockquote p { font-family: var(--kroj-proza); font-style: italic; font-size: 1.22rem; line-height: 1.45; color: rgba(255, 255, 255, .92); }
.os__dalej { text-align: center; margin-top: 36px; }

/* ---------- rozmowy ---------- */

.rozmowy { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(20px, 2.4vw, 32px) clamp(16px, 2vw, 24px); }
.rozmowy--glowna { grid-template-columns: repeat(4, 1fr); }
.rozmowa__film { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; padding: 0; border: 0; border-radius: 14px; overflow: hidden; background: var(--tusz); }
.rozmowa__film img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--wyjscie), opacity .3s; opacity: .92; }
.rozmowa__film:hover img { transform: scale(1.06); opacity: 1; }
.rozmowa__play { position: absolute; left: 14px; bottom: 14px; width: 52px; height: 52px; border-radius: 50%; background: #fff; color: var(--tusz); display: grid; place-items: center; box-shadow: 0 6px 20px -6px rgba(0, 0, 0, .5); transition: transform .3s var(--wyjscie); }
.rozmowa__film:hover .rozmowa__play { transform: scale(1.1); }
.rozmowa__play .ik { width: 22px; height: 22px; margin-left: 3px; }
.rozmowa__film--audio { display: grid; place-content: center; justify-items: center; gap: 8px; color: #fff; text-decoration: none; background: var(--tusz-2) linear-gradient(135deg, rgba(0, 168, 228, .35), rgba(240, 36, 132, .3)); font-weight: 600; }
.rozmowa__film--audio .ik { width: 44px; height: 44px; }
.rozmowa__film--audio:hover { color: #fff; }
.rozmowa__podpis { margin-top: 14px; font-size: 1.14rem; font-weight: 600; line-height: 1.3; letter-spacing: -.01em; }
.rozmowa__zrodlo { margin-top: 6px; color: var(--tekst-2); font-size: .95rem; line-height: 1.4; }
.wideo { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: var(--tusz); }
.wideo iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- autorka (główna) i o mnie ---------- */

.autorka { padding-top: 0; }
.autorka__w { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(32px, 6vw, 88px); align-items: center; background: var(--mgla); border-radius: 28px; padding: clamp(20px, 3vw, 40px); }
.autorka__foto img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 30%; border-radius: 20px; }
.autorka__tekst h2 { margin-bottom: 20px; }
.autorka__tekst > p { margin-bottom: 14px; max-width: 36em; }
.proza-duza { font-family: var(--kroj-proza); font-size: clamp(1.35rem, 1.2rem + .6vw, 1.7rem); line-height: 1.4; color: var(--tusz); }
.autorka__cytat { margin: 24px 0 28px; padding: 18px 22px; background: #fff; border-radius: var(--r); }
.autorka__cytat p { font-family: var(--kroj-proza); font-style: italic; font-size: 1.25rem; }
.autorka__cytat footer { margin-top: 6px; font-size: .95rem; color: var(--tekst-2); }

.omnie { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(32px, 6vw, 88px); align-items: start; }
.omnie__foto { position: sticky; top: calc(var(--wys-naglowka) + 24px); }
.omnie__foto img { width: 100%; border-radius: 24px; }
.omnie__linki { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 12px; }

/* ---------- proza ---------- */

.proza { font-family: var(--kroj-proza); font-size: 1.24rem; line-height: 1.6; }
.proza > * + * { margin-top: 1em; }
.proza h2 { font-family: var(--kroj); font-size: clamp(1.7rem, 1.4rem + 1vw, 2.2rem); margin-top: 1.6em; margin-bottom: .2em; }
.proza h2:first-child { margin-top: 0; }
.proza ul, .proza ol { padding-left: 1.3em; }
.proza li + li { margin-top: .4em; }
.proza--ksiazka > h2 { text-align: center; margin-bottom: .6em; }
.proza__wybicie { font-family: var(--kroj); font-size: clamp(1.5rem, 1.2rem + 1.1vw, 2.1rem); font-weight: 600; letter-spacing: -.02em; line-height: 1.2; color: var(--tusz); text-align: center; padding: 28px 0; margin-block: 1.4em !important; border-block: 1px solid var(--linia); }
.proza__wybicie strong { font-weight: 750; }
.proza__wybicie--gora { font-family: var(--kroj-proza); font-style: italic; font-weight: 400; font-size: 1.45rem; border: 0; padding: 0; margin-top: 0 !important; }
.czytelnicy { background: var(--mgla); border-radius: var(--r); padding: 24px 28px; }
.czytelnicy ul { list-style: none; padding: 0; margin-top: 10px; display: grid; gap: 8px; }
.czytelnicy li { font-style: italic; font-size: 1.32rem; padding-left: 26px; position: relative; }
.czytelnicy li::before { content: ''; position: absolute; left: 0; top: .55em; width: 12px; height: 12px; border-radius: 50%; background: var(--magenta); }

/* ---------- książka: hero, środek, parametry ---------- */

.ks-hero { background: var(--mgla); padding-block: clamp(24px, 3vw, 44px) clamp(40px, 5vw, 72px); }
.ks-hero__w { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 72px); align-items: center; }
.ks-hero h1 { font-size: clamp(2.6rem, 1.6rem + 3.6vw, 4.8rem); font-weight: 800; letter-spacing: -.035em; line-height: .95; }
.ks-hero__autor { margin-top: 14px; font-size: 1.25rem; font-weight: 550; color: var(--morze-ciemne); }
.ks-hero__foto img { width: 100%; border-radius: 24px; }
.ks-hero__wersje { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 30px; }
.ks-hero__wersje a { display: grid; gap: 2px; justify-items: start; padding: 14px 16px; background: #fff; border-radius: var(--r); color: var(--tusz); text-decoration: none; border: 2px solid transparent; transition: border-color .25s, transform .25s var(--wyjscie); }
.ks-hero__wersje a:hover { border-color: var(--tusz); transform: translateY(-2px); }
.ks-hero__wersje .ik { width: 1.6em; height: 1.6em; color: var(--morze-ciemne); margin-bottom: 6px; }
.ks-hero__wersje strong { font-size: 1.15rem; font-variant-numeric: tabular-nums; }

.w-srodku { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
.w-srodku__lewa h2 { margin-bottom: 22px; }
.w-srodku__foto { width: 100%; border-radius: var(--r); margin-top: 24px; }
.ptaszki { list-style: none; padding: 0; display: grid; gap: 4px; }
.ptaszki li { display: grid; grid-template-columns: 34px 1fr; gap: 14px; align-items: start; padding: 14px 0; border-bottom: 1px solid rgba(20, 22, 27, .1); font-size: 1.1rem; }
.ptaszki li:last-child { border-bottom: 0; }
.ptaszki .ik { width: 34px; height: 34px; padding: 7px; border-radius: 50%; background: var(--tusz); color: #fff; }
.parametry { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.parametry div { background: #fff; border-radius: var(--r-maly); padding: 12px 16px; }
.parametry dt { font-size: .9rem; color: var(--tekst-2); }
.parametry dd { font-weight: 650; font-size: 1.08rem; color: var(--tusz); }
.parametry--karta { margin-top: 24px; grid-template-columns: repeat(3, 1fr); }
.parametry--karta div { background: var(--mgla); }

/* ---------- opinie ---------- */

.opinie { columns: 3 300px; column-gap: 18px; }
.opinia { break-inside: avoid; margin: 0 0 18px; background: #fff; border-radius: var(--r); padding: 24px 26px; }
.sekcja:not(.sekcja--mgla) .opinia { background: var(--mgla); }
.opinia p { font-family: var(--kroj-proza); font-size: 1.15rem; line-height: 1.55; }
.opinia p + p { margin-top: .7em; }
.opinia footer { margin-top: 12px; font-weight: 650; font-size: .98rem; color: var(--tusz); }
.opinia footer::before { content: '- '; }

/* ---------- grupa, kontakt, pas grupy ---------- */

.grupa { display: grid; grid-template-columns: 1.2fr .8fr; gap: 20px; }
.grupa__karta, .grupa__bez-fb { border-radius: 24px; padding: clamp(24px, 4vw, 48px); }
.grupa__karta { background: var(--mgla); text-align: center; display: grid; justify-items: center; gap: 16px; }
.grupa__karta p { max-width: 30em; font-size: 1.2rem; }
.grupa__oko { width: 160px; mix-blend-mode: multiply; }
.grupa__bez-fb { border: 2px solid var(--linia); display: grid; align-content: center; gap: 16px; }
.grupa__bez-fb h2, .grupa__karta h2 { font-size: clamp(1.6rem, 1.3rem + 1vw, 2.2rem); }
.grupa__bez-fb .przycisk { justify-self: start; white-space: normal; text-align: left; }

.kontakt { display: grid; grid-template-columns: 1.1fr .9fr; gap: 20px; }
.kontakt__glowny { background: var(--tusz); color: #fff; border-radius: 24px; padding: clamp(28px, 4vw, 56px); display: grid; gap: 16px; align-content: start; }
.kontakt__glowny h2 { color: #fff; }
.kontakt__mail { font-size: clamp(1.6rem, 1.1rem + 2vw, 2.6rem); font-weight: 700; color: #fff; letter-spacing: -.02em; overflow-wrap: anywhere; text-decoration-color: var(--magenta); text-decoration-thickness: 3px; }
.kontakt__mail:hover { color: var(--mgla-2); }
.kontakt__nota { font-size: .95rem; color: rgba(255, 255, 255, .72); }
.kontakt__nota a { color: #fff; }
.kontakt__bok { border: 2px solid var(--linia); border-radius: 24px; padding: clamp(24px, 3vw, 40px); display: grid; gap: 14px; align-content: start; }
.kontakt__bok h2 { font-size: 1.5rem; }
.kontakt__bok h2:not(:first-child) { margin-top: 12px; }
.kanaly { display: flex; flex-wrap: wrap; gap: 10px; }
.kanaly a { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; background: var(--mgla); color: var(--tusz); text-decoration: none; font-weight: 600; }
.kanaly a:hover { background: var(--tusz); color: #fff; }
.kanaly .ik { width: 1.3em; height: 1.3em; }

.zalety { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.zalety li { display: flex; gap: 14px; align-items: flex-start; background: #fff; border-radius: var(--r); padding: 20px; }
.zalety .ik { width: 40px; height: 40px; padding: 9px; border-radius: 50%; background: var(--tusz); color: #fff; }
.zalety strong { display: block; font-size: 1.08rem; color: var(--tusz); }
.zalety span { display: block; font-size: .96rem; color: var(--tekst-2); margin-top: 2px; }

.pas-grupy { padding: clamp(28px, 4vw, 48px) 0; background: var(--tecza); }
.pas-grupy__w { display: flex; align-items: center; justify-content: space-between; gap: 24px 40px; background: var(--tusz); color: #fff; border-radius: 26px; padding: clamp(24px, 3.5vw, 44px) clamp(24px, 4vw, 56px); }
.pas-grupy h2 { color: #fff; font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.5rem); }
.pas-grupy p { margin-top: 10px; color: rgba(255, 255, 255, .8); max-width: 38em; }
.pas-grupy .przycisk { flex: none; }

/* ---------- stopka ---------- */

.stopka { background: var(--tusz); color: rgba(255, 255, 255, .8); padding-top: clamp(44px, 5vw, 64px); font-size: 1rem; }
.stopka a { color: #fff; text-decoration: none; }
.stopka a:hover { text-decoration: underline; color: #fff; }
.stopka__gora { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 32px; padding-bottom: 32px; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.stopka__logo img { width: 210px; }
.stopka__haslo { font-family: var(--kroj-proza); font-style: italic; font-size: 1.4rem; color: #fff; flex: 1; }
.kanaly--stopka a { width: 46px; height: 46px; padding: 0; justify-content: center; background: rgba(255, 255, 255, .08); color: #fff; }
.kanaly--stopka a:hover { background: #fff; color: var(--tusz); text-decoration: none; }
.stopka__srodek { display: grid; grid-template-columns: 1.3fr 1fr 1.2fr 1.2fr; gap: 32px; padding-block: 36px; }
.stopka__zalety { list-style: none; padding: 0; display: grid; gap: 14px; align-content: start; }
.stopka__zalety li { display: flex; align-items: center; gap: 12px; color: #fff; font-weight: 550; }
.stopka__zalety .ik { width: 36px; height: 36px; padding: 8px; border-radius: 50%; background: rgba(255, 255, 255, .1); }
.stopka nav, .stopka__kontakt { display: grid; gap: 8px; align-content: start; }
.stopka nav p, .stopka__kontakt p { font-weight: 700; color: #fff; font-size: 1.05rem; margin-bottom: 4px; }
.stopka__zgody { background: none; border: 0; padding: 0; text-align: left; color: rgba(255, 255, 255, .8); }
.stopka__zgody:hover { color: #fff; text-decoration: underline; }
.stopka__mail { font-size: 1.15rem; font-weight: 600; }
.stopka__dol { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; padding-block: 20px 28px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: .92rem; }
.stopka__imker { display: inline-flex; align-items: center; gap: 12px; color: rgba(255, 255, 255, .7) !important; }
.stopka__imker img { width: 71px; }

/* ---------- karta produktu ---------- */

.p-hero { padding-block: clamp(20px, 3vw, 36px) clamp(40px, 5vw, 64px); }
.p-hero__w { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(28px, 4.5vw, 64px); align-items: start; }
.p-hero__w > * { min-width: 0; }
.p-hero__lewa { position: sticky; top: calc(var(--wys-naglowka) + 20px); }
.p-galeria__glowne { display: block; border-radius: 22px; overflow: hidden; background: var(--mgla-2); }
.p-galeria__glowne img { width: 100%; aspect-ratio: 1; object-fit: cover; mix-blend-mode: multiply; }
.p-galeria__miniatury { display: flex; gap: 10px; margin-top: 10px; overflow-x: auto; scrollbar-width: thin; }
.p-galeria__miniatury a { flex: 0 0 88px; aspect-ratio: 1; border-radius: 12px; overflow: hidden; background: var(--mgla-2); }
.p-galeria__miniatury img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; transition: transform .4s var(--wyjscie); }
.p-galeria__miniatury a:hover img { transform: scale(1.08); }
.p-kup__typ { position: relative; display: flex; align-items: center; gap: 8px; color: var(--morze-ciemne); font-weight: 600; }
.p-kup__typ .ik { width: 1.35em; height: 1.35em; }
.p-kup__typ .znaczek { position: static; margin-left: 6px; }
.p-kup__nazwa { margin-top: 10px; font-size: clamp(1.9rem, 1.4rem + 1.6vw, 2.8rem); letter-spacing: -.03em; }
.p-kup__autor { margin-top: 8px; font-weight: 550; font-size: 1.12rem; }
.p-kup__lead { margin-top: 14px; font-family: var(--kroj-proza); font-size: 1.25rem; line-height: 1.5; }
.wersje { margin-top: 24px; }
.wersje__tytul { font-weight: 650; margin-bottom: 10px; }
.wersje__lista { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.wersje__lista--pakiety { grid-template-columns: 1fr 1fr; margin-top: 8px; }
.wersje__lista a { display: grid; gap: 2px; padding: 12px 14px; border: 2px solid var(--linia); border-radius: 14px; color: var(--tusz); text-decoration: none; transition: border-color .2s; }
.wersje__lista a:hover { border-color: var(--tekst-2); }
.wersje__lista a[aria-current] { border-color: var(--tusz); background: var(--mgla); }
.wersja__ikony { display: flex; gap: 4px; color: var(--morze-ciemne); }
.wersja__ikony .ik { width: 1.3em; height: 1.3em; }
.wersja__nazwa { font-weight: 600; line-height: 1.25; }
.wersja__cena { font-size: .98rem; color: var(--tekst-2); font-variant-numeric: tabular-nums; }
.wersja__cena s { margin-right: 6px; text-decoration-color: var(--magenta); }
.p-kup__cena { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; margin-top: 26px; }
.p-kup__zysk { background: var(--magenta-ciemna); color: #fff; font-weight: 650; font-size: .95rem; padding: 5px 12px; border-radius: 999px; }
.p-kup__omnibus { margin-top: 6px; font-size: .9rem; color: var(--tekst-2); }
.dobierz { margin: 22px 0 0; padding: 0; border: 0; display: grid; gap: 8px; }
.dobierz legend { font-weight: 650; margin-bottom: 10px; padding: 0; }
.dobierz__poz { display: grid; grid-template-columns: auto 56px 1fr auto; gap: 12px; align-items: center; padding: 10px 14px 10px 12px; border: 2px solid var(--linia); border-radius: 14px; cursor: pointer; transition: border-color .2s, background .2s; }
.dobierz__poz:hover { border-color: var(--tekst-2); }
.dobierz__poz:has(input:checked) { border-color: var(--tusz); background: var(--mgla); }
.dobierz__poz input { width: 22px; height: 22px; accent-color: var(--tusz); }
.dobierz__foto { width: 56px; height: 56px; border-radius: 10px; overflow: hidden; background: var(--mgla-2); }
.dobierz__foto img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; }
.dobierz__opis strong { display: block; line-height: 1.2; }
.dobierz__opis small { color: var(--magenta-ciemna); font-weight: 600; font-size: .9rem; }
.dobierz__cena { font-weight: 650; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dobierz__cena s { color: var(--tekst-2); font-weight: 400; font-size: .9rem; margin-right: 4px; }
.p-kup__przyciski { display: grid; grid-template-columns: 1.3fr 1fr; gap: 10px; margin-top: 22px; }
.p-kup__info { list-style: none; padding: 0; margin-top: 20px; display: grid; gap: 8px; font-size: 1.02rem; }
.p-kup__info li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.p-kup__info .ik { color: var(--morze-ciemne); width: 1.3em; height: 1.3em; }
.p-kup__info span { color: var(--tekst-2); }
.p-kup__spam { margin-top: 14px; padding: 12px 16px; border-radius: var(--r-maly); background: var(--mgla); font-size: .96rem; }

.spis { position: sticky; top: var(--wys-naglowka); z-index: 40; background: #fff; border-block: 1px solid var(--linia); }
.spis__w { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; min-height: 64px; }
.spis__produkt { display: flex; align-items: center; gap: 10px; font-weight: 600; opacity: 0; transition: opacity .3s; }
.spis__produkt img { width: 44px; height: 44px; object-fit: cover; border-radius: 8px; }
.spis__linki { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.spis__linki a { padding: 8px 15px; border-radius: 999px; color: var(--tekst-2); text-decoration: none; font-weight: 550; font-size: 1.04rem; white-space: nowrap; }
.spis__linki a:hover { color: var(--tusz); background: var(--mgla); }
.spis__linki a.aktywny { background: var(--tusz); color: #fff; }
.spis__kup { justify-self: end; opacity: 0; pointer-events: none; transition: opacity .3s; }
.spis.pokaz-kup .spis__produkt, .spis.pokaz-kup .spis__kup { opacity: 1; pointer-events: auto; }

.sklad { list-style: none; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 20px; }
.sklad a { display: grid; grid-template-columns: 88px 1fr; gap: 14px; align-items: center; padding: 10px; border: 2px solid var(--linia); border-radius: 14px; color: var(--tusz); text-decoration: none; }
.sklad a:hover { border-color: var(--tusz); }
.sklad img { width: 88px; height: 88px; object-fit: cover; border-radius: 10px; }
.sklad strong { display: block; }
.sklad span { color: var(--tekst-2); font-size: .98rem; }

.pytania { display: grid; gap: 10px; margin-top: 24px; }
.pytanie { background: #fff; border-radius: var(--r); }
.pytanie summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 22px; font-weight: 600; font-size: 1.12rem; cursor: pointer; }
.pytanie summary::-webkit-details-marker { display: none; }
.pytanie summary .ik { transition: transform .3s var(--wyjscie); }
.pytanie[open] summary .ik { transform: rotate(45deg); }
.pytanie p { padding: 0 22px 20px; color: var(--tekst-2); }

.dostawy { width: 100%; border-collapse: collapse; font-family: var(--kroj); font-size: 1.06rem; margin-block: 1em; }
.dostawy caption { text-align: left; font-weight: 650; margin-bottom: 10px; }
.dostawy th, .dostawy td { padding: 12px 16px; text-align: left; font-weight: 400; }
.dostawy td { text-align: right; font-weight: 650; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dostawy tr:nth-child(odd) { background: var(--mgla); }
.dostawy__gratis th, .dostawy__gratis td { color: var(--zielony); font-weight: 700; }

.pasek-kup { display: none; }

/* ---------- informacje, 404, koniec ---------- */

.informacja { display: grid; grid-template-columns: 260px 1fr; gap: clamp(28px, 4vw, 64px); align-items: start; }
.informacja__menu { position: sticky; top: calc(var(--wys-naglowka) + 24px); display: grid; gap: 4px; }
.informacja__menu a { color: var(--tekst-2); text-decoration: none; padding: 10px 16px; border-radius: 12px; font-weight: 550; }
.informacja__menu a:hover { background: var(--mgla); color: var(--tusz); }
.informacja__menu a[aria-current="page"] { background: var(--tusz); color: #fff; }
.informacja__tresc { font-size: 1.1rem; max-width: 50em; }
.informacja__tresc h2 { font-size: 1.5rem; }
.informacja__tresc li { font-size: 1.08rem; }
.prosta { text-align: center; }
.prosta__kod { font-size: clamp(5rem, 3rem + 8vw, 9rem); font-weight: 800; line-height: 1; letter-spacing: -.05em; color: var(--morze); }
.prosta h1 { font-size: clamp(2rem, 1.5rem + 2vw, 3rem); margin-top: 8px; }
.prosta .hero__opis { margin-inline: auto; }
.prosta .hero__przyciski { justify-content: center; }
.koniec { text-align: center; }
.koniec__w p { margin: 14px 0 26px; font-size: 1.15rem; color: var(--tekst-2); }

/* ---------- koszyk ---------- */

.koszyk-ekran { padding-top: clamp(28px, 3.5vw, 48px); }
.koszyk-ekran h1 { font-size: clamp(2.4rem, 1.8rem + 2.4vw, 3.6rem); margin-bottom: 24px; }
.koszyk-komunikat { display: flex; align-items: center; gap: 10px; background: #e3f4ec; color: var(--zielony); font-weight: 650; padding: 12px 16px; border-radius: var(--r-maly); margin-bottom: 20px; }
.koszyk-strona { display: grid; grid-template-columns: 1fr 390px; gap: clamp(24px, 3.5vw, 48px); align-items: start; }
.koszyk-lista { display: grid; gap: 14px; }
.poz { display: grid; grid-template-columns: 168px 1fr auto; gap: 24px; align-items: center; padding: 16px; background: #fff; border: 2px solid var(--linia); border-radius: var(--r); }
.poz__foto { display: block; aspect-ratio: 4 / 3; background: var(--mgla-2); border-radius: 12px; overflow: hidden; }
.poz img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; }
.poz__nazwa { display: block; font-weight: 700; font-size: 1.32rem; color: var(--tusz); text-decoration: none; line-height: 1.2; letter-spacing: -.01em; }
.poz__nazwa:hover { text-decoration: underline; }
.poz__typ { display: block; color: var(--tekst-2); font-size: 1rem; margin: 6px 0 14px; }
.poz__ilosc { display: inline-flex; align-items: center; border: 2px solid var(--linia); border-radius: 999px; }
.poz__ilosc button { width: 44px; height: 44px; background: none; border: 0; display: grid; place-items: center; border-radius: 50%; }
.poz__ilosc button:hover { background: var(--mgla); }
.poz__ilosc span { min-width: 30px; text-align: center; font-weight: 700; font-size: 1.1rem; }
.poz__prawo { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; font-variant-numeric: tabular-nums; }
.poz__prawo s { display: block; text-align: right; color: var(--tekst-2); font-size: 1rem; text-decoration-color: var(--magenta); }
.poz__prawo strong { font-size: 1.6rem; font-weight: 750; color: var(--tusz); }
.poz__usun { background: none; border: 0; color: var(--tekst-2); font-size: .92rem; display: inline-flex; align-items: center; gap: 4px; padding: 4px; }
.poz__usun:hover { color: var(--magenta-ciemna); }
.dostawa-info { display: flex; align-items: center; gap: 10px; margin: 16px 0 0; padding: 12px 16px; background: var(--mgla); border-radius: var(--r-maly); font-size: 1rem; }
.dostawa-info--ok { background: #e3f4ec; color: var(--zielony); font-weight: 600; }
.zamiana { display: grid; grid-template-columns: 120px 1fr; gap: 18px; align-items: center; margin-top: 20px; padding: 18px; border: 2px dashed var(--magenta); border-radius: var(--r); background: #fdf0f6; }
.zamiana img { width: 120px; height: 120px; object-fit: cover; border-radius: 12px; }
.zamiana__tytul { font-weight: 700; margin-bottom: 4px; }
.zamiana p { font-size: 1rem; margin-bottom: 10px; }
.koszyk-sekcja { margin-top: 44px; }
.koszyk-sekcja h2 { font-size: 1.7rem; margin-bottom: 22px; text-align: center; }
.dobierz-siatka { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.dobierz-siatka > * { flex: 0 1 calc((100% - 28px) / 3); }
.propozycja { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; border: 2px solid var(--linia); border-radius: var(--r); padding: 12px; background: #fff; }
.propozycja__foto { align-self: stretch; display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 12px; background: var(--mgla-2); }
.propozycja__foto img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; }
.propozycja__nazwa { font-weight: 650; color: var(--tusz); text-decoration: none; line-height: 1.3; }
.propozycja__powod { font-size: .92rem; color: var(--magenta-ciemna); font-weight: 600; }
.propozycja .cena { margin-top: auto; justify-content: center; }
.propozycja .przycisk { align-self: stretch; }
.koszyk-strona__bok { position: sticky; top: calc(var(--wys-naglowka) + 20px); background: var(--tusz); color: #fff; border-radius: 22px; padding: 28px; }
.podsumowanie__tytul { color: #fff; font-size: 1.6rem; margin-bottom: 18px; }
.podsumowanie { display: grid; gap: 10px; margin-bottom: 22px; font-variant-numeric: tabular-nums; }
.podsumowanie > div { display: flex; justify-content: space-between; gap: 12px; color: rgba(255, 255, 255, .85); }
.podsumowanie > div > span:last-child { white-space: nowrap; }
.podsumowanie__razem small { font-weight: 400; margin-top: 4px; }
.podsumowanie small { display: block; font-size: .84rem; color: rgba(255, 255, 255, .62); }
.podsumowanie__zysk { color: #8fe3bd !important; }
.podsumowanie__razem { padding-top: 14px; margin-top: 4px; border-top: 1px solid rgba(255, 255, 255, .2); font-weight: 750; font-size: 1.4rem; color: #fff !important; }
.koszyk-strona__bok .przycisk { min-height: 58px; background: #fff; border-color: #fff; color: var(--tusz); }
.koszyk-strona__bok .przycisk:hover { background: var(--mgla-2); border-color: var(--mgla-2); }
.szuflada__nota { font-size: .92rem; color: rgba(255, 255, 255, .72); margin: 14px 0; }
.zaufanie { list-style: none; padding: 0; display: grid; gap: 8px; font-size: .94rem; color: rgba(255, 255, 255, .82); }
.zaufanie li { display: flex; align-items: flex-start; gap: 10px; }
.koszyk-dalej { display: inline-flex; align-items: center; gap: 6px; margin-top: 18px; color: #fff; font-weight: 600; font-size: .96rem; }
.koszyk-dalej:hover { color: #fff; }
.koszyk-dalej .ik { transform: scaleX(-1); }
.koszyk-pasek { display: none; }
.pusty { text-align: center; padding: 12px 0 20px; }
.pusty__tytul { font-weight: 750; font-size: 1.9rem; color: var(--tusz); margin-bottom: 6px; }
.pusty .formaty { text-align: left; margin-top: 32px; }

/* ---------- efekty koszyka ---------- */

.podskok { animation: podskok .55s var(--wyjscie); }
@keyframes podskok { 0% { transform: scale(1); } 35% { transform: scale(1.35); } 100% { transform: scale(1); } }
.migniecie { animation: migniecie .8s ease-out; }
@keyframes migniecie { 0% { color: var(--magenta); } 100% { color: inherit; } }
.poz--nowa { animation: nowa 1.6s var(--wyjscie); }
@keyframes nowa { 0% { transform: translateY(-14px); opacity: 0; background: #e3f4ec; } 30% { transform: none; opacity: 1; background: #e3f4ec; } 100% { background: #fff; } }
.wchodzi { animation: wchodzi .5s var(--wyjscie) both; }
@keyframes wchodzi { from { opacity: 0; transform: translateY(12px) scale(.98); } }
.odchodzi { animation: odchodzi .3s ease-in forwards; }
@keyframes odchodzi { to { opacity: 0; transform: translateX(30px) scale(.96); } }
.puls { animation: puls 2.4s ease-in-out 1s 2; }
@keyframes puls { 0%, 100% { box-shadow: 0 0 0 0 rgba(240, 36, 132, 0); } 50% { box-shadow: 0 0 0 8px rgba(240, 36, 132, .22); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }

/* ---------- okno „dodano” ---------- */

.dodano { width: min(520px, calc(100vw - 24px)); padding: 0; border: 0; border-radius: 22px; box-shadow: var(--cien-duzy); color: var(--tekst); }
.dodano::backdrop { background: rgba(14, 18, 24, .55); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); animation: tlo .35s ease-out; }
@keyframes tlo { from { opacity: 0; } to { opacity: 1; } }
.dodano[open] { animation: okno .4s var(--wyjscie); }
@keyframes okno { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.dodano__gora { display: flex; align-items: center; gap: 12px; background: var(--tusz); color: #fff; padding: 14px 18px; position: relative; }
.dodano__gora::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--tecza); }
.dodano__ptaszek { width: 32px; height: 32px; border-radius: 50%; background: #fff; color: var(--tusz); display: grid; place-items: center; flex: none; animation: podskok .6s .15s var(--wyjscie) both; }
.dodano__tytul { margin: 0; font-weight: 700; font-size: 1.12rem; flex: 1; }
.dodano__x { background: none; border: 0; color: #fff; width: 36px; height: 36px; display: grid; place-items: center; }
.dodano__produkt { display: grid; grid-template-columns: 100px 1fr; gap: 16px; align-items: center; padding: 18px; }
.dodano__produkt img { width: 100px; height: 100px; object-fit: cover; border-radius: 12px; background: var(--mgla-2); }
.dodano__nazwa { font-weight: 650; margin-bottom: 6px; line-height: 1.3; }
.dodano__extra { display: block; font-size: .92rem; color: var(--tekst-2); margin-bottom: 6px; }
[data-dodano-propozycja] { padding: 0 18px; }
.dodano__rabat { display: flex; align-items: center; gap: 8px; color: var(--zielony); font-weight: 650; }
.dodano__pasuje { font-weight: 650; margin: 6px 0 8px; color: var(--tusz); }
.dodano__prop { display: grid; grid-template-columns: 64px 1fr auto; gap: 12px; align-items: center; padding: 12px; background: var(--mgla); border-radius: 14px; }
.dodano__prop img { width: 64px; height: 64px; object-fit: cover; border-radius: 10px; mix-blend-mode: multiply; }
.dodano__prop-tytul { margin: 0 0 2px; font-weight: 650; font-size: .98rem; line-height: 1.3; }
.dodano__prop span { font-size: .9rem; color: var(--tekst-2); }
.dodano__przyciski { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 18px; }

/* ---------- zgoda, lightbox ---------- */

.zgoda { position: fixed; left: 16px; bottom: 16px; z-index: 60; max-width: 430px; background: #fff; border-radius: var(--r); box-shadow: var(--cien-duzy); padding: 18px 20px; font-size: .98rem; }
.zgoda p { margin-bottom: 12px; }
.zgoda__przyciski { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.lightbox { padding: 0; border: 0; background: transparent; max-width: 100vw; max-height: 100dvh; width: 100vw; height: 100dvh; }
.lightbox::backdrop { background: rgba(10, 12, 16, .92); }
.lightbox[open] { display: grid; place-items: center; }
.lightbox img { max-width: min(92vw, 1400px); max-height: 88dvh; width: auto; object-fit: contain; border-radius: 14px; }
.ikona-przycisk { position: fixed; width: 52px; height: 52px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .14); color: #fff; display: grid; place-items: center; }
.ikona-przycisk:hover { background: rgba(255, 255, 255, .26); }
.ikona-przycisk .ik { width: 1.5em; height: 1.5em; }
.lightbox__zamknij { top: 16px; right: 16px; }
.lightbox__nav--wstecz { left: 16px; top: 50%; translate: 0 -50%; }
.lightbox__nav--dalej { right: 16px; top: 50%; translate: 0 -50%; }

/* ---------- responsywność ---------- */

@media (max-width: 1180px) {
  .menu a { padding: 8px 10px; }
  .logo img { width: 168px; }
  .rozmowy--glowna { grid-template-columns: repeat(2, 1fr); }
  .zalety { grid-template-columns: 1fr 1fr; }
  .stopka__srodek { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 960px) {
  :root { --wys-naglowka: 68px; }
  .naglowek__w { grid-template-columns: auto 1fr; gap: 12px; padding-block: 11px 14px; }
  .naglowek__akcje { grid-column: 2; }
  .przycisk-menu { display: grid; }
  .menu { position: fixed; inset: var(--wys-naglowka) 0 auto 0; display: none; flex-direction: column; gap: 2px; background: #fff; padding: 10px var(--gutter) 22px; box-shadow: 0 24px 30px -14px rgba(10, 30, 45, .4); }
  .menu-otwarte .menu { display: flex; }
  .menu a { padding: 14px 12px; font-size: 1.2rem; border-radius: 12px; }
  .hero__w, .manifest__w, .ks-hero__w, .w-srodku, .p-hero__w, .omnie, .autorka__w, .grupa, .kontakt, .informacja { grid-template-columns: 1fr; }
  .hero__foto { justify-self: center; max-width: 460px; }
  .manifest__haslo { position: static; }
  .formaty { grid-template-columns: 1fr 1fr; }
  .pakiety { grid-template-columns: 1fr; }
  .rozmowy { grid-template-columns: 1fr 1fr; }
  .os__glosy { grid-template-columns: 1fr 1fr; }
  .p-hero__lewa, .omnie__foto { position: static; }
  .omnie__foto { max-width: 460px; }
  .spis__w { grid-template-columns: 1fr; }
  .spis__produkt, .spis__kup { display: none; }
  .spis__linki { justify-content: flex-start; }
  .informacja__menu { position: static; display: flex; flex-wrap: wrap; }
  .koszyk-strona { grid-template-columns: 1fr; }
  .koszyk-strona__bok { position: static; }
  .pas-grupy__w { flex-direction: column; align-items: flex-start; }
  .parametry--karta { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  body { font-size: 1.08rem; }
  .logo img { width: 150px; }
  .przycisk-koszyk { padding: 0 14px; gap: 6px; }
  .przycisk-koszyk__suma { font-size: .95rem; }
  .hero__przyciski .przycisk, .omnie__linki .przycisk { width: 100%; }
  .negocjacje { flex-direction: column; }
  .hero__foto img { aspect-ratio: 4 / 5; }
  .plakietka { left: 10px; right: 10px; bottom: 10px; padding-left: 16px; font-size: .95rem; }
  .formaty { grid-template-columns: 1fr; }
  .format { display: grid; grid-template-columns: 120px 1fr; column-gap: 14px; padding: 10px; }
  .format__foto { grid-row: span 4; align-self: start; }
  .format__ikony { margin: 4px 0 0; font-size: .92rem; }
  .format__nazwa { margin: 2px 0 0; font-size: 1.3rem; }
  .format__czas { margin: 4px 0 10px; font-size: .92rem; }
  .format__dol { margin: 0; }
  .format__dol .przycisk { width: 100%; }
  .pakiet { grid-template-columns: 84px 1fr; }
  .pakiet__foto { grid-row: auto; }
  .pakiet__prawo { grid-column: 1 / -1; }
  .pakiet__prawo .przycisk { width: 100%; margin: 0; }
  .os__dni { gap: 1px; }
  .dzien { height: 36px; }
  .dzien span { display: none; }
  .dzien--glos span { display: block; left: -4px; bottom: -24px; font-size: .8rem; }
  .os__dni { margin-bottom: 44px; }
  .os__glosy { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; margin-inline: calc(-1 * var(--gutter)); padding-inline: var(--gutter); scrollbar-width: none; }
  .glos { flex: 0 0 82%; scroll-snap-align: center; }
  .rozmowy, .rozmowy--glowna { grid-template-columns: 1fr; }
  .opinie { columns: 1; }
  .opinia { padding: 20px; }
  .ks-hero__wersje { grid-template-columns: 1fr; }
  .ks-hero__wersje a { grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; }
  .ks-hero__wersje .ik { margin: 0; }
  .parametry, .parametry--karta, .sklad { grid-template-columns: 1fr; }
  .zalety { grid-template-columns: 1fr; }
  .wersje__lista { grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
  .wersje__lista--pakiety { grid-template-columns: 1fr 1fr; }
  .wersje__lista a { padding: 10px; }
  .wersja__nazwa { font-size: .95rem; }
  .wersja__cena { font-size: .88rem; }
  .wersja__cena s { display: block; margin: 0; }
  .p-kup__przyciski { grid-template-columns: 1fr; }
  .dobierz__poz { grid-template-columns: auto 48px 1fr; }
  .dobierz__foto { width: 48px; height: 48px; }
  .dobierz__cena { grid-column: 3; }
  .poz { grid-template-columns: 96px 1fr; gap: 14px; padding: 12px; }
  .poz__prawo { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: center; }
  .poz__nazwa { font-size: 1.15rem; }
  .dobierz-siatka > * { flex-basis: 100%; }
  .stopka__srodek { grid-template-columns: 1fr; }
  .stopka__haslo { flex-basis: 100%; }
  .dodano__przyciski { grid-template-columns: 1fr; }
  .pasek-kup { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; background: #fff; box-shadow: 0 -10px 30px -12px rgba(10, 30, 45, .35); transform: translateY(110%); transition: transform .35s var(--wyjscie); }
  .pasek-kup.widoczny { transform: none; }
  .pasek-kup__w { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom)); }
  .pasek-kup__tekst p:first-child { font-weight: 650; font-size: .95rem; }
  .pasek-kup .cena__teraz { font-size: 1.15rem; }
  .karta-produktu .stopka { padding-bottom: 76px; }
  .koszyk-pasek:not([hidden]) { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; align-items: center; justify-content: space-between; gap: 12px; background: var(--tusz); color: #fff; padding: 12px var(--gutter) calc(12px + env(safe-area-inset-bottom)); }
  .koszyk-pasek span { display: block; font-size: .85rem; color: rgba(255, 255, 255, .7); }
  .koszyk-pasek strong { font-size: 1.25rem; }
  .koszyk-pasek .przycisk { background: #fff; color: var(--tusz); border-color: #fff; }
  .zgoda { left: 10px; right: 10px; bottom: 10px; max-width: none; }
}