/* WIZ-G4: arkusz podstrony /wizytowki-google-i-mapy/ (S1–S6 złożone z zatwierdzonych sekcji; generator: docs/strona-agencji/podstrony/wizytowki/G4/buduj-wdrozenie.py). Ładowany tylko na tej podstronie, po arkuszach motywu. */
html{background:#08080a}
body.wiz-wizytowki{background:#08080a;color:#fff}
/* ===== S1-G2/s1.css ===== */
/* WIZ-S1-G2: S1 „Okolica z perspektywy klienta”, koncepcje A, B, C. Telefon najpierw, komputer od 900 px (punkt łamania motywu).
   Dziedziczy motyw wzorowa-agencja.pl (kolumna .wrap, żółć #FFD60A, tusz, papier, Sofia Sans i Sofia Sans Extra Condensed).
   Nie wprowadza nowych kolorów ani krojów. Ruch: raz, bez pętli; ?bezruchu=1 i prefers-reduced-motion zatrzymują wszystko. */

.w1{
  --y:#FFD60A; --ink:#1D1C1A; --pencil:#4A4436; --paper:#F3E6CA; --kalka:#FBF7EA; --dark:#08080a;
  --tech:"Sofia Sans Extra Condensed","Arial Narrow",sans-serif; --f:"Sofia Sans",system-ui,"Segoe UI",Arial,sans-serif;
  position:relative; padding:0 0 40px; color:#fff; font-family:var(--f);
  background-color:#08080a;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:48px 48px;
  overflow-x:clip;
}
.w1 *{box-sizing:border-box}
:where(.w1) h1,:where(.w1) p{margin:0}

/* etykieta sekcji (jak „REALIZACJE” na żywej stronie) */
.w1-tab{display:flex;align-items:stretch;height:48px;margin-left:calc(-1 * var(--m,24px))}
.w1-tab span{display:flex;align-items:center;padding:0 16px 0 var(--m,24px);background:var(--y);color:#111;font:800 15px/1 var(--tech);letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}
.w1-tab i{width:72px;background:repeating-linear-gradient(135deg,var(--y) 0 9px,#08080a 9px 18px)}

.w1-grid{padding-top:0}
.w1-txt{position:relative;z-index:2;padding-top:0}
.w1-h1{margin-top:20px;font:800 clamp(42px,11.4vw,56px)/.96 var(--tech);letter-spacing:.005em;color:#fff;text-wrap:balance}
.w1-h1>span{display:block;white-space:nowrap}
.w1-ul{position:relative;width:fit-content}
.zn-ul{position:absolute;left:0;bottom:-.17em;width:100%;height:.2em;overflow:visible}
.zn-ul path{fill:none;stroke:var(--y);stroke-width:5;stroke-linecap:round}
.w1-lead{margin-top:34px;max-width:34em;font:400 17px/1.5 var(--f);color:rgba(255,255,255,.88);text-wrap:pretty}

.w1-cta{display:flex;flex-direction:column;align-items:stretch;gap:14px;margin-top:24px}  /* G4: przycisk i telefon to dwa osobne cele dotyku (odstęp min. 12 px) */
.w1-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:12px 24px;font:700 18px/1.2 var(--f);color:#111;background:var(--y);border:2px solid #111;text-decoration:none;text-align:center}
.w1-btn:hover{background:#fff}
.w1-tel{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;font:700 17px/1.2 var(--f);color:#fff;text-decoration:underline;text-underline-offset:4px}
.w1-btn:focus-visible,.w1-tel:focus-visible{outline:3px solid #fff;outline-offset:3px}

/* szkic okolicy: wspólne */
.sk{position:relative;width:100%}
.sk-svg{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible}
.st{fill:none;stroke-linecap:round;stroke-linejoin:round}
.bl{fill:none;stroke-linejoin:round}
.st-ink{stroke:var(--pencil)} .bl-ink{stroke:var(--pencil);stroke-width:1.6}
.st-white{stroke:rgba(255,255,255,.46)} .bl-white{stroke:rgba(255,255,255,.34);stroke-width:1.6}
.st-exact{stroke:rgba(255,255,255,.4)} .bl-exact{stroke:rgba(255,255,255,.32);stroke-width:1}
.rt{fill:none;stroke-linecap:round;stroke-linejoin:round}
.rt-marker{stroke:var(--y);stroke-width:15;opacity:.95}
.rt-exact{stroke:var(--y);stroke-width:6}
.nd{stroke-width:3.5}
.nd-sq{fill:var(--y);stroke:var(--ink)}
.nd-y{fill:var(--y);stroke:#08080a}
.pap{fill:var(--paper)}
.seam{stroke:#08080a;stroke-width:4}
.zn{fill:none;stroke:var(--y);stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round}
.zn-box{position:absolute;display:block;overflow:visible}
.zn-box .zn{stroke-width:3.2}
.zn-box .zn.dr{stroke-width:3.2}

/* notatka właściciela (pytanie klienta, przykład) */
.w1-note{position:absolute;left:3%;top:-7%;z-index:3;max-width:80%;padding:12px 14px 10px;background:var(--kalka);color:var(--ink);font:800 clamp(19px,5.6vw,25px)/1 var(--tech);transform:rotate(-2deg);box-shadow:0 8px 18px rgba(30,20,10,.32)}
.w1-note small{display:block;margin-top:6px;font:700 13px/1 var(--f);letter-spacing:.12em;text-transform:uppercase;color:#4A463D}
.w1-tape{position:absolute;left:50%;top:-11px;width:66px;height:20px;margin-left:-33px;background:rgba(207,198,170,.88);transform:rotate(2deg);box-shadow:0 1px 2px rgba(0,0,0,.18)}

/* kafelki interfejsu na trasie */
.chip,.plate,.tick{position:absolute;z-index:2;display:inline-flex;align-items:center;gap:8px;height:30px;white-space:nowrap}
.chip b,.plate b,.tick b{color:var(--y);font:800 14px/1 var(--tech);letter-spacing:.08em}
.chip{padding:0 12px 0 9px;background:#0b0b0d;color:#fff;border-radius:6px;font:700 15px/1 var(--f)}
.plate{padding:0 11px 0 9px;background:#08080a;color:#fff;border:2px solid #fff;font:800 16px/1 var(--tech);letter-spacing:.08em;text-transform:uppercase}
.tick{padding:0 10px 0 8px;background:#08080a;color:#fff;border-left:4px solid var(--y);font:700 15px/1 var(--f)}
.tick.pp{background:var(--ink)}
/* odstęp kafelka od punktu skaluje się z szerokością szkicu (jednostki kontenera), żeby nie nachodził na kwadrat ani pinezkę */
.sk{container-type:inline-size}
.sk-L{--hn:.9;--hp:4.5;--hv:3.3}
.sk-P{--hn:2.3;--hp:8.4;--hv:6.3}
.sd-R{transform:translate(calc(var(--hn) * 1cqw + 8px),-50%)}
.sd-L{transform:translate(calc(-100% - var(--hn) * 1cqw - 8px),-50%)}
.sd-T{transform:translate(-50%,calc(-100% - var(--hn) * 1cqw - 8px))}
.sd-B{transform:translate(-50%,calc(var(--hn) * 1cqw + 8px))}

/* rysowanie linii: raz, bez pętli */
.dr{stroke-dasharray:1;stroke-dashoffset:1;animation:wDr 1.1s cubic-bezier(.4,.1,.2,1) .3s forwards}
.zn-ul .dr{animation-duration:.7s;animation-delay:.15s}
.zn:not(.zn-ul .zn).dr{animation-delay:1.1s;animation-duration:.6s}
.rt.dr{animation-duration:1.3s;animation-delay:.35s}
@keyframes wDr{to{stroke-dashoffset:0}}
.w1-note{animation:wNote .5s ease-out both}
@keyframes wNote{from{opacity:0;transform:rotate(-2deg) translateY(8px)}to{opacity:1;transform:rotate(-2deg)}}
html.stop .dr,html.stop .w1-note{animation:none!important}
html.stop .dr{stroke-dashoffset:0!important}
@media (prefers-reduced-motion:reduce){.dr,.w1-note{animation:none!important}.dr{stroke-dashoffset:0!important}}

/* widoczność wg szerokości: telefon (sk-P) i komputer (sk-L) to osobne układy */
.sk-L{display:none}

/* ---------- A: kartka z notatką ---------- */
.w1-A .w1-obj{position:relative;margin-top:36px}
.w1-sheet{position:relative;padding:22px 18px 18px;background-color:var(--paper);background-image:linear-gradient(rgba(74,68,54,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(74,68,54,.09) 1px,transparent 1px);background-size:24px 24px;transform:rotate(-.9deg);box-shadow:0 14px 30px rgba(0,0,0,.5)}
.w1-sheet::after{content:"";position:absolute;right:-14px;top:-12px;width:80px;height:22px;background:rgba(207,198,170,.9);transform:rotate(38deg);box-shadow:0 1px 2px rgba(0,0,0,.2)}
.w1-A .zn-arrow{display:none}
.w1-A .zn-spark{right:14px;bottom:-22px;top:auto;width:44px;height:44px;z-index:4}
.w1-A .sk-P .w1-note{top:-24px}

/* ---------- B: ulice jako siatka ---------- */
.w1-B .w1-obj{position:relative;margin-top:64px}
.w1-B .w1-note{background:var(--kalka)}
.w1-B .sk-P .w1-note{top:-24px;left:2%}

/* ---------- C: ten sam obszar dwa razy ---------- */
.w1-C .w1-side{position:relative;z-index:2}
.w1-C .w1-obj{margin-top:64px}
.w1-C .sk{border:2px solid #1b1b1e}
.w1-C .sk-P .w1-note-C{top:-24px;left:2%;max-width:80%}
.w1-C .sk-L .w1-note-C{left:3%;top:auto;bottom:8%;max-width:46%}
.w1-C .tick.pp{color:#fff}

/* ---------- komputer ---------- */
@media (min-width:900px){
  .w1{padding-bottom:56px}
  .w1-tab{height:56px}
  .w1-tab span{font-size:21px;padding-right:24px}
  .w1-tab i{width:150px;background:repeating-linear-gradient(135deg,var(--y) 0 12px,#08080a 12px 24px)}
  .w1-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(32px,4.4vw,72px);align-items:start}
  .w1-h1{margin-top:22px;font-size:clamp(46px,4.4vw,66px)}
  .w1-lead{margin-top:36px;font-size:clamp(18px,1.35vw,21px)}
  .w1-cta{flex-direction:column;align-items:flex-start;gap:12px;margin-top:30px}
  .w1-btn{justify-content:flex-start;white-space:nowrap}
  .w1-tel{justify-content:flex-start;min-height:44px}
  .sk-P{display:none}
  .sk-L{display:block}
  .w1-note{max-width:62%;font-size:clamp(24px,2vw,29px);left:3%;top:-4%}
  .w1-obj{padding-top:56px}
  .rt-marker{stroke-width:14}

  .w1-A .w1-obj{margin-top:0}
  .w1-sheet{padding:28px 28px 26px}
  .w1-A .zn-arrow{display:block;left:-74px;top:232px;width:70px;height:52px;z-index:4}
  .w1-A .zn-spark{right:14px;bottom:-24px;top:auto;width:48px;height:48px}

  .w1-B .w1-obj{margin-top:0}
  .w1-B .w1-obj{margin-right:calc(-1 * var(--m,48px))}

  .w1-C .w1-obj{margin-top:36px;padding-top:0}
  .w1-C .w1-h1 .l2,.w1-C .w1-h1 .l3{display:inline;white-space:normal}
  .w1-C .w1-cta{flex-direction:row;align-items:center;gap:12px 28px;flex-wrap:wrap}
}

/* B: mapa ulic pod całą sekcją (tekstura, nie dane) */
.w1-bg{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.w1-bg .st{stroke:rgba(255,255,255,.09)}
.w1-bg .bl{stroke:rgba(255,255,255,.06)}
.w1-B .w1-grid{position:relative}

/* własny znacznik „Firma”: zaznaczony kwartał jak na roboczym planie (kolory systemu: żółć, tusz) */
.fm{stroke-linecap:round;stroke-linejoin:round}
.fm-fill{stroke:none}
.fm-fill.fm-y{fill:rgba(8,8,10,.92)} .fm-fill.fm-sq{fill:var(--paper)}
.fm-hatch{fill:none;stroke-width:1.8}
.fm-hatch.fm-y{stroke:rgba(255,214,10,.8)} .fm-hatch.fm-sq{stroke:rgba(255,214,10,.95);stroke-width:3}
.fm-box{fill:none;stroke-width:3}
.fm-box.fm-y{stroke:var(--y)} .fm-box.fm-sq{stroke:var(--ink);stroke-width:2.4}
.sd-R.pn{transform:translate(calc(var(--hp) * 1cqw + 8px),-50%)}
.sd-B.pn{transform:translate(-50%,calc(var(--hv) * 1cqw + 8px))}

/* ---------- FINALNE B (08.11.2026): H1 „Twoja wizytówka w Google pod stałą opieką”, mocniejsza hierarchia jak na /realizacje/ ---------- */
.w1-B .w1-h1{margin-top:20px;font:800 clamp(44px,13.2vw,64px)/.96 var(--tech);letter-spacing:.005em}
.w1-B .w1-h1>span{display:inline;white-space:normal}
.w1-B .w1-h1 .h-a{display:block;white-space:nowrap}
.w1-B .w1-h1 .h-d{display:block;width:fit-content;position:relative;white-space:nowrap}
.w1-B .w1-sub{margin-top:26px;font:800 clamp(26px,7.4vw,32px)/1.05 var(--tech);color:#fff}
.w1-B .w1-lead{margin-top:14px}
.w1-B .w1-cta{margin-top:24px}
.w1-B .w1-row{margin-top:0}
.w1-B .w1-obj{margin-top:64px;padding-top:0}
@media (min-width:900px){
  .w1-B .w1-h1{margin-top:22px;font-size:clamp(60px,7.2vw,108px)}
  .w1-B .w1-h1 .h-a{display:inline}
  .w1-B .w1-h1 .h-c::before{content:"\A";white-space:pre}
  .w1-B .w1-h1 .h-d{display:inline-block}
  .w1-B .w1-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(32px,4.4vw,72px);align-items:start;margin-top:26px}
  .w1-B .w1-obj{margin-top:0;padding-top:48px;margin-right:calc(-1 * var(--m,48px))}
  .w1-B .w1-sub{margin-top:8px;font-size:clamp(30px,2.6vw,40px)}
  .w1-B .w1-lead{margin-top:16px}
}

/* ===== S2-G2/s2.css ===== */
/* WIZ-S2-G2: S2 „Wizytówka pod lupą”, koncepcje A, B, C. Telefon najpierw (schemat na górze, ponumerowane notatki pod spodem), komputer od 900 px.
   Dziedziczy motyw wzorowa-agencja.pl: żółć #FFD60A, tusz, papier, Sofia Sans i Sofia Sans Extra Condensed. Bez nowych kolorów i krojów.
   Nic nie zależy od najechania myszą (najechanie tylko dodatkowo podświetla). Ruch raz; ?bezruchu=1 i prefers-reduced-motion go zatrzymują. */
.s2{
  --y:#FFD60A; --ink:#1D1C1A; --pencil:#4A4436; --paper:#F3E6CA; --kalka:#FBF7EA;
  --tech:"Sofia Sans Extra Condensed","Arial Narrow",sans-serif; --f:"Sofia Sans",system-ui,"Segoe UI",Arial,sans-serif;
  position:relative; padding:0 0 48px; color:#fff; font-family:var(--f);
  background-color:#08080a;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:48px 48px; overflow-x:clip;
}
.s2 *{box-sizing:border-box}
:where(.s2) h2,:where(.s2) p,:where(.s2) ol,:where(.s2) li{margin:0;padding:0}
.s2 ol{list-style:none}

.s2-tab{display:flex;align-items:stretch;height:48px;margin-left:calc(-1 * var(--m,24px))}
.s2-tab span{display:flex;align-items:center;padding:0 16px 0 var(--m,24px);background:var(--y);color:#111;font:800 15px/1 var(--tech);letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}
.s2-tab i{width:72px;background:repeating-linear-gradient(135deg,var(--y) 0 9px,#08080a 9px 18px)}
.s2-h2{margin-top:22px;font:800 clamp(34px,9.4vw,46px)/.98 var(--tech);letter-spacing:.005em;color:#fff;max-width:20em;text-wrap:balance}
.s2-h2 .u{position:relative;display:inline-block}
.zn-ul{position:absolute;left:0;bottom:-.16em;width:100%;height:.2em;overflow:visible}
.zn-ul path{fill:none;stroke:var(--y);stroke-width:5;stroke-linecap:round}
.s2-lead{margin-top:20px;max-width:36em;font:400 17px/1.5 var(--f);color:rgba(255,255,255,.88);text-wrap:pretty}
.s2-przyklad{display:inline-block;margin-top:16px;padding:4px 10px;border:1.5px solid rgba(255,255,255,.5);font:700 12px/1.2 var(--f);letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.86)}

/* rysowanie linii: raz, bez pętli */
.dr{stroke-dasharray:1;stroke-dashoffset:1;animation:wDr .8s cubic-bezier(.4,.1,.2,1) .25s forwards}
@keyframes wDr{to{stroke-dashoffset:0}}
html.stop .dr{animation:none!important;stroke-dashoffset:0!important}
html.stop .s2 *{transition:none!important}
@media (prefers-reduced-motion:reduce){.dr{animation:none!important;stroke-dashoffset:0!important}.s2 *{transition:none!important}}

/* schematyczna wizytówka przykładowej firmy (własny rysunek, bez interfejsu Google) */
.pf{--pl:rgba(255,255,255,.5);--pl2:rgba(255,255,255,.22);--pb:#0b0b0d;--pt:#fff;--sk:rgba(255,255,255,.3);--hl:rgba(255,214,10,.14);--mkb:#08080a;
  position:relative;width:calc(100% - 20px);max-width:400px;margin-left:20px;border:2px solid var(--pl);border-radius:14px;background:var(--pb);color:var(--pt);font:400 14px/1.35 var(--f)}
.pf .ar{position:relative;padding:11px 14px;border-top:1.5px dashed var(--pl2);transition:background-color .2s,opacity .2s,box-shadow .2s}
.pf .ar:first-child{border-top:0;border-radius:12px 12px 0 0}
.pf .ar:last-child{border-radius:0 0 12px 12px}
.pmk{position:absolute;left:-14px;top:9px;z-index:2;display:grid;place-items:center;width:26px;height:26px;background:var(--y);color:#111;border:2px solid var(--mkb);font:800 14px/1 var(--tech);letter-spacing:.04em}
.pf .ar.on{background:var(--hl);box-shadow:inset 0 0 0 3px var(--y)}
.pf.has-on .ar:not(.on){opacity:.62}
.pf-name{font:800 28px/1 var(--tech);letter-spacing:.01em}
.pf-cat{margin-top:4px;opacity:.78}
.ln{display:flex;gap:10px;padding:3px 0}
.ln i{flex:0 0 66px;font:700 12px/1.7 var(--f);font-style:normal;letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:4px}
.chips span{border:1.5px solid var(--pl);border-radius:20px;padding:2px 10px;font:700 12px/1.5 var(--f)}
.sb{display:block;height:7px;margin-top:7px;border-radius:4px;background:var(--sk)}
.phs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ph{display:block;aspect-ratio:16/10;border:1.5px solid var(--pl);background:repeating-linear-gradient(135deg,var(--sk) 0 2px,transparent 2px 9px)}
.post{margin-bottom:9px}.post:last-child{margin-bottom:0}
.pt{margin-top:3px;font:700 13px/1.35 var(--f)}
.dt{display:block;font:700 12px/1.3 var(--f);letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.rep{margin-top:12px;padding:8px 10px;border-left:3px solid var(--y)}
.btns{display:flex;gap:10px}
.btns span{flex:1;text-align:center;border:1.5px solid var(--pl);border-radius:8px;padding:7px 4px;font:700 13px/1.2 var(--f)}

/* notatki projektanta (przyciski: dotyk i klawiatura, bez najechania) */
.s2-notes{display:grid;gap:4px}
.nt{display:grid;grid-template-columns:44px minmax(0,1fr);gap:8px;width:100%;min-height:56px;margin:0;padding:12px 14px;text-align:left;background:transparent;color:inherit;font:inherit;border:2px solid transparent;border-radius:10px;cursor:pointer}
.nt .no{font:800 24px/1 var(--tech);color:var(--y);letter-spacing:.02em}
.nt .tx{font:400 16px/1.4 var(--f)}
.nt .tx strong{display:block;margin-bottom:3px;font:800 22px/1.05 var(--tech);letter-spacing:.01em}
.nt:focus-visible{outline:3px solid #fff;outline-offset:2px}
.nt[aria-pressed=true]{border-color:var(--y);background:rgba(255,214,10,.1)}

/* A: lupa */
.s2-A .pf{--pb:#101013;--pl:rgba(255,255,255,.62);--pl2:rgba(255,255,255,.3);--sk:rgba(255,255,255,.4)}
.s2-A .s2-row{margin-top:28px}
.s2-A .s2-stage{position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:8px 0 0}
.s2-A .s2-notes{margin-top:28px}
.lens,.lens-fr{display:none}
.lens{position:absolute;left:0;top:0;width:200px;height:200px;margin:-100px 0 0 -100px;border-radius:50%;overflow:hidden;background:#0b0b0d;box-shadow:0 14px 34px rgba(0,0,0,.7);z-index:6;pointer-events:none;transition:left .5s cubic-bezier(.4,.1,.2,1),top .5s cubic-bezier(.4,.1,.2,1)}
.lens-in{position:absolute;left:100px;top:100px;transform-origin:0 0}
.lens-in .pf{margin:0;max-width:none;width:auto}
.lens-fr{position:absolute;left:0;top:0;width:216px;height:250px;margin:-108px 0 0 -108px;pointer-events:none;z-index:7;transition:left .5s cubic-bezier(.4,.1,.2,1),top .5s cubic-bezier(.4,.1,.2,1)}
.lens-fr svg{width:100%;height:100%;overflow:visible}
.lr{fill:none;stroke:var(--y);stroke-width:6;stroke-linecap:round;stroke-linejoin:round}

/* B: marginesy na papierze */
.s2-B .s2-sheet{position:relative;margin-top:32px;padding:26px 18px 28px;color:var(--ink);background-color:var(--paper);background-image:linear-gradient(rgba(74,68,54,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(74,68,54,.09) 1px,transparent 1px);background-size:24px 24px;box-shadow:0 14px 30px rgba(0,0,0,.5)}
.s2-B .tape{position:absolute;right:28px;top:-12px;width:88px;height:22px;background:rgba(207,198,170,.92);transform:rotate(3deg);box-shadow:0 1px 2px rgba(0,0,0,.2)}
.s2-B .pf.has-on .ar:not(.on),.s2-C .pf.has-on .ar:not(.on),.s2-C .stack.has-on .ar:not(.on){opacity:1}
.s2-B .pf{--pl:var(--ink);--pl2:rgba(74,68,54,.45);--pb:var(--kalka);--pt:var(--ink);--sk:rgba(29,28,26,.3);--hl:rgba(255,214,10,.55);--mkb:var(--ink)}
.s2-B .s2-przyklad{border-color:rgba(29,28,26,.55);color:var(--ink)}
.s2-B .s2-notes{margin-top:24px}
.s2-B .nt{color:var(--ink)}
.s2-B .nt .no{color:var(--ink);background:var(--y);padding:2px 4px;align-self:start;width:fit-content;height:fit-content}
.s2-B .nt[aria-pressed=true]{border-color:var(--ink);background:rgba(255,214,10,.55)}
.s2-B .nt:focus-visible{outline-color:var(--ink)}
.leaders{display:none;position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.ld{fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ld.on{stroke-width:4;stroke:var(--ink)}
.ldd{fill:var(--y);stroke:var(--ink);stroke-width:2}

/* C: rozbiórka na warstwy */
.s2-C .s2-layers{display:none}
.s2-C .s2-mobile{margin-top:28px}
.s2-C .pf{--pl:var(--ink);--pl2:rgba(74,68,54,.45);--pb:var(--kalka);--pt:var(--ink);--sk:rgba(29,28,26,.3);--hl:rgba(255,214,10,.55);--mkb:var(--ink)}
.s2-C .stack{display:grid;gap:12px;width:calc(100% - 20px);margin-left:20px;max-width:none;border:0;border-radius:0;background:transparent}
.s2-C .stack .ar{background:var(--kalka);border:2px solid var(--ink);border-radius:12px!important;box-shadow:0 8px 18px rgba(0,0,0,.5);width:calc(100% - var(--o,0px));margin-left:var(--o,0px)}
.s2-C .stack .ar:nth-child(3n+2){--o:14px}.s2-C .stack .ar:nth-child(3n){--o:28px}
.s2-C .stack .ar.on{background:#F7E58A;box-shadow:inset 0 0 0 3px var(--y),0 8px 18px rgba(0,0,0,.5)}
.s2-C .stack.has-on .ar:not(.on){opacity:.4}
.s2-C .s2-notes{margin-top:24px}

/* G4: fragment schematu pod aktywną notatką na telefonie i wyśrodkowanie schematu na tablecie (768–1023 px) */
.s2-B .s2-mfrag{display:block;width:100%;max-width:none;margin:8px 0 6px;--hl:rgba(255,214,10,.55)}
.s2-B .s2-mfrag .ar{border-radius:12px;border-top:0}
.s2-B .s2-mfrag .pmk{display:none}
@media (min-width:768px) and (max-width:1023px){
  .s2-B .s2-left{display:flex;flex-direction:column;align-items:center}
  .s2-B .s2-left .pf{width:100%;max-width:480px;margin-left:0}
  .s2-B .s2-przyklad{align-self:center}
}

/* ---------- komputer ---------- */
@media (min-width:1024px){
  .s2{padding-bottom:64px}
  .s2-tab{height:56px}
  .s2-tab span{font-size:21px;padding-right:24px}
  .s2-tab i{width:150px;background:repeating-linear-gradient(135deg,var(--y) 0 12px,#08080a 12px 24px)}
  .s2-h2{margin-top:26px;font-size:clamp(44px,4.6vw,66px);max-width:none}
  .s2-lead{margin-top:20px;font-size:clamp(18px,1.35vw,21px)}
  .pf{margin-left:18px;width:100%}

  .s2-A .s2-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:clamp(32px,5vw,80px);align-items:start;margin-top:36px}
  .s2-A .s2-stage{padding:44px 0 0 40px}
  .s2-A .pf{max-width:440px}
  .s2-A .s2-notes{margin-top:0}
  .s2-A .s2-stage.lens-on .lens,.s2-A .s2-stage.lens-on .lens-fr{display:block}

  .s2-B .s2-sheet{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);column-gap:clamp(90px,10vw,160px);align-items:start;padding:40px 44px 44px}
  .s2-B .s2-notes{margin-top:0}
  .leaders{display:block}

  .s2-C .s2-layers{display:grid;gap:12px;margin-top:28px}
  .s2-C .s2-layers .s2-przyklad{justify-self:start;margin:0 0 4px}
  .s2-C .s2-mobile{display:none}
  .s2-C .row{display:grid;grid-template-columns:minmax(0,420px) 84px minmax(0,470px);align-items:center;justify-content:start}
  .s2-C .row:nth-child(even){grid-template-columns:minmax(0,470px) 84px minmax(0,420px);justify-content:end}
  .s2-C .row:nth-child(even) .piece{order:3}
  .s2-C .row:nth-child(even) .cn{order:2;transform:scaleX(-1)}
  .s2-C .row:nth-child(even) .nt{order:1}
  .s2-C .row .piece{width:100%;max-width:none;margin-left:0;box-shadow:0 10px 24px rgba(0,0,0,.55);transition:opacity .2s}
  .s2-C .row:nth-child(odd) .piece{transform:rotate(-.4deg)}
  .s2-C .row:nth-child(even) .piece{transform:rotate(.35deg)}
  .s2-C .cn{display:block;width:84px;height:24px;justify-self:center}
  .s2-C .cn path{fill:none;stroke:var(--y);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
  .s2-C .cn circle{fill:var(--y)}
  .s2-C .row.sel .pf .ar{background:var(--hl);box-shadow:inset 0 0 0 3px var(--y)}
  .s2-C .row .pf .ar{opacity:1!important}
}

/* ===== S3-G2/final/s3.css ===== */
/* WIZ-S3-C-FINAL: S3 (finalne C) „Co robimy regularnie + wybrane przykłady bieżącej obsługi”, koncepcje A, B, C. Telefon najpierw, komputer od 1024 px (próg przyjęty w S2).
   Sekcja spokojna: dowody i czytelność ważniejsze niż widowisko. Dziedziczy motyw wzorowa-agencja.pl (żółć #FFD60A, tusz, papier, Sofia Sans i Sofia Sans Extra Condensed).
   Bez nowych kolorów i krojów. Nic nie zależy od najechania myszą. Jedyny ruch: podkreślenie nagłówka (raz); ?bezruchu=1 i prefers-reduced-motion go zatrzymują. */
.s3{
  --y:#FFD60A; --ink:#1D1C1A; --pencil:#4A4436; --paper:#F3E6CA; --kalka:#FBF7EA;
  --tech:"Sofia Sans Extra Condensed","Arial Narrow",sans-serif; --f:"Sofia Sans",system-ui,"Segoe UI",Arial,sans-serif;
  position:relative; padding:0 0 56px; color:#fff; font-family:var(--f);
  background-color:#08080a;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:48px 48px; overflow-x:clip;
}
.s3 *{box-sizing:border-box}
:where(.s3) h2,:where(.s3) h3,:where(.s3) h4,:where(.s3) p,:where(.s3) ol,:where(.s3) ul,:where(.s3) li,:where(.s3) dl,:where(.s3) dd,:where(.s3) dt{margin:0;padding:0}
.s3 ol,.s3 ul{list-style:none}

.s3-tab{display:flex;align-items:stretch;height:48px;margin-left:calc(-1 * var(--m,24px))}
.s3-tab span{display:flex;align-items:center;padding:0 16px 0 var(--m,24px);background:var(--y);color:#111;font:800 15px/1 var(--tech);letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}
.s3-tab i{width:72px;background:repeating-linear-gradient(135deg,var(--y) 0 9px,#08080a 9px 18px)}
.s3-h2{margin-top:22px;font:800 clamp(34px,9.4vw,46px)/.98 var(--tech);letter-spacing:.005em;color:#fff;max-width:20em;text-wrap:balance}
.s3-h2 .u{position:relative;display:inline-block}
.zn-ul{position:absolute;left:0;bottom:-.16em;width:100%;height:.2em;overflow:visible}
.zn-ul path{fill:none;stroke:var(--y);stroke-width:5;stroke-linecap:round}
.s3-lead{margin-top:20px;max-width:36em;font:400 17px/1.5 var(--f);color:rgba(255,255,255,.88);text-wrap:pretty}
.dr{stroke-dasharray:1;stroke-dashoffset:1;animation:wDr .8s cubic-bezier(.4,.1,.2,1) .25s forwards}
@keyframes wDr{to{stroke-dashoffset:0}}
html.stop .dr{animation:none!important;stroke-dashoffset:0!important}
@media (prefers-reduced-motion:reduce){.dr{animation:none!important;stroke-dashoffset:0!important}}

/* wspólne elementy */
.s3-no{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;background:var(--y);color:#111;font:800 15px/1 var(--tech);letter-spacing:.04em}
.s3-h3{font:800 clamp(26px,7vw,32px)/1 var(--tech);letter-spacing:.01em}
.s3-lat{margin-top:12px;max-width:38em;font:400 17px/1.5 var(--f);color:rgba(255,255,255,.92)}
.s3-dzis{margin-top:2px;max-width:38em;font:400 17px/1.5 var(--f);color:rgba(255,255,255,.92)}
.s3-sprawdz{display:flex;flex-wrap:wrap;align-items:center;gap:0 8px;font:700 15px/1.3 var(--f)}
.s3-sprawdz span{opacity:.75}
.s3-sprawdz .s3-pn{flex:0 0 100%;margin-top:-4px;font:400 14px/1.35 var(--f)}
.s3-sprawdz a{display:inline-flex;align-items:center;min-height:44px;color:inherit;text-decoration:underline;text-decoration-color:var(--y);text-decoration-thickness:2px;text-underline-offset:5px}
.s3 a:focus-visible{outline:3px solid #fff;outline-offset:3px}
.s3-end{margin-top:48px}
.s3-btn{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;border:2px solid currentColor;color:inherit;text-decoration:none;font:700 16px/1 var(--f)}
.s3-btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.s3-end p{margin-top:10px;font:400 15px/1.4 var(--f);opacity:.82}
.s3-slady{margin-top:12px;font:400 15px/1.4 var(--f);color:rgba(255,255,255,.78)}

/* C „Twierdzenie i ślad” */
.s3c-head{margin-top:24px}
.s3c-rows{margin-top:24px;border-top:1px solid rgba(255,255,255,.22)}
.s3c-row{display:grid;gap:10px;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.22)}
.s3c-step{display:grid;grid-template-columns:28px minmax(0,1fr);gap:16px}
.s3c-step h3{font:800 24px/1.05 var(--tech)}
.s3c-step p{margin-top:4px;font:400 16px/1.45 var(--f);color:rgba(255,255,255,.88)}
.s3c-brak{padding-left:44px;font:400 15px/1.4 var(--f);color:rgba(255,255,255,.72)}
.s3c-lab{font:800 22px/1.05 var(--tech);color:#fff;padding-left:44px}
.s3c-ma .s3-dzis{margin:6px 0 0 44px;font-size:16px}
.s3c-ma ul{display:grid;gap:12px;margin:10px 0 0 44px}
.s3c-ma li{padding:12px 14px;background:var(--kalka);color:var(--ink);border-left:4px solid var(--y)}
.s3c-ma h4{font:800 24px/1.05 var(--tech)}
.s3c-ma p{margin-top:4px;font:400 15px/1.45 var(--f)}
.s3c-ma .s3-sprawdz a{text-decoration-color:var(--ink)}
.s3c-ma a:focus-visible{outline-color:var(--ink)}

@media (min-width:1024px){
  .s3{padding-bottom:72px}
  .s3-tab{height:56px}
  .s3-tab span{font-size:21px;padding-right:24px}
  .s3-tab i{width:150px;background:repeating-linear-gradient(135deg,var(--y) 0 12px,#08080a 12px 24px)}
  .s3-h2{margin-top:26px;font-size:clamp(44px,4.6vw,66px);max-width:none}
  .s3-lead{margin-top:20px;font-size:clamp(18px,1.35vw,21px)}
  .s3-h3{font-size:34px}
  .s3-no{flex-basis:32px;width:32px;height:32px;font-size:17px}


  
  .s3c-head{margin-top:28px}
  .s3c-rows{margin-top:32px}
  .s3c-row{grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:56px;align-items:start;padding:20px 0}
  .s3c-step h3{font-size:28px}
  .s3c-brak{padding:6px 0 0}
  .s3c-lab{padding-left:0;font-size:24px}
  .s3c-ma .s3-dzis{margin-left:0}
  .s3c-ma ul{margin-left:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
}

/* finalne C: zdanie otwierające, krok kluczowy, przejście do Realizacji, zwarty finał */
.s3-otwarcie{margin-top:20px;max-width:34em;font:700 clamp(21px,5.6vw,26px)/1.3 var(--f);color:#fff;text-wrap:balance}
.s3c-key h3{font-size:28px}
.s3c-key .s3c-step p{font:400 18px/1.45 var(--f);color:#fff}
.s3c-key .s3c-step>div{padding-left:0}
.s3c-key{background:linear-gradient(90deg,rgba(255,214,10,.10),rgba(255,214,10,0) 70%);box-shadow:inset 3px 0 0 var(--y);padding-left:16px;margin-left:-16px}
.s3c-real{margin-top:36px}
.s3c-real p{font:400 15px/1.4 var(--f);color:rgba(255,255,255,.82);margin-top:8px}
.s3-link2{display:inline-flex;align-items:center;min-height:44px;color:#fff;font:700 16px/1.2 var(--f);text-decoration:underline;text-decoration-color:var(--y);text-decoration-thickness:2px;text-underline-offset:5px}
.s3-link2:focus-visible{outline:3px solid #fff;outline-offset:3px}
.s3c-final{margin-top:56px;padding-top:28px;border-top:2px solid var(--y)}
.s3c-final h3{font:800 clamp(30px,8.2vw,40px)/1.02 var(--tech);letter-spacing:.005em;max-width:16em;text-wrap:balance}
.s3c-final .s3-fz{margin-top:12px;max-width:30em;font:400 18px/1.45 var(--f);color:rgba(255,255,255,.92)}
.s3c-fcta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 28px;margin-top:20px}
.s3-btn-y{min-height:52px;background:var(--y);border-color:var(--y);color:#111}
.s3-ank{display:block;height:0;overflow:hidden}
@media (min-width:1024px){
  .s3-otwarcie{margin-top:24px;font-size:clamp(24px,2vw,30px);max-width:38em}
  .s3c-key{padding-left:20px;margin-left:-20px}
  .s3c-key h3{font-size:32px}
  .s3c-real{margin-top:44px}
  .s3c-final{margin-top:72px;padding-top:36px}
  .s3c-final h3{font-size:clamp(40px,3.6vw,52px);max-width:22em}
  .s3c-final .s3-fz{font-size:20px}
  .s3c-fcta{margin-top:26px}
}

/* ===== S4-G2/final/s4.css ===== */
/* WIZ-S4-A-FINAL: S4 (finalne A) „Siatka pomiaru”, koncepcje A, B, C. Telefon najpierw, komputer od 1024 px (próg z S2).
   Dziedziczy system S1–S3: żółć #FFD60A, tusz, papier, kalka, Sofia Sans i Sofia Sans Extra Condensed. Bez nowych kolorów i krojów, bez gradientów poza siatką tła,
   bez kolorów oceny, bez Google UI. Ruch: tylko jednorazowe rysowanie linii (i przejście kalek po kliknięciu); ?bezruchu=1 i prefers-reduced-motion go zatrzymują. */
.s4{
  --y:#FFD60A; --ink:#1D1C1A; --pencil:#4A4436; --paper:#F3E6CA; --kalka:#FBF7EA;
  --tech:"Sofia Sans Extra Condensed","Arial Narrow",sans-serif; --f:"Sofia Sans",system-ui,"Segoe UI",Arial,sans-serif;
  position:relative; padding:0 0 56px; color:#fff; font-family:var(--f);
  background-color:#08080a;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:48px 48px; overflow-x:clip;
}
.s4 *{box-sizing:border-box}
:where(.s4) h2,:where(.s4) h3,:where(.s4) h4,:where(.s4) p,:where(.s4) ol,:where(.s4) ul,:where(.s4) li,:where(.s4) figure{margin:0;padding:0}
.s4 ol,.s4 ul{list-style:none}
.s4 .s4sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.s4-tab{display:flex;align-items:stretch;height:48px;margin-left:calc(-1 * var(--m,24px))}
.s4-tab span{display:flex;align-items:center;padding:0 16px 0 var(--m,24px);background:var(--y);color:#111;font:800 15px/1 var(--tech);letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}
.s4-tab i{width:72px;background:repeating-linear-gradient(135deg,var(--y) 0 9px,#08080a 9px 18px)}
.s4-h2{margin-top:22px;font:800 clamp(34px,9.4vw,46px)/.98 var(--tech);letter-spacing:.005em;color:#fff;max-width:20em;text-wrap:balance}
.s4-h2 .u{position:relative;display:inline-block}
.zn-ul{position:absolute;left:0;bottom:-.16em;width:100%;height:.2em;overflow:visible}
.zn-ul path{fill:none;stroke:var(--y);stroke-width:5;stroke-linecap:round}
.s4-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:20px}
.s4-metoda{font:700 16px/1.3 var(--f);color:rgba(255,255,255,.92)}
.s4-przyklad{display:inline-block;padding:4px 10px;border:1.5px solid rgba(255,255,255,.55);font:700 13px/1.2 var(--f);letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.92)}
.dr{stroke-dasharray:1;stroke-dashoffset:1;animation:wDr .9s cubic-bezier(.4,.1,.2,1) .25s forwards}
@keyframes wDr{to{stroke-dashoffset:0}}
html.stop .dr{animation:none!important;stroke-dashoffset:0!important}
html.stop .s4 *{transition:none!important}
@media (prefers-reduced-motion:reduce){.dr{animation:none!important;stroke-dashoffset:0!important}.s4 *{transition:none!important}}

/* mapka siatki (własny rysunek, przykład działania) */
.s4mp{display:block;width:100%;height:auto;overflow:visible}
.s4mp .s4ul{fill:none;stroke:currentColor;opacity:.22;stroke-width:1.2;stroke-linecap:round}
.s4mp .s4pt circle,.s4mp .s4pt path{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.s4mp .s4pl{fill:currentColor;font:800 15px var(--tech);letter-spacing:.04em}
.s4mp .s4fm rect{fill:var(--y);stroke:#111;stroke-width:2}
.s4mp .s4fm text{fill:currentColor;font:800 13px var(--tech);letter-spacing:.06em;text-transform:uppercase}

/* kroki (opis metody, wspólny) */
.s4-kroki{margin-top:28px;border-top:1px solid rgba(255,255,255,.22)}
.s4-kroki li{display:grid;grid-template-columns:112px minmax(0,1fr);gap:0 14px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.22)}
.s4-kroki .s4k{font:800 22px/1.05 var(--tech)}
.s4-kroki .s4v{font:400 16px/1.45 var(--f);color:rgba(255,255,255,.92);text-wrap:pretty}

/* A „Dwie kalki” */
.s4a-grid{margin-top:28px}
.s4a-stage{--gap:20px;position:relative;display:grid;gap:var(--gap);max-width:340px}
.s4a-stage.is-ov{grid-template-rows:auto 0;align-items:start}
.s4a-sheet{position:relative;margin:0;padding:12px;border:1.5px solid rgba(255,255,255,.38);background:rgba(255,255,255,.03);transition:transform .7s cubic-bezier(.4,.1,.2,1)}
.s4a-s1{color:#fff;z-index:1}
.s4a-s2{color:#fff;z-index:2}
.s4a-sheet figcaption{margin-top:8px;font:400 14px/1.3 var(--f);color:rgba(255,255,255,.92)}
.s4a-sheet figcaption b{font-weight:700}
.s4a-s2 .s4ul,.s4a-s2 .s4fm,.s4a-s2 .s4pl{transition:opacity .4s}
.s4a-s2 figcaption{transition:opacity .15s}
.is-ov .s4a-s2 .s4ul,.is-ov .s4a-s2 .s4fm,.is-ov .s4a-s2 .s4pl,.is-ov .s4a-s2 figcaption{opacity:0}
.s4a-s1 figcaption{transition:opacity .15s}
.is-ov .s4a-s1 figcaption{opacity:0}
.is-ov .s4a-s2{transform:translateY(calc(-100% - var(--gap)));background:transparent}
.s4a-ctl{margin-top:0;max-width:340px}
.s4a-stage{margin-top:20px}
.s4a-btn{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;border:2px solid currentColor;background:transparent;color:#fff;font:700 16px/1 var(--f);cursor:pointer}
.s4a-btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.s4a-btn[aria-pressed=true]{background:var(--y);border-color:var(--y);color:#111}
.s4a-cap{display:flex;align-items:flex-start;gap:12px;margin-top:14px;min-height:46px;font:400 16px/1.45 var(--f);color:rgba(255,255,255,.92)}
.s4a-sheet figcaption{display:flex;align-items:center;gap:8px}
.s4ic{flex:0 0 22px;width:22px;height:22px}
.s4ic circle,.s4ic path{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.s4a-left{min-width:0}
.s4a-klucz{display:none;gap:8px;margin-top:14px;font:400 14px/1.35 var(--f);color:rgba(255,255,255,.92)}
.s4a-klucz li{display:flex;align-items:center;gap:8px}
.s4a-stage.is-ov + .s4a-klucz{display:grid}
.s4a-btn[hidden]{display:inline-flex;visibility:hidden}  /* G4: miejsce przycisku zarezerwowane do czasu pokazania go przez JS (bez skoku układu); ukryty dla czytników ekranu i klawiatury */
.s4a-sheet .s4pt .s4br,.s4a-sheet .s4pt .s4tk{fill:none}
@media (max-width:767px){
  .s4a-stage .s4a-sheet,.s4a-stage .s4a-sheet *{transition:none}
}
/* G4 (08.11.2026): tablet 768–1100 px = jedna kolumna z kalkami obok siebie (większe niż na komputerze), kroki 2×2; układ dwukolumnowy od 1101 px (wcześniej od 1024 px: kalki 248–286 px, etykiety 9–12 px) */
@media (min-width:768px){
  .s4a-stage{--gap:28px;grid-template-columns:repeat(2,minmax(0,1fr));max-width:900px}
  .s4a-stage.is-ov{grid-template-rows:none;align-items:stretch}
  .is-ov .s4a-s1{transform:translateX(calc((100% + var(--gap)) / 2))}
  .is-ov .s4a-s2{transform:translateX(calc((100% + var(--gap)) / -2))}
  .s4a-ctl{max-width:none}
  .s4a-cap{max-width:24em}
}
@media (min-width:1024px){
  .s4{padding-bottom:72px}
  .s4-tab{height:56px}
  .s4-tab span{font-size:21px;padding-right:24px}
  .s4-tab i{width:150px;background:repeating-linear-gradient(135deg,var(--y) 0 12px,#08080a 12px 24px)}
  .s4-h2{margin-top:26px;font-size:clamp(44px,4.6vw,66px);max-width:none}
  .s4-meta{margin-top:22px}
  .s4-kroki{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:40px;border-top:0}
  .s4-kroki li{display:block;padding:12px 0 0;border-bottom:0;border-top:2px solid rgba(255,255,255,.5)}
  .s4-kroki .s4k{display:block;margin-bottom:6px;font-size:26px}
}
@media (min-width:768px) and (max-width:1100px){
  .s4a-grid{display:block;margin-top:32px}
  .s4a-stage{margin-top:22px}
  .s4a-grid .s4-kroki{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 40px;margin-top:36px;border-top:0}
  .s4a-grid .s4-kroki li{display:block;padding:12px 0 0;border-bottom:0;border-top:2px solid rgba(255,255,255,.5)}
  .s4a-grid .s4-kroki .s4k{display:block;margin:0 0 6px;font-size:24px}
}
@media (min-width:1101px){
  .s4a-grid{display:grid;grid-template-columns:minmax(0,800px) minmax(300px,1fr);column-gap:56px;align-items:start;margin-top:36px}
  .s4a-left{grid-column:1;grid-row:1 / span 2}
  .s4a-grid .s4-kroki{grid-column:2;grid-template-columns:minmax(0,1fr);gap:0;margin-top:28px;border-top:1px solid rgba(255,255,255,.22)}
  .s4a-grid .s4-kroki li{display:grid;grid-template-columns:130px minmax(0,1fr);gap:0 14px;padding:12px 0;border-top:0;border-bottom:1px solid rgba(255,255,255,.22)}
  .s4a-grid .s4-kroki .s4k{margin:0;font-size:22px}
  .s4a-grid .s4a-ctl{grid-column:2;grid-row:1}
  .s4a-stage{max-width:none;margin-top:0}
}

/* ===== S5-G2/s5.css ===== */
/* WIZ-S5-G2 (FAST TRACK): S5 „Pytania i odpowiedzi”. Telefon najpierw, komputer od 1024 px (próg z S2). Dziedziczy system S1–S4: żółć #FFD60A, Sofia Sans i Sofia Sans Extra Condensed,
   ciemne tło z siatką 48 px, cienkie linie. Spokojniejsza od S1–S4: bez rysunków, bez ruchu poza jednorazowym podkreśleniem nagłówka; nic nie zależy od najechania. */
.s5{
  --y:#FFD60A; --tech:"Sofia Sans Extra Condensed","Arial Narrow",sans-serif; --f:"Sofia Sans",system-ui,"Segoe UI",Arial,sans-serif;
  position:relative; padding:0 0 64px; color:#fff; font-family:var(--f);
  background-color:#08080a;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:48px 48px; overflow-x:clip;
}
.s5 *{box-sizing:border-box}
:where(.s5) h2,:where(.s5) h3,:where(.s5) p,:where(.s5) summary,:where(.s5) details,:where(.s5) div{margin:0;padding:0}

.s5-tab{display:flex;align-items:stretch;height:48px;margin-left:calc(-1 * var(--m,24px))}
.s5-tab span{display:flex;align-items:center;padding:0 16px 0 var(--m,24px);background:var(--y);color:#111;font:800 15px/1 var(--tech);letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}
.s5-tab i{width:72px;background:repeating-linear-gradient(135deg,var(--y) 0 9px,#08080a 9px 18px)}
.s5-h2{margin-top:22px;font:800 clamp(34px,9.4vw,46px)/.98 var(--tech);letter-spacing:.005em;color:#fff;max-width:20em;text-wrap:balance}
.s5-h2 .u{position:relative;display:inline-block}
.zn-ul{position:absolute;left:0;bottom:-.16em;width:100%;height:.2em;overflow:visible}
.zn-ul path{fill:none;stroke:var(--y);stroke-width:5;stroke-linecap:round}
.dr{stroke-dasharray:1;stroke-dashoffset:1;animation:wDr .9s cubic-bezier(.4,.1,.2,1) .25s forwards}
@keyframes wDr{to{stroke-dashoffset:0}}
html.stop .dr{animation:none!important;stroke-dashoffset:0!important}
@media (prefers-reduced-motion:reduce){.dr{animation:none!important;stroke-dashoffset:0!important}}

.s5-grid{margin-top:24px}
.s5-lead{max-width:30em;font:400 18px/1.5 var(--f);color:rgba(255,255,255,.92);text-wrap:pretty}
.s5-list{margin-top:28px;border-top:1px solid rgba(255,255,255,.22)}
.s5-q{border-bottom:1px solid rgba(255,255,255,.22)}
.s5-q > summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding:12px 0;cursor:pointer;list-style:none;color:#fff}
.s5-q > summary::-webkit-details-marker{display:none}
.s5-q > summary::marker{content:''}
.s5-q > summary:focus-visible{outline:3px solid #fff;outline-offset:3px}
.s5-qt{font:800 24px/1.1 var(--tech);letter-spacing:.005em;color:#fff;text-wrap:balance}
.s5-pm{position:relative;flex:0 0 20px;width:20px;height:20px}
.s5-pm::before,.s5-pm::after{content:"";position:absolute;left:0;top:9px;width:20px;height:2px;background:var(--y)}
.s5-pm::after{transform:rotate(90deg)}
.s5-q[open] .s5-pm::after{transform:rotate(0)}
.s5-a{padding:0 36px 20px 0;max-width:38em}
.s5-a p{font:400 18px/1.5 var(--f);color:rgba(255,255,255,.92);text-wrap:pretty}
.s5-zr{margin-top:20px;max-width:40em;font:400 14px/1.45 var(--f);color:rgba(255,255,255,.78)}
.s5-zr a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.s5-zr a:focus-visible{outline:3px solid #fff;outline-offset:3px}

@media (min-width:1024px){
  .s5{padding-bottom:80px}
  .s5-tab{height:56px}
  .s5-tab span{font-size:21px;padding-right:24px}
  .s5-tab i{width:150px;background:repeating-linear-gradient(135deg,var(--y) 0 12px,#08080a 12px 24px)}
  .s5-h2{margin-top:26px;font-size:clamp(44px,4.6vw,66px);max-width:none}
  .s5-grid{display:grid;grid-template-columns:minmax(240px,4fr) minmax(0,8fr);column-gap:56px;align-items:start;margin-top:40px}
  .s5-lead{max-width:16em}
  .s5-list{margin-top:0}
  .s5-qt{font-size:28px}
  .s5-q > summary{min-height:72px}
}

/* ===== S6-G2/s6.css (finał) ===== */
/* WIZ-S6-G2 (FAST TRACK): finał podstrony = istniejący finał serwisu (style motywu: dodatki.css, klasy fZ). Tu tylko dwie nowe linie tekstu pod nagłówkiem i pod przyciskiem. */
body.wiz-wizytowki .rfh.sf.fZ .s6-lead{margin:calc(34*var(--u,1px)) 0 0;max-width:34em;font:400 18px/1.5 "Sofia Sans",system-ui,"Segoe UI",Arial,sans-serif;color:#0b0b0f}
body.wiz-wizytowki .rfh.sf.fZ .s6-po{margin:12px 0 0;max-width:34em;font:400 15px/1.45 "Sofia Sans",system-ui,"Segoe UI",Arial,sans-serif;color:#0b0b0f}
/* cel dotyku przycisku nie mniejszy niż 44 px także na 1024–1439 px (tam przycisk motywu skaluje się do 41–45 px; wersja w motywie: do decyzji w G4) */
body.wiz-wizytowki .rfh.sf.fZ .fZ-cta{min-height:max(44px,calc(48*var(--u,1px)))}
/* ręczne znaki z motywu przeniesione obok tekstu (nie na tekst): gwiazdka za pierwszym wierszem nagłówka, uśmiech obok przycisku */
body.wiz-wizytowki .rfh.sf.fZ .fZ-l{position:relative}
body.wiz-wizytowki .rfh.sf.fZ .fZ-l .s6-gwiazda{left:calc(352*var(--u,1px));top:calc(-8*var(--u,1px));width:calc(54*var(--u,1px));height:calc(54*var(--u,1px));transform:rotate(-12deg)}
body.wiz-wizytowki .rfh.sf.fZ .s6-cta{position:relative;display:inline-block;vertical-align:top}
body.wiz-wizytowki .rfh.sf.fZ .s6-cta .s6-smile{left:calc(100% + 18*var(--u,1px));top:calc(50% + 6*var(--u,1px));width:calc(52*var(--u,1px));height:calc(52*var(--u,1px));transform:translateY(-50%) rotate(8deg)}

/* G4: cele dotyku w stopce (tablet i telefon do 1439 px) i przycisk ustawień cookies: min. 44 px */
@media (max-width:1439px){
  body.wiz-wizytowki .rfh.sf.fZ .fZ-dane a,body.wiz-wizytowki .rfh.sf.fZ .fZ-gr a{display:inline-flex;align-items:center;min-height:44px}
}
body.wiz-wizytowki .rfh.sf.fZ .fZ-gr .wa-zgody-otworz{min-height:44px}

/* ===== WIZ-G4-MARKETING-PASS: rozpoznawalność usługi i dowód społeczny (rail, znak lokalizacji, droga klienta z opinią, opinie o agencji) ===== */
.mp-rail,.mp-op,.mp-droga,.mp-lok{--y:#FFD60A;--ink:#1D1C1A;--kalka:#FBF7EA;--tech:"Sofia Sans Extra Condensed","Arial Narrow",sans-serif;--f:"Sofia Sans",system-ui,"Segoe UI",Arial,sans-serif}
.mp-rail{box-sizing:border-box;background:#08080a;border-top:1px solid rgba(255,255,255,.22);border-bottom:1px solid rgba(255,255,255,.22);padding:14px 0;font-family:var(--f)}
.mp-rail *{box-sizing:border-box}
.mp-rail .wrap{display:flex;align-items:center;gap:14px}
.mp-znak{flex:0 0 32px;width:32px;height:32px}
.mp-rail-l{display:flex;flex-wrap:wrap;gap:4px 22px;margin:0;padding:0;list-style:none;font:800 clamp(16px,4.4vw,19px)/1.15 var(--tech);letter-spacing:.14em;text-transform:uppercase;color:#fff}
.mp-rail-l li{display:flex;align-items:center;gap:9px;margin:0;padding:0}
.mp-rail-l li::before{content:"";flex:0 0 7px;width:7px;height:7px;background:var(--y)}
.mp-lok{margin:14px 0 0;max-width:38em;font:400 17px/1.5 var(--f);color:rgba(255,255,255,.88);text-wrap:pretty}
.mp-droga{padding:0 0 0 44px;font-family:var(--f)}
.mp-droga-h{margin:0;font:800 21px/1.1 var(--tech);letter-spacing:.01em;color:var(--y);text-wrap:balance}
.mp-droga-l{display:flex;flex-direction:column;gap:6px;margin:10px 0 0;padding:0;list-style:none}
.mp-droga-l li{margin:0;padding:0;font:400 16px/1.35 var(--f);color:#fff}
.mp-droga-l li+li::before{content:"→";margin-right:8px;font-weight:800;color:var(--y)}
.mp-op{box-sizing:border-box;position:relative;padding:8px 0 56px;color:#fff;font-family:var(--f);background-color:#08080a;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:48px 48px;overflow-x:clip}
.mp-op *{box-sizing:border-box}
.mp-op-h{margin:0;font:800 clamp(30px,8vw,38px)/1 var(--tech);letter-spacing:.005em;color:#fff;max-width:22em;text-wrap:balance}
.mp-op-l{display:grid;gap:16px;margin:24px 0 0;padding:0;list-style:none}
.mp-op-l li{margin:0;padding:18px 20px;background:var(--kalka);color:var(--ink);border-left:4px solid var(--y)}
.mp-op-l blockquote{margin:0;padding:0}
.mp-q{margin:0;font:800 clamp(26px,6.6vw,30px)/1.08 var(--tech);text-wrap:balance}
.mp-tr{margin:10px 0 0;font:400 16px/1.5 var(--f)}
.mp-od{margin:12px 0 0;font:700 14px/1.3 var(--f);letter-spacing:.06em;text-transform:uppercase}
.mp-wiecej{margin:20px 0 0}
.mp-wiecej a{display:inline-flex;align-items:center;min-height:44px;color:#fff;font:700 17px/1.2 var(--f);text-decoration:underline;text-decoration-color:var(--y);text-decoration-thickness:2px;text-underline-offset:5px}
.mp-wiecej a:focus-visible{outline:3px solid var(--y);outline-offset:3px}
@media (min-width:768px){
  .mp-droga-l{flex-direction:row;flex-wrap:wrap;gap:4px 8px}
}
@media (min-width:1024px){
  .mp-rail{padding:18px 0}
  .mp-rail-l{gap:6px 38px;font-size:22px}
  .mp-lok{font-size:clamp(18px,1.35vw,21px)}
  .mp-droga{padding:6px 0 0}
  .mp-droga-h{font-size:24px}
  .mp-droga-l li{font-size:17px}
  .mp-op{padding:16px 0 72px}
  .mp-op-l{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .mp-op-l li{padding:22px 24px}
}

/* ===== IMPL-ULICA: moduły A–D (G7/kod/ulica.css) ===== */
/* ===== WIZ-G7 / IMPL-ULICA: warstwa sprzedażowa A–D (kierunek 2 „Ulica”). Wszystkie reguły mają prefiks .wa-sales (nie wpływają na S1–S6, stronę główną ani /realizacje/). ===== */
.wa-sales{--wa-black:#0C0C0E;--wa-y:#FFD60A;--wa-ink:#1D1C1A;--wa-paper:#F3E6CA;--wa-kalka:#FBF7EA;--wa-cream:#F7F5EC;--wa-pencil:#4A4436;--wa-brzoskwinia:#FFC2A6;--wa-szalwia:#BFE4CE;--wa-liliowy:#D9CEF5;--wa-kraft:#E6C9A3;--wa-f:"Sofia Sans",system-ui,"Segoe UI",Arial,sans-serif;--wa-tech:"Sofia Sans Extra Condensed","Arial Narrow",sans-serif;display:block;position:relative;container-type:inline-size;overflow:hidden;background:#08080a;color:#fff;font-family:var(--wa-f);font-size:16px;font-weight:400;line-height:1.4;text-align:left;letter-spacing:normal;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
.wa-sales,.wa-sales *,.wa-sales *::before,.wa-sales *::after{box-sizing:border-box}
.wa-sales :where(h2,h3,p,ul,li,figure,blockquote){margin:0;padding:0}
.wa-sales :where(ul){list-style:none}
.wa-sales :where(a){color:inherit;text-decoration:none}
.wa-sales :where(svg){display:block}
.wa-sales svg,.wa-sales img{max-width:none}   /* motyw ma globalne img,svg{max-width:100%} */
.wa-sales-defs{position:absolute;width:0;height:0;overflow:hidden}
/* rozmiar SVG z atrybutów width/height (przeliczony na jednostkę sceny); zerowa specyficzność, więc każda reguła modułu go nadpisuje */
:where(.wa-sales svg[style*="--wa-w"]){width:var(--wa-w);height:var(--wa-h)}
/* dostępność: widoczny fokus i cele dotyku (B: przycisk i telefon) */
.wa-sales a:focus-visible{outline:calc(var(--wa-u,1px)*4) solid var(--wa-y);outline-offset:calc(var(--wa-u,1px)*4)}
.wa-sales-b-ctaw:has(a:focus-visible){outline:4px solid #fff;outline-offset:6px}
@supports not selector(:has(*)){.wa-sales-b-ctaw:focus-within{outline:4px solid #fff;outline-offset:6px}}
.wa-sales-b-cta:focus-visible{outline:0}
.wa-sales-b-cta:focus-visible span{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:5px}
.wa-sales-b-phn a{position:static}
.wa-sales-b-phn a::after{content:"";position:absolute;inset:0}
.wa-sales-b-phn a:focus-visible{outline:4px solid var(--wa-ink);outline-offset:3px}

.wa-sales-a-d{--wa-u:calc(min(100cqw,1440px)/1440);max-width:1440px;margin-left:auto;margin-right:auto}
.wa-sales-a-m{--wa-u:calc(min(100cqw,560px)/390);max-width:560px;margin-left:auto;margin-right:auto}
.wa-sales-a-d{display:block;position:relative;width:100%}
.wa-sales-a-m{display:none;position:relative;width:100%}
@container (max-width:1079px){
  .wa-sales-a-d{display:none}
  .wa-sales-a-m{display:block}
}
.wa-sales-a-t{font-family:var(--wa-tech);font-weight:800;text-transform:uppercase;margin:0}
.wa-sales-a p{margin:0}
.wa-sales-a-abs{position:absolute}
.wa-sales-a-bg{position:absolute;inset:0;filter:url(#wa-sales-a-rough)}
.wa-sales-a-rivet{position:absolute;width:calc(var(--wa-u)*12);height:calc(var(--wa-u)*12);border-radius:50%;background:var(--wa-ink);box-shadow:inset calc(var(--wa-u)*2) calc(var(--wa-u)*2) 0 rgba(255,255,255,.35)}
.wa-sales-a-rivet.wa-sales-a-l{background:#fff;box-shadow:inset calc(var(--wa-u)*-2) calc(var(--wa-u)*-2) 0 rgba(0,0,0,.35)}
.wa-sales-a-stripes{background:repeating-linear-gradient(-45deg,var(--wa-y) 0 calc(var(--wa-u)*13),var(--wa-ink) calc(var(--wa-u)*13) calc(var(--wa-u)*26))}
.wa-sales-a-u{text-decoration:underline;text-decoration-thickness:calc(var(--wa-u)*2);text-underline-offset:calc(var(--wa-u)*5)}
.wa-sales-a-t2{font-family:var(--wa-tech);font-weight:800;font-size:calc(var(--wa-u)*58);line-height:1.04;color:#fff;margin:0;position:absolute}
.wa-sales-a-t2 .wa-sales-a-q{position:relative;display:inline-block}
.wa-sales-a-t2 .wa-sales-a-ul{position:absolute;left:calc(var(--wa-u)*-4);bottom:calc(var(--wa-u)*-10);width:calc(var(--wa-u)*270);height:calc(var(--wa-u)*18)}
.wa-sales-a-sup{font-size:max(11px,calc(var(--wa-u)*19));line-height:1.4;color:#e8e6de}
.wa-sales-a-road{height:0;border-top:calc(var(--wa-u)*4) dashed #46443e}
.wa-sales-a-pole{background:linear-gradient(90deg,#b4af9f,#7d796d 50%,#4b4840);border-left:calc(var(--wa-u)*3) solid var(--wa-ink);border-right:calc(var(--wa-u)*3) solid var(--wa-ink);border-radius:calc(var(--wa-u)*2)}
.wa-sales-a-pl{position:absolute}
.wa-sales-a-e{position:absolute;inset:0;background:var(--wa-brzoskwinia);border:calc(var(--wa-u)*6) solid var(--wa-ink);border-radius:calc(var(--wa-u)*5);filter:url(#wa-sales-a-rough2)}
.wa-sales-a-e2{position:absolute;inset:calc(var(--wa-u)*7);border:calc(var(--wa-u)*2.5) solid #fff;border-radius:calc(var(--wa-u)*2)}
.wa-sales-a-pl .wa-sales-a-t{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--wa-ink);white-space:nowrap;padding-top:calc(var(--wa-u)*5)}
.wa-sales-a-cs{border-radius:50%}
.wa-sales-a-cs .wa-sales-a-e{border-radius:50%}
.wa-sales-a-cs .wa-sales-a-e2{border-radius:50%}
.wa-sales-a-cs{position:absolute}
.wa-sales-a-cs .wa-sales-a-hs{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.wa-sales-a-bd{position:absolute}
.wa-sales-a-bd .wa-sales-a-e{background:var(--wa-szalwia)}
.wa-sales-a-mp{position:absolute;inset:calc(var(--wa-u)*13);overflow:hidden;border-radius:calc(var(--wa-u)*2)}
.wa-sales-a-mp svg{display:block;width:100%;height:100%}
.wa-sales-a-stkm{background:#FBF7EA;border:calc(var(--wa-u)*5) solid #fff;border-radius:calc(var(--wa-u)*9);padding:calc(var(--wa-u)*4) calc(var(--wa-u)*12) calc(var(--wa-u)*5);font-size:max(11px,calc(var(--wa-u)*16));font-weight:700;color:var(--wa-ink);transform:rotate(-2deg);box-shadow:0 0 0 1px rgba(0,0,0,.3);white-space:nowrap}
.wa-sales-a-cap{margin:0;font-size:max(11px,calc(var(--wa-u)*26));font-weight:700;line-height:1.1;color:#fff;display:flex;align-items:center;gap:calc(var(--wa-u)*12);white-space:nowrap}
.wa-sales-a-cap i{flex:none;width:calc(var(--wa-u)*15);height:calc(var(--wa-u)*15);background:var(--wa-y)}
.wa-sales-a-route .wa-sales-a-ry,.wa-sales-a-route path{stroke-dasharray:100;stroke-dashoffset:0}
@container (max-width:1079px){
  .wa-sales-a-t2{font-size:calc(var(--wa-u)*44)}
  .wa-sales-a-t2 .wa-sales-a-ul{width:calc(var(--wa-u)*190);height:calc(var(--wa-u)*14);bottom:calc(var(--wa-u)*-8)}
  .wa-sales-a-sup{font-size:max(11px,calc(var(--wa-u)*17.5))}
  .wa-sales-a-cap{font-size:max(11px,calc(var(--wa-u)*21))}
  .wa-sales-a-cap i{width:calc(var(--wa-u)*12);height:calc(var(--wa-u)*12)}
  .wa-sales-a-stkm{font-size:max(11px,calc(var(--wa-u)*14));padding:calc(var(--wa-u)*3) calc(var(--wa-u)*9) calc(var(--wa-u)*4)}
  .wa-sales-a-e{border-width:calc(var(--wa-u)*5)}
  .wa-sales-a-e2{inset:calc(var(--wa-u)*6)}
}
.wa-sales-b-d{--wa-u:calc(min(100cqw,1440px)/1440);max-width:1440px;margin-left:auto;margin-right:auto}
.wa-sales-b-m{--wa-u:calc(min(100cqw,560px)/390);max-width:560px;margin-left:auto;margin-right:auto}
.wa-sales-b-d{display:block;position:relative;width:100%}
.wa-sales-b-m{display:none;position:relative;width:100%}
@container (max-width:1079px){
  .wa-sales-b-d{display:none}
  .wa-sales-b-m{display:block}
}
.wa-sales-b-t{font-family:var(--wa-tech);font-weight:800;text-transform:uppercase;margin:0}
.wa-sales-b p{margin:0}
.wa-sales-b-abs{position:absolute}
.wa-sales-b-bg{position:absolute;inset:0;filter:url(#wa-sales-b-rough)}
.wa-sales-b-rivet{position:absolute;width:calc(var(--wa-u)*12);height:calc(var(--wa-u)*12);border-radius:50%;background:var(--wa-ink);box-shadow:inset calc(var(--wa-u)*2) calc(var(--wa-u)*2) 0 rgba(255,255,255,.35)}
.wa-sales-b-rivet.wa-sales-b-l{background:#fff;box-shadow:inset calc(var(--wa-u)*-2) calc(var(--wa-u)*-2) 0 rgba(0,0,0,.35)}
.wa-sales-b-stripes{background:repeating-linear-gradient(-45deg,var(--wa-y) 0 calc(var(--wa-u)*13),var(--wa-ink) calc(var(--wa-u)*13) calc(var(--wa-u)*26))}
.wa-sales-b-u{text-decoration:underline;text-decoration-thickness:calc(var(--wa-u)*2);text-underline-offset:calc(var(--wa-u)*5)}
.wa-sales-b-h1{font-size:calc(var(--wa-u)*150);line-height:.86;color:#fff;white-space:nowrap}
.wa-sales-b-h1 .wa-sales-b-zn{position:relative;display:inline-block}
.wa-sales-b-h1 .wa-sales-b-ul{position:absolute;left:calc(var(--wa-u)*-6);bottom:calc(var(--wa-u)*-16);width:calc(var(--wa-u)*380);height:calc(var(--wa-u)*24)}
.wa-sales-b-main{font-size:max(11px,calc(var(--wa-u)*24));font-weight:700;line-height:1.3;color:#fff}
.wa-sales-b-micro{font-size:max(11px,calc(var(--wa-u)*16));color:#e0ded5;line-height:1.4}
.wa-sales-b-pole{width:calc(var(--wa-u)*26);background:linear-gradient(90deg,#b4af9f,#7d796d 50%,#4b4840);border-left:calc(var(--wa-u)*3) solid var(--wa-ink);border-right:calc(var(--wa-u)*3) solid var(--wa-ink);border-radius:calc(var(--wa-u)*3)}
.wa-sales-b-pole .wa-sales-b-base{position:absolute;left:calc(var(--wa-u)*-3);right:calc(var(--wa-u)*-3);bottom:0;height:calc(var(--wa-u)*70);background:repeating-linear-gradient(-45deg,var(--wa-y) 0 calc(var(--wa-u)*13),var(--wa-ink) calc(var(--wa-u)*13) calc(var(--wa-u)*26));border:calc(var(--wa-u)*3) solid var(--wa-ink)}
.wa-sales-b-strap{position:absolute;width:calc(var(--wa-u)*30);background:#6b675d;border:calc(var(--wa-u)*3) solid var(--wa-ink);border-radius:calc(var(--wa-u)*3)}
.wa-sales-b-strap b{position:absolute;left:50%;top:50%;width:calc(var(--wa-u)*8);height:calc(var(--wa-u)*8);margin:calc(var(--wa-u)*-4);border-radius:50%;background:var(--wa-ink)}
.wa-sales-b-zw{position:absolute;inset:0}
.wa-sales-b-zw .wa-sales-b-en{position:absolute;inset:0;background:var(--wa-brzoskwinia);border:calc(var(--wa-u)*6) solid var(--wa-ink);border-radius:calc(var(--wa-u)*6)}
.wa-sales-b-zw .wa-sales-b-en2{position:absolute;inset:calc(var(--wa-u)*8);border:calc(var(--wa-u)*2.5) solid #fff;border-radius:calc(var(--wa-u)*3)}
.wa-sales-b-zw .wa-sales-b-in{position:absolute;left:calc(var(--wa-u)*52);right:calc(var(--wa-u)*36);top:calc(var(--wa-u)*30)}
.wa-sales-b-zw h3{font-size:calc(var(--wa-u)*96);line-height:.92;color:var(--wa-ink);white-space:nowrap}
.wa-sales-b-zw .wa-sales-b-bar{height:calc(var(--wa-u)*18);margin-top:calc(var(--wa-u)*20);border:calc(var(--wa-u)*3) solid var(--wa-ink)}
.wa-sales-b-zw ul{list-style:none;margin:calc(var(--wa-u)*8) 0 0;padding:0}
.wa-sales-b-zw li{display:flex;align-items:center;gap:calc(var(--wa-u)*18);height:calc(var(--wa-u)*58);border-bottom:calc(var(--wa-u)*2) dashed rgba(29,28,26,.45);font-size:max(11px,calc(var(--wa-u)*25));font-weight:700;color:var(--wa-ink)}
.wa-sales-b-zw li:last-child{border-bottom:0}
.wa-sales-b-sq{flex:none;width:calc(var(--wa-u)*22);height:calc(var(--wa-u)*22);background:var(--wa-y);border:calc(var(--wa-u)*3.5) solid var(--wa-ink);transform:rotate(-4deg)}
.wa-sales-b-cta{position:absolute;inset:0;display:block;background:var(--wa-y);color:var(--wa-ink);clip-path:polygon(0 0,calc(100% - calc(var(--wa-u)*38)) 0,100% 50%,calc(100% - calc(var(--wa-u)*38)) 100%,0 100%)}
.wa-sales-b-cta span{position:absolute;left:calc(var(--wa-u)*60);right:calc(var(--wa-u)*56);top:0;bottom:0;display:flex;align-items:center;font-size:calc(var(--wa-u)*31);white-space:nowrap;padding-top:calc(var(--wa-u)*3)}
.wa-sales-b-cta .wa-sales-b-rv{position:absolute;left:calc(var(--wa-u)*34);top:calc(var(--wa-u)*12);width:calc(var(--wa-u)*11);height:calc(var(--wa-u)*11);border-radius:50%;background:var(--wa-ink)}
.wa-sales-b-cta .wa-sales-b-rv.wa-sales-b-b{top:auto;bottom:calc(var(--wa-u)*12)}
.wa-sales-b-ctaw::before{content:"";position:absolute;left:0;top:0;width:calc(var(--wa-u)*36);bottom:0;background:#6b675d;border:calc(var(--wa-u)*3) solid var(--wa-ink);border-radius:calc(var(--wa-u)*3);z-index:2;left:calc(var(--wa-u)*4);top:calc(var(--wa-u)*-8);bottom:calc(var(--wa-u)*-8);width:calc(var(--wa-u)*30)}
.wa-sales-b-ctaw .wa-sales-b-cta{z-index:1}
.wa-sales-b-phw{background:var(--wa-cream);border:calc(var(--wa-u)*5) solid var(--wa-ink);border-radius:calc(var(--wa-u)*5);box-shadow:inset 0 0 0 calc(var(--wa-u)*2.5) #fff}
.wa-sales-b-phw::before{content:"";position:absolute;left:calc(var(--wa-u)*4);top:calc(var(--wa-u)*-8);bottom:calc(var(--wa-u)*-8);width:calc(var(--wa-u)*30);background:#6b675d;border:calc(var(--wa-u)*3) solid var(--wa-ink);border-radius:calc(var(--wa-u)*3);z-index:2;margin-left:calc(var(--wa-u)*-9)}
.wa-sales-b-phn{position:absolute;left:calc(var(--wa-u)*52);right:calc(var(--wa-u)*14);top:0;bottom:0;display:flex;align-items:center;gap:calc(var(--wa-u)*14);color:var(--wa-ink)}
.wa-sales-b-phn span{font-size:max(11px,calc(var(--wa-u)*17));font-weight:700;white-space:nowrap}
.wa-sales-b-phn a{font-size:calc(var(--wa-u)*38);font-weight:700;line-height:1;text-decoration:underline;text-decoration-thickness:calc(var(--wa-u)*3);text-underline-offset:calc(var(--wa-u)*5);white-space:nowrap}
.wa-sales-b-sam{position:absolute;inset:0}
.wa-sales-b-sam .wa-sales-b-kr{position:absolute;inset:0;background:var(--wa-kraft);border:calc(var(--wa-u)*3) solid #BF9D6C;border-radius:calc(var(--wa-u)*3)}
.wa-sales-b-sam .wa-sales-b-perf{position:absolute;left:calc(var(--wa-u)*12);top:calc(var(--wa-u)*56);bottom:calc(var(--wa-u)*56);width:calc(var(--wa-u)*12);background:radial-gradient(circle,var(--wa-black) 0 calc(var(--wa-u)*4.5),transparent calc(var(--wa-u)*5)) 0 0/calc(var(--wa-u)*12) calc(var(--wa-u)*24) repeat-y}
.wa-sales-b-sam h3{position:absolute;left:calc(var(--wa-u)*52);top:calc(var(--wa-u)*26);font-size:calc(var(--wa-u)*124);line-height:.9;color:var(--wa-ink)}
.wa-sales-b-sam .wa-sales-b-sub{position:absolute;left:calc(var(--wa-u)*54);top:calc(var(--wa-u)*140);font-size:max(11px,calc(var(--wa-u)*20));font-weight:700;color:var(--wa-ink)}
.wa-sales-b-sam ul{position:absolute;left:calc(var(--wa-u)*50);right:calc(var(--wa-u)*30);top:calc(var(--wa-u)*186);list-style:none;margin:0;padding:0}
.wa-sales-b-sam li{display:flex;align-items:center;gap:calc(var(--wa-u)*16);height:calc(var(--wa-u)*58);border-bottom:calc(var(--wa-u)*2) dashed rgba(29,28,26,.5);font-size:max(11px,calc(var(--wa-u)*23));font-weight:700;color:var(--wa-ink)}
.wa-sales-b-sam li:last-child{border-bottom:0}
.wa-sales-b-tape{position:absolute;left:calc(var(--wa-u)*120);top:calc(var(--wa-u)*-16);width:calc(var(--wa-u)*136);height:calc(var(--wa-u)*34);background:rgba(251,247,234,.88);transform:rotate(2deg);clip-path:polygon(0 8%,4% 0,8% 10%,12% 0,16% 10%,20% 0,100% 0,96% 14%,100% 28%,96% 42%,100% 56%,96% 70%,100% 84%,96% 100%,0 100%,4% 82%,0 66%,4% 50%,0 34%,4% 20%)}
.wa-sales-b-stk{position:relative;background:#FFFDF4;border:calc(var(--wa-u)*7) solid #fff;border-radius:calc(var(--wa-u)*14);padding:calc(var(--wa-u)*12) calc(var(--wa-u)*18) calc(var(--wa-u)*14);box-shadow:0 0 0 calc(var(--wa-u)*3) var(--wa-ink)}
.wa-sales-b-stk p{font-size:max(11px,calc(var(--wa-u)*19));line-height:1.3;font-weight:700;color:var(--wa-ink)}
.wa-sales-b-stk .wa-sales-b-peel{position:absolute;right:calc(var(--wa-u)*-7);bottom:calc(var(--wa-u)*-7);width:calc(var(--wa-u)*34);height:calc(var(--wa-u)*34);background:linear-gradient(135deg,#d9d4c4 0 50%,var(--wa-black) 50% 100%);border-top-left-radius:calc(var(--wa-u)*6)}
@container (max-width:1079px){
  .wa-sales-b-h1{font-size:calc(var(--wa-u)*104)}
  .wa-sales-b-h1 .wa-sales-b-ul{width:calc(var(--wa-u)*262);height:calc(var(--wa-u)*18);bottom:calc(var(--wa-u)*-10)}
  .wa-sales-b-main{font-size:max(11px,calc(var(--wa-u)*20))}
  .wa-sales-b-sam h3{left:calc(var(--wa-u)*40);top:calc(var(--wa-u)*18);font-size:calc(var(--wa-u)*72)}
  .wa-sales-b-sam .wa-sales-b-sub{left:calc(var(--wa-u)*42);top:calc(var(--wa-u)*84);font-size:max(11px,calc(var(--wa-u)*16))}
  .wa-sales-b-sam ul{left:calc(var(--wa-u)*38);right:calc(var(--wa-u)*16);top:calc(var(--wa-u)*116);display:grid;grid-template-columns:1fr 1fr;column-gap:calc(var(--wa-u)*8)}
  .wa-sales-b-sam li{height:calc(var(--wa-u)*38);font-size:max(11px,calc(var(--wa-u)*18));gap:calc(var(--wa-u)*8)}
  .wa-sales-b-sam li:last-child{grid-column:1/3}
  .wa-sales-b-sam li svg{width:calc(var(--wa-u)*22);height:calc(var(--wa-u)*22)}
  .wa-sales-b-sam .wa-sales-b-perf{top:calc(var(--wa-u)*34);bottom:calc(var(--wa-u)*34)}
  .wa-sales-b-tape{left:calc(var(--wa-u)*90);width:calc(var(--wa-u)*110);height:calc(var(--wa-u)*28)}
  .wa-sales-b-zw .wa-sales-b-in{left:calc(var(--wa-u)*46);right:calc(var(--wa-u)*22);top:calc(var(--wa-u)*22)}
  .wa-sales-b-zw h3{font-size:calc(var(--wa-u)*64)}
  .wa-sales-b-zw .wa-sales-b-bar{height:calc(var(--wa-u)*14);margin-top:calc(var(--wa-u)*14);border-width:calc(var(--wa-u)*2.5)}
  .wa-sales-b-zw ul{margin-top:calc(var(--wa-u)*4)}
  .wa-sales-b-zw li{height:calc(var(--wa-u)*46);font-size:max(11px,calc(var(--wa-u)*21));gap:calc(var(--wa-u)*14)}
  .wa-sales-b-sq{width:calc(var(--wa-u)*18);height:calc(var(--wa-u)*18);border-width:calc(var(--wa-u)*3)}
  .wa-sales-b-zw .wa-sales-b-rivet{width:calc(var(--wa-u)*10);height:calc(var(--wa-u)*10)}
  .wa-sales-b-cta span{left:calc(var(--wa-u)*48);right:calc(var(--wa-u)*44);font-size:max(11px,calc(var(--wa-u)*24))}
  .wa-sales-b-cta .wa-sales-b-rv{left:calc(var(--wa-u)*28);width:calc(var(--wa-u)*10);height:calc(var(--wa-u)*10);top:calc(var(--wa-u)*10)}
  .wa-sales-b-phn{left:calc(var(--wa-u)*44);gap:calc(var(--wa-u)*8);right:calc(var(--wa-u)*8)}
  .wa-sales-b-phn span{font-size:max(11px,calc(var(--wa-u)*14))}
  .wa-sales-b-phn a{font-size:max(11px,calc(var(--wa-u)*26))}
  .wa-sales-b-stk p{font-size:max(11px,calc(var(--wa-u)*16))}
  .wa-sales-b-zw h3{line-height:1}
  .wa-sales-b-zw .wa-sales-b-bar{margin-top:calc(var(--wa-u)*24)}
}
.wa-sales-c-d{--wa-u:calc(min(100cqw,1440px)/1440);max-width:1440px;margin-left:auto;margin-right:auto}
.wa-sales-c-m{--wa-u:calc(min(100cqw,560px)/390);max-width:560px;margin-left:auto;margin-right:auto}
.wa-sales-c-d{display:block;position:relative;width:100%}
.wa-sales-c-m{display:none;position:relative;width:100%}
@container (max-width:1079px){
  .wa-sales-c-d{display:none}
  .wa-sales-c-m{display:block}
}
.wa-sales-c-t{font-family:var(--wa-tech);font-weight:800;text-transform:uppercase;margin:0}
.wa-sales-c p{margin:0}
.wa-sales-c-abs{position:absolute}
.wa-sales-c-bg{position:absolute;inset:0;filter:url(#wa-sales-c-rough)}
.wa-sales-c-rivet{position:absolute;width:calc(var(--wa-u)*12);height:calc(var(--wa-u)*12);border-radius:50%;background:var(--wa-ink);box-shadow:inset calc(var(--wa-u)*2) calc(var(--wa-u)*2) 0 rgba(255,255,255,.35)}
.wa-sales-c-rivet.wa-sales-c-l{background:#fff;box-shadow:inset calc(var(--wa-u)*-2) calc(var(--wa-u)*-2) 0 rgba(0,0,0,.35)}
.wa-sales-c-stripes{background:repeating-linear-gradient(-45deg,var(--wa-y) 0 calc(var(--wa-u)*13),var(--wa-ink) calc(var(--wa-u)*13) calc(var(--wa-u)*26))}
.wa-sales-c-u{text-decoration:underline;text-decoration-thickness:calc(var(--wa-u)*2);text-underline-offset:calc(var(--wa-u)*5)}
.wa-sales-c-t2{font-family:var(--wa-tech);font-weight:800;font-size:calc(var(--wa-u)*58);line-height:1.04;color:#fff;margin:0;position:absolute}
.wa-sales-c-t2 .wa-sales-c-q{position:relative;display:inline-block}
.wa-sales-c-t2 .wa-sales-c-ul{position:absolute;left:calc(var(--wa-u)*-4);bottom:calc(var(--wa-u)*-10);width:calc(var(--wa-u)*200);height:calc(var(--wa-u)*16)}
.wa-sales-c-sup{font-size:max(11px,calc(var(--wa-u)*19));line-height:1.4;color:#f0eee6}
.wa-sales-c-bdc{position:absolute;inset:0}
.wa-sales-c-bdc .wa-sales-c-en{position:absolute;inset:0;background:var(--wa-liliowy);border:calc(var(--wa-u)*7) solid var(--wa-ink);border-radius:calc(var(--wa-u)*6)}
.wa-sales-c-bdc .wa-sales-c-en2{position:absolute;inset:calc(var(--wa-u)*9);border:calc(var(--wa-u)*2.5) solid #fff;border-radius:calc(var(--wa-u)*3)}
.wa-sales-c-row{position:absolute;left:calc(var(--wa-u)*34);right:calc(var(--wa-u)*34);top:calc(var(--wa-u)*36);display:flex;align-items:flex-start;justify-content:space-between}
.wa-sales-c-vg{position:relative;width:calc(var(--wa-u)*300)}
.wa-sales-c-vg svg{display:block;width:calc(var(--wa-u)*300);height:calc(var(--wa-u)*274)}
.wa-sales-c-lb{display:flex;align-items:center;gap:calc(var(--wa-u)*10);margin-top:calc(var(--wa-u)*8);color:var(--wa-ink)}
.wa-sales-c-lb .wa-sales-c-t{font-size:max(11px,calc(var(--wa-u)*27));letter-spacing:.02em}
.wa-sales-c-lb .wa-sales-c-n{flex:none;display:inline-flex;align-items:center;justify-content:center;width:calc(var(--wa-u)*30);height:calc(var(--wa-u)*30);background:var(--wa-y);border:calc(var(--wa-u)*3.5) solid var(--wa-ink);font-style:normal;font-size:max(11px,calc(var(--wa-u)*20));padding-top:calc(var(--wa-u)*2);transform:rotate(-3deg)}
.wa-sales-c-ra{flex:none;margin-top:calc(var(--wa-u)*128);width:calc(var(--wa-u)*32);height:calc(var(--wa-u)*22)}
.wa-sales-c-stkm{background:#FBF7EA;border:calc(var(--wa-u)*5) solid #fff;border-radius:calc(var(--wa-u)*9);padding:calc(var(--wa-u)*4) calc(var(--wa-u)*12) calc(var(--wa-u)*5);font-size:max(11px,calc(var(--wa-u)*16));font-weight:700;color:var(--wa-ink);transform:rotate(2deg);box-shadow:0 0 0 1px rgba(0,0,0,.3);white-space:nowrap}
.wa-sales-c-stk0{z-index:5}
.wa-sales-c-slot{display:none}
.wa-sales-c-sf{position:absolute;left:calc(var(--wa-u)*872);top:calc(var(--wa-u)*644);width:calc(var(--wa-u)*520);height:calc(var(--wa-u)*200);border:calc(var(--wa-u)*4) dashed var(--wa-y);border-radius:calc(var(--wa-u)*8);transform:rotate(-.8deg)}
.wa-sales-c-sl1{position:absolute;left:calc(var(--wa-u)*340);top:calc(var(--wa-u)*716);width:calc(var(--wa-u)*400);font-size:max(11px,calc(var(--wa-u)*30));line-height:1.08;color:var(--wa-y);text-align:right;margin:0;text-transform:none}
.wa-sales-c-sa{position:absolute;left:calc(var(--wa-u)*752);top:calc(var(--wa-u)*722)}
.wa-sales-c-sl2{position:absolute;left:calc(var(--wa-u)*48);top:calc(var(--wa-u)*868);width:calc(var(--wa-u)*900);font-size:max(11px,calc(var(--wa-u)*17));line-height:1.45;color:#f0eee6}
@container (max-width:1079px){
  .wa-sales-c-t2{font-size:calc(var(--wa-u)*40);line-height:1.06}
  .wa-sales-c-t2 .wa-sales-c-ul{width:calc(var(--wa-u)*150);height:calc(var(--wa-u)*13);bottom:calc(var(--wa-u)*-8)}
  .wa-sales-c-sup{font-size:max(11px,calc(var(--wa-u)*17.5))}
  .wa-sales-c-row{display:none}
  .wa-sales-c-col{position:absolute;left:calc(var(--wa-u)*14);right:calc(var(--wa-u)*14);top:calc(var(--wa-u)*20);display:flex;flex-direction:column;gap:0}
  .wa-sales-c-mv{width:calc(var(--wa-u)*330);height:calc(var(--wa-u)*152);display:flex;align-items:center;gap:calc(var(--wa-u)*6);position:relative;border-bottom:0}
  .wa-sales-c-mv svg{width:calc(var(--wa-u)*172);height:calc(var(--wa-u)*157);flex:none;margin-top:0}
  .wa-sales-c-mv .wa-sales-c-lb{position:absolute;right:0;top:calc(var(--wa-u)*42);flex-direction:column;align-items:flex-start;gap:calc(var(--wa-u)*8);width:calc(var(--wa-u)*126);margin:0}
  .wa-sales-c-mv .wa-sales-c-lb .wa-sales-c-t{font-size:max(11px,calc(var(--wa-u)*22));line-height:1}
  .wa-sales-c-mv + .wa-sales-c-mv::before{content:"";position:absolute;left:0;right:0;top:calc(var(--wa-u)*-3);border-top:calc(var(--wa-u)*3) dashed rgba(29,28,26,.45)}
  .wa-sales-c-stkm{font-size:max(11px,calc(var(--wa-u)*14))}
}
.wa-sales-d-d{--wa-u:calc(min(100cqw,1440px)/1440);max-width:1440px;margin-left:auto;margin-right:auto}
.wa-sales-d-m{--wa-u:calc(min(100cqw,560px)/390);max-width:560px;margin-left:auto;margin-right:auto}
.wa-sales-d-d{display:block;position:relative;width:100%}
.wa-sales-d-m{display:none;position:relative;width:100%}
@container (max-width:1079px){
  .wa-sales-d-d{display:none}
  .wa-sales-d-m{display:block}
}
.wa-sales-d-t{font-family:var(--wa-tech);font-weight:800;text-transform:uppercase;margin:0}
.wa-sales-d p{margin:0}
.wa-sales-d-abs{position:absolute}
.wa-sales-d-bg{position:absolute;inset:0;filter:url(#wa-sales-d-rough)}
.wa-sales-d-rivet{position:absolute;width:calc(var(--wa-u)*12);height:calc(var(--wa-u)*12);border-radius:50%;background:var(--wa-ink);box-shadow:inset calc(var(--wa-u)*2) calc(var(--wa-u)*2) 0 rgba(255,255,255,.35)}
.wa-sales-d-rivet.wa-sales-d-l{background:#fff;box-shadow:inset calc(var(--wa-u)*-2) calc(var(--wa-u)*-2) 0 rgba(0,0,0,.35)}
.wa-sales-d-stripes{background:repeating-linear-gradient(-45deg,var(--wa-y) 0 calc(var(--wa-u)*13),var(--wa-ink) calc(var(--wa-u)*13) calc(var(--wa-u)*26))}
.wa-sales-d-u{text-decoration:underline;text-decoration-thickness:calc(var(--wa-u)*2);text-underline-offset:calc(var(--wa-u)*5)}
.wa-sales-d-t2{font-family:var(--wa-tech);font-weight:800;font-size:calc(var(--wa-u)*76);line-height:1.0;color:#fff;margin:0;position:absolute}
.wa-sales-d-t2 .wa-sales-d-ul{position:absolute;left:calc(var(--wa-u)*-4);bottom:calc(var(--wa-u)*-14);width:calc(var(--wa-u)*420);height:calc(var(--wa-u)*20)}
.wa-sales-d-sup p{margin:0;font-size:max(11px,calc(var(--wa-u)*20));line-height:1.4;color:#f0eee6}
.wa-sales-d-sup .wa-sales-d-s2{margin-top:calc(var(--wa-u)*12);font-size:max(11px,calc(var(--wa-u)*17));color:#e0ded5}
.wa-sales-d-pave{background:linear-gradient(#17171a 0 calc(var(--wa-u)*28),#101012 calc(var(--wa-u)*28));border-top:calc(var(--wa-u)*4) solid #46443e}
.wa-sales-d-pave i{position:absolute;left:0;right:0;top:calc(var(--wa-u)*62);border-top:calc(var(--wa-u)*4) dashed #46443e}
.wa-sales-d-e{position:absolute;inset:0;background:var(--wa-szalwia);border:calc(var(--wa-u)*6) solid var(--wa-ink);border-radius:calc(var(--wa-u)*5);filter:url(#wa-sales-d-rough2)}
.wa-sales-d-e2{position:absolute;inset:calc(var(--wa-u)*6);border:calc(var(--wa-u)*2.5) solid #fff;border-radius:calc(var(--wa-u)*2)}
.wa-sales-d-fa{position:absolute}
.wa-sales-d-fa .wa-sales-d-e{background:var(--wa-brzoskwinia)}
.wa-sales-d-ar{position:absolute;z-index:4}
.wa-sales-d-ld{z-index:4}
.wa-sales-d-fa .wa-sales-d-t,.wa-sales-d-op .wa-sales-d-t{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--wa-ink);white-space:nowrap;padding-top:calc(var(--wa-u)*4)}
.wa-sales-d-op{position:absolute}
.wa-sales-d-op .wa-sales-d-e{background:#F7F5EC}
.wa-sales-d-op .wa-sales-d-t{font-size:max(11px,calc(var(--wa-u)*21));letter-spacing:.04em}
.wa-sales-d-ad{position:absolute;background:#F7F5EC;border:calc(var(--wa-u)*4) solid var(--wa-ink);border-radius:calc(var(--wa-u)*3);padding:calc(var(--wa-u)*2) calc(var(--wa-u)*8) calc(var(--wa-u)*3);font-size:max(11px,calc(var(--wa-u)*15));font-weight:700;color:var(--wa-ink);white-space:nowrap;box-shadow:inset 0 0 0 calc(var(--wa-u)*2) #fff}
.wa-sales-d-mk{position:absolute;width:calc(var(--wa-u)*20);height:calc(var(--wa-u)*20);background:var(--wa-y);border:calc(var(--wa-u)*4) solid var(--wa-ink);transform:rotate(-5deg);z-index:3}
.wa-sales-d-jt{position:absolute;z-index:5}
.wa-sales-d-jt span{display:block;background:#F7F5EC;border:calc(var(--wa-u)*4) solid var(--wa-ink);border-radius:calc(var(--wa-u)*4);padding:calc(var(--wa-u)*3) calc(var(--wa-u)*12) calc(var(--wa-u)*4);font-size:max(11px,calc(var(--wa-u)*19));font-weight:700;color:var(--wa-ink);box-shadow:inset 0 0 0 calc(var(--wa-u)*2) #fff;white-space:nowrap}
.wa-sales-d-jt i{position:absolute;left:calc(var(--wa-u)*26);bottom:calc(var(--wa-u)*-14);width:0;height:0;border-left:calc(var(--wa-u)*11) solid transparent;border-right:calc(var(--wa-u)*11) solid transparent;border-top:calc(var(--wa-u)*14) solid var(--wa-ink)}
.wa-sales-d-cap{position:absolute}
.wa-sales-d-cap svg{position:absolute;left:0;top:0}
.wa-sales-d-cap .wa-sales-d-mg{position:absolute;left:calc(var(--wa-u)*14);top:0;bottom:0;display:flex;align-items:center;line-height:0}
.wa-sales-d-cap .wa-sales-d-tx{position:absolute;left:calc(var(--wa-u)*58);right:calc(var(--wa-u)*14);top:0;bottom:0;display:flex;align-items:center;font-weight:700;color:var(--wa-ink);white-space:nowrap;padding-bottom:calc(var(--wa-u)*3)}
.wa-sales-d-cap .wa-sales-d-tx u{text-decoration:underline;text-decoration-style:dashed;text-decoration-thickness:calc(var(--wa-u)*2.5);text-underline-offset:calc(var(--wa-u)*5)}
.wa-sales-d-stkd{background:var(--wa-brzoskwinia);border:calc(var(--wa-u)*6) solid #fff;border-radius:calc(var(--wa-u)*9);padding:calc(var(--wa-u)*7) calc(var(--wa-u)*16) calc(var(--wa-u)*8);font-size:max(11px,calc(var(--wa-u)*16));font-weight:700;color:var(--wa-ink);box-shadow:0 0 0 calc(var(--wa-u)*2) var(--wa-ink) inset;transform:rotate(-1deg);line-height:1.3}
@container (max-width:1079px){
  .wa-sales-d-t2{font-size:calc(var(--wa-u)*44);line-height:1.02}
  .wa-sales-d-t2 .wa-sales-d-ul{width:calc(var(--wa-u)*250);height:calc(var(--wa-u)*15);bottom:calc(var(--wa-u)*-9)}
  .wa-sales-d-sup p{font-size:max(11px,calc(var(--wa-u)*17.5))}
  .wa-sales-d-sup .wa-sales-d-s2{font-size:max(11px,calc(var(--wa-u)*15.5));margin-top:calc(var(--wa-u)*8)}
  .wa-sales-d-fa .wa-sales-d-t{padding-top:calc(var(--wa-u)*3)}
  .wa-sales-d-op .wa-sales-d-t{font-size:max(11px,calc(var(--wa-u)*17))}
  .wa-sales-d-ad{font-size:max(11px,calc(var(--wa-u)*14));padding:1px calc(var(--wa-u)*6) calc(var(--wa-u)*2);border-width:calc(var(--wa-u)*3)}
  .wa-sales-d-jt span{font-size:max(11px,calc(var(--wa-u)*17));padding:calc(var(--wa-u)*2) calc(var(--wa-u)*10) calc(var(--wa-u)*3)}
  .wa-sales-d-jt i{left:calc(var(--wa-u)*10);bottom:auto;top:50%;margin-top:calc(var(--wa-u)*-9);left:calc(var(--wa-u)*-16);border-left:0;border-top:calc(var(--wa-u)*9) solid transparent;border-bottom:calc(var(--wa-u)*9) solid transparent;border-right:calc(var(--wa-u)*14) solid var(--wa-ink)}
  .wa-sales-d-stkd{font-size:max(11px,calc(var(--wa-u)*15))}
}
/* ===== Ruch (storyboardy G6/final, RUCH-FINAL.md): raz po wejściu w widok (JS dodaje .wa-sales-arm, potem .wa-sales-go); bez JS, przy prefers-reduced-motion i ?bezruchu=1 od razu stan końcowy.
   Animowane wyłącznie: opacity, translate (osobna właściwość, nie psuje obrotów z inline), stroke-dashoffset. Wysokości stałe: zero przesunięć układu. ===== */
/* A: telefon → trasa → strona (1400 ms) */
.wa-sales-a .wa-sales-a-arcs{transition:opacity .22s ease-out .12s}
.wa-sales-a .wa-sales-a-o2{transition:opacity .35s ease-out .35s}
.wa-sales-a .wa-sales-a-o2>*{transition:translate .35s ease-out .35s}   /* przesunięcie na dzieciach, nie na obwolucie: obwoluta z translate stałaby się blokiem odniesienia dla elementów absolutnych i dała skok układu */
.wa-sales-a .wa-sales-a-o2 .wa-sales-a-cap,.wa-sales-a .wa-sales-a-dest{transition:opacity .25s ease-out 1s}
.wa-sales-a .wa-sales-a-route{transition:opacity 0s linear .6s}
.wa-sales-a .wa-sales-a-route path{stroke-dasharray:100;stroke-dashoffset:0;transition:stroke-dashoffset .4s cubic-bezier(.45,0,.55,1) .6s}
.wa-sales-a .wa-sales-a-o3{transition:opacity .4s ease-out 1s}
.wa-sales-a .wa-sales-a-o3>*{transition:translate .4s ease-out 1s}
.wa-sales-a.wa-sales-arm:not(.wa-sales-go) :is(.wa-sales-a-arcs,.wa-sales-a-o2,.wa-sales-a-o3,.wa-sales-a-dest,.wa-sales-a-route,.wa-sales-a-o2 .wa-sales-a-cap){opacity:0}
.wa-sales-a.wa-sales-arm:not(.wa-sales-go) .wa-sales-a-route path{stroke-dashoffset:100}
.wa-sales-a.wa-sales-arm:not(.wa-sales-go) .wa-sales-a-o2>*{translate:calc(var(--wa-u)*-12) 0}
.wa-sales-a.wa-sales-arm:not(.wa-sales-go) .wa-sales-a-o3>*{translate:calc(var(--wa-u)*16) 0}
/* B: dokładanie pozycji i drogowskaz (1500 ms) */
.wa-sales-b :is(.wa-sales-b-r1,.wa-sales-b-r2,.wa-sales-b-r3,.wa-sales-b-r4,.wa-sales-b-r5){transition:opacity .3s ease-out var(--wa-d,0s),translate .3s ease-out var(--wa-d,0s)}
.wa-sales-b .wa-sales-b-r2{--wa-d:.15s}.wa-sales-b .wa-sales-b-r3{--wa-d:.3s}.wa-sales-b .wa-sales-b-r4{--wa-d:.45s}.wa-sales-b .wa-sales-b-r5{--wa-d:.6s}
.wa-sales-b .wa-sales-b-ctaw{transition:opacity .35s ease-out .9s,translate .35s ease-out .9s}
.wa-sales-b :is(.wa-sales-b-phw,.wa-sales-b-micro){transition:opacity .35s ease-out 1.1s,translate .35s ease-out 1.1s}
.wa-sales-b.wa-sales-arm:not(.wa-sales-go) :is(.wa-sales-b-r1,.wa-sales-b-r2,.wa-sales-b-r3,.wa-sales-b-r4,.wa-sales-b-r5,.wa-sales-b-ctaw,.wa-sales-b-phw,.wa-sales-b-micro){opacity:0}
.wa-sales-b.wa-sales-arm:not(.wa-sales-go) :is(.wa-sales-b-r1,.wa-sales-b-r2,.wa-sales-b-r3,.wa-sales-b-r4,.wa-sales-b-r5){translate:0 calc(var(--wa-u)*-6)}
.wa-sales-b.wa-sales-arm:not(.wa-sales-go) :is(.wa-sales-b-ctaw,.wa-sales-b-phw,.wa-sales-b-micro){translate:calc(var(--wa-u)*-24) 0}
/* C: opinia → odpowiedź (1500 ms) */
.wa-sales-c :is(.wa-sales-c-v2,.wa-sales-c-v3,.wa-sales-c-v4){transition:opacity .3s ease-out var(--wa-d,0s),translate .3s ease-out var(--wa-d,0s)}
.wa-sales-c .wa-sales-c-v2{--wa-d:.15s}.wa-sales-c .wa-sales-c-v3{--wa-d:.6s}.wa-sales-c .wa-sales-c-v4{--wa-d:1s}
.wa-sales-c .wa-sales-c-ra{transition:opacity .2s ease-out var(--wa-d,0s)}
.wa-sales-c .wa-sales-c-ra:nth-of-type(1){--wa-d:0s}.wa-sales-c .wa-sales-c-ra:nth-of-type(2){--wa-d:.45s}.wa-sales-c .wa-sales-c-ra:nth-of-type(3){--wa-d:.85s}
.wa-sales-c.wa-sales-arm:not(.wa-sales-go) :is(.wa-sales-c-v2,.wa-sales-c-v3,.wa-sales-c-v4,.wa-sales-c-ra){opacity:0}
.wa-sales-c.wa-sales-arm:not(.wa-sales-go) :is(.wa-sales-c-v2,.wa-sales-c-v3,.wa-sales-c-v4){translate:0 calc(var(--wa-u)*8)}
/* D: zapytanie → wskazanie miejsca (1400 ms) */
.wa-sales-d .wa-sales-d-bub{transition:opacity .3s ease-out var(--wa-d,0s),translate .3s ease-out var(--wa-d,0s)}
.wa-sales-d .wa-sales-d-b2{--wa-d:.7s}.wa-sales-d .wa-sales-d-b3{--wa-d:1.05s}
.wa-sales-d .wa-sales-d-ar{transition:opacity .05s linear var(--wa-e,.3s)}
.wa-sales-d .wa-sales-d-ar path{stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset .3s ease-in-out var(--wa-e,.3s)}
.wa-sales-d .wa-sales-d-mk{transition:opacity .15s ease-out var(--wa-e,.3s)}
.wa-sales-d .wa-sales-d-ld{transition:opacity .3s ease-out 0s}
.wa-sales-d :is(.wa-sales-d-a2,.wa-sales-d-m2){--wa-e:.95s}.wa-sales-d :is(.wa-sales-d-a3,.wa-sales-d-m3){--wa-e:1.3s}
.wa-sales-d.wa-sales-arm:not(.wa-sales-go) :is(.wa-sales-d-bub,.wa-sales-d-ar,.wa-sales-d-mk,.wa-sales-d-ld){opacity:0}
.wa-sales-d.wa-sales-arm:not(.wa-sales-go) .wa-sales-d-bub{translate:0 calc(var(--wa-u)*-8)}
.wa-sales-d.wa-sales-arm:not(.wa-sales-go) .wa-sales-d-ar path{stroke-dashoffset:1}
@media (prefers-reduced-motion:reduce){.wa-sales *{transition:none!important;animation:none!important}}

/* ===== WIZ-G8 ŻYCIE: fiolet z hasła strony głównej („przewagę”, #8052ff), ręczne znaki motywu (.rk), delikatne tło, blok „Więcej dowodów” ===== */
/* 1. Słowo kluczowe w nagłówku: kolor z wyrazu „przewagę” na stronie głównej (sam kolor tekstu, bez tła i obrysu). Drugi kolor nagłówka zostaje biały. */
.wz-v{color:#8052ff}
.wz-v .zn-ul{display:none}
.mp-op-h .wz-v,.s3c-final h3 .wz-v{display:inline}
/* moduły A–D: słowo z żółtej kreski dostaje fiolet (kreska zostaje pod spodem jako ręczne podkreślenie) */
.wa-sales .wa-sales-a-q,.wa-sales .wa-sales-c-q,.wa-sales .wa-sales-b-zn,.wa-sales .wz-vd{color:#8052ff}
/* 2. Ręczne znaki przy nagłówkach: rysują się raz po wejściu w widok (skrypt motywu/podstrony dodaje klasę .in); wielkość w em, więc skalują się z nagłówkiem */
body.wiz-wizytowki .rk-end.wz-end{position:relative;display:inline-block;width:0;height:0}
body.wiz-wizytowki .wz-rk{position:absolute;pointer-events:none;overflow:visible;max-width:none}
body.wiz-wizytowki .wz-rk path{stroke:#FFD60A;stroke-width:4.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
body.wiz-wizytowki .wz-rk-gw{left:.08em;top:-.95em;width:.92em;height:.92em;transform:rotate(-12deg)}
body.wiz-wizytowki .wz-rk-st{left:.28em;top:-.08em;width:1.6em;height:.56em}
body.wiz-wizytowki .wz-rk-sm{left:.14em;top:-.9em;width:.9em;height:.9em;transform:rotate(9deg)}
body.wiz-wizytowki .wz-rk-se{left:.1em;top:-.92em;width:.78em;height:.7em;transform:rotate(8deg)}
body.wiz-wizytowki .wz-rk-pe{left:-4%;top:-16%;width:108%;height:134%;z-index:0}
.wz-pe{position:relative;display:inline-block}
body.wiz-wizytowki .wz-pe{margin-left:.16em}
body.wiz-wizytowki .wz-pe .wz-rk-pe path{stroke:#FFD60A;stroke-width:3.6}
/* 3. Delikatne ruchome tło: dwie miękkie plamy (fiolet i żółć, poniżej 8% krycia), powoli dryfują; tylko transform; wyłączone przy ograniczonym ruchu i ?bezruchu=1 */
body.wiz-wizytowki::after{content:'';position:fixed;left:-20vmax;top:-20vmax;right:-20vmax;bottom:-20vmax;z-index:0;pointer-events:none;
  background:radial-gradient(38vmax 38vmax at 22% 30%,rgba(128,82,255,.075),transparent 62%),radial-gradient(34vmax 34vmax at 78% 68%,rgba(255,214,10,.05),transparent 62%);
  animation:wz-dryf 52s ease-in-out infinite alternate;will-change:transform}
@keyframes wz-dryf{from{transform:translate3d(-3vmax,-2vmax,0)}to{transform:translate3d(4vmax,3vmax,0)}}
html.bezruchu body.wiz-wizytowki::after,html.stop body.wiz-wizytowki::after{animation:none}
@media (prefers-reduced-motion:reduce){body.wiz-wizytowki::after{animation:none}}
/* 4. Blok „Więcej dowodów pracy firm”: kartka jak w scenach modułów (papier, taśma, ręczna strzałka do przycisku), a nie obrys przycisku w pustce */
.s3c-real.wz-real{position:relative;margin-top:44px;padding:26px 30px;background:#f3e6ca;color:#1d1c1a;border:2px solid #1d1c1a;border-radius:3px;transform:rotate(-.5deg);box-shadow:6px 6px 0 rgba(255,214,10,.9);display:grid;grid-template-columns:auto auto 1fr;align-items:center;column-gap:30px;row-gap:12px}
.s3c-real.wz-real::before{content:'';position:absolute;left:50%;top:-15px;width:104px;height:28px;margin-left:-52px;background:rgba(222,216,196,.92);transform:rotate(-3deg);box-shadow:0 1px 0 rgba(0,0,0,.18)}
.s3c-real.wz-real p{margin:0;color:#1d1c1a}
.s3c-real.wz-real .wz-real-t{font:800 clamp(22px,2.4vw,30px)/1.05 var(--tech,var(--f));letter-spacing:.005em}
.s3c-real.wz-real .wz-real-h{font:600 15px/1.4 var(--f);color:#4b4840;position:relative;padding-left:70px}
.s3c-real.wz-real .s3-btn{background:#ffd60a;border-color:#1d1c1a;color:#111;min-height:52px}
body.wiz-wizytowki .wz-real .wz-rk-ar{position:absolute;left:0;top:-4px;width:56px;height:20px;transform:scaleX(-1) rotate(8deg)}
body.wiz-wizytowki .wz-real .wz-rk-ar path{stroke:#1d1c1a;stroke-width:4.2}
@media (max-width:899px){
  .s3c-real.wz-real{grid-template-columns:1fr;padding:24px 22px}
  .s3c-real.wz-real .s3-btn{justify-self:start}
  .s3c-real.wz-real .wz-real-h{padding-left:0}
  .wz-real .wz-rk-ar{display:none}
}
/* 5. Moduł A: drugie zdanie podpisu nad scenami wyróżnione jak zakreślaczem (znaczenie: tu jest to, co robimy) */
.wa-sales .wz-b{font-weight:700;color:#fff;background:linear-gradient(transparent 58%,rgba(255,214,10,.38) 58%);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 .12em}
/* 6. Moduł C: kreska pod „Decyduje.” stoi pod tym słowem przy każdej szerokości (wcześniej miała stałe położenie z makiety i przy 1440 px lądowała pod „Sprawdza pro”) */
.wa-sales .wa-sales-c-q{position:relative;display:inline-block}
.wa-sales .wa-sales-c-q > .wa-sales-c-ul{position:absolute!important;left:0!important;top:auto!important;right:auto!important;bottom:-.16em!important;width:100%!important;height:.2em!important;transform:none!important}

/* ===== runda 2: rysunki w pustych miejscach, porządek w dolnym bloku S3, kolor w siatce pomiarów (S4) ===== */
.wz-ill{pointer-events:none}
.wz-ill svg{display:block;width:100%;height:auto;overflow:visible}
/* S3: kalendarz po prawej od wstępu (zapis zmian z datą, regularność); wstęp nie wchodzi pod rysunek */
.wz-ill-cal,.wz-ill-stos,.wz-ill-q{display:none}
@media (min-width:1080px){
  body.wiz-wizytowki .s3-C > .wrap{position:relative}
  .wz-ill-cal{display:block;position:absolute;right:20px;top:96px;width:clamp(320px,30vw,420px);transform:rotate(2deg)}
  body.wiz-wizytowki .s3-C > .wrap > p{max-width:min(38em,calc(100% - clamp(320px,30vw,420px) - 48px))}
}
/* S3: stos kart „realizacje” w kartce Więcej dowodów (tylko gdy jest miejsce) */
@media (min-width:1280px){
  .s3c-real.wz-real{padding-right:340px}
  .wz-ill-stos{display:block;position:absolute;right:28px;top:50%;width:270px;transform:translateY(-50%) rotate(2deg)}
}
/* S3: dolny blok pytania „Chcesz widzieć, za co płacisz w SEO?”: tekst po lewej, lista z lupą po prawej */
.s3c-final{position:relative}
@media (min-width:1080px){
  .s3c-final{display:grid;grid-template-columns:minmax(0,1fr) clamp(320px,32vw,440px);column-gap:56px;align-items:center}
  .wz-fin-txt{grid-column:1}
  .wz-fin-ill{grid-column:2;transform:rotate(1.5deg)}
}
@media (max-width:1079px){.wz-fin-ill{width:min(300px,78%);margin:28px 0 0 auto}}
/* S5: dymek z pytaniem w pustej lewej kolumnie */
@media (min-width:1024px){
  .s5-lead{grid-column:1;grid-row:1}
  .s5-main{grid-column:2;grid-row:1}
  .wz-ill-q{display:block;grid-column:1;grid-row:1;align-self:start;margin-top:170px;width:min(100%,300px);transform:rotate(-2deg)}
}
/* S4: kolor w siatce pomiaru: dwa arkusze papieru (szałwia i liliowy) z tuszem; po „Nałóż pomiary na siebie” fioletowe punkty leżą na szałwii */
body.wiz-wizytowki .s4a-sheet{border:2.5px solid #1d1c1a;box-shadow:6px 6px 0 rgba(255,214,10,.9);background:#bfe4ce}
body.wiz-wizytowki .s4a-s1{color:#1d1c1a;background:#bfe4ce;transform:rotate(-.5deg)}
body.wiz-wizytowki .s4a-s2{color:#4b24c9;background:#d9cef5;transform:rotate(.6deg)}
body.wiz-wizytowki .s4a-sheet figcaption{color:#1d1c1a}
body.wiz-wizytowki .s4a-s2 figcaption{color:#2b1478}
body.wiz-wizytowki .s4mp .s4ul{opacity:.42}
body.wiz-wizytowki .s4mp .s4pt circle,body.wiz-wizytowki .s4mp .s4pt path{stroke-width:2.2}
body.wiz-wizytowki .s4a-sheet::before{content:'';position:absolute;left:50%;top:-14px;width:92px;height:24px;margin-left:-46px;background:rgba(222,216,196,.92);transform:rotate(-3deg);box-shadow:0 1px 0 rgba(0,0,0,.18);z-index:3}
body.wiz-wizytowki .s4a-btn{background:#ffc2a6;border:2.5px solid #1d1c1a;color:#1d1c1a;box-shadow:5px 5px 0 #1d1c1a}
body.wiz-wizytowki .s4a-btn[aria-pressed=true]{background:#ffd60a;border-color:#1d1c1a;color:#111}
body.wiz-wizytowki .s4a-grid .s4-kroki .s4k{color:#bfe4ce}
body.wiz-wizytowki .s4-przyklad{border-color:#bfe4ce;color:#bfe4ce}
body.wiz-wizytowki .s4-metoda{color:#fff}

.wz-ill-waga svg{filter:none}
@media (min-width:1080px){.s3c-final h3{font-size:clamp(40px,4.2vw,60px)}.s3c-final .s3-fz{font-size:22px}}