/* Tydzień w ruchu – zeszyt jednego tygodnia: papier, wycięte godziny, paski papieru */
:root {
  --bordo: #962c2c;
  --wino: #5f1c1c;
  --mieta: #59c08c;
  --turkus: #22c3c3;
  --papier: #faf5f5;
  --plotno: #f3e2e2;
  --atrament: #2d1b1b;
  --bordo-ciemne: #7a2222;
  --nadpis: "Arsenal", "Trebuchet MS", sans-serif;
  --tekst: "Lora", Georgia, serif;
  --szum: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .18 0 0 0 0 .18 0 0 0 .08 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --zab: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='12' viewBox='0 0 48 12'%3E%3Cpath d='M0 0H48V5L44 9L39 4L34 11L28 6L23 10L17 3L12 9L7 5L3 10L0 6Z'/%3E%3C/svg%3E");
  --zab-gora: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='12' viewBox='0 0 48 12'%3E%3Cpath d='M0 12H48V7L44 3L39 8L34 1L28 6L23 2L17 9L12 3L7 7L3 2L0 6Z'/%3E%3C/svg%3E");
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  font-family: var(--tekst);
  font-size: 1.125rem;
  line-height: 1.7;
  color: var(--atrament);
  background: var(--papier) var(--szum);
  padding-bottom: 96px;
}
img { max-width: 100%; height: auto; display: block; }
small { font-size: .9rem; }
h1, h2, h3 { font-family: var(--nadpis); font-weight: 700; line-height: 1.12; margin: 0 0 .6em; }
h1 { font-size: clamp(2.3rem, 4.2vw, 3.5rem); }
h2 { font-size: clamp(1.9rem, 3.2vw, 2.7rem); }
h3 { font-size: 1.5rem; line-height: 1.2; }
p { margin: 0 0 1em; }
a { color: var(--bordo); }
a:focus-visible, summary:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--turkus); outline-offset: 3px;
}

/* --- nagłówek --- */
.naglowek {
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  padding: .7rem clamp(1rem, 4vw, 3rem);
  background: var(--papier) var(--szum);
  border-bottom: 2px dashed rgba(150, 44, 44, .35);
}
.znak {
  font-family: var(--nadpis); font-weight: 700; font-size: 1.6rem; text-decoration: none;
  color: var(--wino); display: inline-block; transform: rotate(-2deg);
  background: var(--plotno); padding: .1rem .7rem; box-shadow: 2px 3px 0 rgba(95, 28, 28, .18);
}

/* --- przyciski --- */
.przycisk {
  display: inline-flex; align-items: center; justify-content: center; text-align: center;
  font-family: var(--nadpis); font-weight: 700; text-decoration: none;
  background: var(--turkus); color: var(--atrament);
  border: 2px solid var(--atrament); border-radius: 3px;
  box-shadow: 5px 5px 0 var(--atrament);
  transition: transform .15s, box-shadow .15s;
}
.przycisk:hover { transform: translate(2px, 2px); box-shadow: 3px 3px 0 var(--atrament); }
.przycisk-maly { min-height: 52px; padding: .45rem 1.2rem; font-size: 1.2rem; }
.przycisk-glowny { min-height: 84px; min-width: 320px; padding: .9rem 2rem; font-size: 1.45rem; line-height: 1.2; }
.pas-bordo .przycisk, .pas-wino .przycisk { color: var(--atrament); border-color: var(--papier); box-shadow: 5px 5px 0 var(--papier); }
.kartka .przycisk { color: var(--atrament); border-color: var(--atrament); box-shadow: 5px 5px 0 var(--atrament); }

/* --- papier: naddarte krawędzie, paski --- */
.naddarte {
  -webkit-mask: linear-gradient(#000, #000) top / 100% calc(100% - 11px) no-repeat, var(--zab) bottom left / 48px 12px repeat-x;
  mask: linear-gradient(#000, #000) top / 100% calc(100% - 11px) no-repeat, var(--zab) bottom left / 48px 12px repeat-x;
  padding-bottom: 2.6rem !important;
}
.naddarte-gora { position: relative; }
.naddarte-gora::before {
  content: ""; position: absolute; left: 0; right: 0; top: -11px; height: 12px;
  background: inherit;
  -webkit-mask: var(--zab-gora) left / 48px 12px repeat-x; mask: var(--zab-gora) left / 48px 12px repeat-x;
}
.kartka {
  background: var(--papier) var(--szum);
  color: var(--atrament);
  box-shadow: 0 10px 24px rgba(45, 27, 27, .22);
}
.foto-wklejone { position: relative; margin: 0; background: #fff; padding: 10px 10px 0; box-shadow: 0 8px 20px rgba(45, 27, 27, .25); }
.foto-wklejone::before, .foto-wklejone::after {
  content: ""; position: absolute; width: 110px; height: 30px; top: -14px;
  background: rgba(89, 192, 140, .72); box-shadow: 0 1px 2px rgba(0, 0, 0, .12);
}
.foto-wklejone::before { left: 18px; transform: rotate(-7deg); }
.foto-wklejone::after { right: 18px; transform: rotate(6deg); background: rgba(243, 226, 226, .85); }
.foto-wklejone figcaption { font-size: .95rem; line-height: 1.45; padding: .6rem .2rem .8rem; color: var(--atrament); font-style: italic; }

/* --- pasy i sekcje --- */
.pas-bordo { background: var(--bordo) var(--szum); color: var(--papier); }
.pas-wino { background: var(--wino) var(--szum); color: var(--papier); }
.pas-plotno { background: var(--plotno) var(--szum); }
.powietrze { padding: clamp(4rem, 9vw, 7.5rem) clamp(1rem, 4vw, 3rem); }
.waski { max-width: 46rem; margin: 0 auto; }
.szeroki { max-width: 72rem; margin: 0 auto; }
.wstep { font-size: 1.15rem; }

/* --- hero --- */
.hero { padding: 1.6rem clamp(1rem, 4vw, 3rem) 3rem; }
.hero-uklad {
  max-width: 76rem; margin: 0 auto;
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: center;
}
.hero-kartka { transform: rotate(-1.2deg); padding: 1.3rem 2.4rem 2.4rem; position: relative; z-index: 2; }
.hero-czas { display: flex; align-items: flex-end; gap: 1rem; margin: 0 0 .7rem; }
.dzien { font-style: italic; font-size: 1.1rem; line-height: 1.3; color: var(--bordo-ciemne); padding-bottom: .55rem; }
.godzina-wielka {
  font-family: var(--nadpis); font-weight: 700; color: var(--bordo);
  font-size: clamp(3.6rem, 6.4vw, 5.4rem); line-height: .85;
  font-variant-numeric: lining-nums tabular-nums; letter-spacing: -.02em;
}
.hero h1 { color: var(--atrament); max-width: 22ch; font-size: clamp(2.2rem, 3.6vw, 3.1rem); }
.perex { font-size: 1.125rem; max-width: 60ch; line-height: 1.6; }
.drobny { font-size: .95rem; margin: 1rem 0 0; color: #5a3a3a; }
.hero-foto { transform: rotate(2.4deg); margin-left: -3rem; z-index: 1; }
.hero-foto figcaption { padding-left: 3.4rem; }
.hero-foto img { aspect-ratio: 4 / 3.4; object-fit: cover; object-position: 45% 40%; }

/* --- oś tygodnia --- */
.tydzien h2 { text-align: left; }
.os {
  list-style: none; margin: 3.5rem auto 0; padding: 0; max-width: 72rem; position: relative;
}
.os::before {
  content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 26px; margin-left: -13px;
  background: var(--plotno);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='48' viewBox='0 0 26 48'%3E%3Cpath d='M4 0L0 6L5 12L1 19L4 26L0 33L5 40L2 48H24L26 42L22 35L26 28L21 20L25 13L22 6L26 0Z'/%3E%3C/svg%3E") center top / 26px 48px repeat-y;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='48' viewBox='0 0 26 48'%3E%3Cpath d='M4 0L0 6L5 12L1 19L4 26L0 33L5 40L2 48H24L26 42L22 35L26 28L21 20L25 13L22 6L26 0Z'/%3E%3C/svg%3E") center top / 26px 48px repeat-y;
}
.os::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 3px; margin-left: -1.5px;
  background: repeating-linear-gradient(var(--bordo) 0 10px, transparent 10px 18px);
}
.wpis {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 11rem minmax(0, 1fr);
  align-items: start; margin-bottom: 4.5rem;
}
.godz {
  grid-column: 2; grid-row: 1; justify-self: center; position: relative; z-index: 2;
  margin: 0; padding: .4rem .9rem .5rem; text-align: center;
  background: var(--papier); box-shadow: 0 6px 14px rgba(45, 27, 27, .2);
  font-family: var(--nadpis); font-weight: 700; color: var(--bordo);
  font-size: 3.4rem; line-height: 1; font-variant-numeric: lining-nums;
}
.godz::before {
  content: ""; position: absolute; left: 50%; top: -20px; width: 64px; height: 22px; margin-left: -32px;
  background: rgba(89, 192, 140, .7); transform: rotate(-4deg);
}
.godz { padding-top: .7rem; }
.godz-dzien { display: block; font-family: var(--tekst); font-style: italic; font-weight: 400; font-size: 1rem; color: var(--atrament); margin-bottom: .2rem; }
.wpis-lewy .godz { transform: rotate(-3deg); }
.wpis-prawy .godz { transform: rotate(2.5deg); }
.wpis-tresc { grid-row: 1; padding-top: .6rem; }
.wpis-lewy .wpis-tresc { grid-column: 1; text-align: right; padding-right: 1rem; }
.wpis-prawy .wpis-tresc { grid-column: 3; padding-left: 1rem; }
.dopisek {
  grid-row: 1; margin: 1.4rem 0 0; max-width: 22rem; font-style: italic; font-size: 1.1rem; line-height: 1.55;
  color: var(--bordo-ciemne); padding: .9rem 1.1rem; background: rgba(243, 226, 226, .7); border-left: 3px solid var(--mieta);
}
.wpis-lewy .dopisek { grid-column: 3; margin-left: 1.5rem; transform: rotate(1.5deg); }
.wpis-prawy .dopisek { grid-column: 1; justify-self: end; margin-right: 1.5rem; transform: rotate(-1.5deg); }
.wpis-foto { grid-row: 1; grid-column: 1; max-width: 400px; justify-self: end; margin-right: 1rem; transform: rotate(-2deg); }
.wpis-tresc p { max-width: 34rem; }
.wpis-lewy .wpis-tresc p { margin-left: auto; }

/* --- wykład --- */
.vyklad { padding: clamp(3.5rem, 7vw, 6rem) clamp(1rem, 4vw, 3rem); }
.vyklad .wstep { max-width: 62ch; }
.ilustracja { max-width: 760px; margin: 2.5rem auto 3rem; background: #fff; padding: 12px; box-shadow: 0 8px 22px rgba(45, 27, 27, .18); transform: rotate(-.6deg); }
.ilustracja figcaption { font-size: .98rem; line-height: 1.5; font-style: italic; padding: .7rem .2rem .2rem; }
.przyczyny { list-style: none; margin: 0; padding: 0; }
.przyczyny li {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 2.5rem;
  padding: 1.6rem 0; border-top: 2px dashed rgba(150, 44, 44, .4);
}
.przyczyny li:last-child { border-bottom: 2px dashed rgba(150, 44, 44, .4); }
.przyczyny h3 { color: var(--wino); margin: 0; }
.przyczyny p { margin: 0; }
.przyczyny small { display: block; margin-top: .4rem; color: #6a3434; }
.objawy {
  max-width: 44rem; margin: 3.5rem auto 0; padding: 2rem 2.4rem 1.6rem; transform: rotate(.8deg);
}
.kartka-liniowana {
  background: #fff repeating-linear-gradient(transparent 0 31px, rgba(34, 195, 195, .35) 31px 32px);
  box-shadow: 0 8px 20px rgba(45, 27, 27, .18);
  border-left: 3px solid rgba(150, 44, 44, .55);
}
.objawy ul { margin: 0 0 1rem; padding-left: 1.3rem; }
.objawy-zrodlo { font-size: .95rem; margin: 0; }

/* --- oferta --- */
.oferta { background: var(--papier); }
.oferta-kartka {
  max-width: 54rem; margin: 0 auto; padding: 3rem 3.2rem 3rem; transform: rotate(.7deg);
  background: var(--plotno) var(--szum); border-top: 10px solid var(--mieta);
}
.oferta-kartka p { max-width: 62ch; }
.oferta-kartka .przycisk { margin-top: 1rem; }

/* --- liczby --- */
.liczby { padding: clamp(3.5rem, 7vw, 6rem) clamp(1rem, 4vw, 3rem); }
.liczby-uklad { max-width: 72rem; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 3.5rem; align-items: center; }
.wykres { padding-bottom: 10px; transform: rotate(-1.5deg); max-width: 540px; }
.wykres img { width: 100%; }
.liczby h2 { color: var(--papier); }
.liczby p { font-size: 1.15rem; }
.liczby-polska { border-left: 4px solid var(--mieta); padding-left: 1rem; }
.liczby small { display: block; color: #f3e2e2; }

/* --- notki --- */
.recenze h2 { max-width: 30ch; }
.notki { display: flex; flex-wrap: wrap; gap: 2.5rem 3rem; margin-top: 2.5rem; align-items: flex-start; }
.notka {
  margin: 0; flex: 1 1 15rem; position: relative; padding: 1.8rem 1.6rem 2.4rem;
  background: #fff var(--szum); box-shadow: 0 6px 16px rgba(45, 27, 27, .16);
}
.notka blockquote { margin: 0 0 1rem; font-size: 1.2rem; line-height: 1.55; font-style: italic; }
.notka cite { font-style: normal; font-family: var(--nadpis); font-weight: 700; font-size: 1.1rem; color: var(--bordo-ciemne); }
.notka-a { transform: rotate(-2deg); max-width: 21rem; }
.notka-b { transform: rotate(1.5deg) translateY(1.6rem); max-width: 19rem; background-color: var(--plotno); }
.notka-c { transform: rotate(-.8deg); max-width: 23rem; }
.notka::before { content: ""; position: absolute; top: -12px; left: 40%; width: 80px; height: 24px; background: rgba(34, 195, 195, .45); transform: rotate(3deg); }

/* --- FAQ --- */
.faq { background: var(--papier); }
.faq-uklad { max-width: 72rem; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 3rem; align-items: start; }
.faq-uklad > h2 { position: sticky; top: 6rem; }
.faq details { border-bottom: 2px dashed rgba(150, 44, 44, .4); padding: 1rem 0; }
.faq details:first-child { border-top: 2px dashed rgba(150, 44, 44, .4); }
.faq summary { font-family: var(--nadpis); font-weight: 700; font-size: 1.3rem; cursor: pointer; line-height: 1.3; }
.faq details p { margin: .7rem 0 0; }

/* --- zakończenie --- */
.zaver { padding: clamp(3.5rem, 7vw, 6rem) clamp(1rem, 4vw, 3rem); }
.zaver-uklad { max-width: 76rem; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); align-items: center; }
.zaver-foto { transform: rotate(-1.8deg); z-index: 1; }
.zaver-foto figcaption { padding-right: 3.4rem; }
.zaver-foto img { aspect-ratio: 4 / 3.2; object-fit: cover; object-position: 40% 30%; }
.zaver-kartka { margin-left: -3rem; padding: 1.8rem 2.2rem 2.6rem; transform: rotate(1.4deg); position: relative; z-index: 2; }
.zaver-kartka h2 { color: var(--atrament); }
.zaver-kartka .przycisk-glowny { min-width: 0; width: 100%; }

/* --- stopka --- */
.stopka {
  background: var(--wino); color: var(--papier); padding: 2rem clamp(1rem, 4vw, 3rem) 2.2rem;
  display: flex; flex-wrap: wrap; gap: .6rem 2rem; align-items: center; justify-content: space-between; font-size: 1rem;
}
.stopka p { margin: 0; }
.stopka-linki { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; }
.stopka a { color: var(--papier); font-size: .95rem; }
.stopka-uwaga { flex-basis: 100%; font-size: .95rem; opacity: .9; }

/* --- podstrony --- */
.podstrona { min-height: 100vh; display: flex; flex-direction: column; }
.podstrona main { flex: 1; padding: clamp(2.5rem, 6vw, 4.5rem) clamp(1rem, 4vw, 3rem); background: var(--plotno) var(--szum); }
.podstrona .podstrona-kartka { background: #fff var(--szum); }
.podstrona-kartka { max-width: 760px; margin: 0 auto; padding: 2.4rem 2.6rem 3rem; transform: rotate(-.4deg); }
.podstrona-kartka h1 { font-size: clamp(2rem, 3.6vw, 2.8rem); }
.podstrona-kartka h2 { font-size: 1.5rem; margin-top: 1.6em; }
.formularz label { display: block; font-family: var(--nadpis); font-weight: 700; font-size: 1.15rem; margin: 1rem 0 .3rem; }
.formularz input, .formularz textarea {
  width: 100%; font: inherit; padding: .7rem .8rem; border: 2px solid var(--atrament); border-radius: 2px; background: #fff;
}
.formularz button {
  margin-top: 1.4rem; font-family: var(--nadpis); font-weight: 700; font-size: 1.25rem; min-height: 60px; padding: .6rem 2rem;
  background: var(--bordo); color: var(--papier); border: 2px solid var(--atrament); box-shadow: 4px 4px 0 var(--atrament); cursor: pointer;
}
#kontaktDakujeme { margin-top: 1.4rem; padding: 1.2rem 1.4rem; background: var(--plotno); border-left: 4px solid var(--mieta); }

/* --- popup i listwa (engine) --- */
.modal-overlay {
  position: fixed; inset: 0; z-index: 1000; display: none; align-items: center; justify-content: center;
  background: rgba(45, 27, 27, .82); padding: 1rem;
}
.modal-overlay.show { display: flex; }
.modal {
  position: relative; width: min(660px, 100%); max-height: 94vh; overflow: auto; text-align: center;
  background: var(--papier) var(--szum); color: var(--atrament); padding: 2.6rem 2.4rem 2.4rem;
  border-top: 12px solid var(--bordo); box-shadow: 0 20px 50px rgba(0, 0, 0, .45);
}
.modal .close {
  position: absolute; top: .5rem; right: .7rem; width: 48px; height: 48px; font-size: 2.2rem; line-height: 1;
  background: transparent; border: 0; color: var(--atrament); cursor: pointer;
}
.modal .badge {
  display: inline-block; background: var(--bordo); color: var(--papier); font-family: var(--nadpis); font-weight: 700;
  font-size: 1.1rem; padding: .3rem 1rem; transform: rotate(-2deg);
}
.modal h3 { font-size: 3.2rem; color: var(--bordo); margin: .8rem 0 .2rem; }
.modal > p { font-size: 1.4rem; font-weight: 600; margin-bottom: 1rem; }
.modal .offer { background: var(--plotno); padding: 1rem 1.2rem; margin: 0 0 1.4rem; }
.modal .offer p { margin: .3rem 0; font-size: 1.1rem; }
.modal .btn {
  display: flex; align-items: center; justify-content: center; white-space: normal; text-decoration: none;
  min-height: 88px; padding: .8rem 1.4rem; font-family: var(--nadpis); font-weight: 700; font-size: 1.5rem; line-height: 1.2;
  background: var(--turkus); color: var(--atrament); border: 2px solid var(--atrament); box-shadow: 5px 5px 0 var(--atrament);
}
.sticky-cta {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 900;
  display: flex; align-items: center; justify-content: center; gap: 1.4rem;
  background: var(--wino); color: var(--papier); padding: .7rem 1rem; border-top: 3px solid var(--mieta);
  font-size: 1.05rem;
}
.sticky-cta > span { flex: 0 1 auto; }
.sticky-cta .btn {
  flex: 0 0 auto; display: inline-flex; align-items: center; min-height: 62px; padding: .5rem 1.6rem;
  font-family: var(--nadpis); font-weight: 700; font-size: 1.2rem; text-decoration: none;
  background: var(--turkus); color: var(--atrament); border: 2px solid var(--papier); box-shadow: 4px 4px 0 var(--papier);
}

/* --- tablet --- */
@media (max-width: 960px) {
  .hero-uklad, .zaver-uklad, .liczby-uklad, .faq-uklad { grid-template-columns: minmax(0, 1fr); }
  .faq-uklad > h2 { position: static; }
  .hero-foto { margin: -1.2rem 1rem 0; }
  .zaver-kartka { margin: 1.4rem 1rem 0; }
  .przyczyny li { grid-template-columns: minmax(0, 1fr); gap: .5rem; }
  .wykres { margin: 0 auto; }
}

/* --- mobil: oś po lewej --- */
@media (max-width: 720px) {
  body { font-size: 1.07rem; padding-bottom: 150px; }
  .perex, .wstep, .liczby p { font-size: 1.07rem; }
  .naglowek { padding: .6rem .8rem; }
  .znak { font-size: 1.3rem; }
  .przycisk-maly { font-size: 1.125rem; padding: .4rem .8rem; min-height: 50px; }
  .przycisk-glowny { min-width: 0; width: 100%; font-size: 1.3rem; }
  .hero { padding: 1.4rem .8rem 2.4rem; }
  .hero-kartka { padding: 1.2rem 1.2rem 2.4rem; transform: rotate(-.6deg); }
  .hero-foto { margin: -.8rem .4rem 0; transform: rotate(1.2deg); }
  .os { margin-top: 2.5rem; }
  .os::before { left: 22px; }
  .os::after { left: 22px; }
  .wpis { grid-template-columns: 1fr; padding-left: 2.6rem; margin-bottom: 3rem; }
  .godz { grid-column: 1; grid-row: 1; justify-self: start; font-size: 2.4rem; margin-left: -1.4rem; }
  .wpis-tresc, .wpis-lewy .wpis-tresc, .wpis-prawy .wpis-tresc { grid-column: 1; grid-row: 2; text-align: left; padding: 1rem 0 0; }
  .wpis-lewy .dopisek, .wpis-prawy .dopisek { grid-column: 1; grid-row: 3; justify-self: stretch; margin: 1.2rem 0 0; max-width: 100%; transform: none; }
  .hero-foto figcaption, .zaver-foto figcaption { padding-left: .2rem; padding-right: .2rem; }
  .wpis-foto { grid-column: 1; grid-row: 3; max-width: 100%; justify-self: stretch; margin: 1.6rem 0 0; transform: rotate(-1deg); }
  .ilustracja { margin: 2rem 0 2.4rem; transform: none; padding: 8px; }
  .objawy { padding: 1.6rem 1.2rem 1.2rem; transform: none; }
  .oferta-kartka { padding: 2rem 1.3rem 2.6rem; transform: none; }
  .notki { gap: 2.2rem; }
  .notka, .notka-a, .notka-b, .notka-c { max-width: 100%; flex-basis: 100%; transform: none; }
  .notka-b { transform: rotate(.8deg); }
  .zaver-kartka { margin: 1.2rem .3rem 0; padding: 1.3rem 1.2rem 2.4rem; }
  .podstrona-kartka { padding: 1.6rem 1.2rem 2.4rem; transform: none; }
  .modal { padding: 2.4rem 1.2rem 1.6rem; }
  .modal h3 { font-size: 2.3rem; white-space: nowrap; }
  .modal .btn { font-size: 1.25rem; min-height: 72px; }
  .sticky-cta { flex-direction: column; gap: .45rem; padding: .55rem .8rem .7rem; text-align: center; }
  .sticky-cta .btn { min-height: 60px; width: 100%; justify-content: center; }
}