/* resizen.eu — silnik rs_, wersja 4 (27.09.2026)
   Uklad przepisany co do siatki ze specyfikacji makiety:
   kontener 1200, gap 48, sekcje 72/72, CTA purpurowe, zielen ciemna #123f2c
   i jasna #eef6ea, sekcje naprzemiennie biale / jasnoszare / jasnozielone. */

:root{
  --rs-lim:#8ec63f; --rs-lim-c:#6fa62a;
  --rs-ziel:#123f2c; --rs-ziel-j:#eef6ea;
  --rs-pur:#9b139c; --rs-pur-c:#8a0f8f;
  --rs-graf:#1f2420; --rs-tekst:#39393c; --rs-szary:#6d6d73;
  --rs-tlo:#f7f7f5; --rs-biel:#fff; --rs-linia:#ececec;
  --rs-cien:0 2px 10px rgba(31,36,32,.06);
  --rs-cien2:0 10px 34px rgba(31,36,32,.12);
  --rs-r:20px; --rs-r-duzy:26px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0; background:var(--rs-biel); color:var(--rs-tekst);
  font:400 17px/1.6 "Segoe UI",Roboto,-apple-system,"Helvetica Neue",Arial,sans-serif;
  overflow-x:hidden}
img{max-width:100%; height:auto; display:block}
a{color:var(--rs-pur)}

.rs-w{max-width:1200px; margin:0 auto; padding:0 24px}

/* ——— pasek gorny ——— */
.rs-nav{position:sticky; top:0; z-index:40; background:#fff;
  border-bottom:1px solid var(--rs-linia)}
.rs-nav.rs-cien{box-shadow:0 4px 20px rgba(0,0,0,.06)}
.rs-nav .rs-w{display:flex; align-items:center; gap:20px; min-height:72px}
.rs-logo{font-weight:800; font-size:24px; letter-spacing:-.6px; color:var(--rs-graf)}
.rs-logo b{color:var(--rs-lim-c)}
.rs-menu{display:flex; gap:26px; margin:0 auto; font-size:15px}
.rs-menu a{color:var(--rs-szary); text-decoration:none; white-space:nowrap}
.rs-menu a:hover{color:var(--rs-pur)}
.rs-nav .rs-btn{padding:11px 24px; font-size:15px; min-width:180px; justify-content:center}

/* ——— przyciski: GLOWNY = PURPUROWY ——— */
.rs-btn{display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:16px 30px; border:0; border-radius:28px; cursor:pointer; text-decoration:none;
  font:700 17px/1 "Segoe UI",Roboto,Arial,sans-serif; color:#fff;
  background:linear-gradient(135deg,var(--rs-pur) 0%,var(--rs-pur-c) 100%);
  box-shadow:0 6px 18px rgba(155,19,156,.26); transition:transform .15s, box-shadow .15s}
.rs-btn:hover{transform:translateY(-2px); box-shadow:0 12px 26px rgba(155,19,156,.34)}
.rs-btn.rs-drugi{background:#fff; color:var(--rs-pur); border:2px solid var(--rs-pur);
  box-shadow:none}
.rs-btn.rs-drugi:hover{background:rgba(155,19,156,.05); box-shadow:none}
.rs-btn.rs-zielony{background:linear-gradient(135deg,var(--rs-lim) 0%,var(--rs-lim-c) 100%);
  box-shadow:0 6px 18px rgba(111,166,42,.26)}
.rs-btn .rs-x{font-size:20px; line-height:1}

/* ——— hero 52/48 ——— */
.rs-hero{padding:56px 0 52px; background:var(--rs-biel);
  background-image:radial-gradient(760px 420px at 88% 22%, rgba(142,198,63,.16), transparent 62%)}
.rs-hero .rs-w{display:grid; grid-template-columns:52% 48%; gap:48px; align-items:center}
.rs-hero h1{margin:0 0 18px; font-size:52px; line-height:1.03; letter-spacing:-1.4px;
  color:var(--rs-graf); font-weight:800; max-width:560px}
.rs-hero h1 span{color:var(--rs-lim-c)}
.rs-lead{margin:0 0 14px; font-size:19px; line-height:1.5; max-width:560px}
.rs-lead strong{color:var(--rs-graf)}
.rs-pod{margin:14px 0 0; font-size:14.5px; color:var(--rs-szary); max-width:520px}
.rs-lista{margin:20px 0 24px; padding:0; list-style:none; max-width:560px}
.rs-lista li{position:relative; padding:8px 0 8px 32px; font-size:16.5px}
.rs-lista li::before{content:""; position:absolute; left:3px; top:16px; width:14px; height:8px;
  border-left:2.6px solid var(--rs-lim-c); border-bottom:2.6px solid var(--rs-lim-c);
  transform:rotate(-45deg)}
.rs-przyciski{display:flex; flex-wrap:wrap; gap:14px; align-items:center}
.rs-przyciski .rs-btn{min-width:220px; height:52px}

.rs-foto{position:relative; text-align:center}
.rs-foto img{margin:0 auto; max-width:560px; width:100%}
.rs-chip{display:inline-flex; align-items:center; gap:12px; margin-top:16px;
  background:#fff; border:1px solid var(--rs-linia); border-radius:999px; padding:10px 22px;
  box-shadow:var(--rs-cien)}
.rs-chip b{font-size:23px; color:var(--rs-pur); line-height:1}
.rs-chip span{font-size:14.5px; color:var(--rs-szary)}

/* ——— pas zaufania: bialy, 4 kolumny z separatorami ——— */
.rs-zaufanie{background:#fff; border-bottom:1px solid var(--rs-linia)}
.rs-zaufanie .rs-w{display:grid; grid-template-columns:repeat(4,1fr); min-height:100px;
  align-items:center}
.rs-zaufanie .rs-poz{display:flex; align-items:center; gap:14px; padding:14px 22px;
  border-left:1px solid var(--rs-linia)}
.rs-zaufanie .rs-poz:first-child{border-left:0; padding-left:0}
.rs-zaufanie svg{width:32px; height:32px; flex:0 0 auto; fill:none; stroke:var(--rs-lim-c);
  stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.rs-zaufanie b{display:block; font-size:16px; color:var(--rs-graf); line-height:1.25}
.rs-zaufanie span{display:block; font-size:14px; color:var(--rs-szary)}

/* ——— sekcje: biala / jasnoszara / jasnozielona ——— */
.rs-sek{padding:72px 0; background:var(--rs-biel)}
.rs-sek.rs-szara{background:var(--rs-tlo)}
.rs-sek.rs-zielona{background:var(--rs-ziel-j)}
.rs-sek h2{margin:0 0 12px; font-size:36px; line-height:1.15; letter-spacing:-.8px;
  color:var(--rs-graf); font-weight:800}
.rs-sek h2 em{font-style:normal; color:var(--rs-lim-c)}
.rs-wst{margin:0 0 30px; font-size:18px; color:var(--rs-szary); max-width:74ch}
.rs-sek p{max-width:560px}
.rs-srodek{text-align:center}
.rs-srodek h2{margin-left:auto; margin-right:auto}
.rs-srodek .rs-wst{margin-left:auto; margin-right:auto; max-width:720px}
.rs-srodek p{margin-left:auto; margin-right:auto}

/* ——— siatka dwukolumnowa ——— */
.rs-duo{display:grid; gap:48px; align-items:center}
.rs-duo.rs-48-52{grid-template-columns:48% calc(52% - 48px)}
.rs-duo.rs-52-48{grid-template-columns:52% calc(48% - 48px)}
.rs-duo.rs-58-42{grid-template-columns:58% calc(42% - 48px)}
.rs-duo.rs-44-56{grid-template-columns:44% calc(56% - 48px)}
.rs-duo.rs-60-40{grid-template-columns:60% calc(40% - 48px)}
.rs-duo.rs-66-34{grid-template-columns:66% calc(34% - 48px)}
.rs-duo.rs-55-45{grid-template-columns:55% calc(45% - 48px)}
.rs-duo.rs-gora{align-items:start}

/* ——— obrazy ——— */
.rs-obraz{position:relative; border-radius:var(--rs-r-duzy); overflow:hidden;
  box-shadow:var(--rs-cien2)}
.rs-obraz img{width:100%}
.rs-obraz.rs-wysoki img{height:440px; object-fit:cover}
.rs-panorama{border-radius:var(--rs-r-duzy); overflow:hidden; margin-top:34px;
  box-shadow:var(--rs-cien2)}
.rs-panorama img{width:100%; height:300px; object-fit:cover}
.rs-mini{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:14px}
.rs-mini img{border-radius:14px; height:96px; object-fit:cover; width:100%;
  box-shadow:var(--rs-cien)}

/* ——— karty ——— */
.rs-karty{display:grid; gap:24px}
.rs-karty.rs-k3{grid-template-columns:repeat(3,1fr)}
.rs-karty.rs-k4{grid-template-columns:repeat(4,1fr)}
.rs-karta{background:var(--rs-biel); border:1px solid var(--rs-linia); border-radius:var(--rs-r);
  padding:26px 24px}
.rs-sek.rs-szara .rs-karta,.rs-sek.rs-zielona .rs-karta{background:#fff}
.rs-karta.rs-zielona-karta{background:var(--rs-ziel-j); border-color:transparent}
.rs-karta h3{margin:0 0 8px; font-size:19px; color:var(--rs-graf); font-weight:700}
.rs-karta p{margin:0; font-size:16px; color:var(--rs-szary); max-width:none}
.rs-ikona{width:48px; height:48px; border-radius:14px; display:grid; place-items:center;
  margin-bottom:14px; background:rgba(142,198,63,.15)}
.rs-ikona svg{width:26px; height:26px; fill:none; stroke:var(--rs-lim-c); stroke-width:1.9;
  stroke-linecap:round; stroke-linejoin:round}
.rs-karta.rs-p .rs-ikona{background:rgba(155,19,156,.10)}
.rs-karta.rs-p .rs-ikona svg{stroke:var(--rs-pur)}
.rs-okragle{width:74px; height:74px; border-radius:50%; overflow:hidden; margin-bottom:14px}
.rs-okragle img{width:100%; height:100%; object-fit:cover}

/* ——— tabela ——— */
.rs-tab{width:100%; border-collapse:collapse; background:#fff; border-radius:var(--rs-r);
  overflow:hidden; box-shadow:var(--rs-cien); font-size:16.5px}
.rs-tab th,.rs-tab td{padding:13px 18px; text-align:left;
  border-bottom:1px solid var(--rs-linia)}
.rs-tab th{background:var(--rs-ziel); color:#fff; font-weight:700; font-size:14.5px;
  letter-spacing:.3px; text-transform:uppercase}
.rs-tab tbody tr:nth-child(even) td{background:#fafafa}
.rs-tab tr.rs-akt td{background:rgba(142,198,63,.10)}
.rs-tab td:nth-last-child(2),.rs-tab td:last-child{white-space:nowrap;
  font-variant-numeric:tabular-nums}
.rs-tab td:last-child{font-weight:700; color:var(--rs-lim-c)}
.rs-tab tr:last-child td{border-bottom:0}
.rs-nota{margin:14px 0 0; font-size:14.5px; color:var(--rs-szary)}

/* ——— pierscienie ——— */
.rs-piers{display:grid; grid-template-columns:repeat(5,1fr); gap:20px}
.rs-pier{background:#fff; border:1px solid var(--rs-linia); border-radius:18px;
  padding:26px 16px; text-align:center}
.rs-kolo{position:relative; width:104px; height:104px; margin:0 auto 12px}
.rs-kolo svg{width:104px; height:104px; transform:rotate(-90deg)}
.rs-kolo circle{fill:none; stroke-width:9}
.rs-kolo .rs-tor{stroke:#e8e8e8}
.rs-kolo .rs-luk{stroke:var(--rs-lim); stroke-linecap:round; stroke-dasharray:283;
  stroke-dashoffset:283; transition:stroke-dashoffset 1.1s ease-out}
.rs-luk.rs-max{stroke:var(--rs-pur)}
.rs-luk.rs-w40{stroke-dashoffset:175}
.rs-luk.rs-w100{stroke-dashoffset:0}
.rs-kolo b{position:absolute; inset:0; display:grid; place-items:center; font-size:19px;
  font-weight:800; color:var(--rs-graf)}
.rs-pier h3{margin:0 0 3px; font-size:17px; color:var(--rs-graf)}
.rs-pier > span{display:block; font-size:14.5px; color:var(--rs-szary)}
.rs-pier p{margin:10px 0 0; font-size:14.5px; line-height:1.5; color:var(--rs-szary);
  max-width:none}

/* ——— kroki ze strzalkami ——— */
.rs-kroki{display:grid; grid-template-columns:repeat(4,1fr); gap:34px; counter-reset:rs-k;
  position:relative}
.rs-krok{position:relative; background:#fff; border:1px solid var(--rs-linia);
  border-radius:18px; padding:30px 20px 22px; text-align:center}
.rs-krok::before{counter-increment:rs-k; content:counter(rs-k); position:absolute;
  top:-17px; left:50%; transform:translateX(-50%); width:36px; height:36px; border-radius:50%;
  display:grid; place-items:center; font-weight:800; font-size:16px; color:#fff;
  background:linear-gradient(135deg,var(--rs-lim) 0%,var(--rs-lim-c) 100%)}
.rs-krok:not(:last-child)::after{content:""; position:absolute; top:50%; right:-24px;
  width:14px; height:14px; border-top:2px solid var(--rs-linia);
  border-right:2px solid var(--rs-linia); transform:translateY(-50%) rotate(45deg)}
.rs-krok h3{margin:4px 0 6px; font-size:17.5px; color:var(--rs-graf)}
.rs-krok p{margin:0; font-size:15.5px; color:var(--rs-szary); max-width:none}
.rs-kroki.rs-pion{grid-template-columns:1fr; gap:16px}
.rs-kroki.rs-pion .rs-krok{text-align:left; padding:20px 20px 20px 64px}
.rs-kroki.rs-pion .rs-krok::before{top:20px; left:18px; transform:none}
.rs-kroki.rs-pion .rs-krok::after{display:none}

/* ——— pas ofertowy: ciemna zielen + purpurowy przycisk ——— */
.rs-oferta{background:var(--rs-ziel); color:#fff; padding:44px 0}
.rs-oferta .rs-w{display:grid; grid-template-columns:65% 35%; gap:24px; align-items:center}
.rs-oferta .rs-cena{font-size:38px; font-weight:800; color:var(--rs-lim); line-height:1.05}
.rs-oferta .rs-opis{font-size:16px; color:#cfe0d3; margin-top:6px}
.rs-oferta .rs-btn{justify-self:end; min-width:240px; height:52px}

/* ——— karta ceny: packshot 45 / tresc 55 ——— */
.rs-cenakarta{background:#fff; border-radius:28px; box-shadow:var(--rs-cien2);
  max-width:1060px; margin:0 auto; overflow:hidden;
  display:grid; grid-template-columns:45% 55%; align-items:center}
.rs-cenakarta .rs-pack{background:var(--rs-ziel-j); padding:34px; display:grid;
  place-items:center}
.rs-cenakarta .rs-tresc{padding:38px 40px}
.rs-cenakarta .rs-kwota{font-size:52px; font-weight:800; color:var(--rs-pur); line-height:1.02}
.rs-cenakarta ul{margin:18px 0 24px; padding:0; list-style:none}
.rs-cenakarta li{padding:7px 0 7px 30px; position:relative; font-size:16.5px}
.rs-cenakarta li::before{content:""; position:absolute; left:3px; top:15px; width:14px;
  height:8px; border-left:2.6px solid var(--rs-lim-c); border-bottom:2.6px solid var(--rs-lim-c);
  transform:rotate(-45deg)}
.rs-cenakarta .rs-btn{min-width:260px; height:56px}

/* ——— formularz w ciemnozielonej karcie ——— */
.rs-form{background:var(--rs-ziel); border-radius:var(--rs-r-duzy); padding:32px 30px;
  box-shadow:var(--rs-cien2); color:#fff}
.rs-form h3{margin:0 0 6px; font-size:22px; color:#fff}
.rs-form .rs-fpod{margin:0 0 20px; font-size:15px; color:#cfe0d3; max-width:none}
.rs-form label{display:block; font-size:14px; font-weight:600; color:#cfe0d3; margin:0 0 6px}
.rs-form input[type=text],.rs-form input[type=tel]{width:100%; padding:14px 16px;
  font-size:17px; border:0; border-radius:14px; background:#fff; color:var(--rs-tekst);
  margin:0 0 16px; font-family:inherit}
.rs-form input:focus{outline:3px solid rgba(142,198,63,.55)}
.rs-form .rs-btn{width:100%; height:54px}
.rs-hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0;
  pointer-events:none}
.rs-odp{margin:14px 0 0; font-size:15.5px; font-weight:600; display:none; max-width:none}
.rs-odp.rs-ok{display:block; color:var(--rs-lim)}
.rs-odp.rs-zle{display:block; color:#ff9e9e}
.rs-form .rs-mikro{margin:14px 0 0; font-size:14px; color:#a9c4b0; max-width:none}
.rs-form .rs-mikro a{color:#cfe0d3}

/* ——— akordeon ——— */
.rs-akord{background:#fff; border:1px solid var(--rs-linia); border-radius:16px;
  margin:0 0 12px; overflow:hidden}
.rs-sek.rs-szara .rs-akord,.rs-sek.rs-zielona .rs-akord{background:#fff}
.rs-akord summary{padding:19px 22px; cursor:pointer; font-weight:700; font-size:17.5px;
  color:var(--rs-graf); list-style:none; position:relative; padding-right:52px}
.rs-akord summary::-webkit-details-marker{display:none}
.rs-akord summary::after{content:""; position:absolute; right:22px; top:26px; width:10px;
  height:10px; border-right:2.5px solid var(--rs-lim-c);
  border-bottom:2.5px solid var(--rs-lim-c); transform:rotate(45deg); transition:transform .2s}
.rs-akord[open] summary::after{transform:rotate(-135deg); top:30px}
.rs-akord .rs-tresc{padding:0 22px 20px; font-size:16.5px; color:var(--rs-szary)}
.rs-akord .rs-tresc p{margin:0 0 12px; max-width:none}
.rs-akord .rs-tresc p:last-child{margin:0}

/* ——— boczna karta przy FAQ ——— */
.rs-bok{background:var(--rs-tlo); border-radius:22px; padding:26px; text-align:center}
.rs-sek.rs-szara .rs-bok{background:#fff}
.rs-bok img{margin:0 auto 16px; max-width:230px}
.rs-bok .rs-fakt{font-size:15.5px; color:var(--rs-szary); margin:0 0 8px; max-width:none}
.rs-bok .rs-btn{margin-top:14px; width:100%}

/* ——— lista sprawdzen (opinie) ——— */
.rs-checki{margin:0; padding:0; list-style:none}
.rs-checki li{position:relative; padding:16px 0 16px 46px; border-bottom:1px solid var(--rs-linia)}
.rs-checki li:last-child{border-bottom:0}
.rs-checki li::before{content:""; position:absolute; left:8px; top:22px; width:16px; height:9px;
  border-left:2.8px solid var(--rs-lim-c); border-bottom:2.8px solid var(--rs-lim-c);
  transform:rotate(-45deg)}
.rs-checki b{display:block; font-size:17.5px; color:var(--rs-graf)}
.rs-checki span{font-size:16px; color:var(--rs-szary)}

/* ——— infografika 30 ml ——— */
.rs-info3{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; text-align:center}
.rs-info3 .rs-poz{padding:18px 10px}
.rs-info3 .rs-duza{font-size:34px; font-weight:800; color:var(--rs-lim-c); line-height:1.1}
.rs-info3 b{display:block; margin-top:8px; font-size:16px; color:var(--rs-graf)}
.rs-info3 span{font-size:14.5px; color:var(--rs-szary)}

/* ——— stopka: ciemna zielen, 3 kolumny ——— */
.rs-stopka{background:var(--rs-ziel); color:#9fb6a6; padding:52px 0 0; font-size:14px}
.rs-stopka .rs-w{display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:40px;
  padding-bottom:36px}
.rs-stopka .rs-logo{color:#fff; margin-bottom:12px}
.rs-stopka .rs-logo b{color:var(--rs-lim)}
.rs-stopka a{color:#cfe0d3; text-decoration:none; display:block; padding:4px 0}
.rs-stopka a:hover{color:#fff}
.rs-stopka h4{margin:0 0 10px; color:#fff; font-size:15px}
.rs-stopka p{max-width:none; margin:0}
.rs-dol{border-top:1px solid rgba(255,255,255,.12); padding:18px 0; font-size:13px;
  color:#8aa392}
.rs-dol .rs-w{display:block; padding-bottom:0}

/* ——— pasek mobilny ——— */
.rs-pasek{position:fixed; left:0; right:0; bottom:0; z-index:60; display:none;
  background:var(--rs-ziel); color:#fff; padding:10px 14px;
  box-shadow:0 -4px 18px rgba(0,0,0,.24)}
.rs-pasek .rs-in{display:flex; align-items:center; gap:12px}
.rs-pasek .rs-n{font-size:13.5px; color:#cfe0d3}
.rs-pasek .rs-c{font-size:19px; font-weight:800; color:var(--rs-lim)}
.rs-pasek .rs-btn{margin-left:auto; padding:12px 22px; font-size:15px; min-width:0}

/* ——— animacja ——— */
.rs-anim{opacity:1}
.rs-js .rs-anim{opacity:0; transform:translateY(14px); transition:opacity .6s, transform .6s}
.rs-js .rs-anim.rs-in{opacity:1; transform:none}

/* ——— tablet ——— */
@media (max-width:1080px){
  .rs-hero .rs-w{grid-template-columns:1fr; gap:34px}
  .rs-hero h1{font-size:38px}
  .rs-menu{display:none}
  .rs-duo{grid-template-columns:1fr !important; gap:30px}
  .rs-piers{grid-template-columns:repeat(3,1fr)}
  .rs-kroki{grid-template-columns:repeat(2,1fr); gap:28px}
  .rs-krok:not(:last-child)::after{display:none}
  .rs-karty.rs-k4{grid-template-columns:repeat(2,1fr)}
  .rs-cenakarta{grid-template-columns:1fr}
  .rs-oferta .rs-w{grid-template-columns:1fr}
  .rs-oferta .rs-btn{justify-self:start}
  .rs-stopka .rs-w{grid-template-columns:1fr 1fr}
}

/* ——— telefon ——— */
@media (max-width:640px){
  body{font-size:16px; padding-bottom:70px}
  .rs-w{padding:0 16px}
  .rs-hero{padding:32px 0 28px}
  .rs-hero h1{font-size:30px; letter-spacing:-.8px}
  .rs-lead{font-size:17px}
  .rs-sek{padding:44px 0}
  .rs-sek h2{font-size:26px}
  .rs-wst{font-size:16.5px; margin-bottom:22px}
  .rs-przyciski .rs-btn{width:100%; min-width:0}
  .rs-zaufanie .rs-w{grid-template-columns:1fr 1fr; min-height:0}
  .rs-zaufanie .rs-poz{border-left:0; padding:12px 0}
  .rs-karty.rs-k3,.rs-karty.rs-k4{grid-template-columns:1fr}
  .rs-piers{grid-template-columns:1fr 1fr; gap:14px}
  .rs-kroki{grid-template-columns:1fr; gap:26px}
  .rs-tab{font-size:14.5px}
  .rs-tab th,.rs-tab td{padding:10px 11px}
  .rs-cenakarta .rs-tresc{padding:26px 22px}
  .rs-cenakarta .rs-kwota{font-size:40px}
  .rs-cenakarta .rs-btn{min-width:0; width:100%}
  .rs-obraz.rs-wysoki img{height:300px}
  .rs-panorama img{height:210px}
  .rs-mini img{height:70px}
  .rs-pasek{display:block}
  .rs-stopka .rs-w{grid-template-columns:1fr; gap:26px}
  .rs-info3{grid-template-columns:1fr}
}

/* ==========================================================================
   PAS INSTRUKCJI (27.09.2026) — Krzysiek: „zeby obrazki laczyly sie w instrukcje”.
   Cztery klatki z jednej sceny stoja obok siebie bez odstepu, rozdzielone tylko
   biala szczelina; numer siedzi na zdjeciu, strzalka na szwie miedzy klatkami.
   Efekt: czyta sie jak jedna tasma, a nie jak cztery osobne kafelki.
   ========================================================================== */

.rs-instr{
  display:grid; grid-template-columns:repeat(4,1fr); gap:0;
  border-radius:var(--rs-r-duzy); overflow:hidden; background:#fff;
  box-shadow:var(--rs-cien2); margin-top:8px;
}
.rs-instr .rs-kl{position:relative; display:flex; flex-direction:column}
.rs-instr .rs-kl + .rs-kl{border-left:4px solid #fff}

.rs-instr .rs-kadr{position:relative; overflow:hidden}
.rs-instr .rs-kadr img{width:100%; height:250px; object-fit:cover; display:block}

/* numer na zdjeciu */
.rs-instr .rs-nr{
  position:absolute; top:14px; left:14px; width:38px; height:38px; border-radius:50%;
  display:grid; place-items:center; font:800 17px/1 "Segoe UI",Roboto,Arial,sans-serif;
  color:#fff; background:linear-gradient(135deg,var(--rs-lim) 0%,var(--rs-lim-c) 100%);
  box-shadow:0 3px 10px rgba(0,0,0,.22); z-index:2;
}

/* strzalka na szwie */
.rs-instr .rs-kl:not(:last-child) .rs-kadr::after{
  content:""; position:absolute; top:125px; right:-15px; z-index:3;
  width:30px; height:30px; border-radius:50%; background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.16);
}
.rs-instr .rs-kl:not(:last-child) .rs-kadr::before{
  content:""; position:absolute; top:134px; right:-6px; z-index:4;
  width:9px; height:9px; border-top:2.4px solid var(--rs-lim-c);
  border-right:2.4px solid var(--rs-lim-c); transform:rotate(45deg);
}

.rs-instr .rs-opis{padding:18px 20px 22px; background:#fff; flex:1}
.rs-instr .rs-opis b{display:block; font-size:17px; color:var(--rs-graf); margin-bottom:5px}
.rs-instr .rs-opis span{display:block; font-size:15px; line-height:1.5; color:var(--rs-szary)}

/* ——— tablet: dwie kolumny, szwy tylko w poziomie pierwszego rzedu ——— */
@media (max-width:1080px){
  .rs-instr{grid-template-columns:repeat(2,1fr)}
  .rs-instr .rs-kl:nth-child(odd){border-left:0}
  .rs-instr .rs-kl:nth-child(n+3){border-top:4px solid #fff}
  .rs-instr .rs-kl:nth-child(2) .rs-kadr::after,
  .rs-instr .rs-kl:nth-child(2) .rs-kadr::before{display:none}
}

/* ——— telefon: jedna kolumna, strzalki schodza pod zdjecie ——— */
@media (max-width:640px){
  .rs-instr{grid-template-columns:1fr}
  .rs-instr .rs-kl + .rs-kl{border-left:0; border-top:4px solid #fff}
  .rs-instr .rs-kadr img{height:200px}
  .rs-instr .rs-kl:not(:last-child) .rs-kadr::after{
    top:auto; bottom:-15px; right:50%; transform:translateX(50%);
  }
  .rs-instr .rs-kl:not(:last-child) .rs-kadr::before{
    top:auto; bottom:-6px; right:50%; transform:translateX(50%) rotate(135deg);
  }
}