/* Kreator na całą szerokość (decyzja Adriana 28.09): nad podglądem pasek narzędzi (styl, tryb
   kontaktu, Wstecz/Dalej, Twój zestaw), pod nim szeroki podgląd, pod nim kafle. Listy propozycji
   części nie ma — wybiera się kaflami; przyciski kroków zostają w DOM jako stan wyboru. */
html:has(.ww-kreator),body:has(.ww-kreator){overflow-x:clip}
.ww-kreator{--ww-pasek:106px;position:relative;padding:38px 16px 48px;background:var(--paper);color:var(--ink);overflow-wrap:anywhere}
.ww-wstep{margin:0 0 22px;display:flex;gap:32px;align-items:end;justify-content:space-between}
.ww-wstep .kicker{color:var(--purple);font-size:11px;margin:0 0 12px}
.ww-wstep h2{margin:0;font:800 clamp(30px,3.6vw,50px)/1.12 'Manrope',sans-serif;letter-spacing:-.045em}
.ww-wstep h2 em{color:var(--purple);font-style:normal}
.ww-wstep>p{max-width:360px;margin:0;font-size:14px;line-height:1.6;color:var(--muted)}
.ww-prowadzenie{position:sticky;top:0;z-index:6;padding:8px 0 12px;background:var(--paper)}
.ww-orientacja{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:6px;font-size:12px;color:var(--muted)}
.ww-orientacja a{display:flex;align-items:center;min-height:32px;color:inherit;text-decoration:none}
.ww-postep{display:flex;flex-wrap:wrap;gap:8px}
.ww-tryby{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.ww-tryb{min-height:40px;padding:8px 14px;border:1px solid #8b927f;border-radius:999px;background:#fff;color:var(--ink);font:700 13px/1.2 'Manrope',sans-serif;cursor:pointer}
.ww-tryb:hover{border-color:#5839c8}.ww-tryb--aktywny{background:var(--ink);border-color:var(--ink);color:#fff}
.ww-pytanie{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.ww-pytanie h4{margin:0 0 12px;font:800 17px/1.25 'Manrope',sans-serif;letter-spacing:-.02em}
.ww-opcja[hidden]{display:none}
.ww-postep a{display:flex;flex:1 1 140px;min-width:0;align-items:center;gap:12px;min-height:48px;padding:10px 16px;border:1px solid var(--line);border-radius:9px;color:var(--ink);text-decoration:none;font:700 14px 'DM Sans',sans-serif;transition:background .18s,border-color .18s}
.ww-postep b{font:600 11px 'Manrope',sans-serif}
.ww-postep a:hover{background:var(--white);border-color:var(--purple)}
.ww-postep a.ww-krok--aktywny{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.ww-pracownia{scroll-margin-top:calc(var(--ww-pasek) + 12px);display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:'styl etapy' 'podglad podglad' 'kafle kafle';gap:12px 24px;align-items:center}
.ww-styl{grid-area:styl}.ww-etapy{grid-area:etapy;min-width:0;align-self:start}
.ww-etap{padding:0;border-radius:12px;background:var(--paper);color:var(--ink);scroll-margin-top:calc(var(--ww-pasek) + 12px)}
.ww-etap[hidden]{display:none}.ww-etap+.ww-etap{margin-top:16px}.ww-js .ww-etap{margin-top:0}
.ww-etap-head h3{margin:0 0 18px;font:800 25px/1.18 'Manrope',sans-serif;letter-spacing:-.03em}
.ww-etap-head h3:focus{outline:none}
.ww-opcje{display:grid;gap:8px}
.ww-opcja{margin:0;position:relative;width:100%;padding:13px 38px 13px 14px;min-height:48px;border:1px solid #8b927f;border-radius:8px;background:#fff;color:var(--ink);text-align:left;cursor:pointer;transition:background .18s,border-color .18s}
.ww-opcja strong{font:700 14px/1.4 'Manrope',sans-serif}
.ww-grupa{grid-column:1/-1;margin:16px 0 0;color:#515947;font:700 12px/1.3 'Manrope',sans-serif}
.ww-galeria-wskazowka{margin:0 0 14px;color:#515947;font:400 13px/1.5 'DM Sans',sans-serif}
.ww-galeria{max-height:575px;overflow-y:auto;overscroll-behavior:contain;padding:2px 8px 2px 2px;scrollbar-color:#939989 transparent}
.ww-galeria-karta{display:grid;grid-template-columns:90px minmax(0,1fr);gap:12px;padding:8px 34px 8px 8px;min-height:142px;align-items:start}
.ww-galeria-karta.ww-opcja--aktywna{padding:7px 33px 7px 7px}
.ww-galeria-obraz{display:block;height:124px;overflow:hidden;border-radius:4px;background:#e6e0d8}
.ww-galeria-obraz img{display:block;width:100%;height:auto}
.ww-galeria-tresc{display:grid;gap:7px;text-align:left}.ww-galeria-tresc>span{color:#515947;font:400 12px/1.4 'DM Sans',sans-serif}
.ww-galeria-karta .ww-check{top:16px;transform:none}
.ww-opcja:hover{background:#f1edff;border-color:#5839c8}
.ww-opcja--aktywna{border:2px solid #5839c8;padding:12px 37px 12px 13px;background:#f1edff}
.ww-check{position:absolute;right:12px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:18px;height:18px;border:1px solid #818a73;border-radius:50%;color:transparent;font:800 11px 'DM Sans',sans-serif}
.ww-opcja--aktywna .ww-check{background:#5839c8;border-color:#5839c8;color:#fff}
.ww-opisy{margin:16px 0 0;color:#515947;font:400 14px/1.6 'DM Sans',sans-serif}
.ww-opisy p{margin:0 0 10px}.ww-opisy summary{cursor:pointer;font-size:13px;min-height:36px;padding:6px 0;text-decoration:underline;text-underline-offset:3px}
.ww-nawigacja{display:flex;align-items:center;gap:12px;margin-top:20px;padding-top:16px;border-top:1px solid #cdd0c2}
.ww-wstecz{display:flex;align-items:center;min-height:48px;margin-right:auto;color:#515947;font:700 13px 'DM Sans',sans-serif;text-decoration:none}
.ww-dalej,.ww-pelny{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:48px;padding:12px 14px;border-radius:8px;background:var(--ink);color:#fff;text-decoration:none;font:700 13px/1.4 'DM Sans',sans-serif}
.ww-dalej span,.ww-pelny span{color:var(--lime)}.ww-dalej:hover,.ww-pelny:hover{background:#343a2a}
.ww-zestaw{margin:14px 0 0;font-size:12px;line-height:1.6;color:var(--ink)}.ww-zestaw span{display:block;color:var(--muted)}.ww-zestaw strong{font-weight:500}
/* Tor trzyma przyklejone okno przez oba rzędy kroków; siatka kafli jedzie już pod nim, razem ze stroną. */
.ww-okno-tor{grid-area:podglad;align-self:stretch;min-width:0}
.ww-okno{grid-area:podglad;display:none;min-width:0;border:1px solid #909780;border-radius:12px;overflow:clip;background:#e8e9e1;color:var(--ink)}
.ww-js .ww-okno{display:block;position:relative;z-index:4}
.ww-podglad-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:3px 14px;border-bottom:1px solid #c1c6b7;font:700 12px 'DM Sans',sans-serif}
.ww-podglad-head>span::before{content:'';display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;background:#527326}
.ww-powieksz{display:flex;align-items:center;min-height:38px;color:#4426ae;text-decoration:none}
.ww-fragment{position:relative;height:max(420px,calc(100svh - var(--ww-pasek) - 150px));overflow:clip;background:#e8e9e1}
.ww-fragment iframe{display:block;width:var(--ww-szerokosc,100%);height:calc(100% / var(--ww-skala,1));transform:scale(var(--ww-skala,1));transform-origin:top left;margin-left:var(--ww-odsuniecie,0);border:0;background:#fff}
.ww-laduje iframe,.ww-blad iframe{visibility:hidden}
.ww-stan{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;text-align:center;background:#e8e9e1}
.ww-status{margin:0;color:#4f5647;font:600 14px/1.6 'DM Sans',sans-serif}
.ww-fragment:not(.ww-laduje):not(.ww-blad) .ww-stan{width:1px;height:1px;overflow:hidden;clip-path:inset(50%);padding:0}
/* Nowa strona ładuje się pod widoczną (wybor-fragmenty.js): niewidoczna, dopóki nie jest gotowa i przewinięta. */
.ww-fragment iframe.ww-ramka-w-tle{position:absolute;top:0;left:0;opacity:0;pointer-events:none}
.ww-fragment.ww-odswieza:not(.ww-laduje) .ww-stan{inset:12px 12px auto auto;width:auto;height:auto;overflow:visible;clip-path:none;padding:6px 14px;border-radius:999px;background:rgba(232,233,225,.94);box-shadow:0 2px 10px rgba(0,0,0,.12)}
.ww-fragment.ww-odswieza .ww-status{font-size:13px}
.ww-ponow{min-height:44px;padding:10px 18px;border:1px solid #4f5647;border-radius:8px;background:#fff;color:var(--ink);font:700 13px 'DM Sans',sans-serif;cursor:pointer}.ww-ponow[hidden]{display:none}
.ww-podglad-opis{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:2px 12px;border-top:1px solid #c1c6b7;font-size:12px;color:#4f5647}
.ww-do-czesci{min-height:40px;padding:6px 0;border:0;background:none;color:#4426ae;font:700 12px 'DM Sans',sans-serif;cursor:pointer}
.ww-noscript{max-width:700px;margin:24px auto 0;font-size:14px;line-height:1.7}.ww-noscript a{color:var(--lime)}
.ww-kreator :is(a,button,summary):focus-visible{outline:3px solid #5839c8;outline-offset:3px}.ww-prowadzenie a:focus-visible{outline-color:#bcaaff}
.ww-kreator button:disabled{cursor:default;opacity:.65}
@media(max-width:1099px){.ww-wstep>p{max-width:320px}.ww-etap-head h3{font-size:24px}}
@media(max-width:700px){.ww-kreator{padding:24px 12px 32px}.ww-wstep{display:block;margin-bottom:14px}.ww-wstep .kicker{font-size:10px;margin-bottom:8px}.ww-wstep h2{font-size:30px}.ww-wstep>p{max-width:none;margin-top:10px;font-size:13px;line-height:1.5}.ww-orientacja{font-size:11px;gap:8px}.ww-orientacja>span{text-align:right;max-width:62%}.ww-postep{gap:6px}.ww-postep a{padding:9px;gap:7px;font-size:12px}.ww-postep b{font-size:10px}.ww-etap{padding:16px}.ww-podglad-head{padding-inline:10px;font-size:11px}.ww-podglad-opis{padding-inline:9px;font-size:11px}.ww-podglad-opis>span{max-width:48%}.ww-opcja strong{font-size:13px}.ww-opcja{padding-left:10px}.ww-opcja--aktywna{padding-left:9px}.ww-zestaw{padding-inline:4px}}
@media(max-width:700px){.ww-galeria{max-height:430px;grid-template-columns:1fr}.ww-galeria-karta{min-height:122px}.ww-galeria-obraz{height:106px}}
@media(max-width:700px){.ww-kreator:has(.ww-galeria) .ww-opcje{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html:has(.ww-kreator){scroll-behavior:auto}.ww-kreator *{transition:none!important}}
@media(forced-colors:active){.ww-krok--aktywny,.ww-opcja--aktywna{outline:2px solid Highlight}}
/* Pasek narzędzi nad podglądem: kroki części pokazują tylko tryb kontaktu i nawigację; lista propozycji,
   pytanie i opisy znikają (wybór kaflami). Krok „Twoja firma” zostaje w całości. */
.ww-etap:not(.tf) :is(.ww-opcje,.ww-galeria-wskazowka,.ww-pytanie){display:none}
/* Pytanie kroku zostaje dla czytnika ekranu i jako cel fokusu przy zmianie kroku — tylko niewidoczne. */
.ww-etap:not(.tf) .ww-etap-head{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.ww-etap:not(.tf):not(:has(.ww-tryby)) .ww-opisy{display:none}
.ww-etap:not(.tf):not([hidden]){position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
.ww-etap:not(.tf) .ww-tryby{margin:0}.ww-etap:not(.tf) .ww-opisy{flex:1 1 240px;margin:0;font-size:13px}.ww-etap:not(.tf) .ww-opisy p{margin:0}
.ww-etap:not(.tf) .ww-nawigacja{margin:0 0 0 auto;padding:0;border:0}.ww-etap:not(.tf) .ww-wstecz{margin-right:0}
.ww-etapy{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}.ww-etapy>.ww-etap{flex:1 1 auto}
.ww-zestaw{margin:0;order:-1}.ww-zestaw span{display:inline;margin-right:6px}
.ww-etapy:has(> .tf:not([hidden])){display:block}.ww-etapy:has(> .tf:not([hidden])) .ww-zestaw{margin-top:12px}
.ww-styl{display:flex;align-items:center;gap:8px 12px;padding:0;background:none}.ww-styl h3{margin:0;white-space:nowrap}
.ww-styl-wybory{display:flex;gap:8px}.ww-styl-panel{position:relative}.ww-styl-panel>summary{min-height:44px;padding:10px 12px}.ww-styl-panel>summary>span{display:inline;margin-left:6px}
.ww-styl-panel[open]>:not(summary){position:absolute;top:calc(100% + 6px);left:0;z-index:9;width:min(560px,calc(100vw - 32px));margin:0;border:1px solid #929a85;border-radius:8px;background:#fff;box-shadow:0 12px 32px #0003}
@media(max-width:1099px){.ww-pracownia{grid-template-columns:minmax(0,1fr);grid-template-areas:'etapy' 'styl' 'podglad' 'kafle';align-items:stretch}.ww-styl-wybory{flex:1}.ww-styl-panel{flex:1 1 0;min-width:0}.ww-styl-panel:nth-child(2)[open]>:not(summary){left:auto;right:0}}
@media(max-width:700px){.ww-kreator{padding:20px 12px 32px}.ww-fragment{height:clamp(360px,62svh,600px)}.ww-styl h3{display:none}.ww-etap:not(.tf) .ww-nawigacja{margin-left:0;width:100%}.ww-etap:not(.tf) .ww-nawigacja .ww-dalej{margin-left:auto}}
/* „Powiększ”: okno podglądu na cały ekran; nad ramką tylko „Wyjdź” i urządzenie (wybor-powieksz.js). */
.ww-pelny-pasek[hidden]{display:none}
.ww-pelny-pasek{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 8px;border-bottom:1px solid #c1c6b7;background:#f5f4ed}
.ww-pelny-pasek button{min-height:36px;padding:6px 12px;border:1px solid #a9b09f;border-radius:8px;background:#fff;color:var(--ink);font:700 13px 'DM Sans',sans-serif;cursor:pointer}
.ww-pelny-pasek button:hover{border-color:#5839c8;background:#f1edff}
.ww-urzadzenia{display:flex;gap:4px}.ww-urzadzenia button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.ww-js .ww-okno.ww-okno--pelne{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;border:0;border-radius:0}
.ww-okno--pelne :is(.ww-podglad-head,.kg-zestawy-naw,.ww-podglad-opis){display:none}
.ww-okno--pelne .ww-fragment{flex:1;height:auto;min-height:0}
html.ww-pelny-ekran{overflow:hidden}
.ww-postep b{white-space:nowrap}.ww-zestaw{flex:1 1 auto}
/* Nazwy kroków łamią się między słowami, nie w środku („Jak pracujem-y”). */
.ww-postep a span{overflow-wrap:normal}
/* Wąski pasek kroków (wybor-pasek-krokow.js): zwinięty = jedna linia; panel kroków rozwija się
   nad treścią po najechaniu (mysz), stuknięciu (dotyk) albo z fokusem w środku; przypięty = w układzie. */
.ww-prowadzenie.ww-zwiniety{padding:4px 0}
.ww-prowadzenie.ww-zwiniety .ww-orientacja{margin-bottom:0;min-height:40px;border-bottom:1px solid var(--line)}
.ww-kroki-biezacy{margin-right:auto;padding:4px 10px;border-radius:999px;background:var(--lime);color:var(--ink);font:700 12px/1.3 'Manrope',sans-serif}
.ww-kroki-biezacy:empty{display:none}
.ww-kroki-przelacz{min-height:32px;margin:0 0 0 8px;padding:4px 12px;border:1px solid #8b927f;border-radius:999px;background:var(--white);color:var(--ink);font:700 12px 'Manrope',sans-serif;cursor:pointer}
.ww-kroki-przelacz:hover{border-color:#5839c8;background:#f1edff}
/* Zwinięty pasek (pkt 9, 30.09): kroki i „Styl całej strony” schowane; stan zmienia tylko przycisk. */
.ww-prowadzenie.ww-zwiniety .ww-kroki-panel,.ww-kreator.ww-kroki-ukryte .ww-styl{display:none}
@media(prefers-reduced-motion:reduce){.ww-kroki-panel{transition:none!important;transform:none!important}}
@media(max-width:700px){.ww-kroki-biezacy{max-width:40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ww-prowadzenie.ww-zwiniety .ww-orientacja>span[data-postep]{display:none}}