/* Kreator /demo/ — dokładka do /_assets/style.css (tokeny, btn, shell, eyebrow stamtąd).
   Mobile first: podgląd na górze, pytanie pod nim. Od 900px dwie kolumny. */

/* ---------- nagłówek ---------- */
.kr-head{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:.7rem 0}
.kr-head-in{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.kr-kontakt{display:flex;align-items:center;gap:.7rem}
.kr-head .nav-phone{text-align:right;font-size:.95rem;line-height:1.2}
/* Numer nigdy nie łamie się w środku: „+48 511 608 / 362" wyglądało jak dwa numery.
   Na wąskim telefonie znika podpis pod numerem, a gdy dalej brakuje miejsca,
   przełącznik języka schodzi do drugiego rzędu, zamiast wyjechać za ekran. */
.kr-head .nav-phone{white-space:nowrap}
.kr-head .nav-phone small{white-space:normal}
@media(max-width:430px){
  .kr-head .nav-phone small{display:none}
  .kr-head-in{flex-wrap:wrap;row-gap:.4rem}
}
/* WhatsApp to inny numer niz telefon (725 951 769), tak jak na landingach /lp/ */
.kr-wa{display:inline-flex;align-items:center;gap:.45rem;flex:none;
  background:#25d366;color:#fff;border-radius:999px;padding:.5rem .85rem;
  font-weight:800;font-size:.88rem;line-height:1;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease);
  box-shadow:0 8px 20px -10px rgba(37,211,102,.9)}
.kr-wa:hover{transform:translateY(-2px);box-shadow:0 14px 26px -12px rgba(37,211,102,.95)}
.kr-wa span{display:none}
@media(min-width:560px){.kr-wa span{display:inline}}

/* ---------- etap 1: hook ---------- */
.kr-hook{padding:1.6rem 0 3rem}
.kr-hook-panel{background:linear-gradient(135deg,var(--lime) 0%,#e4f7dd 42%,var(--mint) 100%);
  border-radius:var(--r-panel);padding:2.4rem 1.5rem}
.kr-hook-grid{display:grid;gap:2.2rem}
.kr-hook h1{font-size:clamp(1.9rem,7.2vw,3.3rem);margin:.9rem 0 1rem}
.kr-hook .lede{font-size:1.05rem}
.kr-hook-cta{margin:1.7rem 0 1.3rem}
.kr-hook-cta .btn{width:100%;padding:1.15rem 2rem;font-size:1.08rem}
.kr-trust{list-style:none;display:grid;gap:.55rem;font-size:.92rem;color:#41485e;font-weight:600}
.kr-trust li{display:flex;align-items:flex-start;gap:.6rem}
.kr-trust li::before{content:"";flex:none;width:18px;height:18px;margin-top:.22rem;border-radius:50%;
  background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/11px no-repeat}

body[data-etap="kreator"] .kr-hook{display:none}

/* ---------- okno przeglądarki ---------- */
.kr-okno{border-radius:16px;overflow:hidden;background:#fff;border:1px solid var(--line);
  box-shadow:var(--shadow)}
.kr-okno-belka{display:flex;align-items:center;gap:.35rem;padding:.55rem .8rem;
  background:#f2f4f8;border-bottom:1px solid var(--line)}
.kr-okno-belka i{width:9px;height:9px;border-radius:50%;background:#d3d8e2;flex:none}
.kr-okno-url{margin-left:.6rem;font-size:.72rem;font-weight:700;color:var(--muted);
  background:#fff;border-radius:999px;padding:.2rem .75rem;border:1px solid var(--line);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:72%}
.kr-okno-ekran{background:#fff;min-height:220px}
.kr-okno-pusty{display:grid;place-items:center;min-height:260px;
  background:repeating-linear-gradient(135deg,#fafbfc 0 12px,#f4f6f9 12px 24px)}
.kr-pusty-tekst{text-align:center;color:var(--muted);font-weight:700;line-height:1.6}
.kr-pusty-tekst strong{color:var(--ink);font-size:1.2rem}

/* ---------- etap 2: scena ---------- */
body[data-etap="hook"] .kr-scena{display:none}
.kr-scena{padding:1rem 0 5rem}
.kr-scena-in{display:grid;gap:1.4rem}

/* podgląd: na telefonie przyklejony pod nagłówkiem, przycięty, z rozwijaniem */
.kr-panel-podglad{position:sticky;top:54px;z-index:40;background:#fff;
  padding-bottom:.6rem;margin:0 -4vw;padding-inline:4vw}
.kr-podglad-naglowek{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;
  padding:.35rem 0 .5rem}
.kr-podglad-naglowek .kr-widok{margin-left:auto}
.kr-podglad-etykieta{font-size:.7rem;font-weight:800;letter-spacing:.18em;
  text-transform:uppercase;color:var(--green-dark)}
.kr-podglad-toggle{background:none;border:0;font:inherit;font-size:.8rem;font-weight:800;
  color:var(--muted);cursor:pointer;padding:.2rem .4rem;text-decoration:underline}
/* Uczciwe zastrzezenie: to szkielet, nie gotowa strona. Ma byc widoczne, nie schowane. */
.kr-podglad-uwaga{display:flex;gap:.5rem;font-size:.76rem;line-height:1.45;color:#7a6a3c;
  background:#fdf6e3;border:1px solid #f0e2bd;border-radius:10px;
  padding:.55rem .7rem;margin-bottom:.6rem}
.kr-podglad-uwaga::before{content:"";flex:none;width:15px;height:15px;margin-top:.08rem;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b08a2e' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 8h.01M11 12h1v4h1'/%3E%3C/svg%3E") center/contain no-repeat}
.kr-panel-podglad .kr-okno-ekran{max-height:34vh;overflow:hidden;position:relative;
  -webkit-mask-image:linear-gradient(#000 76%,transparent 100%);
  mask-image:linear-gradient(#000 76%,transparent 100%)}

/* ---------- pasek postępu ---------- */
.kr-postep{margin-bottom:1.5rem}
.kr-postep-pasek{height:5px;border-radius:999px;background:var(--line);overflow:hidden}
.kr-postep-pasek span{display:block;height:100%;width:0;border-radius:999px;
  background:var(--green);transition:width .45s var(--ease)}
.kr-postep-opis{margin-top:.5rem;font-size:.76rem;font-weight:800;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted)}

/* ---------- pytanie ---------- */
/* Przyklejony naglowek ma ~56px, a na telefonie doklada sie do tego przyklejony
   podglad. Bez tego marginesu scrollIntoView chowa tytul pytania pod naglowkiem
   (punkt 9 z strony-klientow/CHECKLIST.md). */
/* --kr-glowa i --kr-pasek mierzy kreator.js: wysokość nagłówka strony i paska
   podglądu przyklejonego na telefonie. Sztywne 78 px chowało tytuł pytania
   pod podglądem, który miał wtedy ponad 500 px. */
/* --muted z arkusza strony głównej (#8b91a7) ma na białym 3,1:1, poniżej AA.
   Na stronach kreatora ciemniejszy odcień tej samej szarości: 5,96:1. */
:root{--kr-glowa:54px;--kr-pasek:0px;--muted:#5d6378}
.kr-panel-pytanie{scroll-margin-top:calc(var(--kr-glowa) + var(--kr-pasek) + 14px)}
html{scroll-padding-top:calc(var(--kr-glowa) + var(--kr-pasek) + 14px)}
.kr-pyt-tytul{font-size:clamp(1.45rem,5.6vw,2rem);margin-bottom:.55rem;
  scroll-margin-top:calc(var(--kr-glowa) + var(--kr-pasek) + 14px)}
.kr-pyt-opis{font-size:.98rem;color:var(--body);margin-bottom:1.4rem;max-width:46ch}

.kr-opcje{display:grid;gap:.6rem}
.kr-opcje-chipy{display:flex;flex-wrap:wrap;gap:.5rem}

.kr-opcja{display:flex;align-items:center;gap:.85rem;width:100%;text-align:left;
  padding:1rem 1.15rem;border:2px solid var(--line);border-radius:14px;background:#fff;
  font:inherit;font-weight:700;color:var(--ink);cursor:pointer;
  transition:border-color .2s,background .2s,transform .2s var(--ease)}
.kr-opcja:hover{border-color:var(--green);transform:translateY(-2px)}
.kr-opcja[aria-pressed="true"]{border-color:var(--green);background:var(--green-soft)}
.kr-opcja-znacznik{flex:none;width:22px;height:22px;border-radius:7px;border:2px solid var(--line);
  display:grid;place-items:center;transition:background .2s,border-color .2s}
.kr-opcja[aria-pressed="true"] .kr-opcja-znacznik{background:var(--green);border-color:var(--green)}
.kr-opcja-znacznik::after{content:"";width:11px;height:11px;opacity:0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/contain no-repeat}
.kr-opcja[aria-pressed="true"] .kr-opcja-znacznik::after{opacity:1}
.kr-opcja-tresc{display:grid;gap:.15rem}
.kr-opcja-podpis{font-size:.84rem;font-weight:600;color:var(--muted)}
/* próbka palety przy wyborze stylu */
.kr-probka{margin-left:auto;flex:none;display:flex;gap:4px;align-items:center;
  width:52px;height:30px;border-radius:8px;border:1px solid;padding:0 7px}
.kr-probka i{width:12px;height:12px;border-radius:50%;display:block}

.kr-chip{padding:.6rem 1rem;border:2px solid var(--line);border-radius:999px;background:#fff;
  font:inherit;font-size:.92rem;font-weight:700;color:var(--ink);cursor:pointer;
  transition:border-color .2s,background .2s,transform .2s var(--ease)}
.kr-chip:hover{border-color:var(--green);transform:translateY(-2px)}
.kr-chip[aria-pressed="true"]{border-color:var(--green);background:var(--green-soft);color:var(--ink)}

.kr-pole{display:grid;gap:.4rem;margin-top:1rem}
.kr-pole label{font-size:.82rem;font-weight:800;color:var(--ink)}
.kr-pole input{width:100%;padding:.95rem 1.1rem;border:2px solid var(--line);border-radius:14px;
  font:inherit;font-size:1rem;color:var(--ink);background:#fff;transition:border-color .2s}
.kr-pole input:focus{outline:none;border-color:var(--green)}
.kr-pole input:focus-visible{border-color:#1b7a43;box-shadow:0 0 0 3px rgba(27,122,67,.18)}
.kr-pole-podpis{font-size:.8rem;color:var(--muted)}
.kr-blad{font-size:.85rem;font-weight:700;color:#c2372f;margin-top:.7rem}
.kr-blad:empty{display:none}

/* ---------- nawigacja ---------- */
.kr-nawigacja{display:flex;align-items:center;gap:1rem;margin-top:1.8rem}
.kr-nawigacja .btn{flex:1;padding:1.1rem 2rem}
.kr-wstecz{background:none;border:0;font:inherit;font-weight:800;color:var(--muted);
  cursor:pointer;padding:.6rem .2rem}
.kr-wstecz:hover{color:var(--ink)}
.kr-wstecz[hidden]{display:none}
/* .btn z style.css ma display:inline-flex i przebija atrybut hidden. Bez tego
   po wysłaniu zostawał widoczny przycisk „Wyślij”, a jego kliknięcie wysyłało drugi raz. */
.kr-scena [hidden]{display:none !important}

/* ---------- podgląd: treść strony ----------
   Kolory idą ze zmiennych ustawianych z kreator.js przy wyborze stylu.
   Wartości tutaj to tylko wariant startowy, zanim user wybierze paletę. */
.pv{font-size:11px;line-height:1.5;
  --pv-tlo:#ffffff; --pv-ink:#16223d; --pv-tekst:#56607a;
  --pv-akcent:#2f6bff; --pv-miekki:#eef3ff; --pv-linia:#e4e9f2; --pv-na-akcencie:#fff;
  background:var(--pv-tlo);color:var(--pv-tekst);transition:background .35s var(--ease)}
.pv-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;
  padding:.7rem .9rem;border-bottom:1px solid var(--pv-linia)}
.pv-logo{font-weight:900;font-size:12px;color:var(--pv-ink);letter-spacing:-.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:52%}
.pv-menu{display:flex;gap:.55rem;font-size:8.5px;font-weight:700;color:var(--pv-tekst);opacity:.8}
.pv-menu span{white-space:nowrap}
.pv-hero{position:relative;aspect-ratio:16/8;background:var(--pv-miekki);overflow:hidden}
.pv-hero img{width:100%;height:100%;object-fit:cover}
/* Mocny cień pod tekstem: zdjęcia bywają jasne, a napis musi być czytelny na każdym. */
.pv-hero-tekst{position:absolute;inset:auto 0 0 0;padding:1.4rem .9rem .8rem;
  background:linear-gradient(transparent,rgba(18,22,38,.45) 26%,rgba(18,22,38,.88));color:#fff;
  text-shadow:0 1px 6px rgba(0,0,0,.45)}
.pv-hero-tekst h3{color:#fff;font-size:14px;line-height:1.2;margin-bottom:.15rem}
.pv-hero-tekst p{font-size:9.5px;opacity:.9}
.pv-hero-cta{display:inline-block;margin-top:.45rem;background:var(--pv-akcent);color:var(--pv-na-akcencie);
  font-size:8.5px;font-weight:800;padding:.3rem .7rem;border-radius:999px}
.pv-termin{display:flex;align-items:center;gap:.4rem;padding:.45rem .9rem;
  background:var(--pv-miekki);color:var(--pv-akcent);font-size:9px;font-weight:800}
.pv-sekcja{padding:.85rem .9rem;border-top:1px solid var(--pv-linia)}
.pv-sekcja h4{font-size:10.5px;color:var(--pv-ink);margin-bottom:.5rem;
  display:flex;align-items:center;gap:.35rem}
.pv-sekcja h4::before{content:"";width:12px;height:2px;background:var(--pv-akcent);border-radius:2px;flex:none}
.pv-wiersz{display:flex;align-items:center;justify-content:space-between;gap:.6rem;
  padding:.3rem 0;border-bottom:1px dashed var(--pv-linia);font-size:9.5px}
.pv-wiersz:last-child{border-bottom:0}
.pv-kreska{height:7px;border-radius:99px;background:var(--pv-linia);flex:none}
.pv-kafle{display:grid;grid-template-columns:repeat(3,1fr);gap:.35rem}
.pv-kafel{aspect-ratio:1;border-radius:6px;background:var(--pv-miekki);overflow:hidden}
.pv-kafel img{width:100%;height:100%;object-fit:cover;opacity:.92}
.pv-mapa{height:74px;border-radius:8px;position:relative;overflow:hidden;
  background:
    repeating-linear-gradient(0deg,var(--pv-linia) 0 1px,transparent 1px 17px),
    repeating-linear-gradient(90deg,var(--pv-linia) 0 1px,transparent 1px 21px),var(--pv-miekki)}
.pv-pinezka{position:absolute;left:50%;top:50%;transform:translate(-50%,-100%);
  width:15px;height:15px;border-radius:50% 50% 50% 0;background:var(--pv-akcent);rotate:-45deg;
  box-shadow:0 3px 8px rgba(37,42,78,.3)}
.pv-adres{margin-top:.4rem;font-size:9px;color:var(--pv-tekst);opacity:.75}
.pv-godziny{display:grid;gap:.18rem}
.pv-formularz{display:grid;gap:.3rem}
.pv-input{height:20px;border-radius:6px;background:var(--pv-miekki);border:1px solid var(--pv-linia)}
.pv-przycisk{height:22px;border-radius:99px;background:var(--pv-akcent);display:grid;place-items:center;
  color:var(--pv-na-akcencie);font-size:8.5px;font-weight:800}
.pv-gwiazdki{color:#f5b301;letter-spacing:1px;font-size:9px}
.pv-opinia{padding:.35rem 0;border-bottom:1px dashed var(--pv-linia);display:grid;gap:.22rem}
.pv-opinia:last-child{border-bottom:0}
.pv-zrodlo{font-size:8.5px;color:var(--pv-tekst);opacity:.7;margin-top:.35rem}
.pv-stopka{padding:.6rem .9rem;background:var(--pv-miekki);border-top:1px solid var(--pv-linia);
  display:flex;justify-content:space-between;gap:.5rem;font-size:8.5px;color:var(--pv-tekst)}
.pv-odznaki{display:flex;flex-wrap:wrap;gap:.3rem;padding:.55rem .9rem .1rem}
.pv-odznaka{font-size:8px;font-weight:800;padding:.2rem .5rem;border-radius:999px;
  background:var(--pv-miekki);color:var(--pv-akcent);border:1px solid var(--pv-linia)}
.pv-nowe{animation:pvWejscie .45s var(--ease)}
@keyframes pvWejscie{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- podsumowanie ---------- */
.kr-podsum{display:grid;gap:.5rem;margin:1.2rem 0 .4rem;padding:1.1rem 1.2rem;
  border:1px solid var(--line);border-radius:16px;background:var(--tint)}
.kr-podsum-wiersz{display:flex;justify-content:space-between;gap:1rem;font-size:.92rem}
.kr-podsum-wiersz dt{color:var(--muted);font-weight:600;flex:none}
.kr-podsum-wiersz dd{font-weight:800;color:var(--ink);text-align:right}
.kr-zgoda{display:flex;gap:.7rem;align-items:flex-start;margin-top:1.1rem;
  font-size:.82rem;color:var(--body);line-height:1.5}
.kr-zgoda input{flex:none;width:20px;height:20px;margin-top:.1rem;accent-color:var(--green)}

/* ---------- desktop ---------- */
@media(min-width:900px){
  .kr-hook{padding:3rem 0 4rem}
  .kr-hook-panel{padding:3.4rem 3rem}
  .kr-hook-grid{grid-template-columns:1.04fr .96fr;gap:3rem;align-items:center}
  .kr-hook-cta .btn{width:auto}
  .kr-scena{padding:2.4rem 0 6rem}
  .kr-scena-in{grid-template-columns:1fr 1.06fr;gap:3rem;align-items:start}
  .kr-panel-pytanie{order:1;padding-top:.4rem}
  .kr-panel-podglad{order:2;position:sticky;top:86px;margin:0;padding-inline:0}
  .kr-panel-podglad .kr-okno-ekran{max-height:none;-webkit-mask-image:none;mask-image:none}
  .kr-podglad-toggle{display:none}
  .kr-nawigacja .btn{flex:0 0 auto;min-width:200px}
  .pv{font-size:12.5px}
  .pv-logo{font-size:14px}
  .pv-menu{font-size:9.5px}
  .pv-hero-tekst h3{font-size:17px}
  .pv-sekcja h4{font-size:12px}
}

/* ---------- oferta ankiety po wysłaniu (10% rabatu) ----------
   Ciemna zieleń #1b7a43 zamiast --green-dark, bo ta ma na białym tylko 2,6:1. */
.kr-rabat{margin-top:1.2rem;padding:1rem 1.1rem 1.1rem;border:2px dashed #1b7a43;border-radius:16px;
  background:var(--green-soft);animation:pvWejscie .45s var(--ease)}
.kr-rabat-tytul{font-weight:800;color:var(--ink);margin:0 0 .3rem;font-size:1.02rem;line-height:1.35}
.kr-rabat-tytul strong{color:#1b7a43;font-size:1.35rem;font-weight:900;margin-right:.25rem}
.kr-rabat-opis{font-size:.92rem;color:var(--body);margin:0 0 .85rem;line-height:1.5}
.kr-rabat-btn{width:100%;background:#1b7a43;box-shadow:0 12px 30px -12px rgba(27,122,67,.8)}
.kr-rabat-btn:hover{background:#146236}
.kr-rabat-btn:focus-visible{outline:3px solid var(--ink);outline-offset:3px}

/* Karta push pod kuponem. Lżejsza od niego (ciągła ramka, białe tło, obrysowany
   przycisk), żeby nie odbierała rabatowi pierwszego kliknięcia. #1b7a43 na bieli
   ma 5,4:1, na --green-soft 5,0:1. */
.kr-push{display:flex;gap:.85rem;align-items:flex-start;margin-top:.9rem;padding:.95rem 1rem;
  border:2px solid #d6dbe8;border-radius:16px;background:#fff;
  animation:pvWejscie .45s var(--ease) .15s both;transition:border-color .25s,background-color .25s}
.kr-push-ikona{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;
  background:var(--green-soft);color:#1b7a43;transition:background-color .25s,color .25s}
.kr-push-tresc{flex:1;min-width:0}
.kr-push-tytul{font-weight:800;color:var(--ink);margin:0 0 .2rem;font-size:.98rem;line-height:1.35}
.kr-push-opis{font-size:.9rem;color:var(--body);margin:0 0 .7rem;line-height:1.5}
.kr-push-btn{display:inline-flex;align-items:center;min-height:44px;padding:.5rem 1.1rem;
  border:2px solid #1b7a43;border-radius:999px;background:#fff;color:#1b7a43;
  font:inherit;font-size:.92rem;font-weight:800;cursor:pointer;transition:background-color .2s,color .2s}
.kr-push-btn:hover{background:#1b7a43;color:#fff}
.kr-push-btn:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.kr-push-btn:disabled{opacity:.6;cursor:progress}
.kr-push.czeka .kr-push-ikona svg{animation:krDzwonek .9s ease-in-out infinite;transform-origin:50% 15%}
.kr-push.wlaczone{border-color:#1b7a43;background:var(--green-soft)}
.kr-push.wlaczone .kr-push-ikona{background:#1b7a43;color:#fff}
.kr-push.wlaczone .kr-push-opis,.kr-push.nie-wyszlo .kr-push-opis{margin-bottom:0}
@keyframes krDzwonek{0%,100%{transform:rotate(0)}25%{transform:rotate(14deg)}75%{transform:rotate(-14deg)}}
@media (prefers-reduced-motion:reduce){.kr-push,.kr-push.czeka .kr-push-ikona svg{animation:none}}

/* Darmowy audyt obecnej strony, pod kuponem i pushem. Ta sama rodzina co push
   (ciągła ramka, obrysowany przycisk), żeby nie zabierała kuponowi pierwszego
   kliknięcia; ikona w kwadracie, a nie w kółku, żeby obie karty się nie zlewały.
   Adres strony jak etykieta: lead widzi, że chodzi o JEGO stronę, bez wpisywania.
   #8a2b2b na bieli 8,6:1, #1b7a43 na --green-soft 5,0:1. */
.kr-audyt{display:flex;gap:.85rem;align-items:flex-start;margin-top:.9rem;padding:.95rem 1rem;
  border:2px solid #d6dbe8;border-radius:16px;background:#fff;
  animation:pvWejscie .45s var(--ease) .3s both;transition:border-color .25s,background-color .25s}
.kr-audyt-ikona{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;
  background:var(--green-soft);color:#1b7a43;transition:background-color .25s,color .25s}
.kr-audyt-tresc{flex:1;min-width:0}
.kr-audyt-tytul{font-weight:800;color:var(--ink);margin:0 0 .2rem;font-size:.98rem;line-height:1.35}
.kr-audyt-opis{font-size:.9rem;color:var(--body);margin:0 0 .7rem;line-height:1.5}
.kr-audyt-adres{display:inline-block;max-width:100%;margin:0 0 .75rem;padding:.3rem .65rem;border-radius:8px;
  background:#f1f4f9;color:var(--ink);font-size:.85rem;font-weight:700;overflow-wrap:anywhere}
.kr-audyt-pole{margin:0 0 .75rem}
.kr-audyt-pole input{padding:.75rem .9rem}
.kr-audyt.czeka .kr-audyt-btn{cursor:progress}
.kr-audyt.zamowione{border-color:#1b7a43;background:var(--green-soft)}
.kr-audyt.zamowione .kr-audyt-ikona{background:#1b7a43;color:#fff}
.kr-audyt.zamowione .kr-audyt-opis{margin-bottom:0}
.kr-audyt.nie-wyszlo .kr-audyt-opis{color:#8a2b2b;font-weight:700}
@media (prefers-reduced-motion:reduce){.kr-audyt{animation:none}}

/* Chipy i opcje to przyciski: fokus z klawiatury musi być widać (WCAG 2.4.7). */
.kr-chip:focus-visible,.kr-opcja:focus-visible{outline:3px solid #1b7a43;outline-offset:2px}

@media(prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

/* ---------- przerolowanie wygladu ---------- */
.kr-rolka{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem .8rem;margin-bottom:1.2rem;
  padding:.7rem .85rem;border:1px dashed var(--line);border-radius:14px;background:var(--tint)}
.kr-rolka-btn{display:inline-flex;align-items:center;gap:.45rem;border:2px solid var(--green);
  background:var(--green-soft);color:var(--ink);font:inherit;font-size:.86rem;font-weight:800;
  border-radius:999px;padding:.5rem .95rem;cursor:pointer;
  transition:transform .2s var(--ease),background .2s}
.kr-rolka-btn:hover{transform:translateY(-2px);background:#fff}
.kr-rolka-btn span{font-size:1rem;line-height:1}
.kr-rolka-reset{background:none;border:0;font:inherit;font-size:.8rem;font-weight:700;
  color:var(--muted);text-decoration:underline;cursor:pointer;padding:.3rem 0}
.kr-rolka-reset:hover{color:var(--ink)}
.kr-rolka-opis{margin-left:auto;font-size:.76rem;font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted)}

.kr-grupa-etykieta{font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);margin:0 0 .6rem}

/* ---------- zgody ---------- */
.kr-zgody{display:grid;gap:.1rem;margin-top:1.3rem;border:1px solid var(--line);
  border-radius:14px;overflow:hidden}
.kr-zgody .kr-zgoda{margin:0;padding:.85rem 1rem;background:#fff;
  border-bottom:1px solid var(--line);align-items:flex-start}
.kr-zgody .kr-zgoda:last-child{border-bottom:0}
.kr-zgoda-wszystko{background:var(--tint) !important}
.kr-zgody a{color:var(--green-dark);font-weight:700;text-decoration:underline}
.kr-zgody em{font-style:normal;font-size:.74rem;font-weight:800;letter-spacing:.05em;
  text-transform:uppercase;color:var(--muted);white-space:nowrap}

/* ---------- warianty ukladu w podgladzie ---------- */
.pv-head-srodek{flex-direction:column;gap:.3rem;text-align:center}
.pv-head-srodek .pv-logo{max-width:100%}
.pv-head-menu-pod{padding-bottom:.5rem}
.pv-head-menu-pod .pv-menu{justify-content:center;width:100%}
.pv-hero-srodek{inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;
  background:linear-gradient(rgba(18,22,38,.42),rgba(18,22,38,.62))}
.pv-hero-srodek h3{font-size:17px}
.pv-kafel,.pv-input,.pv-mapa{border-radius:var(--pv-radius,6px)}
.pv-uklad-pelnoekranowy .pv-hero-tekst h3{font-size:19px}
.pv-uklad-kompaktowy .pv-sekcja{padding-top:.6rem;padding-bottom:.6rem}
.pv-uklad-miekki .pv-sekcja{padding-top:1.05rem;padding-bottom:1.05rem}

/* ---------- warianty hero i sekcji zalezne od ukladu ---------- */
.pv-hero-czyste .pv-hero-tekst{display:none}
.pv-hero-pod{padding:.85rem .9rem .3rem}
.pv-hero-pod h3{font-size:15px;color:var(--pv-ink);line-height:1.15;margin-bottom:.15rem}
.pv-hero-pod p{font-size:9.5px;color:var(--pv-tekst)}
.pv-hero-pod .pv-hero-cta{display:inline-block;margin-top:.5rem}
.pv-hero-zkarta{overflow:visible;margin-bottom:26px}
.pv-hero-karta{position:absolute;left:8%;right:8%;bottom:-22px;background:var(--pv-tlo);
  border:1px solid var(--pv-linia);border-radius:var(--pv-radius,12px);
  padding:.7rem .8rem;box-shadow:0 10px 26px -14px rgba(20,24,40,.5)}
.pv-hero-karta h3{font-size:14px;color:var(--pv-ink);line-height:1.15;margin-bottom:.1rem}
.pv-hero-karta p{font-size:9px;color:var(--pv-tekst)}
.pv-hero-karta .pv-hero-cta{margin-top:.4rem}
.pv-burger{display:block;width:16px;height:11px;flex:none;
  border-top:2px solid var(--pv-tekst);border-bottom:2px solid var(--pv-tekst);position:relative}
.pv-burger::after{content:"";position:absolute;left:0;right:0;top:50%;margin-top:-1px;
  height:2px;background:var(--pv-tekst)}
.pv-menu-pigulki .pv-menu span{border:1px solid var(--pv-linia);border-radius:999px;
  padding:.16rem .5rem}
.pv-karty{display:grid;gap:.4rem}
.pv-karta{display:grid;gap:.35rem;padding:.55rem .65rem;border:1px solid var(--pv-linia);
  border-radius:var(--pv-radius,8px);background:var(--pv-miekki);font-size:9.5px}

/* ---------- przelacznik komputer / telefon ---------- */
.kr-widok{display:flex;gap:2px;padding:2px;background:var(--line);border-radius:999px}
.kr-widok-btn{display:inline-flex;align-items:center;gap:.3rem;border:0;background:transparent;
  font:inherit;font-size:.74rem;font-weight:800;color:var(--muted);cursor:pointer;
  padding:.3rem .6rem;border-radius:999px;transition:background .2s,color .2s}
.kr-widok-btn[aria-pressed="true"]{background:#fff;color:var(--ink);
  box-shadow:0 1px 4px rgba(37,42,78,.16)}
.kr-widok-btn svg{flex:none}

/* Widok telefonu: ten sam szkic zwezony do szerokosci ekranu telefonu.
   !important przy galerii, bo liczbe kolumn ustawia uklad stylem inline. */
.kr-okno-mobil .kr-okno-ekran{background:repeating-linear-gradient(135deg,#f4f6f9 0 10px,#eef1f5 10px 20px);
  padding:10px 0}
.kr-okno-mobil .pv{max-width:330px;margin-inline:auto;border-radius:12px;overflow:hidden;
  box-shadow:0 8px 24px -10px rgba(20,24,40,.45);border:1px solid var(--pv-linia)}
.kr-okno-mobil .pv-menu{display:none}
.kr-okno-mobil .pv-head::after{content:"";width:16px;height:11px;flex:none;
  border-top:2px solid var(--pv-tekst);border-bottom:2px solid var(--pv-tekst)}
.kr-okno-mobil .pv-head-srodek::after{display:none}
.kr-okno-mobil .pv-kafle{grid-template-columns:repeat(2,1fr) !important}
.kr-okno-mobil .pv-hero{aspect-ratio:4/3 !important}
.kr-okno-mobil .pv-hero-karta{left:5%;right:5%}
.kr-okno-mobil .pv-wiersz,.kr-okno-mobil .pv-karta{font-size:9px}
.kr-okno-mobil .pv-stopka{flex-direction:column;gap:.15rem}

/* ---------- anti-exit popup ---------- */
.kr-popup{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:1.2rem;
  background:rgba(20,24,40,.55);backdrop-filter:blur(3px);
  opacity:0;transition:opacity .22s var(--ease)}
.kr-popup.widoczny{opacity:1}
.kr-popup-karta{position:relative;width:min(430px,100%);background:#fff;border-radius:22px;
  padding:1.8rem 1.5rem 1.4rem;box-shadow:0 30px 70px -24px rgba(20,24,40,.6);
  transform:translateY(14px);transition:transform .25s var(--ease)}
.kr-popup.widoczny .kr-popup-karta{transform:none}
.kr-popup-karta h3{font-size:1.32rem;line-height:1.2;margin-bottom:.5rem;padding-right:1.6rem}
.kr-popup-karta p{font-size:.95rem;color:var(--body)}
.kr-popup-x{position:absolute;top:.7rem;right:.9rem;background:none;border:0;
  font-size:1.6rem;line-height:1;color:var(--muted);cursor:pointer;padding:.2rem .4rem}
.kr-popup-x:hover{color:var(--ink)}
.kr-popup-akcje{display:grid;gap:.6rem;margin-top:1.2rem}
.kr-popup-akcje .btn{width:100%}
.kr-popup-nie{background:none;border:0;font:inherit;font-weight:700;font-size:.9rem;
  color:var(--muted);cursor:pointer;padding:.5rem}
.kr-popup-nie:hover{color:var(--ink)}
.kr-popup-stopka{margin-top:.9rem;text-align:center;font-size:.78rem;color:var(--muted)}
@media(min-width:520px){.kr-popup-akcje{grid-template-columns:1fr auto;align-items:center}}

/* ----------------------------------------------------- przełącznik języka */

.kr-jez {
  display: flex;
  gap: 2px;
  margin-left: auto;
  padding: 3px;
  border: 1px solid var(--line, #e4e9f2);
  border-radius: 999px;
  background: #fff;
}
.kr-jez-btn {
  padding: 4px 11px;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .04em;
  color: #6b7488;
  text-decoration: none;
  line-height: 1.5;
}
.kr-jez-btn:hover { color: var(--green-dark, #14532d); }
.kr-jez-btn.aktywny { background: var(--green-dark, #14532d); color: #fff; }

/* Wysyłka padła: komunikat musi być widoczny, bo user czeka na link. */
.kr-blad-wysylka {
  margin-top: 1.2rem;
  padding: .9rem 1rem;
  border: 1px solid #f0c2c2;
  border-radius: 10px;
  background: #fdf3f3;
  color: #8a2b2b;
  font-weight: 600;
}
.kr-blad-wysylka a { color: #8a2b2b; font-weight: 800; }
.kr-blad-wysylka small { display: block; margin-top: .3rem; opacity: .5; font-weight: 400; }

@media (max-width: 720px) {
  .kr-jez { order: 3; margin-left: 0; }
  .kr-jez-btn { padding: 3px 9px; font-size: .72rem; }
}

/* ------------------------------------------------- zwijanie całego podglądu */

.kr-podglad-zwin {
  padding: 5px 12px;
  border: 1px solid var(--line, #e4e9f2);
  border-radius: 999px;
  background: #fff;
  font: inherit;
  font-size: .78rem;
  font-weight: 700;
  color: #4b5568;
  cursor: pointer;
  white-space: nowrap;
}
.kr-podglad-zwin:hover { border-color: var(--green-dark, #14532d); color: var(--green-dark, #14532d); }

/* Zwinięty podgląd: znika okno, uwaga o wersji poglądowej i sterowanie widokiem.
   Zostaje sam nagłówek z etykietą i przyciskiem, żeby dało się wrócić. */
.kr-panel-podglad.zwiniety .kr-okno,
.kr-panel-podglad.zwiniety .kr-podglad-uwaga,
.kr-panel-podglad.zwiniety .kr-widok,
.kr-panel-podglad.zwiniety .kr-podglad-toggle { display: none; }

.kr-panel-podglad.zwiniety { padding-bottom: .45rem; }
.kr-panel-podglad.zwiniety .kr-podglad-naglowek { margin-bottom: 0; border-bottom: 0; }

/* ------------------------------------------- telefon: kierunkowy z listy */
/* Jedno pole z dwiema częściami: przycisk kraju i numer. Obrys ma cała grupa,
   fokus pokazuje się na grupie, żeby wyglądała jak jedno pole formularza. */
.kr-tel{display:flex;align-items:stretch;border:2px solid var(--line);border-radius:14px;
  background:#fff;transition:border-color .2s,box-shadow .2s}
.kr-tel:focus-within{border-color:#1b7a43;box-shadow:0 0 0 3px rgba(27,122,67,.18)}
.kr-pole .kr-tel input{flex:1;min-width:0;border:0;border-radius:0 12px 12px 0;padding-left:.85rem}
.kr-pole .kr-tel input:focus,.kr-pole .kr-tel input:focus-visible{outline:none;box-shadow:none}
.kr-tel-kraj{display:inline-flex;align-items:center;gap:.4rem;flex:none;padding:0 .7rem 0 .85rem;
  border:0;border-right:1px solid var(--line);border-radius:12px 0 0 12px;background:#f6f8fb;
  font:inherit;font-size:1rem;font-weight:800;color:var(--ink);cursor:pointer;
  font-variant-numeric:tabular-nums;transition:background .15s}
.kr-tel-kraj:hover{background:#edf1f6}
.kr-tel-kraj:focus-visible{outline:3px solid #1b7a43;outline-offset:-3px}
.kr-tel-flaga{font-size:1.25rem;line-height:1}
.kr-tel-strzalka{color:#5d6378;transition:transform .2s var(--ease)}
.kr-tel-kraj[aria-expanded="true"] .kr-tel-strzalka{transform:rotate(180deg)}
.kr-tel-staly .kr-tel-kraj{cursor:default}
.kr-tel-staly .kr-tel-kraj:hover{background:#f6f8fb}

.kr-tel-panel{margin-top:.4rem;border:2px solid var(--line);border-radius:14px;background:#fff;
  box-shadow:0 20px 40px -26px rgba(37,42,78,.5);overflow:hidden;animation:krTelWjazd .18s var(--ease)}
.kr-tel-panel[hidden]{display:none}
/* Fokus w wyszukiwarce widać po ramce całego panelu (samo pole nie ma obrysu). */
.kr-tel-panel:focus-within{border-color:#1b7a43}
@keyframes krTelWjazd{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.kr-pole .kr-tel-szukaj{border:0;border-bottom:1px solid var(--line);border-radius:0;
  padding:.8rem 1rem .8rem 2.6rem;font-size:1rem;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235d6378' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") 1rem center/17px no-repeat}
.kr-pole .kr-tel-szukaj:focus,.kr-pole .kr-tel-szukaj:focus-visible{outline:none;box-shadow:none;
  background-color:#fbfcfd}
.kr-tel-lista{position:relative;list-style:none;margin:0;padding:.3rem;
  max-height:min(15rem,42vh);overflow-y:auto;overscroll-behavior:contain}
.kr-tel-lista li{display:flex;align-items:center;gap:.65rem;min-height:44px;padding:.5rem .7rem;
  border-radius:10px;color:var(--ink);font-weight:600;cursor:pointer}
.kr-tel-lista li:hover{background:#f3f6f9}
/* Pozycja wskazana strzałkami: tło plus pasek z lewej, żeby było ją widać
   także bez koloru (wymóg widocznego fokusu przy aria-activedescendant). */
.kr-tel-lista li.aktywny{background:#eaf5ee;box-shadow:inset 3px 0 0 #1b7a43}
.kr-tel-lista li[aria-selected="true"]{font-weight:800}
.kr-tel-lista li[aria-selected="true"]::after{content:"";flex:none;width:16px;height:16px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b7a43' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/contain no-repeat}
.kr-tel-lista .kr-tel-flaga{font-size:1.15rem;width:1.5rem;text-align:center}
.kr-tel-nazwa{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kr-tel-numer{color:#5d6378;font-weight:700;font-variant-numeric:tabular-nums}
/* Kreska między najczęstszymi krajami a pełną listą (tylko bez filtra). */
.kr-tel-lista .kr-tel-reszta{position:relative;margin-top:.5rem}
.kr-tel-lista .kr-tel-reszta::before{content:"";position:absolute;left:.7rem;right:.7rem;top:-.3rem;
  border-top:1px solid var(--line)}
.kr-tel-brak{margin:0;padding:.9rem 1rem;font-size:.86rem;line-height:1.5;color:#5d6378}

/* ------------------------------------ podgląd na telefonie: pasek z miniaturą */
/* 21.09: podgląd zajmował 505 z 812 px, czyli 62% ekranu, a przyklejony zasłaniał
   tytuł każdego kolejnego pytania. Na wąskim ekranie jest teraz paskiem z żywą
   miniaturą w ramce ekranu telefonu; szczegóły pokazuje pełny ekran. */
.kr-podglad-adres,.kr-podglad-zamknij,.kr-uwaga-krotko{display:none}
.kr-podglad-akcje{display:flex;align-items:center;gap:.45rem}
.kr-panel-podglad button:focus-visible{outline:3px solid #1b7a43;outline-offset:2px}

@media(max-width:899px){
  .kr-panel-podglad:not(.pelny){top:var(--kr-glowa);display:grid;
    grid-template-columns:120px minmax(0,1fr) auto;grid-template-rows:auto auto minmax(0,1fr) auto;
    grid-template-areas:"okno etykieta zwin" "okno adres adres" "okno uwaga uwaga" "okno akcje akcje";
    column-gap:.9rem;row-gap:.3rem;padding-top:.6rem;padding-bottom:.65rem;
    border-bottom:1px solid var(--line);box-shadow:0 16px 20px -22px rgba(37,42,78,.6)}
  .kr-panel-podglad:not(.pelny) .kr-podglad-naglowek{display:contents}
  .kr-panel-podglad:not(.pelny) .kr-widok{display:none}
  .kr-panel-podglad:not(.pelny) .kr-podglad-etykieta{grid-area:etykieta;align-self:end;
    font-size:.66rem;color:#1b7a43}
  .kr-panel-podglad:not(.pelny):not(.zwiniety) .kr-podglad-adres{grid-area:adres;display:block;
    justify-self:start;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    font-size:.82rem;font-weight:800;color:var(--ink);background:#f2f4f8;
    border:1px solid var(--line);border-radius:999px;padding:.2rem .7rem}
  .kr-panel-podglad:not(.pelny) .kr-podglad-uwaga{grid-area:uwaga;align-self:start;margin:.1rem 0 0;
    padding:0;background:none;border:0;font-size:.74rem;line-height:1.4;color:#6b5a2a}
  .kr-panel-podglad:not(.pelny) .kr-uwaga-dluga{display:none}
  .kr-panel-podglad:not(.pelny) .kr-uwaga-krotko{display:inline}
  /* „Powiększ” to główna akcja paska, pod uwagą. „Ukryj podgląd” jest drobnym
     przyciskiem w rzędzie etykiety, bo obok siebie oba się nie mieściły. */
  .kr-panel-podglad:not(.pelny) .kr-podglad-akcje{display:contents}
  .kr-panel-podglad:not(.pelny):not(.zwiniety) .kr-podglad-toggle{grid-area:akcje;justify-self:start;
    display:inline-flex;align-items:center;gap:.35rem;padding:.45rem .9rem;border-radius:999px;
    background:var(--ink);color:#fff;font-size:.8rem;text-decoration:none}
  .kr-panel-podglad:not(.pelny) .kr-podglad-zwin{grid-area:zwin;justify-self:end;align-self:start;
    margin:-.3rem -.4rem 0 0;padding:.3rem .4rem;border:0;background:none;border-radius:8px;
    font-size:.74rem;color:#4b5568;text-decoration:underline;text-underline-offset:2px}

  /* Miniatura: ten sam szkic w wariancie telefonu, pomniejszony do ramki.
     330 px to szerokość wariantu mobilnego, 114 px to wnętrze ramki. */
  .kr-panel-podglad:not(.pelny)>.kr-okno{grid-area:okno;position:relative;width:120px;height:156px;
    border:3px solid var(--ink);border-radius:18px;cursor:zoom-in;
    box-shadow:0 12px 22px -14px rgba(37,42,78,.65)}
  .kr-panel-podglad:not(.pelny)>.kr-okno::after{content:"";position:absolute;z-index:2;top:4px;
    left:50%;width:26px;height:5px;margin-left:-13px;border-radius:9px;background:var(--ink)}
  .kr-panel-podglad:not(.pelny) .kr-okno-belka{display:none}
  .kr-panel-podglad:not(.pelny) .kr-okno-ekran{width:330px;min-height:0;max-height:none;padding:0;
    background:#fff;transform:scale(.3455);transform-origin:0 0;
    -webkit-mask-image:none;mask-image:none;pointer-events:none}
  .kr-panel-podglad:not(.pelny) .kr-okno-mobil .pv{max-width:none;border:0;border-radius:0;box-shadow:none}

  /* Zwinięty: sama etykieta i „Pokaż podgląd” w jednym rzędzie. */
  .kr-panel-podglad.zwiniety:not(.pelny){grid-template-columns:1fr auto;grid-template-rows:auto;
    grid-template-areas:"etykieta zwin";align-items:center;padding-block:.45rem}
  .kr-panel-podglad.zwiniety .kr-podglad-etykieta{align-self:center}
  .kr-panel-podglad.zwiniety:not(.pelny) .kr-podglad-zwin{align-self:center;margin:0;padding:.35rem .8rem;
    border:1px solid var(--line);border-radius:999px;background:#fff;text-decoration:none;font-weight:800}

  /* Pełny ekran po „Powiększ”: nagłówek z przełącznikiem i zamykaniem, pełna
     uwaga o wersji poglądowej i okno w naturalnej wielkości. */
  .kr-panel-podglad.pelny{position:fixed;inset:0;z-index:150;display:block;margin:0;
    padding:0 4vw calc(1.6rem + env(safe-area-inset-bottom));overflow-y:auto;
    overscroll-behavior:contain;background:#fff;animation:krPelny .24s var(--ease)}
  .kr-panel-podglad.pelny .kr-podglad-naglowek{position:sticky;top:0;z-index:3;display:flex;
    align-items:center;gap:.6rem;margin:0 -4vw .8rem;
    padding:calc(.55rem + env(safe-area-inset-top)) 4vw .55rem;background:rgba(255,255,255,.96);
    -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
  .kr-panel-podglad.pelny .kr-podglad-etykieta{color:#1b7a43}
  .kr-panel-podglad.pelny .kr-podglad-akcje{display:none}
  .kr-panel-podglad.pelny .kr-widok{margin-left:auto}
  .kr-panel-podglad.pelny .kr-podglad-zamknij{display:inline-grid;place-items:center;flex:none;
    width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:#fff;
    color:var(--ink);cursor:pointer}
  .kr-panel-podglad.pelny .kr-okno-ekran{max-height:none;-webkit-mask-image:none;mask-image:none}
}
/* Niski ekran (telefon w poziomie): mniejsza miniatura, bez uwagi w pasku. */
@media(max-width:899px) and (max-height:520px){
  .kr-panel-podglad:not(.pelny){grid-template-columns:84px minmax(0,1fr)}
  .kr-panel-podglad:not(.pelny)>.kr-okno{width:84px;height:100px;border-width:2px;border-radius:12px}
  .kr-panel-podglad:not(.pelny)>.kr-okno::after{display:none}
  .kr-panel-podglad:not(.pelny) .kr-okno-ekran{transform:scale(.2424)}
  .kr-panel-podglad:not(.pelny) .kr-podglad-uwaga{display:none}
}
@keyframes krPelny{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
html.kr-bez-przewijania,html.kr-bez-przewijania body{overflow:hidden}
/* .shell z arkusza strony ma position:relative i z-index:1, więc cała scena to
   osobna warstwa POD nagłówkiem strony (z-index 60). Bez tego nagłówek przykrywał
   górę pełnego ekranu razem z przyciskiem „Zamknij”: kciuk trafiał w numer
   telefonu albo WhatsApp. Na czas pełnego ekranu scena idzie nad nagłówek. */
html.kr-pelny-podglad .kr-scena-in{z-index:100}
@media(prefers-reduced-motion:reduce){.kr-panel-podglad.pelny,.kr-tel-panel{animation:none}}

/* ===================================================================== */
/* Lejki pod reklamy (02.10.2026): /ocena-strony-pod-reklamy/,            */
/* /generator-landing-page/ i /darmowy-projekt-strony/. Strony mają na    */
/* <body> klasę kr-aa: kolory zmierzone pod WCAG AA (patrz blok na końcu).*/
/* ===================================================================== */

.kr-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- hook oceny: pole na adres zamiast samego przycisku ---------- */
.kr-hook-adres{margin:1.6rem 0 1.1rem;max-width:36rem;padding:1.2rem 1.25rem 1rem}
.kr-hook-adres label{display:block;font-size:.86rem;font-weight:800;color:var(--ink);margin-bottom:.45rem}
.kr-hook-pole{display:grid;gap:.6rem}
.kr-hook-pole input{width:100%;min-height:54px;padding:.8rem 1.1rem;font:inherit;font-size:1.05rem;
  color:var(--ink);background:#fff;border:2px solid #b9c2cf;border-radius:999px}
.kr-hook-pole input:focus-visible{outline:3px solid #1b7a43;outline-offset:2px;border-color:#1b7a43}
.kr-hook-pole input[aria-invalid="true"]{border-color:#b42318}
.kr-hook-pole .btn{width:100%;min-height:54px;margin-top:0}
.kr-hook-blad{min-height:1.3em;margin-top:.45rem;font-size:.86rem;font-weight:700;color:#8a1f12}
.kr-link{background:none;border:0;padding:.35rem 0;font:inherit;font-size:.9rem;font-weight:700;
  color:var(--ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.kr-link:hover{color:#1b7a43}
.kr-link:focus-visible{outline:3px solid #1b7a43;outline-offset:3px;border-radius:4px}
@media(min-width:560px){
  .kr-hook-pole{grid-template-columns:1fr auto}
  .kr-hook-pole .btn{width:auto;padding-inline:1.5rem;white-space:nowrap}
}

/* ---------- karta oceny: wskaźnik PageSpeed i lista kontroli ---------- */
.kr-ocena{border:1px solid var(--line);border-radius:18px;background:#fff;padding:1.15rem 1.1rem 1rem;
  margin:.2rem 0 1.4rem;box-shadow:0 14px 30px -26px rgba(37,42,78,.5)}
.kr-ocena-glowa{display:flex;align-items:center;gap:1rem;margin-bottom:.8rem}
.kr-ocena-tytul{font-size:1.08rem;font-weight:800;color:var(--ink);margin:0 0 .1rem}
/* Drugie zdanie nagłówka: mniejsze, ta sama myśl. */
.kr-h1-dalej{display:block;margin-top:.3em;font-size:.6em;line-height:1.18;color:#14572f}
.kr-ocena-adres{font-size:.8rem;font-weight:700;color:#4b5568;word-break:break-all}
.kr-ocena-suma{font-size:.88rem;font-weight:800;color:var(--ink);margin-top:.15rem}
/* Pierścień: wynik jako wycinek koła. Kolor nigdy nie jest jedyną informacją,
   obok stoi liczba i słowo (szybka, przeciętna, wolna). */
.kr-wskaznik{--wynik:0;--kolor:#8a93a6;position:relative;flex:none;width:76px;height:76px;border-radius:50%;
  display:grid;place-items:center;align-content:center;
  background:conic-gradient(var(--kolor) calc(var(--wynik) * 1%),#e8ecf1 0)}
.kr-wskaznik::before{content:"";position:absolute;inset:7px;border-radius:50%;background:#fff}
.kr-wskaznik span,.kr-wskaznik small{position:relative;line-height:1}
.kr-wskaznik span{font-size:1.5rem;font-weight:900;color:var(--ink)}
.kr-wskaznik small{font-size:.52rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#4b5568;margin-top:.2rem}
.kr-wskaznik.dobry{--kolor:#1b7a43}
.kr-wskaznik.sredni{--kolor:#b46f00}
.kr-wskaznik.slaby{--kolor:#c0331f}
.kr-wskaznik:not(.dobry):not(.sredni):not(.slaby)::after{content:"";position:absolute;inset:0;border-radius:50%;
  border:3px solid transparent;border-top-color:#1b7a43;animation:krKrec 1s linear infinite}
.kr-ocena-lista{list-style:none;display:grid;gap:.15rem;margin:0;padding:0}
.kr-ocena-pkt{display:flex;gap:.7rem;align-items:flex-start;padding:.55rem 0;border-top:1px solid var(--line);
  font-size:.86rem;line-height:1.45;color:var(--body)}
.kr-ocena-pkt strong{color:var(--ink)}
.kr-ocena-opis{display:block;margin-top:.1rem}
.kr-ocena-status{display:inline-block;margin-left:.3rem;padding:.05rem .45rem;border-radius:999px;
  font-size:.7rem;font-weight:800;letter-spacing:.02em;vertical-align:1px;background:#eef1f5;color:#3d4457}
.kr-ocena-pkt.ok .kr-ocena-status{background:#e3f4ea;color:#14572f}
.kr-ocena-pkt.zle .kr-ocena-status{background:#fbe7e4;color:#8a1f12}
.kr-ocena-pkt.uwaga .kr-ocena-status{background:#fdf0d8;color:#6e4300}
.kr-ocena-ikona{flex:none;width:22px;height:22px;margin-top:.05rem;border-radius:50%;background:#eef1f5 center/12px no-repeat}
.ok>.kr-ocena-ikona{background-color:#1b7a43;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E")}
.zle>.kr-ocena-ikona{background-color:#c0331f;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E")}
.uwaga>.kr-ocena-ikona{background-color:#b46f00;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round'%3E%3Cpath d='M12 5v9M12 19h.01'/%3E%3C/svg%3E")}
.brak>.kr-ocena-ikona{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234b5568' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E")}
.czeka>.kr-ocena-ikona{border:3px solid #d5dbe4;border-top-color:#1b7a43;background:none;animation:krKrec .9s linear infinite}
@keyframes krKrec{to{transform:rotate(360deg)}}
.kr-ocena-pasek{display:flex;align-items:center;gap:.55rem;margin:-.4rem 0 1.2rem;padding:.55rem .8rem;
  border-radius:12px;background:var(--green-soft);color:#14572f;font-size:.86rem;font-weight:700}
.kr-ocena-pasek::before{content:"";flex:none;width:12px;height:12px;border-radius:50%;background:#1b7a43}
.kr-ocena-pasek.czeka::before{background:none;border:2px solid #9fd8b6;border-top-color:#1b7a43;animation:krKrec .9s linear infinite}

/* ---------- teksty reklam z licznikami ---------- */
.kr-reklamy{margin:0 0 1rem}
.kr-reklamy-tytul{font-size:1.08rem;margin:0 0 .25rem}
.kr-reklamy-opis{font-size:.88rem;color:var(--body);margin-bottom:.9rem}
.kr-reklamy .kr-grupa-etykieta{margin:.9rem 0 .45rem}
.kr-reklama-lista{list-style:none;display:grid;gap:.45rem;margin:0;padding:0}
.kr-reklama-poz{display:flex;align-items:center;gap:.6rem;padding:.55rem .55rem .55rem .85rem;
  border:1px solid var(--line);border-radius:12px;background:#fff}
.kr-reklama-tekst{flex:1;min-width:0;font-weight:800;color:var(--ink);font-size:.92rem;overflow-wrap:anywhere}
.kr-reklama-meta .kr-reklama-tekst{font-weight:600;font-size:.86rem;line-height:1.45}
.kr-licznik{flex:none;font-size:.72rem;font-weight:800;color:#4b5568;font-variant-numeric:tabular-nums}
.kr-kopiuj{flex:none;min-height:40px;min-width:64px;padding:.35rem .8rem;border:2px solid var(--line);border-radius:999px;
  background:#fff;font:inherit;font-size:.8rem;font-weight:800;color:var(--ink);cursor:pointer;
  transition:border-color .2s,background .2s}
.kr-kopiuj:hover{border-color:#1b7a43;background:var(--green-soft)}
.kr-kopiuj:focus-visible{outline:3px solid #1b7a43;outline-offset:2px}

/* ---------- podgląd: reklama nad landingiem ---------- */
.pv-rek{margin:.8rem .9rem 0;padding:.65rem .75rem;border:1px solid #e3e7ee;border-radius:10px;background:#fff;
  font-size:10px;line-height:1.45;color:#3c4043;display:grid;gap:.15rem}
.pv-rek-etyk{font-weight:800;font-size:8.5px;color:#202124}
.pv-rek-url{font-size:9px;color:#202124}
.pv-rek-naglowek{font-size:12.5px;line-height:1.3;color:#1a0dab}
.pv-rek-opis{font-size:9.5px;color:#4d5156}
.pv-rek-meta{padding:0;overflow:hidden;gap:0;max-width:340px;margin-inline:auto}
.pv-rek-glowa{display:flex;align-items:center;gap:.45rem;padding:.55rem .65rem}
.pv-rek-glowa span:last-child{display:grid;line-height:1.25}
.pv-rek-glowa b{font-size:10px;color:#050505}
.pv-rek-glowa small{font-size:8px;color:#65676b}
.pv-rek-awatar{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#1877f2;color:#fff;
  font-weight:900;font-size:10px}
.pv-rek-tekst{padding:0 .65rem .5rem;font-size:9.5px;color:#050505}
.pv-rek-zdj{aspect-ratio:1.91/1;background:#eef1f5;overflow:hidden}
.pv-rek-zdj img{width:100%;height:100%;object-fit:cover}
.pv-rek-stopka{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem .65rem;background:#f0f2f5}
.pv-rek-stopka span:first-child{display:grid;min-width:0}
.pv-rek-stopka small{font-size:7.5px;text-transform:uppercase;color:#65676b}
.pv-rek-stopka b{font-size:9.5px;color:#050505;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pv-rek-btn{flex:none;background:#e4e6eb;color:#050505;font-weight:800;font-size:8.5px;padding:.3rem .55rem;border-radius:6px}
.pv-rek-strzalka{display:flex;align-items:center;justify-content:center;gap:.35rem;padding:.45rem .9rem .55rem;
  font-size:8.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#4b5568}
.pv-rek-strzalka::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px)}

/* ---------- podgląd: landing pod płatny ruch ---------- */
.pv-landing{border-top:1px solid #e3e7ee;position:relative}
.pv-tel{flex:none;background:var(--pv-akcent);color:var(--pv-na-akcencie);font-size:8.5px;font-weight:800;
  padding:.28rem .65rem;border-radius:999px}
.pv-l-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:.8rem;align-items:center;padding:1rem .9rem;
  background:var(--pv-miekki)}
.pv-l-tekst{display:grid;gap:.35rem;justify-items:start;min-width:0}
.pv-l-nad{font-size:8px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--pv-akcent)}
.pv-l-tekst h3{font-size:15px;line-height:1.15;color:var(--pv-ink);margin:0;overflow-wrap:anywhere}
.pv-l-tekst .pv-hero-cta{margin-top:.25rem;font-size:9px;padding:.4rem .9rem}
.pv-l-odznaki{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:.2rem}
.pv-l-zdj{aspect-ratio:4/5;border-radius:var(--pv-radius);overflow:hidden;background:var(--pv-linia)}
.pv-l-zdj img{width:100%;height:100%;object-fit:cover}
.pv-l-form{display:grid;gap:.3rem;padding:.65rem;border-radius:var(--pv-radius);background:var(--pv-tlo);
  border:1px solid var(--pv-linia);box-shadow:0 8px 18px -12px rgba(20,24,40,.4)}
.pv-l-form b{font-size:9.5px;color:var(--pv-ink)}
.pv-l-karty{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem}
.pv-l-karty .pv-karta{display:grid;gap:.3rem;padding:.55rem .6rem;border:1px solid var(--pv-linia);
  border-radius:var(--pv-radius);font-size:9px;color:var(--pv-ink);font-weight:700}
.pv-l-cena{display:flex;align-items:center;gap:.25rem;font-size:8.5px;color:var(--pv-tekst);font-weight:600}
.pv-l-cena .pv-kreska{width:26px;display:inline-block}
.pv-l-final{display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.9rem;
  background:var(--pv-ink);color:var(--pv-tlo)}
.pv-l-final b{font-size:11px;color:var(--pv-tlo)}
.pv-l-final .pv-hero-cta{margin:0}
.pv-l-pasek{display:none}
.kr-okno-mobil .pv-rek,.kr-okno-mobil .pv-rek-strzalka{max-width:330px;margin-inline:auto}
.kr-okno-mobil .pv-l-hero{grid-template-columns:1fr}
.kr-okno-mobil .pv-l-zdj{aspect-ratio:16/10;order:-1}
.kr-okno-mobil .pv-l-karty{grid-template-columns:1fr}
.kr-okno-mobil .pv-l-pasek{display:block;position:sticky;bottom:0;margin:0;padding:.55rem;text-align:center;
  background:var(--pv-akcent);color:var(--pv-na-akcencie);font-size:10px;font-weight:800}
.kr-okno-mobil .pv-landing .pv-head::after{display:none}
@media(min-width:900px){.pv-l-tekst h3{font-size:19px}}

/* ---------- treść pod hookiem (SEO i obiekcje), znika w trakcie kreatora ---------- */
body[data-etap="kreator"] .kr-tresc{display:none}
.kr-tresc{padding:0 0 3.5rem}
.kr-blok{margin-top:clamp(3rem,8vw,5rem)}
.kr-blok>h2{font-size:clamp(1.6rem,5.4vw,2.5rem);line-height:1.12;max-width:22ch;margin:.6rem 0 1rem}
.kr-blok>p,.kr-blok .kr-akapit{max-width:64ch;font-size:1.02rem;line-height:1.7;margin-bottom:1rem}
.kr-blok a:not(.btn){color:#1b7a43;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.kr-blok a:not(.btn):focus-visible,.kr-stopka a:focus-visible{outline:3px solid #1b7a43;outline-offset:3px;border-radius:4px}
/* Sygnatura stron: wielkie, obrysowane numery kroków. */
.kr-kroki3{list-style:none;counter-reset:krok;display:grid;gap:1.4rem;margin:1.6rem 0 0;padding:0}
.kr-kroki3 li{counter-increment:krok;position:relative;padding:1.3rem 1.2rem 1.2rem;border:1px solid var(--line);
  border-radius:var(--r);background:#fff}
.kr-kroki3 li::before{content:"0" counter(krok);display:block;font-size:3.4rem;font-weight:900;line-height:1;
  letter-spacing:-.04em;color:transparent;-webkit-text-stroke:2px #1b7a43;margin-bottom:.6rem}
.kr-kroki3 h3{font-size:1.1rem;margin-bottom:.35rem}
.kr-kroki3 p{font-size:.95rem;line-height:1.6}
.kr-siatka2{display:grid;gap:.8rem;margin-top:1.4rem;padding:0;list-style:none}
.kr-siatka2 li{display:flex;gap:.75rem;align-items:flex-start;padding:.95rem 1rem;border-radius:16px;background:var(--tint);
  border:1px solid var(--line);font-size:.95rem;line-height:1.55}
.kr-siatka2 li::before{content:"";flex:none;width:22px;height:22px;margin-top:.1rem;border-radius:50%;
  background:#1b7a43 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/12px no-repeat}
.kr-siatka2 strong{color:var(--ink)}
.kr-tabela-ramka{overflow-x:auto;margin-top:1.4rem;border:1px solid var(--line);border-radius:16px;background:#fff}
.kr-tabela{width:100%;min-width:520px;border-collapse:collapse;font-size:.92rem}
.kr-tabela th,.kr-tabela td{padding:.8rem 1rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.kr-tabela thead th{background:var(--tint);color:var(--ink);font-weight:800}
.kr-tabela tbody th{color:var(--ink);font-weight:700;width:30%}
.kr-tabela tr:last-child>*{border-bottom:0}
.kr-tabela-ramka:focus-visible{outline:3px solid #1b7a43;outline-offset:2px}
/* Oferta: najpierw „W skrócie”, potem opcje od najtańszej. */
.kr-skrot{margin-top:1.4rem;padding:1.1rem 1.2rem;border-left:5px solid #1b7a43;border-radius:0 16px 16px 0;
  background:var(--green-soft);max-width:70ch}
.kr-skrot h3{font-size:1rem;margin-bottom:.4rem}
.kr-skrot ul{margin:0;padding-left:1.1rem;display:grid;gap:.3rem;font-size:.96rem;line-height:1.55}
.kr-opcje-cen{display:grid;gap:1rem;margin-top:1.4rem}
.kr-cena{display:flex;flex-direction:column;gap:.5rem;padding:1.3rem 1.2rem;border:1px solid var(--line);
  border-radius:var(--r);background:#fff}
.kr-cena-etyk{align-self:flex-start;font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:#14572f;background:var(--green-soft);padding:.25rem .6rem;border-radius:999px}
.kr-cena h3{font-size:1.12rem}
.kr-cena-kwota{font-size:1.7rem;font-weight:900;color:var(--ink);letter-spacing:-.02em;line-height:1.1}
.kr-cena-kwota small{font-size:.86rem;font-weight:700;color:#4b5568;letter-spacing:0}
.kr-cena ul{margin:.2rem 0 0;padding-left:1.1rem;display:grid;gap:.25rem;font-size:.92rem;line-height:1.5}
/* Termin i płatność na dole karty, w jednej linii we wszystkich trzech. */
.kr-cena-fakty{margin:auto 0 0;padding-top:.85rem;border-top:1px dashed var(--line);display:grid;gap:.35rem;font-size:.88rem;line-height:1.45}
.kr-cena-fakty div{display:flex;flex-wrap:wrap;gap:0 .35rem}
.kr-cena-fakty dt{font-weight:800;color:var(--ink)}
.kr-cena-fakty dt::after{content:":"}
.kr-cena-fakty dd{margin:0}
/* Opcja polecana: kotwica cenowa w środku, wyróżniona ramką i odwróconą etykietą. */
.kr-cena-polecana{border:2px solid #1b7a43;background:linear-gradient(180deg,var(--green-soft) 0,#fff 9rem);
  box-shadow:0 14px 32px -18px rgba(20,87,47,.45)}
.kr-cena-polecana .kr-cena-etyk{background:#1b7a43;color:#fff}
.kr-raty{margin-top:1rem;font-size:.95rem;color:var(--body)}
.kr-faq{margin-top:1.2rem;display:grid;gap:.6rem;max-width:72ch}
.kr-faq details{border:1px solid var(--line);border-radius:14px;background:#fff}
.kr-faq summary{cursor:pointer;list-style:none;padding:1rem 2.8rem 1rem 1.1rem;position:relative;font-weight:800;color:var(--ink);
  border-radius:14px}
.kr-faq summary::-webkit-details-marker{display:none}
.kr-faq summary::after{content:"";position:absolute;right:1.2rem;top:50%;width:9px;height:9px;margin-top:-6px;
  border-right:2.5px solid #1b7a43;border-bottom:2.5px solid #1b7a43;transform:rotate(45deg);transition:transform .2s}
.kr-faq details[open] summary::after{transform:rotate(225deg);margin-top:-2px}
.kr-faq summary:focus-visible{outline:3px solid #1b7a43;outline-offset:2px}
.kr-faq details>div{padding:0 1.1rem 1.05rem;font-size:.97rem;line-height:1.65}
.kr-koniec{margin-top:clamp(3rem,8vw,5rem);padding:2.2rem 1.4rem;border-radius:var(--r-panel);text-align:center;
  background:linear-gradient(135deg,var(--lime) 0%,#e4f7dd 42%,var(--mint) 100%)}
.kr-koniec h2{font-size:clamp(1.5rem,5vw,2.2rem);max-width:22ch;margin:0 auto .6rem}
.kr-koniec p{max-width:56ch;margin:0 auto 1.3rem}
.kr-koniec .btn{min-height:52px}
@media(min-width:900px){
  .kr-kroki3{grid-template-columns:repeat(3,1fr)}
  .kr-siatka2{grid-template-columns:1fr 1fr}
  .kr-opcje-cen{grid-template-columns:repeat(3,1fr)}
  .kr-cena-polecana{transform:translateY(-.6rem)}
}

/* ---------- stopka z kontaktem (każda strona lejka) ---------- */
.kr-stopka{border-top:1px solid var(--line);background:var(--tint);padding:1.8rem 0 2.2rem;font-size:.9rem;color:var(--body)}
.kr-stopka-in{display:grid;gap:.9rem}
.kr-stopka-kontakt{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;align-items:center}
.kr-stopka a{color:var(--ink);font-weight:800;text-decoration:underline;text-underline-offset:3px}
.kr-stopka a:hover{color:#1b7a43}
.kr-stopka-prawne{font-size:.8rem}
body[data-etap="kreator"] .kr-stopka{padding-bottom:5.5rem}

/* ---------- WCAG AA na stronach lejków (body.kr-aa) ----------
   Zieleń marki pod białym tekstem ma 1,9:1, a --green-dark na bieli 2,6:1. Tutaj:
   granatowy napis na zieleni marki (7,0:1) i ciemna zieleń #1b7a43 (5,4:1) tam,
   gdzie zieleń jest tekstem. /demo/ zostaje bez zmian do decyzji o kolorze marki. */
.kr-aa .btn-primary{color:var(--ink)}
.kr-aa .btn-primary:hover{color:var(--ink)}
.kr-aa .btn:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.kr-aa .eyebrow{color:#14572f}
.kr-aa .kr-jez-btn.aktywny{background:#1b7a43;color:#fff}
.kr-aa .kr-jez-btn:hover{color:#1b7a43}
.kr-aa .kr-jez-btn:focus-visible,.kr-aa .brand:focus-visible,.kr-aa .nav-phone:focus-visible,
.kr-aa .kr-wa:focus-visible{outline:3px solid #1b7a43;outline-offset:3px;border-radius:6px}
.kr-aa .kr-zgody a{color:#1b7a43}
.kr-aa .kr-podglad-etykieta{color:#14572f}
.kr-aa .kr-wa{background:#0f7b3e;box-shadow:0 8px 20px -10px rgba(15,123,62,.8)}
.kr-aa .kr-blad{color:#8a1f12}
@media(prefers-reduced-motion:reduce){
  .kr-wskaznik::after,.czeka>.kr-ocena-ikona,.kr-ocena-pasek.czeka::before{animation:none}
}