[hidden]{display:none!important}
:root{--tlo:#0a0f1f;--tlo2:#0f1830;--tusz:#eef3ff;--szary:#a3b0cc;--akcent:#2f7bff;--akcent2:#1c63e6;--akcent3:#22c7f0;--ciemny:#060a16;--linia:#1f2c52;--karta:#111b36;--ok:#34d399;--r:14px;--grad:linear-gradient(90deg,#2f7bff 0%,#22c7f0 100%)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--tlo);color:var(--tusz);font:17px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;overflow-x:hidden}
h1,h2,h3{line-height:1.15;letter-spacing:-.02em;margin:0 0 .5em}
h1{font-size:clamp(2.05rem,6.4vw,3.6rem);font-weight:800}
h2{font-size:clamp(1.55rem,4.4vw,2.35rem);font-weight:800}
h3{font-size:1.2rem}
p{margin:0 0 1em}
.wrap{max-width:860px;margin:0 auto;padding:0 16px}
section{padding:56px 0;border-bottom:1px solid var(--linia)}
section.alt{background:var(--tlo2)}
section.ciemna{background:var(--ciemny);color:#f6efe5;border-bottom:0}
section.ciemna .pod{color:#c9bfb3}
.etykieta{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--akcent);margin-bottom:12px}
.pod{color:var(--szary)}
.hero{padding:40px 0 56px}
.gora{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:14px;padding-bottom:14px;font-weight:800}
.tryb{font-size:.72rem;font-weight:700;background:#ffe9a8;color:#5b4300;border-radius:99px;padding:3px 10px;text-transform:uppercase;letter-spacing:.06em}
.wideo{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:16/9;background:var(--ciemny);color:#f6efe5;border:0;border-radius:var(--r);margin:24px 0;cursor:pointer;font:inherit;font-weight:700}
.wideo{position:relative;overflow:hidden;padding:0}
.wideo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.wideo .play{position:relative;width:72px;height:72px;border-radius:50%;background:rgba(0,0,0,.65)}
.wideo .play::after{content:"";position:absolute;left:29px;top:22px;border-style:solid;border-width:14px 0 14px 22px;border-color:transparent transparent transparent #fff}
.wideo:hover .play{background:#c00}
.wideo iframe{width:100%;height:100%;border:0;border-radius:var(--r)}
.wideo.pion{aspect-ratio:9/16;max-width:320px;margin-inline:auto}
.btn{display:block;width:100%;background:var(--akcent);color:#fff;border:0;border-radius:var(--r);padding:17px 20px;font:inherit;font-size:1.08rem;font-weight:800;text-align:center;text-decoration:none;cursor:pointer;line-height:1.3;min-height:48px}
.btn:hover{background:var(--akcent2)}
.btn:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid #2c6fd6;outline-offset:2px}
.btn.drugi{background:transparent;color:var(--tusz);border:2px solid var(--tusz)}
.btn.drugi:hover{background:var(--tusz);color:#fff}
.btn-pod{font-size:.88rem;color:var(--szary);text-align:center;margin-top:10px}
section.ciemna .btn-pod{color:#c9bfb3}
.siatka{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.karta{background:#fff;border:1px solid var(--linia);border-radius:var(--r);padding:20px;color:var(--tusz)}
.karta.wyroznij{border:2px solid var(--akcent)}
ul.lista{padding-left:1.15em;margin:0 0 1em}
ul.lista li{margin:.35em 0}
.stos{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--r);overflow:hidden}
.stos td{padding:12px 14px;border-bottom:1px solid var(--linia);vertical-align:top}
.stos td:last-child{text-align:right;white-space:nowrap;font-weight:700}
.stos tr.suma td{font-size:1.15rem;font-weight:800;background:var(--tlo2);border-bottom:0}
.cena{text-align:center;padding:26px 0 8px}
.cena .w{font-size:1.15rem;color:var(--szary)}
.cena .d{font-size:clamp(2.6rem,10vw,4.3rem);font-weight:800;color:var(--akcent);line-height:1.05}
.licznik{display:block;text-align:center;font-weight:800;margin:12px 0}
.licznik b{color:var(--akcent);font-size:1.3em}
.atrapa{display:inline-block;font-size:.72rem;background:#ffe9a8;color:#5b4300;border-radius:6px;padding:1px 7px;margin-left:6px;font-weight:700}
.ostrzezenie{background:var(--ciemny);color:#fff;text-align:center;padding:14px 16px;font-weight:800}
.dwie{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.dwie .karta .cena-kwota{font-size:2.2rem;font-weight:800;color:var(--akcent);margin:6px 0 12px}
dialog{border:0;border-radius:var(--r);padding:0;width:min(92vw,460px);max-height:92dvh;color:var(--tusz)}
dialog::backdrop{background:rgba(20,16,12,.65)}
.ok-tresc{padding:24px;position:relative}
.ok-zamknij{position:absolute;top:8px;right:8px;width:44px;height:44px;border:0;background:none;font-size:1.5rem;cursor:pointer;color:var(--szary)}
label{display:block;font-weight:600;margin:12px 0 4px}
input[type=text],input[type=email]{width:100%;padding:13px;border:1px solid #b9ad9c;border-radius:10px;font:inherit;background:#fff}
.zgoda{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:.9rem;margin:12px 0}
.zgoda input{margin-top:5px;width:18px;height:18px;flex:none}
.blad{color:#a11;font-weight:700}
footer{padding:32px 0 44px;font-size:.84rem;color:var(--szary)}
footer a{color:inherit}
.placeholder{background:#fff5cf;padding:0 4px;border-radius:4px}
@media (min-width:720px){.btn{max-width:560px;margin-inline:auto}.karta .btn{max-width:none}}
.ukryte{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.faq details{background:#fff;border:1px solid var(--linia);border-radius:var(--r);padding:14px 16px;margin:0 0 10px}
.faq summary{font-weight:700;cursor:pointer;min-height:28px}
.faq details p{margin:10px 0 0}
.stos.por td:last-child{white-space:normal;text-align:left}
.stos.por td{font-size:.95rem}
.etykieta{text-wrap:balance}

/* MOTYW NIEBIESKI 2026-11-11: ciemne tło z niebieską poświatą, akcent niebieski do turkusu.
   Inspiracja: projekty/tripwire-reklama-bez-kamery/strona/wzory/2026-11-11_wzor-kolorystyki-optimizepress.png (bez kopiowania układu). */
body{background:var(--tlo) radial-gradient(1200px 600px at 50% -10%,rgba(47,123,255,.28),transparent 70%) no-repeat}
section.alt{background:var(--tlo2)}
section.ciemna{background:var(--ciemny) radial-gradient(800px 400px at 50% 0,rgba(34,199,240,.12),transparent 70%);color:var(--tusz)}
section.ciemna .pod,section.ciemna .btn-pod{color:var(--szary)}
.etykieta{color:var(--akcent3)}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.btn{background:var(--grad);color:#fff;box-shadow:0 8px 24px rgba(47,123,255,.35);border-radius:99px}
.btn:hover{background:linear-gradient(90deg,#1c63e6,#14b3dc)}
.btn.drugi{background:#fff;color:#0a0f1f;border:0;box-shadow:none}
.btn.drugi:hover{background:#dfe8ff;color:#0a0f1f}
.karta,.faq details,.stos{background:var(--karta);border-color:var(--linia);color:var(--tusz)}
.karta.wyroznij{border-color:var(--akcent);box-shadow:0 0 0 1px var(--akcent),0 10px 30px rgba(47,123,255,.2)}
.stos tr.suma td{background:#16234a}
.cena .d,.dwie .karta .cena-kwota,.licznik b{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.wideo{background:#0d1530;color:var(--tusz)}
.wideo:hover .play{background:var(--akcent)}
dialog{background:var(--karta);color:var(--tusz);border:1px solid var(--linia)}
dialog::backdrop{background:rgba(3,6,15,.75)}
input[type=text],input[type=email]{background:#0a1228;border-color:#2b3b6b;color:var(--tusz)}
input[type=text]:focus,input[type=email]:focus{border-color:var(--akcent);outline:none}
.blad{color:#ff7a7a}
a{color:#7fb0ff}
footer{color:var(--szary)}
.placeholder{background:#3a3214;color:#ffe7a0}
.ostrzezenie{background:#16234a}

/* WYRÓWNANIE 2026-11-11 (Kacper): etykiety i nagłówki na środku, cały tekst pod nimi do lewej.
   Przyciski, podpis pod przyciskiem, cena i licznik zostają na środku. */
section .wrap{text-align:left}
section .wrap>.etykieta,section .wrap>h1,section .wrap>h2{text-align:center}
.btn-pod,.cena,.licznik{text-align:center}
.siatka .wideo.pion{margin-inline:auto}

/* CERTYFIKATY 2026-11-11 */
.certyfikat{margin:24px auto 0;max-width:360px;text-align:center}
.certyfikat img{width:100%;border-radius:10px;border:1px solid var(--linia);display:block}
.certyfikat figcaption{font-size:.85rem;color:var(--szary);margin-top:8px}
.certyfikaty{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));margin-top:24px}
.certyfikaty .certyfikat{margin:0;max-width:none}

/* GALERIA PRAC 2026-11-11 */
.galeria{columns:3 220px;column-gap:12px;margin:8px 0 16px}
.praca{break-inside:avoid;margin:0 0 12px;position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--linia);background:#0d1530;cursor:pointer}
.praca img,.praca video{display:block;width:100%;height:auto}
.praca .dzwiek{position:absolute;left:8px;bottom:8px;font-size:.72rem;background:rgba(6,10,22,.75);color:#fff;padding:3px 8px;border-radius:99px;pointer-events:none}
.praca.glos .dzwiek{display:none}
.praca img{cursor:default}
.podpis-galerii{text-align:center;color:var(--szary);font-size:.9rem}
.praca .dzwiek{bottom:auto;top:8px}

/* ODSTĘPY 2026-11-11 (Kacper): więcej powietrza między wersami i sekcjami, wzorowane na proporcjach kingkong.co/thank,
   wartości własne: sekcje 64/88/120 px zależnie od szerokości, tekst 18-19 px, interlinia 1.7, akapity co 1.3 em. */
body{font-size:18px;line-height:1.7}
section{padding:64px 0}
.hero{padding:56px 0 72px}
p{margin:0 0 1.3em}
h1{margin-bottom:.6em}
h2{margin-bottom:.8em}
h3{margin-bottom:.6em}
.etykieta{margin-bottom:18px}
ul.lista li{margin:.7em 0}
.faq details{padding:18px 20px;margin-bottom:14px}
.karta{padding:24px}
.stos td{padding:14px 16px}
.btn{margin-top:12px}
@media (min-width:720px){section{padding:88px 0}.hero{padding:72px 0 96px}}
@media (min-width:992px){body{font-size:19px}section{padding:120px 0}.hero{padding:96px 0 120px}}

/* ODSTĘPY v2 2026-11-11: węższa kolumna tekstu (ok. 55-65 znaków w wierszu), większa czcionka,
   pusta linia między akapitami, punkty listy rozsunięte jak akapity. */
.wrap>p,.wrap>ul.lista,.wrap>div[data-tylko]>p{max-width:680px;margin-left:auto;margin-right:auto}
.wrap>p.btn-pod,.wrap>p.licznik{max-width:none}
body{line-height:1.75}
p{margin:0 0 1.6em}
ul.lista{padding-left:1.2em}
ul.lista li{margin:0 0 1em}
ul.lista{margin-bottom:1.6em}
@media (min-width:992px){body{font-size:21px}}

/* NAGŁÓWKI v2 2026-11-11 (Kacper): większe, wyraźnie odstają od tekstu 21 px.
   H1: 38 px telefon -> 80 px komputer, H2: 30 -> 56 px, H3: 22 -> 26 px, etykieta 14 px. */
h1{font-size:clamp(2.4rem,7.5vw,5rem);line-height:1.08;letter-spacing:-.03em}
h2{font-size:clamp(1.9rem,5.6vw,3.5rem);line-height:1.12;letter-spacing:-.025em}
h3{font-size:clamp(1.35rem,2.4vw,1.6rem)}
.etykieta{font-size:.875rem}
.wrap>h1,.wrap>h2{max-width:900px;margin-left:auto;margin-right:auto;text-wrap:balance}

/* SZEROKOŚĆ 2026-11-11: strona szersza (1120 px), żeby duże nagłówki miały miejsce; tekst zostaje w kolumnie 680 px. */
.wrap{max-width:1120px}
.wrap>h1{max-width:1080px}
.wrap>h2{max-width:960px}
.wrap>.wideo,.wrap>.btn{max-width:860px;margin-left:auto;margin-right:auto}

/* Przyciski v2 (2026-11-11): grubsze, wyższe */
.btn{padding:26px 32px;font-size:1.2rem;min-height:76px;display:block}
@media (min-width:992px){.btn{padding:32px 40px;font-size:1.35rem;min-height:92px}}
.btn.wersaliki{text-transform:uppercase;letter-spacing:.04em}

/* Dla kogo (2026-11-11): TAK wyróżnione, NIE wyblakłe */
.karta.tak{border:2px solid var(--akcent);background:linear-gradient(180deg,rgba(47,123,255,.18),rgba(34,199,240,.06)),var(--karta);box-shadow:0 12px 40px rgba(47,123,255,.28)}
.karta.tak h3{color:#fff}
.karta.tak .lista li::marker{color:var(--akcent3)}
.karta.nie{background:transparent;border:1px solid #1a2442;opacity:.55;filter:grayscale(1)}
.karta.nie h3,.karta.nie li{color:var(--szary)}
/* 2026-11-12: wyróżnione karty „Kontekst” i „Wzorce” (strona główna) */
.karta.filar{border:2px solid transparent;background:linear-gradient(var(--karta),var(--karta)) padding-box,var(--grad) border-box;box-shadow:0 12px 40px rgba(47,123,255,.28)}
.karta.filar .nr{display:block;font-size:2.6rem;font-weight:800;line-height:1;margin-bottom:6px}
.karta.filar h3{font-size:1.6rem;margin-bottom:8px}
.karta.filar p{font-size:1.08rem}