/* ═══ LEMIESZ DEVELOPMENT — układ i typografia editorial (wielkie cienkie wersaliki, rozdziały, zdjęcia), paleta w kolorach ═══ */
:root{
  --zielen:#0F3D2E;--zielen2:#17553F;--cegla:#1E2528;--cegla2:#2B3437;--petrol:#123B4A;--petrol2:#1E5A6E;
  --krem:#F3EBDD;--krem2:#E7DCC7;--atrament:#141412;--ochra:#E3B23C;--ochra2:#C8961E;
  --bg:var(--zielen);--karta:rgba(0,0,0,.28);--bg3:rgba(255,255,255,.06);
  --tx:var(--krem);--tx2:rgba(243,235,221,.66);--tx3:rgba(243,235,221,.42);
  --linia:rgba(243,235,221,.14);--linia2:rgba(243,235,221,.26);
  --h:var(--ochra);--akcent:var(--ochra);
  --ok:#5BC98A;--uwaga:#E3B23C;--zle:#E8674F;--fiolet:#B79CFF;--cyan:#6FD3E8;
  --disp:"Montserrat","Inter",system-ui,sans-serif;
  --sans:"Inter",system-ui,-apple-system,sans-serif;
  --wolno:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;background:var(--bg);color:var(--tx);font-family:var(--sans);-webkit-font-smoothing:antialiased;font-weight:300}
body{overflow:hidden;font-size:15px;line-height:1.55}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
a{color:inherit}
img{display:block;max-width:100%}
[hidden]{display:none!important}
b,strong{font-weight:500}
::selection{background:var(--ochra);color:var(--atrament)}
h1,h2,h3,h4,h5,h6{font-family:var(--disp);font-weight:200;letter-spacing:-.04em;text-transform:uppercase;line-height:.94}
.lead-id,.lead-sz,.w-rzad .nr,.kalk-wynik b,.dane3d b,.arkusze-s b,.kostka-wyn b,.pedzle button b,.slupek b,.of-tab td:last-child,.karta-lok dd,.pok-lista b,.panel-tab input,.strona-cen .r b,.historia,.zegar b,.skrz-r small,.waga b,.suwak output,.liczby b{font-variant-numeric:tabular-nums}

/* ── górny pasek ───────────────────────────────────────────── */
.pasek{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:22px clamp(18px,3vw,44px);pointer-events:none}
.pasek>*{pointer-events:auto}
.marka{display:flex;align-items:center;gap:14px;text-decoration:none}
.marka i{width:40px;height:40px;border:1px solid var(--linia2);display:grid;place-items:center;font-style:normal;color:var(--ochra)}
.marka i svg{width:30px;height:30px}
.marka b{display:block;font-family:var(--disp);font-weight:300;font-size:12px;letter-spacing:.26em;text-transform:uppercase}
.marka small{display:block;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--tx2);margin-top:3px;font-weight:400}
.pasek-p{display:flex;gap:26px;align-items:center}
.guzik{display:inline-flex;align-items:center;gap:12px;padding:0 0 6px;border-bottom:1px solid var(--linia2);font-size:10px;letter-spacing:.24em;text-transform:uppercase;font-weight:500;transition:border-color .5s,color .5s}
.guzik:hover{border-color:var(--h);color:var(--h)}
.guzik .strz{transition:transform .6s var(--wolno);font-weight:300}
.guzik:hover .strz{transform:translateX(5px)}
.guzik.pelny{padding:14px 22px;border:1px solid var(--h);color:var(--h)}
.guzik.pelny:hover{background:var(--h);color:var(--atrament)}
.przelacz{display:none;gap:18px}
.przelacz button{font-size:10px;letter-spacing:.24em;text-transform:uppercase;font-weight:500;color:var(--tx3);padding-bottom:6px;border-bottom:1px solid transparent;transition:color .5s,border-color .5s}
.przelacz button.on{color:var(--tx);border-color:var(--h)}
body.w-decku .przelacz{display:flex}

/* ── wejście ───────────────────────────────────────────────── */
#wybor{position:fixed;inset:0;display:grid;grid-template-columns:1.05fr .95fr;transition:opacity 1s var(--wolno),visibility 1s;background:var(--zielen)}
#wybor.znika{opacity:0;pointer-events:none;visibility:hidden}
.hero-l{position:relative;padding:110px clamp(24px,5vw,80px) 36px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.hero-l::before{content:"";position:absolute;inset:0;background:url(data:image/webp;base64,UklGRn4AAABXRUJQVlA4IHIAAACQBACdASogABUAPu1cqU4ppKOiMBgMATAdiWIAsOw30GQYfcuXP6Np1M1KCVAA/vJ/v7sW6FRXD4cF4E21HjefzVAhQ0jMB8mSLHf28L1Os8q3cK94yaeCew3bV0ND9I2nKftbap49ovqxFsH775PF8AA=) center/cover;filter:blur(14px) saturate(.75);opacity:.55;transform:scale(1.06)}
.hero-foto{position:absolute;inset:0;z-index:0;opacity:0;transition:opacity 1.6s var(--wolno)}
.hero-foto img{width:100%;height:100%;object-fit:cover;filter:saturate(.75)}
.hero-foto.gotowe{opacity:.55}
.hero-l::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,61,46,.25),rgba(15,61,46,.9) 74%),linear-gradient(0deg,rgba(15,61,46,.95) 8%,transparent 52%)}
.hero-l>*{position:relative;z-index:1}
.hero-l>.hero-foto{position:absolute;z-index:0}
.hero-l::after{z-index:0}
.hero-nr{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--tx2);font-weight:500}
.hero-l h1{font-size:clamp(46px,5.9vw,100px);margin-top:18px;letter-spacing:-.05em;line-height:.9}
.hero-l h1 span{display:block}
.hero-l h1 em{font-style:normal;color:var(--ochra)}
.hero-dol{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.hero-dol p{max-width:380px;font-size:14px;color:var(--tx2)}
.hero-hint{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--tx2);font-weight:500;display:flex;gap:12px;align-items:center}
.hero-hint i{width:1px;height:28px;background:linear-gradient(var(--ochra),transparent);animation:kap 2s infinite}
.mod-lista{display:grid;grid-template-rows:1fr 1fr 1fr;border-left:1px solid var(--linia)}
.mod{position:relative;display:grid;grid-template-columns:1fr minmax(160px,32%);align-items:center;gap:20px;padding:clamp(14px,2vw,28px) clamp(18px,2.6vw,36px);min-height:0;border-bottom:1px solid var(--linia);cursor:pointer;overflow:hidden;transition:background .8s var(--wolno)}
.mod:last-child{border-bottom:0}
.mod:hover{background:rgba(0,0,0,.18)}
.mod-nr{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--tx2);font-weight:500}
.mod h2{font-size:clamp(22px,2.3vw,36px);margin:8px 0 6px;letter-spacing:-.045em}
.mod p{font-size:12.5px;color:var(--tx2);max-width:420px;line-height:1.45}
.mod .guzik{margin-top:10px}
.mod-obraz{position:relative;aspect-ratio:16/10;max-height:calc(33vh - 70px);overflow:hidden;background:var(--karta);border:1px solid var(--linia);transition:transform 1.2s var(--wolno)}
.mod:hover .mod-obraz{transform:translateY(-4px)}
.mod-obraz img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform 2.6s var(--wolno)}
.mod:hover .mod-obraz img{transform:scale(1.05)}
.mod-obraz .ramka{position:absolute;left:6%;top:8%;width:118%;transform:scale(.7);transform-origin:top left;pointer-events:none}
.mod-real{position:absolute;right:clamp(18px,2.6vw,36px);top:clamp(10px,1.4vw,18px);font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--tx3);font-weight:500}

/* ── deck ──────────────────────────────────────────────────── */
.deck{position:fixed;inset:0;visibility:hidden;opacity:0;transition:opacity 1s var(--wolno),visibility 1s}
.deck.aktywny{visibility:visible;opacity:1}
.deck-crm{--bg:var(--zielen)}
.deck-dev{--bg:var(--cegla)}
.deck-firma{--bg:var(--petrol)}
.slajd{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,72px);align-items:center;padding:100px clamp(24px,5vw,96px) 72px clamp(64px,7vw,140px);visibility:hidden;opacity:0;transform:translateY(4vh);transition:opacity 1.1s var(--wolno),transform 1.4s var(--wolno),visibility 1.4s;background:var(--bg);color:var(--tx)}
.slajd.jasny{--bg:var(--krem);--tx:var(--atrament);--tx2:rgba(20,20,18,.62);--tx3:rgba(20,20,18,.42);--linia:rgba(20,20,18,.12);--linia2:rgba(20,20,18,.24);--karta:#fff;--bg3:rgba(20,20,18,.05);--h:var(--ochra2)}
.slajd.jest{visibility:visible;opacity:1;transform:none;z-index:2}
.slajd.byl{transform:translateY(-4vh)}
.slajd.szeroki{grid-template-columns:1fr}
.slajd .wej{opacity:0;transform:translateY(34px);transition:opacity 1.2s var(--wolno),transform 1.4s var(--wolno)}
.slajd.jest .wej{opacity:1;transform:none}
.slajd.jest .wej:nth-child(2){transition-delay:.12s}
.slajd.jest .wej:nth-child(3){transition-delay:.24s}
.slajd.jest .wej:nth-child(4){transition-delay:.36s}
.slajd.jest .wej:nth-child(5){transition-delay:.48s}
.slajd.jest .wizual.wej{transition-delay:.3s}
.slajd.foto-tlo::before{content:"";position:absolute;inset:0;background:var(--foto) center/cover;opacity:.3;filter:saturate(.6)}
.slajd.foto-tlo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 55%,transparent),color-mix(in srgb,var(--bg) 97%,transparent) 60%)}
.slajd>*{position:relative;z-index:1}

.tekst{max-width:600px}
.kicker{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--tx2);font-weight:500;display:flex;align-items:center;gap:14px}
.kicker::before{content:"";width:34px;height:1px;background:var(--h)}
.tekst h2,.tekst h1{font-size:clamp(36px,4.2vw,70px);margin:20px 0 20px;letter-spacing:-.05em;line-height:.9}
.tekst h1{font-size:clamp(38px,4.4vw,74px)}
.tekst h2 em,.tekst h1 em{font-style:normal;color:var(--h)}
.tekst p{color:var(--tx2);font-size:clamp(14px,1.05vw,16px);max-width:500px}
.tekst p+p{margin-top:12px}
.punkty{list-style:none;margin-top:24px;display:grid;gap:10px}
.punkty li{display:flex;gap:14px;font-size:14px;color:var(--tx)}
.punkty li::before{content:"";flex:none;width:18px;height:1px;background:var(--h);margin-top:11px}
.liczby{display:flex;flex-wrap:wrap;gap:22px 36px;margin-top:30px}
.liczby div{min-width:110px}
.liczby b{display:block;font-family:var(--disp);font-weight:200;font-size:44px;line-height:1;letter-spacing:-.04em;color:var(--tx)}
.liczby span{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx2);font-weight:500}
.uwaga-m{margin-top:18px;font-size:12px;color:var(--tx3)}
.link-real{display:inline-flex;gap:10px;align-items:center;margin-top:18px;font-size:10px;letter-spacing:.24em;text-transform:uppercase;font-weight:500;color:var(--h);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--h) 50%,transparent);padding-bottom:6px}

.wizual{position:relative;min-width:0}
.ramka{background:var(--karta);border:1px solid var(--linia2);overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.35)}
.slajd.jasny .ramka{box-shadow:0 30px 70px rgba(20,20,18,.14)}
.ramka-g{display:flex;align-items:center;gap:6px;padding:12px 14px;border-bottom:1px solid var(--linia);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx3);font-weight:500}
.ramka-g i{width:7px;height:7px;border-radius:50%;background:var(--linia2)}
.ramka-g span{margin-left:10px}

.kropki{position:absolute;left:clamp(20px,2.4vw,44px);top:50%;transform:translateY(-50%);z-index:20;display:grid;gap:5px}
.kropki button{display:flex;align-items:center;gap:12px;padding:4px 0;color:var(--tx3);font-size:9px;letter-spacing:.2em;text-transform:uppercase;text-align:left;font-weight:500}
.kropki button::before{content:"";width:12px;height:1px;background:currentColor;transition:width .8s var(--wolno),background .5s}
.kropki button span{opacity:0;transform:translateX(-6px);transition:opacity .6s var(--wolno),transform .6s var(--wolno);white-space:nowrap}
.kropki:hover button span{opacity:1;transform:none}
.kropki button.on{color:var(--tx)}
.kropki button.on::before{width:32px;background:var(--h)}
.deck-dol{position:absolute;right:clamp(20px,3vw,44px);bottom:26px;z-index:20;display:flex;align-items:center;gap:22px;font-size:10px;letter-spacing:.2em;color:var(--tx2);font-weight:500}
.deck-dol .nr b{color:var(--tx);font-weight:500}
.strzalki{display:flex;gap:8px}
.strzalki button{width:42px;height:42px;border:1px solid var(--linia2);display:grid;place-items:center;transition:border-color .5s,color .5s;font-weight:300}
.strzalki button:hover{border-color:var(--h);color:var(--h)}
.postep{position:absolute;left:0;top:0;height:2px;background:var(--ochra);z-index:61;transition:width 1.2s var(--wolno)}
.dalej-hint{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--tx3);font-weight:500;z-index:20;display:flex;gap:12px;align-items:center}
.dalej-hint i{width:1px;height:26px;background:linear-gradient(var(--h),transparent);animation:kap 2s infinite}
@keyframes kap{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ── wspólne UI makiet ─────────────────────────────────────── */
.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;font-size:9px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;background:var(--bg3);color:var(--tx2);border:1px solid var(--linia)}
.chip.nowy{border-color:rgba(111,211,232,.5);color:#8FDDEE}
.chip.umow{border-color:rgba(183,156,255,.5);color:#C9B6FF}
.chip.nie{border-color:rgba(232,103,79,.5);color:#F09A88}
.chip.wys{border-color:rgba(91,201,138,.5);color:#8FDBB0}
.chip.dys{border-color:rgba(227,178,60,.5);color:#F0CB78}
.slajd.jasny .chip.nowy{color:#1B6E80}.slajd.jasny .chip.umow{color:#5A3FA8}.slajd.jasny .chip.nie{color:#B33F27}.slajd.jasny .chip.wys{color:#1F7A48}.slajd.jasny .chip.dys{color:#8A6410}
.chip b{font-weight:500}
.toast{position:fixed;left:50%;bottom:34px;transform:translate(-50%,30px);opacity:0;z-index:95;padding:14px 20px;background:var(--atrament);color:var(--krem);border:1px solid rgba(243,235,221,.14);box-shadow:0 30px 60px rgba(0,0,0,.4);font-size:13px;transition:opacity .7s var(--wolno),transform .7s var(--wolno);pointer-events:none;max-width:90vw}
.toast.on{opacity:1;transform:translate(-50%,0)}
.toast b{color:var(--ochra);font-weight:500}

.opcje{display:flex;flex-wrap:wrap;gap:6px}
.opcje button{padding:9px 13px;border:1px solid var(--linia2);font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;transition:background .4s,border-color .4s,color .4s}
.opcje button.on{background:var(--h);border-color:var(--h);color:var(--atrament)}
.suwak{display:flex;align-items:center;gap:14px}
.suwak input[type=range]{flex:1;accent-color:var(--h)}
.suwak output{font-size:13px;min-width:74px;text-align:right}
.przel{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--tx2);cursor:pointer}
.przel input{appearance:none;width:40px;height:20px;background:var(--linia2);position:relative;transition:background .4s;cursor:pointer}
.przel input::after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;background:var(--krem);transition:transform .5s var(--wolno)}
.przel input:checked{background:var(--h)}
.przel input:checked::after{transform:translateX(20px);background:var(--atrament)}

/* plan */
.plan{padding:14px}
.plan-chipy{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.plan-lista{display:grid;gap:8px;min-height:340px;align-content:start}
.lead{display:grid;grid-template-columns:1fr auto;gap:8px 16px;padding:12px 12px 12px 16px;background:var(--bg3);border:1px solid var(--linia);border-left:2px solid var(--kol,var(--ochra));transition:opacity .8s var(--wolno),transform .8s var(--wolno),max-height .8s var(--wolno),padding .8s,margin .8s;max-height:240px;overflow:hidden}
.lead.out{opacity:0;transform:translateX(40px);max-height:0;padding-top:0;padding-bottom:0;margin-top:-8px;border-width:0}
.lead-g{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.lead-g b{font-size:15px;font-weight:500}
.lead-id{font-size:11px;color:var(--tx3);letter-spacing:.08em}
.lead-m{font-size:12px;color:var(--tx2);margin-top:4px}
.lead-o{font-size:12px;color:var(--tx);margin-top:6px;padding:6px 10px;background:var(--bg3)}
.lead-sz{margin-top:8px;font-size:11px;color:var(--ochra);letter-spacing:.04em}
.slajd.jasny .lead-sz{color:var(--ochra2)}
.lead-akcje{display:grid;grid-template-columns:repeat(3,auto);gap:6px;align-content:start}
.lead-akcje .tel{grid-column:1/-1;font-size:12px;padding:8px 10px;border:1px solid var(--linia2);text-align:center;letter-spacing:.06em}
.lead-akcje button{padding:7px 10px;font-size:9px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;white-space:nowrap;border:1px solid var(--linia2);transition:border-color .4s,background .4s}
.lead-akcje button.odb{background:var(--h);border-color:var(--h);color:var(--atrament)}
.lead-akcje button:hover{border-color:var(--tx2)}
.plan-pusty{display:grid;place-items:center;text-align:center;gap:14px;padding:60px 20px;color:var(--tx2)}
.plan-pusty b{font-family:var(--disp);font-weight:200;font-size:30px;color:var(--tx);text-transform:uppercase;letter-spacing:-.03em}

/* branże */
.branze{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.branza{padding:16px 14px;border:1px solid var(--linia2);background:var(--karta);cursor:pointer;transition:border-color .5s,background .5s;min-height:112px;position:relative;text-align:left}
.branza:hover,.branza.on{border-color:var(--h);background:color-mix(in srgb,var(--h) 10%,var(--karta))}
.branza i{display:block;font-style:normal;font-size:10px;letter-spacing:.2em;color:var(--h);font-weight:500;margin-bottom:14px}
.branza b{display:block;font-family:var(--disp);font-weight:300;font-size:13px;text-transform:uppercase;letter-spacing:-.01em;line-height:1.15}
.branza span{display:block;margin-top:6px;font-size:11px;color:var(--tx2)}
.branza-opis{margin-top:10px;padding:16px 18px;background:var(--karta);border:1px solid var(--linia2);font-size:13px;color:var(--tx2);min-height:64px}
.branza-opis b{color:var(--tx);font-weight:500}

/* scena otworzył */
.scena-w{display:grid;grid-template-columns:1.25fr .75fr;gap:20px;align-items:center}
.crm-okno{padding:16px;min-height:360px;position:relative;overflow:visible}
.crm-okno h4{font-family:var(--sans);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx2);font-weight:500;margin-bottom:12px}
.w-rzad{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px;background:var(--bg3);border:1px solid var(--linia);margin-bottom:8px;font-size:12px;transition:border-color .8s,box-shadow .8s}
.w-rzad .nr{color:var(--tx3);font-size:11px}
.w-rzad .st{font-size:9px;letter-spacing:.14em;text-transform:uppercase;padding:3px 8px;border:1px solid var(--linia2);color:var(--tx2);transition:background .6s,color .6s;font-weight:600}
.w-rzad.otw{border-color:var(--fiolet);box-shadow:0 10px 40px rgba(183,156,255,.2)}
.w-rzad.otw .st{background:var(--fiolet);color:var(--atrament);border-color:var(--fiolet)}
.babel{position:absolute;right:-18px;bottom:40px;width:86px;height:86px;border-radius:50%;background:var(--fiolet);color:var(--atrament);display:grid;place-items:center;text-align:center;font-size:9px;font-weight:600;line-height:1.1;letter-spacing:.06em;text-transform:uppercase;transform:scale(0);transition:transform .9s var(--wolno)}
.babel strong{display:block;font-size:26px;font-family:var(--disp);font-weight:300}
.babel.on{transform:scale(1)}
.telefon{position:relative;width:100%;max-width:250px;aspect-ratio:9/19;margin:auto;border-radius:38px;background:#0E0E0D;border:1px solid #3A3A36;padding:10px;box-shadow:0 40px 80px rgba(0,0,0,.5),inset 0 0 0 2px #1E1E1C}
.telefon::before{content:"";position:absolute;left:50%;top:14px;transform:translateX(-50%);width:70px;height:18px;border-radius:12px;background:#000;z-index:3}
.ekran{position:relative;width:100%;height:100%;border-radius:30px;overflow:hidden;background:linear-gradient(180deg,#232320,#141412);color:var(--krem)}
.ekran-w{position:absolute;inset:0;padding:44px 14px 14px;transition:opacity .8s,transform 1s var(--wolno)}
.ekran-w.ukryj{opacity:0;transform:translateY(20px);pointer-events:none}
.powiad{background:rgba(255,255,255,.1);backdrop-filter:blur(10px);border-radius:14px;padding:10px 12px;font-size:11px;transform:translateY(-120%);opacity:0;transition:transform 1s var(--wolno),opacity 1s;color:#fff}
.powiad.on{transform:none;opacity:1}
.powiad b{display:block;font-size:12px;margin-bottom:2px}
.of-mini{background:var(--krem);color:var(--atrament);padding:12px;font-size:10px}
.of-mini h5{font-size:12px;margin-bottom:8px;font-weight:400;letter-spacing:.06em}
.of-mini .r{display:flex;justify-content:space-between;padding:4px 0;border-bottom:1px solid rgba(20,20,18,.12)}
.of-mini .s{display:flex;justify-content:space-between;font-weight:600;font-size:12px;margin-top:8px}
.of-mini .zam{margin-top:10px;background:var(--zielen);color:var(--krem);text-align:center;padding:7px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;font-size:9px}
.oś{display:flex;gap:6px;margin-top:22px}
.oś div{flex:1;height:2px;background:var(--linia2);overflow:hidden}
.oś div i{display:block;height:100%;width:0;background:var(--h);transition:width linear}
.krok-opis{margin-top:12px;font-size:13px;color:var(--tx2);min-height:44px}

/* kalkulator */
.kalk{padding:22px;display:grid;gap:18px}
.pole-e{display:grid;gap:8px}
.pole-e label{font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--tx3);font-weight:500}
.kalk-wynik{display:grid;grid-template-columns:1fr auto;gap:6px 18px;padding:18px;background:var(--bg3);border:1px solid var(--linia);font-size:13px;color:var(--tx2)}
.kalk-wynik b{font-weight:400;color:var(--tx);text-align:right}
.kalk-suma{grid-column:1/-1;display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--linia2);margin-top:8px;padding-top:12px}
.kalk-suma span{color:var(--tx);font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:500}
.kalk-suma b{font-family:var(--disp);font-weight:200;font-size:44px;color:var(--h);letter-spacing:-.04em}

/* 3D */
.scena3d{position:relative;height:min(62vh,560px);overflow:hidden;background:radial-gradient(ellipse at 50% 80%,#DCE3E6,#EEF0EA 70%);border:1px solid var(--linia2);cursor:grab}
.scena3d:active{cursor:grabbing}
.scena3d canvas{display:block;width:100%;height:100%}
.panel3d{position:absolute;left:14px;right:14px;bottom:14px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;padding:12px 14px;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);border:1px solid rgba(20,20,18,.14);color:var(--atrament)}
.panel3d .opcje button{border-color:rgba(20,20,18,.24)}
.panel3d .opcje button.on{background:var(--atrament);border-color:var(--atrament);color:var(--krem)}
.kolory{display:flex;gap:8px}
.kolory button{width:24px;height:24px;border-radius:50%;border:2px solid transparent;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);transition:border-color .4s,transform .4s}
.kolory button.on{border-color:var(--h);transform:scale(1.12)}
.dane3d{position:absolute;right:14px;top:14px;display:grid;gap:4px;padding:12px 14px;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);border:1px solid rgba(20,20,18,.14);font-size:11px;color:rgba(20,20,18,.6);min-width:190px}
.dane3d div{display:flex;justify-content:space-between;gap:18px}
.dane3d b{font-weight:500;color:var(--atrament)}
.suwaki3d{display:grid;gap:10px;margin-top:22px;max-width:460px}
.suwaki3d .suwak span{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx2);min-width:92px;font-weight:500}
.mini-hint{position:absolute;left:14px;top:14px;font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:rgba(20,20,18,.5);font-weight:500}

/* PDF */
.pdf-scena{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pdf-kadr{position:relative;overflow:hidden;border:1px solid var(--linia2);background:#fff}
.pdf-kadr img{width:100%;height:100%;object-fit:cover;object-position:60% 30%;aspect-ratio:1/1.05}
.skan{position:absolute;left:0;right:0;height:80px;top:-80px;background:linear-gradient(180deg,transparent,rgba(227,178,60,.55),transparent);mix-blend-mode:multiply;opacity:0}
.pdf-scena.gra .skan{animation:skan 2.6s var(--wolno) forwards;opacity:1}
@keyframes skan{to{top:100%}}
.pdf-3d{position:relative;overflow:hidden;border:1px solid var(--linia2);background:#E9ECEE;opacity:.15;filter:grayscale(1) blur(4px);transition:opacity 1.6s var(--wolno),filter 1.6s var(--wolno)}
.pdf-3d.on{opacity:1;filter:none}
.pdf-3d img{width:100%;height:100%;object-fit:cover;aspect-ratio:1/1.05}
.pdf-tagi{position:absolute;inset:0;pointer-events:none}
.tag{position:absolute;padding:6px 10px;background:var(--atrament);color:var(--krem);font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:500;box-shadow:0 10px 30px rgba(0,0,0,.35);opacity:0;transform:translateY(10px);transition:opacity .8s var(--wolno),transform .8s var(--wolno);white-space:nowrap}
.tag::before{content:"— ";color:var(--ochra)}
.tag.on{opacity:1;transform:none}
.kroki{counter-reset:k;display:grid;gap:2px;margin-top:26px;max-width:470px}
.kroki li{list-style:none;counter-increment:k;display:flex;gap:16px;padding:10px 0;border-bottom:1px solid var(--linia);color:var(--tx3);transition:color .6s;font-size:14px}
.kroki li::before{content:counter(k,decimal-leading-zero);font-size:10px;letter-spacing:.2em;padding-top:4px;font-weight:500}
.kroki li.on{color:var(--tx)}
.kroki li.on::before{color:var(--h)}

/* arkusze */
.arkusze-w{padding:18px}
.arkusze-w svg{width:100%;height:auto;display:block}
.ark{fill:rgba(227,178,60,.16);stroke:rgba(227,178,60,.85);stroke-width:1;cursor:pointer;transition:fill .4s}
.ark:hover{fill:rgba(227,178,60,.4)}
.ark.us{fill:rgba(232,103,79,.12);stroke:rgba(232,103,79,.8);stroke-dasharray:4 3}
.ark-t{font-size:10px;fill:var(--tx2);pointer-events:none;font-family:var(--sans)}
.arkusze-s{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:14px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx2);font-weight:500}
.arkusze-s b{color:var(--tx);font-weight:500;margin-left:6px;font-size:13px;letter-spacing:0;text-transform:none}

/* kostka */
.kostka-w{display:grid;grid-template-columns:1.9fr .8fr;gap:14px;align-items:start}
.kostka-rys{overflow:hidden;border:1px solid var(--linia2);background:#4E7A4A}
.kostka-rys svg{width:100%;height:auto;display:block}
.kostka-f{display:grid;gap:12px}
.kostka-f .opcje button{padding:6px 9px;font-size:9px;letter-spacing:.08em}
.kostka-wyn{font-size:11px}
.kostka-wyn .suma b{font-size:26px}
.kostka-wyn{display:grid;grid-template-columns:1fr 1fr;gap:3px 22px;font-size:11px;color:var(--tx2);padding:12px 14px;background:var(--bg3);border:1px solid var(--linia);margin-top:10px}
.kostka-wyn div{display:flex;justify-content:space-between;gap:12px}
.kostka-wyn b{font-weight:400;color:var(--tx);text-align:right}
.kostka-wyn .suma{grid-column:1/-1;border-top:1px solid var(--linia2);margin-top:4px;padding-top:8px;align-items:baseline}
.kostka-wyn .suma b{font-family:var(--disp);font-weight:200;font-size:30px;color:var(--h);letter-spacing:-.04em}
.kostka-wyn h6{font-family:var(--sans);font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--tx3);font-weight:500;margin:2px 0 0}

/* ogrodzenia */
.ogr-zdj{position:relative;aspect-ratio:1.7;overflow:hidden;border:1px solid var(--linia2);background:#E3E6EA}
.ogr-zdj img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity 1.2s var(--wolno),transform 2s var(--wolno)}
.ogr-zdj img.on{opacity:1;transform:none}
.ogr-dane{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}
.ogr-dane div{padding:12px;background:var(--bg3);border:1px solid var(--linia)}
.ogr-dane span{display:block;font-size:9px;color:var(--tx3);text-transform:uppercase;letter-spacing:.2em;font-weight:500}
.ogr-dane b{font-family:var(--disp);font-weight:300;font-size:20px;letter-spacing:-.02em}

/* oferta */
.oferta{background:var(--krem);color:var(--atrament);padding:26px;box-shadow:0 40px 90px rgba(0,0,0,.35)}
.of-g{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px}
.of-g b{font-family:var(--disp);font-weight:300;font-size:22px;letter-spacing:-.02em;text-transform:uppercase}
.of-g small{display:block;color:rgba(20,20,18,.55);font-size:11px}
.warianty{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}
.warianty button{padding:8px 12px;border:1px solid rgba(20,20,18,.24);font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;color:rgba(20,20,18,.7);transition:background .4s,color .4s,border-color .4s}
.warianty button.on{background:var(--atrament);color:var(--krem);border-color:var(--atrament)}
.warianty button em{font-style:normal;font-size:9px;margin-left:6px;padding:2px 6px;background:var(--ochra);color:var(--atrament)}
.of-tab{width:100%;border-collapse:collapse;font-size:13px}
.of-tab td{padding:9px 0;border-bottom:1px solid rgba(20,20,18,.12)}
.of-tab td:last-child{text-align:right;font-size:12px}
.of-tab td small{display:block;color:rgba(20,20,18,.5);font-size:11px}
.of-suma{display:flex;justify-content:space-between;align-items:baseline;margin-top:14px}
.of-suma span{font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:500}
.of-suma b{font-family:var(--disp);font-weight:200;font-size:36px;letter-spacing:-.04em}
.of-dol{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:16px;flex-wrap:wrap}
.of-dol small{color:rgba(20,20,18,.55);font-size:11px}
.of-dol button{background:var(--zielen);color:var(--krem);padding:13px 18px;font-weight:500;font-size:10px;letter-spacing:.2em;text-transform:uppercase;transition:transform .4s,background .4s}
.of-dol button:hover{transform:translateY(-2px)}
.of-dol button.klik{background:#1F7A48}

/* mapa */
.mapa-w{display:grid;grid-template-columns:1fr 210px;gap:16px;align-items:center}
.mapa-w>svg{width:100%;height:auto}
.woj{fill:rgba(255,255,255,.08);stroke:var(--bg);stroke-width:1.2;cursor:pointer;transition:fill .5s}
.woj:hover{filter:brightness(1.3)}
.pedzle{display:grid;gap:6px}
.pedzle button{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--linia2);font-size:12px;font-weight:500;text-align:left;transition:border-color .4s,background .4s}
.pedzle button i{width:12px;height:12px;background:var(--k)}
.pedzle button.on{border-color:var(--k);background:color-mix(in srgb,var(--k) 18%,transparent)}
.pedzle button b{margin-left:auto;font-weight:400;font-size:10px;color:var(--tx2);letter-spacing:.06em}

/* raport */
.raport{padding:20px}
.raport-g{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:18px;flex-wrap:wrap}
.raport-g b{font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;color:var(--tx2)}
.slupki{display:grid;gap:12px}
.slupek{display:grid;grid-template-columns:110px 1fr 70px;gap:12px;align-items:center;font-size:13px}
.slupek .t{height:22px;background:var(--bg3);overflow:hidden}
.slupek .t i{display:block;height:100%;background:var(--h);width:0;transition:width 1.4s var(--wolno)}
.slupek b{font-weight:400;text-align:right}
.raport-k{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:20px}
.raport-k div{padding:14px;background:var(--bg3);border:1px solid var(--linia)}
.raport-k span{display:block;font-size:9px;color:var(--tx3);text-transform:uppercase;letter-spacing:.2em;font-weight:500}
.raport-k b{font-family:var(--disp);font-weight:200;font-size:32px;color:var(--tx);letter-spacing:-.03em}

/* telefon */
.tel-ui{padding:40px 10px 0;font-size:10px;height:100%;display:flex;flex-direction:column}
.tel-ui h6{font-family:var(--sans);font-size:9px;letter-spacing:.2em;text-transform:uppercase;margin:4px 4px 10px;color:rgba(243,235,221,.7);font-weight:500}
.tel-lead{background:rgba(255,255,255,.07);border-left:2px solid var(--ochra);padding:8px;margin-bottom:6px}
.tel-lead b{font-size:11px;display:block;font-weight:500}
.tel-lead span{color:rgba(243,235,221,.6)}
.tel-lead .tb{display:flex;gap:4px;margin-top:6px}
.tel-lead .tb i{flex:1;font-style:normal;text-align:center;padding:4px;background:rgba(255,255,255,.08);font-size:8px;letter-spacing:.1em;text-transform:uppercase}
.tel-lead .tb i:first-child{background:var(--ochra);color:var(--atrament);font-weight:600}
.tel-bar{margin-top:auto;display:grid;grid-template-columns:repeat(5,1fr);gap:2px;padding:8px 2px 12px;border-top:1px solid rgba(255,255,255,.1);text-align:center;color:rgba(243,235,221,.45);font-size:7px;letter-spacing:.08em;text-transform:uppercase}
.tel-bar div:first-child{color:var(--ochra)}
.tel-bar i{display:block;width:14px;height:14px;margin:0 auto 4px;background:currentColor;opacity:.5}
.tel-duo{display:flex;gap:24px;justify-content:center;align-items:flex-end}
.tel-duo .telefon{max-width:230px}
.tel-duo .telefon:nth-child(2){transform:translateY(-40px)}

/* sejf */
.sejf{display:grid;grid-template-columns:1fr 60px 1fr;align-items:center;gap:0}
.sejf-box{padding:24px;border:1px solid var(--linia2);background:var(--karta);min-height:230px}
.sejf-box h5{font-size:26px;margin-bottom:12px;font-weight:300}
.sejf-box ul{list-style:none;display:grid;gap:8px;font-size:13px;color:var(--tx2)}
.sejf-box li::before{content:"— ";color:var(--h)}
.sejf-box.zamek{border-color:var(--h)}
.sejf-strz{position:relative;height:1px;background:repeating-linear-gradient(90deg,var(--linia2) 0 6px,transparent 6px 12px)}
.sejf-strz::after{content:"✕";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:28px;height:28px;display:grid;place-items:center;background:var(--bg);border:1px solid var(--linia2);font-size:11px;color:var(--zle)}
.sejf-pas{grid-column:1/-1;margin-top:16px;display:flex;flex-wrap:wrap;gap:6px}
.sejf-pas span{padding:8px 12px;border:1px solid var(--linia2);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--tx2);font-weight:500}

/* etapy */
.etapy{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.etap{padding:24px 22px;border:1px solid var(--linia2);background:var(--karta);min-height:230px;position:relative}
.etap b{font-size:10px;letter-spacing:.24em;color:var(--h);font-weight:500}
.etap h5{font-size:24px;margin:16px 0 12px;font-weight:300;line-height:1}
.etap p{font-size:13px;color:var(--tx2)}

/* ═══ DEWELOPER ═══ */
.hero-inw{position:relative;overflow:hidden;border:1px solid var(--linia2);aspect-ratio:16/10;box-shadow:0 40px 90px rgba(0,0,0,.35)}
.hero-inw img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 4s var(--wolno)}
.slajd.jest .hero-inw img{transform:none}
.hero-inw figcaption,.galeria figcaption,.sp-gdzie,.sp-cofnij,.sp-koniec,.ekran-www figcaption{position:absolute;padding:8px 12px;background:rgba(20,20,18,.78);color:var(--krem);font-size:9px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;border:1px solid rgba(243,235,221,.18)}
.hero-inw figcaption{left:18px;bottom:16px}

.bud-foto{position:relative;overflow:hidden;border:1px solid var(--linia2);box-shadow:0 40px 90px rgba(0,0,0,.35)}
.bud-foto img{width:100%;display:block}
.bud-foto svg{position:absolute;inset:0;width:100%;height:100%}
.poziom{fill:rgba(255,255,255,0);stroke:rgba(255,255,255,0);stroke-width:3;cursor:pointer;transition:fill .5s,stroke .5s}
.poziom:hover{fill:rgba(227,178,60,.18);stroke:rgba(227,178,60,.9)}
.poziom.on{fill:rgba(227,178,60,.14);stroke:var(--ochra)}
.poziom-chip{fill:rgba(20,20,18,.82)}
.poziom-t{fill:#F3EBDD;font-size:26px;font-family:var(--sans);font-weight:500;letter-spacing:3px;pointer-events:none}
.pasek-lok{position:relative;margin-top:10px;overflow:hidden;border:1px solid var(--linia2);background:#fff}
.pasek-lok img{width:100%;display:block;transition:opacity .5s}
.pasek-lok svg{position:absolute;inset:0;width:100%;height:100%}
.slot{stroke-width:8;cursor:pointer;transition:fill-opacity .4s,stroke-width .4s;fill-opacity:.3}
.slot[data-s=wolne]{fill:#1F8A4C;stroke:#1F8A4C}
.slot[data-s=rez]{fill:var(--ochra2);stroke:var(--ochra2)}
.slot[data-s=sprz]{fill:#B33F27;stroke:#B33F27}
.slot:hover{fill-opacity:.5}
.slot.on{fill-opacity:.1;stroke-width:18}
.slot-b{fill:rgba(255,255,255,.88);pointer-events:none}
.slot-t{font-family:var(--disp);font-weight:300;font-size:72px;fill:#141412;pointer-events:none;text-anchor:middle}
.karta-lok{margin-top:10px;padding:14px 18px;background:var(--karta);border:1px solid var(--linia2);display:grid;grid-template-columns:auto 1fr auto;gap:4px 22px;align-items:center}
.karta-lok h5{font-size:32px;line-height:1;grid-row:1/3;font-weight:200}
.karta-lok .st{display:inline-block;font-size:9px;font-weight:600;padding:3px 9px;text-transform:uppercase;letter-spacing:.16em;grid-column:2;grid-row:1;justify-self:start;border:1px solid}
.karta-lok .st.wolne{color:#7FE0A8;border-color:rgba(127,224,168,.5)}
.karta-lok .st.rez{color:var(--ochra);border-color:rgba(227,178,60,.5)}
.karta-lok .st.sprz{color:#F09A88;border-color:rgba(240,154,136,.5)}
.slajd.jasny .karta-lok .st.wolne{color:#1F7A48}.slajd.jasny .karta-lok .st.rez{color:#8A6410}.slajd.jasny .karta-lok .st.sprz{color:#B33F27}
.karta-lok dl{grid-column:2;grid-row:2;display:grid;grid-template-columns:repeat(5,auto);grid-auto-flow:column;grid-template-rows:auto auto;justify-content:start;gap:2px 22px;font-size:12px}
.karta-lok dt{font-size:9px;text-transform:uppercase;letter-spacing:.18em;color:var(--tx3);font-weight:500}
.karta-lok .cena{grid-column:3;grid-row:1/3;padding-left:22px;border-left:1px solid var(--linia2);display:grid;gap:2px}
.karta-lok .cena span{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx2);font-weight:500}
.karta-lok .cena b{font-family:var(--disp);font-weight:200;font-size:28px;color:var(--h);letter-spacing:-.03em}
.legenda{display:flex;gap:16px;margin-top:10px;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--tx2);font-weight:500}
.legenda i{display:inline-block;width:9px;height:9px;margin-right:7px;vertical-align:-1px}

.rzut-w{display:grid;grid-template-columns:.9fr 1fr;gap:18px;align-items:center}
.rzut-obraz{overflow:hidden;background:#fff;padding:12px;border:1px solid var(--linia2)}
.rzut-obraz img{width:100%;height:auto;max-height:min(58vh,520px);object-fit:contain;transition:opacity .6s}
.pok-lista{display:grid;gap:2px;font-size:13px}
.pok-lista div{display:flex;justify-content:space-between;padding:9px 4px;border-bottom:1px solid var(--linia);color:var(--tx2);transition:color .4s}
.pok-lista div:hover{color:var(--tx)}
.pok-lista b{font-weight:400}
.pok-lista .suma{border-bottom:0;margin-top:6px;padding-top:12px;color:var(--tx)}
.pok-lista .suma b{color:var(--h);font-family:var(--disp);font-weight:300;font-size:20px}

.sp-scena{position:relative;aspect-ratio:16/9.3;overflow:hidden;background:#1B1B1B;border:1px solid var(--linia2);box-shadow:0 40px 90px rgba(0,0,0,.35)}
.sp-foto{width:100%;height:100%;object-fit:cover;display:block;transition:transform .65s cubic-bezier(.5,0,.8,.4),opacity .55s ease;transform-origin:50% 50%}
.sp-scena.sp-out .sp-foto{transform:scale(1.62);opacity:0}
.sp-hot{position:absolute;transform:translate(-50%,-50%);background:rgba(255,255,255,.08);border:2px solid rgba(255,255,255,.9);cursor:pointer;padding:0;min-width:44px;min-height:44px;animation:sp-puls 2.2s infinite;transition:background .2s}
.sp-hot:hover{background:rgba(255,255,255,.22)}
.sp-hot i{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.94);color:#33302B;font-style:normal;font-size:16px;display:grid;place-items:center;font-weight:500}
@keyframes sp-puls{0%{box-shadow:0 0 0 0 rgba(255,255,255,.55)}70%{box-shadow:0 0 0 14px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
.sp-gdzie{left:14px;top:14px}
.sp-cofnij{right:14px;top:14px;opacity:0;pointer-events:none;transition:opacity .4s;cursor:pointer}
.sp-cofnij.on{opacity:1;pointer-events:auto}
.sp-koniec{left:50%;bottom:14px;transform:translateX(-50%);opacity:0;transition:opacity .4s;white-space:nowrap}
.sp-koniec.on{opacity:1}

.panel-duo{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.panel-tab{width:100%;border-collapse:collapse;font-size:12px}
.panel-tab th{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx3);font-weight:500;text-align:left;padding:8px 6px}
.panel-tab td{padding:6px;border-top:1px solid var(--linia)}
.panel-tab input{width:88px;padding:6px 8px;border:1px solid var(--linia2);background:var(--bg3);font-size:12px}
.panel-tab select{padding:6px;border:1px solid var(--linia2);background:var(--bg3);font-size:11px}
.strona-cen{background:var(--krem);color:var(--atrament);padding:16px;font-size:12px}
.strona-cen h6{font-size:18px;margin-bottom:10px;font-weight:300}
.strona-cen .r{display:grid;grid-template-columns:36px 1fr auto auto;gap:10px;align-items:center;padding:8px 6px;border-bottom:1px solid rgba(20,20,18,.12);transition:background 1.2s;white-space:nowrap;font-size:11px}
.strona-cen .r.blysk{background:#F5DFB0}
.strona-cen .r b{font-weight:500}
.strona-cen .r .s{font-size:8px;font-weight:700;padding:2px 7px;text-transform:uppercase;letter-spacing:.12em}
.s-wolne{background:#D6EEDD;color:#23713F}.s-rez{background:#F6E6BF;color:#8A6410}.s-sprz{background:#F3D3CD;color:#9A3A2C}
.historia{margin-top:12px;font-size:11px;color:var(--tx2);display:grid;gap:4px;max-height:92px;overflow:hidden}
.historia div{animation:wlot .8s var(--wolno)}
@keyframes wlot{from{opacity:0;transform:translateY(-6px)}}

.potok{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;align-items:stretch;position:relative}
.wezel{padding:18px 16px;background:var(--karta);border:1px solid var(--linia2);transition:border-color .8s;position:relative;min-height:170px}
.wezel b{font-size:10px;letter-spacing:.24em;color:var(--tx3);font-weight:500}
.wezel h5{font-size:20px;margin:12px 0 8px;line-height:1;font-weight:300}
.wezel p{font-size:12px;color:var(--tx2)}
.wezel.on{border-color:var(--h)}
.wezel.on b{color:var(--h)}
.zegar{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.zegar b{font-family:var(--disp);font-weight:200;font-size:46px;letter-spacing:-.02em;color:var(--h)}
.zegar span{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx2);font-weight:500}
.csv{margin-top:14px;padding:12px 14px;background:var(--atrament);border:1px solid var(--linia);font-family:ui-monospace,Menlo,monospace;font-size:10px;color:#9FD9A6;white-space:pre;overflow:hidden;height:118px}

.zap-duo{display:grid;grid-template-columns:.9fr 1.1fr;gap:14px;align-items:start}
.formik{background:var(--krem);color:var(--atrament);padding:18px;display:grid;gap:8px;font-size:12px}
.formik h6{font-size:18px;font-weight:300}
.formik input,.formik textarea{width:100%;padding:9px 11px;border:1px solid rgba(20,20,18,.22);background:#fff;font-size:12px;color:var(--atrament)}
.formik textarea{height:62px;resize:none}
.formik button{background:var(--atrament);color:var(--krem);padding:12px;font-weight:500;font-size:9px;letter-spacing:.24em;text-transform:uppercase}
.skrzynka{padding:14px;min-height:320px}
.skrz-r{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:11px;background:var(--bg3);border:1px solid var(--linia);margin-bottom:8px;font-size:12px}
.skrz-r .kr{width:7px;height:7px;background:var(--tx3)}
.skrz-r.nowe{border-color:var(--h);animation:wlot 1s var(--wolno)}
.skrz-r.nowe .kr{background:var(--h)}
.skrz-r small{color:var(--tx3);font-size:10px;letter-spacing:.08em}

.galeria{display:grid;grid-template-columns:1.4fr 1fr;grid-template-rows:1fr 1fr;gap:8px;height:min(60vh,540px)}
.galeria figure{position:relative;overflow:hidden;border:1px solid var(--linia2)}
.galeria figure:first-child{grid-row:1/3}
.galeria img{width:100%;height:100%;object-fit:cover;transition:transform 2.5s var(--wolno)}
.galeria figure:hover img{transform:scale(1.05)}
.galeria figcaption{left:12px;bottom:10px}

.pierscienie{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.pier{text-align:center;padding:20px 10px;border:1px solid var(--linia2);background:var(--karta)}
.pier svg{width:96px;height:96px;transform:rotate(-90deg)}
.pier circle{fill:none;stroke-width:3}
.pier .tl{stroke:var(--linia)}
.pier .wy{stroke:var(--h);stroke-linecap:butt;stroke-dasharray:264;stroke-dashoffset:264;transition:stroke-dashoffset 2s var(--wolno)}
.pier b{display:block;font-family:var(--disp);font-weight:200;font-size:30px;margin-top:-64px;margin-bottom:34px;letter-spacing:-.03em}
.pier span{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--tx2);font-weight:500}
.waga{display:flex;align-items:center;gap:18px;margin-top:18px;padding:18px;border:1px solid var(--linia2);background:var(--karta)}
.waga .p{flex:1;height:6px;background:var(--bg3);overflow:hidden}
.waga .p i{display:block;height:100%;width:100%;background:var(--zle);transition:width 2.4s var(--wolno) .6s,background 2.4s .6s}
.slajd.jest .waga .p i{width:9%;background:var(--ok)}
.waga b{font-weight:400;font-size:13px;min-width:150px}
.waga>span{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--tx2);font-weight:500}

/* ═══ FIRMA ═══ */
.ekran-www{position:relative;overflow:hidden;border:1px solid var(--linia2);box-shadow:0 40px 90px rgba(0,0,0,.35);background:#fff;aspect-ratio:16/10}
.ekran-www img{width:100%;height:auto;display:block}
.ekran-www.scroll img{animation:przewin 26s ease-in-out infinite alternate}
@keyframes przewin{0%{transform:translateY(0)}12%{transform:translateY(0)}100%{transform:translateY(calc(-100% + 100cqh))}}
.ekran-www{container-type:size}
.ekran-www figcaption{left:14px;bottom:12px}
.cechy{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:22px;max-width:520px}
.cecha{padding:14px 16px;border:1px solid var(--linia2);background:var(--karta)}
.cecha b{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--h);font-weight:500;margin-bottom:6px}
.cecha span{font-size:12px;color:var(--tx2)}
.duo-www{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.duo-www .ekran-www{aspect-ratio:4/3}

/* o mnie */
.omnie{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(24px,4vw,64px);align-items:center;width:100%}
.omnie .tekst h2{font-size:clamp(34px,3.8vw,60px)}
.foto{position:relative;overflow:hidden;border:1px solid var(--linia2);max-height:calc(100vh - 190px);height:100%}
.foto img{width:100%;height:100%;object-fit:cover;object-position:40% 30%;transform:scale(1.06);transition:transform 3s var(--wolno);filter:saturate(.85)}
.slajd.jest .foto img{transform:none}
.foto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(20,20,18,.85))}
.foto figcaption{position:absolute;left:22px;bottom:18px;z-index:2}
.foto figcaption b{font-family:var(--disp);font-weight:200;font-size:34px;display:block;line-height:1;letter-spacing:-.03em;color:var(--krem);text-transform:uppercase}
.foto figcaption span{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:rgba(243,235,221,.7);font-weight:500}
.kontakt{display:grid;gap:10px;margin-top:22px;max-width:520px}
.kontakt .dwa{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kontakt input,.kontakt textarea{width:100%;padding:14px 16px;border:1px solid var(--linia2);background:var(--bg3);font-size:14px;transition:border-color .4s;color:var(--tx)}
.kontakt input::placeholder,.kontakt textarea::placeholder{color:var(--tx3)}
.kontakt input:focus,.kontakt textarea:focus{outline:0;border-color:var(--h)}
.kontakt textarea{height:96px;resize:none}
.kontakt .zgoda{font-size:11px;color:var(--tx3)}
.kontakt .wynik{font-size:13px;color:var(--ok)}
.kontakt .guzik.pelny{justify-self:start}
.realizacje{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:20px}
.realizacje a{font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;color:var(--tx2);text-decoration:none;border-bottom:1px solid var(--linia2);padding-bottom:4px;transition:color .4s,border-color .4s}
.realizacje a:hover{color:var(--tx);border-color:var(--h)}
.pulapka{position:absolute;left:-9999px;opacity:0}


/* ── formularz w hero (strona wejściowa) ───────────────────── */
.hero-prawa{display:flex;flex-direction:column;align-items:stretch;gap:14px;flex:1 1 420px;min-width:0}
.hero-form{margin-top:0;width:100%;max-width:none;gap:9px;padding:18px 20px;border:1px solid var(--linia2);background:rgba(8,28,21,.62)}
.hero-prawa .hero-hint{align-self:flex-end}
.hero-form-tyt{font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--tx2);font-weight:500}
.hero-form-tyt em{font-style:normal;color:var(--ochra)}
.hero-pola{display:grid;grid-template-columns:1fr 1.2fr auto;gap:8px}
.hero-form input{padding:11px 13px;font-size:13px}
.hero-form .guzik.pelny{padding:11px 18px;white-space:nowrap;justify-self:stretch}
.hero-form .zgoda{font-size:10px;letter-spacing:.01em}
.hero-form .wynik{font-size:12px}

/* ── mobile / niskie ekrany ────────────────────────────────── */
@media (max-width:900px),(max-height:600px){
  body,body.w-decku{overflow:auto}
  #wybor{position:relative;grid-template-columns:1fr;min-height:100svh}
  #wybor.znika{display:none}
  .hero-l{min-height:78svh;padding-top:100px}
  .hero-l h1{font-size:clamp(34px,11vw,72px)}
  .marka b{font-size:10px;letter-spacing:.14em}
  .marka i{width:32px;height:32px}
  .marka i svg{width:20px;height:20px}
  .przelacz{gap:10px}
  .przelacz button{font-size:9px;letter-spacing:.1em}
  .mod-lista{border-left:0;border-top:1px solid var(--linia);grid-template-rows:none}
  .mod{grid-template-columns:1fr;padding:26px 18px}
  .mod-obraz{display:none}
  .deck{position:relative;inset:auto;display:none}
  .deck.aktywny{display:block}
  .slajd{position:relative;visibility:visible;opacity:1;transform:none;grid-template-columns:1fr;padding:86px 18px 56px;min-height:auto;align-items:start}
  .slajd .wej{opacity:0;transform:translateY(30px)}
  .slajd.widac .wej{opacity:1;transform:none}
  .kropki,.deck-dol,.dalej-hint{display:none}
  /* pasek na telefonie: pełne tło, żeby treść nie przewijała się pod literami */
  .pasek{position:fixed;background:rgba(12,42,32,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--linia);padding:12px 16px}
  body.na-jasnym .pasek{background:rgba(243,235,221,.97);border-bottom-color:rgba(20,20,18,.14)}
  .marka b{font-size:9.5px;letter-spacing:.1em}
  .slajd{padding-top:78px}
  .mod h2{line-height:1.12}
  .marka small{display:none}
  .pasek-p{gap:14px}
  .pasek-p .guzik:not(.przelacz){display:none}
  .scena-w,.pdf-scena,.panel-duo,.zap-duo,.rzut-w,.omnie,.mapa-w,.kostka-w,.duo-www{grid-template-columns:1fr}
  .etapy,.potok,.pierscienie,.branze{grid-template-columns:1fr 1fr}
  .ogr-dane{grid-template-columns:1fr 1fr}
  .sejf{grid-template-columns:1fr}
  .sejf-strz{height:40px;width:1px;margin:0 auto;background:repeating-linear-gradient(180deg,var(--linia2) 0 6px,transparent 6px 12px)}
  .karta-lok{grid-template-columns:1fr auto}
  .karta-lok h5{grid-row:auto}
  .karta-lok .st{grid-column:1;grid-row:auto}
  .karta-lok dl{grid-column:1/-1;grid-row:auto;grid-template-columns:1fr auto;grid-auto-flow:row;grid-template-rows:none}
  .karta-lok dd{text-align:right}
  .karta-lok .cena{grid-column:1/-1;grid-row:auto;border-left:0;padding:10px 0 0;border-top:1px solid var(--linia2)}
  .scena3d{height:420px}
  .dane3d{min-width:0;font-size:10px}
  .tel-duo .telefon:nth-child(2){display:none}
  .lead{grid-template-columns:1fr}
  .lead-akcje{grid-template-columns:1fr 1fr 1fr}
  /* czytelność na telefonie: ogonki Ę/Ą nie mogą wchodzić w tekst pod spodem */
  h1,h2,h3,h4,h5,h6{line-height:1.04}
  .hero-l{padding-bottom:30px}
  .hero-l h1{line-height:1.02;margin-top:14px}
  .hero-nr{font-size:10.5px;letter-spacing:.16em}
  .hero-dol{gap:20px;margin-top:22px}
  .hero-dol p{font-size:14.5px;line-height:1.6;max-width:none}
  .mod{padding:30px 18px}
  .mod h2{line-height:1.06;margin:10px 0 12px}
  .mod p{font-size:14px;line-height:1.55;max-width:none}
  .mod-nr,.mod-real{letter-spacing:.2em}
  .mod-real{position:static;display:block;margin-bottom:10px}
  .tekst h2,.tekst h1{line-height:1.02;margin:16px 0 18px}
  .kicker{letter-spacing:.2em}
  .slajd p,.tekst p{font-size:14.5px;line-height:1.6}
  .kostka-wyn{grid-template-columns:1fr}
  .kostka-wyn div{display:flex;justify-content:space-between;align-items:baseline;gap:14px}
  .kostka-wyn h6{display:none}
  .kostka-wyn .suma b{font-size:24px}
  .mapa-leaflet{height:min(52vh,380px)}
  .kontakt .dwa{grid-template-columns:1fr}
  .hero-prawa{align-items:stretch;width:100%}
  .hero-form{width:100%}
  .hero-pola{grid-template-columns:1fr}
  .hero-form .guzik.pelny{justify-self:start}
  .babel{right:8px}
  .mapa-w .pedzle{grid-template-columns:1fr 1fr}
  .galeria{height:auto;grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .galeria figure{aspect-ratio:4/3}
  .galeria figure:first-child{grid-column:1/-1;grid-row:auto}
  .foto{max-height:none;aspect-ratio:1/1.05}
  .slot-t{font-size:90px}
  .poziom-t{font-size:44px}
  .cechy{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01s!important;transition-duration:.01s!important}}

/* ═══ dodatkowe slajdy CRM ═══ */
.zrodla{display:grid;gap:10px}
.zrodla-p{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.zrodla-p button{padding:14px;border:1px solid var(--linia2);background:var(--karta);text-align:left;transition:border-color .4s,background .4s}
.zrodla-p button:hover{border-color:var(--h)}
.zrodla-p button.on{border-color:var(--h);background:color-mix(in srgb,var(--h) 12%,var(--karta))}
.zrodla-p b{display:block;font-family:var(--disp);font-weight:300;text-transform:uppercase;font-size:13px}
.zrodla-p span{display:block;font-size:11px;color:var(--tx2);margin-top:4px}
.zrodla .lead.nowy-lead{animation:wlot 1s var(--wolno)}
.szukaj{display:grid;gap:10px}
.szukaj input{width:100%;padding:12px 14px;border:1px solid var(--linia2);background:var(--bg3);font-size:16px;letter-spacing:.06em}
.szukaj .opcje button{font-size:12px;letter-spacing:.06em;text-transform:none}
.ktos-wynik{min-height:220px;display:grid;gap:8px;align-content:start}
.ktos-k{padding:12px 14px;background:var(--bg3);border:1px solid var(--linia);font-size:13px}
.ktos-k b{font-weight:500}
.ktos-k .kiedy{color:var(--tx3);font-size:11px;letter-spacing:.06em;margin-right:8px}
.ktos-naglowek{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.ktos-naglowek b{font-family:var(--disp);font-weight:300;font-size:22px;text-transform:uppercase}
.terminarz{padding:16px}
.term-g{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.term-g b{font-family:var(--disp);font-weight:300;font-size:18px;text-transform:uppercase}
.term-g span{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx2);font-weight:500}
.term-siatka{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.term-siatka .dn{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx3);text-align:center;padding:4px 0;font-weight:500}
.term-siatka button{aspect-ratio:1.25;border:1px solid var(--linia);background:var(--bg3);font-size:12px;position:relative;text-align:left;padding:5px 6px;transition:border-color .4s,background .4s}
.term-siatka button:hover{border-color:var(--h)}
.term-siatka button.on{border-color:var(--h);background:color-mix(in srgb,var(--h) 14%,transparent)}
.term-siatka button.pusty{opacity:.3;pointer-events:none}
.term-siatka button i{position:absolute;right:6px;bottom:5px;display:flex;gap:2px}
.term-siatka button i b{width:5px;height:5px;background:var(--h);display:block}
.term-lista{margin-top:10px;display:grid;gap:5px;min-height:70px}
.term-lista div{display:grid;grid-template-columns:52px 62px 1fr;gap:10px;padding:8px 10px;background:var(--bg3);border:1px solid var(--linia);font-size:12px;align-items:center}
.term-lista .g{font-weight:500}
.term-lista .id{color:var(--h);letter-spacing:.06em}
.term-lista .brak{display:block;grid-template-columns:1fr;color:var(--tx3);background:none;border:0;padding:8px 0}
.mapa-d{grid-template-columns:1fr;gap:10px}
.mapa-d svg{cursor:crosshair}
.dyst-zasieg{fill:var(--ochra);fill-opacity:.1;stroke:var(--ochra);stroke-opacity:.5;stroke-width:1;pointer-events:none}
.dyst-pin{fill:var(--ochra);stroke:var(--bg);stroke-width:2;pointer-events:none}
.dyst-pin.on{fill:#F3EBDD}
.klient-pin{fill:#F3EBDD;stroke:var(--atrament);stroke-width:2;pointer-events:none}
.trasa{fill:none;stroke:#F3EBDD;stroke-width:2;stroke-dasharray:5 4;pointer-events:none}
.dyst-lista{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;align-content:start}
.dyst-lista .propo{grid-column:1/-1}
.dyst-lista button{text-align:left;padding:10px 12px;border:1px solid var(--linia2);background:var(--karta);display:grid;gap:3px;transition:border-color .4s}
.dyst-lista button.on{border-color:var(--h)}
.dyst-lista b{font-weight:500;font-size:13px}
.dyst-lista span{font-size:11px;color:var(--tx2)}
.dyst-lista em{font-style:normal;color:var(--h);font-size:11px;letter-spacing:.06em}
.dyst-lista .propo{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx3);font-weight:500;padding:4px 0}
.quiz{padding:20px;display:grid;gap:14px}
.quiz-g{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx2);font-weight:500}
.quiz-g b{color:var(--h)}
.quiz-pasek{height:3px;background:var(--linia2);overflow:hidden}
.quiz-pasek i{display:block;height:100%;width:100%;background:var(--h);transition:width 15s linear}
.quiz-p{font-family:var(--disp);font-weight:300;font-size:22px;text-transform:uppercase;line-height:1.1;min-height:52px}
.quiz-o{display:grid;gap:6px}
.quiz-o button{text-align:left;padding:12px 14px;border:1px solid var(--linia2);background:var(--bg3);font-size:14px;transition:border-color .4s,background .4s}
.quiz-o button:hover{border-color:var(--h)}
.quiz-o button.dobra{border-color:var(--ok);background:rgba(91,201,138,.12)}
.quiz-o button.zla{border-color:var(--zle);background:rgba(232,103,79,.12)}
.quiz-w{font-size:13px;color:var(--tx2);min-height:20px}
@media (max-width:900px),(max-height:600px){.zrodla-p{grid-template-columns:1fr}.mapa-d{grid-template-columns:1fr}.dyst-lista{grid-template-columns:1fr}.term-siatka button{aspect-ratio:1}}
/* nagłówek i nawigacja na jasnym slajdzie */
body.na-jasnym{--tx:var(--atrament);--tx2:rgba(20,20,18,.62);--tx3:rgba(20,20,18,.42);--linia:rgba(20,20,18,.12);--linia2:rgba(20,20,18,.24);--h:var(--ochra2)}
body.na-jasnym .pasek,body.na-jasnym .kropki,body.na-jasnym .deck-dol,body.na-jasnym .dalej-hint{color:var(--atrament)}
body.na-jasnym .marka i{color:var(--ochra2);border-color:rgba(20,20,18,.24)}
body.na-jasnym .toast{color:var(--krem)}
/* mapa drogowa */
.mapa-leaflet{height:min(46vh,420px);border:1px solid var(--linia2);background:#DDE3DA;cursor:crosshair}
.mapa-leaflet .leaflet-tile-pane{filter:saturate(.55) contrast(1.05)}
.dyst-marker{width:14px;height:14px;border-radius:50%;background:var(--ochra);border:2px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.35)}
.dyst-marker.on{background:#fff;border-color:var(--ochra);width:16px;height:16px}
.klient-marker{width:16px;height:16px;border-radius:50%;background:#141412;border:3px solid #F3EBDD;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.leaflet-container{font-family:var(--sans)}
.mapa-leaflet .leaflet-attribution-flag{display:none!important}
.dyst-lista .licze{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx3);font-weight:500;padding:6px 0}
/* czym jest system / dzień handlowca */
.moduly{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.moduly div{padding:14px;border:1px solid var(--linia2);background:var(--karta);min-height:92px}
.moduly b{display:block;font-family:var(--disp);font-weight:300;text-transform:uppercase;font-size:14px;letter-spacing:-.01em;margin-bottom:6px}
.moduly span{font-size:11px;color:var(--tx2);line-height:1.4}
.dzien{display:grid;gap:0;position:relative}
.dzien>div{display:grid;grid-template-columns:52px 20px 1fr;gap:8px;align-items:start;padding:9px 0;opacity:0;transform:translateX(20px);transition:opacity .8s var(--wolno),transform .8s var(--wolno)}
.slajd.jest .dzien>div{opacity:1;transform:none}
.slajd.jest .dzien>div:nth-child(1){transition-delay:.3s}.slajd.jest .dzien>div:nth-child(2){transition-delay:.55s}.slajd.jest .dzien>div:nth-child(3){transition-delay:.8s}.slajd.jest .dzien>div:nth-child(4){transition-delay:1.05s}.slajd.jest .dzien>div:nth-child(5){transition-delay:1.3s}.slajd.jest .dzien>div:nth-child(6){transition-delay:1.55s}.slajd.jest .dzien>div:nth-child(7){transition-delay:1.8s}.slajd.jest .dzien>div:nth-child(8){transition-delay:2.05s}
.dzien b{font-weight:500;font-size:13px;letter-spacing:.06em;padding-top:2px}
.dzien i{display:block;width:10px;height:10px;background:var(--h);margin-top:6px;position:relative}
.dzien i::after{content:"";position:absolute;left:4px;top:12px;width:1px;height:34px;background:var(--linia2)}
.dzien>div:last-child i::after{display:none}
.dzien span{font-size:13px;color:var(--tx2)}
.dzien strong{color:var(--tx);font-weight:500}
@media (max-width:900px),(max-height:600px){.moduly{grid-template-columns:1fr 1fr}}
.branza-nota{margin-top:20px;padding:12px 16px;border-left:2px solid var(--h);font-size:13px;color:var(--tx2);max-width:500px}
.branza-nota b{color:var(--h);font-weight:500;letter-spacing:.02em}
