/* Start: kino na scrollu „jedno zamówienie przez cały system”. #st-gl to scena WebGL (three.js), #st-swiat to świat DOM
   z tą samą kamerą (telefon, panel, karty, podpisy). Liczy assets/start3d.js. Bez JS, bez WebGL i przy
   prefers-reduced-motion zostaje jeden ekran startowy z plakatem. */
.st-kino{position:relative;height:calc(100svh - 64px);min-height:520px;background:#03040B}
.st-kino.kino-on{height:780vh}
.st-scena{position:sticky;top:64px;height:calc(100svh - 64px);min-height:520px;overflow:hidden;color:#fff;
  --sys:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,sans-serif}
.st-tlo{position:absolute;inset:0;background:radial-gradient(55% 60% at 68% 52%,rgba(79,70,229,.2),transparent 72%),radial-gradient(28% 34% at 92% 10%,rgba(6,182,212,.1),transparent 70%),linear-gradient(180deg,#03040B,#080B20)}
.st-plotno{position:absolute;z-index:1;left:0;top:0;width:100%;height:100%;pointer-events:none}
.st-kino:not(.kino-on) .st-plotno{display:none}
.st-kino:not(.kino-on) .st-tlo{background:#04050d url(img/start/plakat.webp) center/cover no-repeat}
@media (max-aspect-ratio:0.85){.st-kino:not(.kino-on) .st-tlo{background-image:url(img/start/plakat-pion.webp)}}
.st-swiat{position:absolute;z-index:2;left:0;top:0;width:0;height:0;transform-style:preserve-3d;pointer-events:none}
.st-swiat > *{position:absolute;left:0;top:0;transform-origin:50% 50%;backface-visibility:hidden;visibility:hidden}

/* podpisy naszych ekranów na mapie */
.st-podpis{font:600 44px/1.1 var(--ff);letter-spacing:-.01em;white-space:nowrap;color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.85)}

/* telefon: kasa sklepu */
.st-tel{width:330px;height:680px;padding:11px;border-radius:52px;background:linear-gradient(160deg,#2C2F38,#0D0E13 40%,#1B1D24);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.16),0 50px 110px -30px rgba(0,0,0,.95),0 0 140px -30px rgba(34,211,238,.4)}
.tl-ek{position:relative;height:100%;border-radius:42px;overflow:hidden;background:#F6F7F9;color:#14161C;font:15px/1.35 var(--sys);padding:62px 20px 20px}
.tl-ek::before{content:"";position:absolute;z-index:2;left:50%;top:11px;width:96px;height:28px;margin-left:-48px;border-radius:20px;background:#0D0E13}
.tl-st{position:absolute;left:0;right:0;top:0;height:48px;display:flex;justify-content:space-between;align-items:center;padding:4px 30px 0;font-size:14px}
.tl-st span{font-size:12px;color:#6B7280}
.tl-nag{display:flex;justify-content:space-between;align-items:baseline;padding:10px 2px 16px;border-bottom:1px solid #E3E5E8}
.tl-nag b{font-size:30px;letter-spacing:-.02em}
.tl-nag span{font-size:13px;color:#6B7280}
.tl-w{display:flex;justify-content:space-between;padding:14px 2px;border-bottom:1px solid #E9EAED}
.tl-w span{color:#6B7280}
.tl-razem{display:flex;justify-content:space-between;align-items:baseline;padding:18px 2px 20px}
.tl-razem span{font-weight:600}
.tl-razem b{font-size:30px;letter-spacing:-.02em}
.tl-blik{padding:14px;border-radius:16px;background:#fff;box-shadow:0 0 0 1px #E3E5E8}
.tl-blik small{display:block;font-size:12.5px;color:#6B7280;margin-bottom:10px}
.tl-kod{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}
.tl-kod i{display:grid;place-items:center;height:46px;border-radius:10px;background:#F1F2F4;box-shadow:inset 0 0 0 1px #E1E3E7;transition:box-shadow .2s}
.tl-kod i.jest{box-shadow:inset 0 0 0 1.5px #16824A}
.tl-kod i.jest::after{content:"";width:12px;height:12px;border-radius:50%;background:#14161C}
.tl-btn{margin-top:16px;padding:17px;border-radius:14px;text-align:center;font-weight:700;font-size:16px;background:#16824A;color:#fff;transition:transform .15s,filter .15s}
.st-tel.klik .tl-btn{transform:scale(.95);filter:brightness(.85)}
.tl-ok{position:absolute;inset:48px 0 0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:30px;text-align:center;background:#F6F7F9;opacity:0;transform:scale(1.05);transition:opacity .4s,transform .55s cubic-bezier(.2,.8,.2,1)}
.tl-ok svg{width:88px;height:88px;padding:20px;border-radius:50%;background:#16824A;color:#fff;box-shadow:0 0 0 14px rgba(22,130,74,.14)}
.tl-ok b{margin-top:14px;font-size:32px;letter-spacing:-.02em}
.tl-ok span{font-size:14px;color:#6B7280}
.st-tel.oplacone .tl-ok{opacity:1;transform:none}

/* panel Sellteo: zamówienia */
.st-panel{width:1120px;height:700px;display:grid;grid-template-columns:200px 1fr;border-radius:16px;overflow:hidden;background:#fff;color:#14161C;font:14px/1.35 var(--sys);
  box-shadow:0 0 0 1.5px rgba(255,255,255,.22),0 60px 140px -40px rgba(0,0,0,.95),0 0 180px -40px rgba(99,102,241,.55)}
.sp-bok{display:flex;flex-direction:column;gap:2px;padding:22px 12px;border-right:1px solid #ECEDF0;background:#FAFAFB}
.sp-logo{font-size:25px;letter-spacing:-.03em;padding:0 10px 18px}
.sp-logo i{font-style:normal;color:#16824A}
.sp-bok span{display:flex;justify-content:space-between;padding:8px 10px;border-radius:8px;color:#3C3F47}
.sp-bok span.on{background:#E3F2E8;color:#0E5A33;font-weight:600}
.sp-bok em{font-style:normal;font-weight:600}
.sp-bok small{padding:16px 10px 6px;margin-top:10px;border-top:1px solid #ECEDF0;font-size:12px;color:#8A8F99}
.sp-gl{min-width:0;padding:0 26px}
.sp-gora{display:flex;justify-content:space-between;align-items:center;gap:16px;height:62px;margin:0 -26px;padding:0 26px;border-bottom:1px solid #ECEDF0}
.sp-szuk{flex:1;max-width:470px;padding:9px 14px;border-radius:9px;box-shadow:inset 0 0 0 1px #E3E5E8;color:#8A8F99}
.sp-sk{padding:8px 14px;border-radius:9px;box-shadow:inset 0 0 0 1px #E3E5E8;font-weight:600}
.sp-tyt{display:flex;align-items:baseline;gap:14px;padding:24px 0 18px}
.sp-tyt b{font-size:27px;letter-spacing:-.02em}
.sp-tyt span{color:#8A8F99}
.sp-nag,.sp-w{display:grid;grid-template-columns:1.3fr .55fr 1.05fr .75fr 1.05fr;gap:14px;align-items:center;padding:0 14px}
.sp-nag{height:40px;border-radius:10px 10px 0 0;background:#F4F5F7;color:#6B7280;font-size:13px;font-weight:600}
.sp-w{height:68px;border-bottom:1px solid #ECEDF0}
.sp-w b{display:block;font-weight:700}
.sp-w small{display:block;margin-top:2px;font-size:12.5px;color:#8A8F99}
.sp-w small.sp-zl{color:#16824A;font-weight:600}
.sp-nowy{position:relative;z-index:1;background:#fff;transform-origin:50% 0;opacity:0;transform:translateY(-16px) scaleY(.5);transition:opacity .45s,transform .6s cubic-bezier(.2,.8,.2,1),background 1.4s,box-shadow 1.4s}
.st-panel.ma .sp-nowy{opacity:1;transform:none;background:#EAF6EF;box-shadow:inset 4px 0 0 #16824A}
.sp-ik{display:flex;gap:6px}
.sp-ik i{display:grid;place-items:center;min-width:38px;height:28px;padding:0 6px;border-radius:7px;font-style:normal;font-size:11.5px;font-weight:700;color:#A0A4AD;background:#EEF0F3;transition:background .4s,color .4s,transform .4s}
.sp-ik i.jest{background:#16824A;color:#fff;transform:scale(1.1)}
.sp-reszta{filter:blur(1.5px);opacity:.7;transform:translateY(-68px);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.st-panel.ma .sp-reszta{transform:none}
.sp-reszta i{display:block;height:11px;border-radius:6px;background:#E3E6EA}
.sp-reszta i:nth-child(1){width:84%}.sp-reszta i:nth-child(2){width:62%}.sp-reszta i:nth-child(3){width:78%}.sp-reszta i:nth-child(4){width:55%}
.sp-reszta .sp-w:nth-child(2n) i:nth-child(1){width:70%}.sp-reszta .sp-w:nth-child(3n) i:nth-child(3){width:58%}

/* karty: cztery rzeczy, które dzieją się same */
.st-karta{width:440px;height:300px}
#st-k1{width:300px;height:430px}
#st-k2{width:400px;height:280px}
.st-karta .kw{position:relative;height:100%;border-radius:14px;overflow:hidden;font:16px/1.4 var(--sys);opacity:0;transform:scale(.86) translateY(24px);
  transition:opacity .45s,transform .65s cubic-bezier(.2,.8,.2,1);box-shadow:0 40px 90px -30px rgba(0,0,0,.9)}
.st-karta.jest .kw{opacity:1;transform:none;animation:stBlysk 1.4s ease-out}
@keyframes stBlysk{0%{box-shadow:0 0 0 3px rgba(34,211,238,.95),0 0 90px 10px rgba(34,211,238,.6),0 40px 90px -30px rgba(0,0,0,.9)}100%{box-shadow:0 0 0 0 rgba(34,211,238,0),0 0 0 0 rgba(34,211,238,0),0 40px 90px -30px rgba(0,0,0,.9)}}
.st-karta footer{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:8px;padding:13px 18px;font-size:14px;font-weight:600;background:#E9F6EE;color:#0E5A33}
.st-karta footer svg{width:16px;height:16px;flex:none}
.st-karta time{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:700}
.sk{display:block;height:10px;margin:11px 0;border-radius:5px;background:#E6E7EA;width:88%}
.sk.k{width:56%}
.st-fv{padding:24px 26px;background:#FBFBF8;color:#22252B}
.st-fv header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:16px;padding-bottom:14px;border-bottom:2px solid #22252B}
.st-fv header b{font-size:23px}
.st-fv header span{font-size:15px;color:#6B7280}
.fv-suma{display:flex;justify-content:space-between;align-items:baseline;margin-top:16px;padding-top:12px;border-top:1px solid #E1E3E7}
.fv-suma b{font-size:30px;letter-spacing:-.02em}
.st-dpd{padding:20px 22px;background:#fff;color:#111;box-shadow:inset 0 0 0 3px #111}
.dpd-g{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:10px;border-bottom:3px solid #111}
.dpd-g b{font-size:46px;letter-spacing:-.04em;line-height:1}
.dpd-g span{font-size:15px;font-weight:700}
.dpd-kod{height:120px;margin:20px 0 12px;background:repeating-linear-gradient(90deg,#111 0 3px,transparent 3px 5px,#111 5px 9px,transparent 9px 11px,#111 11px 12px,transparent 12px 16px,#111 16px 17px,transparent 17px 21px)}
.dpd-nr{text-align:center;font:700 15px/1 ui-monospace,Menlo,monospace;letter-spacing:.06em}
.st-dpd footer{line-height:1.3}
.st-stany{padding:22px 24px;background:rgba(14,18,44,.92);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(129,140,248,.4)}
.st-stany header{font-size:21px;font-weight:700}
.st-stany ul{list-style:none;margin:12px 0 0;padding:0}
.st-stany li{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:17px}
.st-stany li b{color:#22D3EE;font-variant-numeric:tabular-nums}
.st-stany footer{background:rgba(34,211,238,.14);color:#A5F3FC}
.st-mail{padding:22px 24px;background:#fff;color:#14161C}
.st-mail header span{font-size:14px;color:#6B7280}
.st-mail header b{display:block;margin-top:4px;padding-bottom:14px;border-bottom:1px solid #ECEDF0;font-size:22px}
.ml-nr{display:flex;justify-content:space-between;align-items:center;margin-top:14px;font-size:14px;color:#6B7280}
.ml-btn{padding:9px 14px;border-radius:9px;background:#16824A;color:#fff;font-weight:600}

/* reszta systemu na mapie */
.st-wezel{display:flex;flex-direction:column;align-items:center;text-align:center;white-space:nowrap;color:#fff;font:600 64px/1.05 var(--ff);letter-spacing:-.02em;text-shadow:0 2px 30px rgba(0,0,0,.85)}
.st-wezel small{margin-top:10px;font:500 38px/1.2 var(--ff);letter-spacing:0;color:#A5F3FC}

/* tekst nad sceną */
.st-cien,.st-cien-d{position:absolute;z-index:2;inset:0;pointer-events:none}
.st-pas{position:absolute;z-index:3;left:0;right:0;height:calc(var(--lb,0) * 5.5vh);background:#000;pointer-events:none}
.st-pas.g{top:0}.st-pas.d{bottom:0}
.st-cien{background:linear-gradient(90deg,rgba(3,4,11,.94) 0,rgba(3,4,11,.8) 30%,rgba(3,4,11,0) 52%);opacity:var(--cl,1)}
.st-cien-d{background:linear-gradient(0deg,rgba(3,4,11,.94) 0,rgba(3,4,11,.66) 20%,rgba(3,4,11,0) 38%);opacity:var(--cb,0)}
.st-start{position:absolute;z-index:3;top:50%;left:max(28px,5vw);width:min(600px,40vw);transform:translateY(calc(-50% + (1 - var(--h,1)) * -50px));opacity:var(--h,1)}
.st-start.znik,.st-pod.znik,.st-final.znik,.st-pomin.znik{visibility:hidden}
.st-start h1{font-size:clamp(42px,4.9vw,78px);letter-spacing:-.04em;line-height:.97}
.st-start h1 span{display:block}
.st-start .lead{margin-top:22px;color:rgba(255,255,255,.74);max-width:46ch}
.st-cta{display:flex;align-items:center;gap:14px 26px;margin-top:30px;flex-wrap:wrap}
.st-kino .btn.bialy{background:#fff;border-color:#fff;color:var(--ink)}
.st-kino .btn.bialy:hover{background:#E6E8FF;border-color:#E6E8FF}
.st-kino .link.jasny{color:#fff;border-color:#22D3EE}
.st-kino .link.jasny:hover{color:#A5F3FC}
.st-kino.wejscie .st-start h1 span,.st-kino.wejscie .st-start .lead,.st-kino.wejscie .st-cta{animation:stWej 1s cubic-bezier(.2,.8,.2,1) both}
.st-kino.wejscie .st-start h1 span:nth-child(1){animation-delay:.35s}
.st-kino.wejscie .st-start h1 span:nth-child(2){animation-delay:.47s}
.st-kino.wejscie .st-start h1 span:nth-child(3){animation-delay:.59s}
.st-kino.wejscie .st-start .lead{animation-delay:1.05s}
.st-kino.wejscie .st-start .st-cta{animation-delay:1.2s}
@keyframes stWej{from{opacity:0;transform:translateY(38px);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
.st-przewin{position:absolute;z-index:3;left:50%;bottom:18px;display:flex;flex-direction:column;align-items:center;gap:8px;transform:translateX(-50%);font-size:13px;color:rgba(255,255,255,.55);opacity:var(--hs,1);pointer-events:none}
.st-przewin i{position:relative;width:1.5px;height:38px;overflow:hidden;background:linear-gradient(rgba(255,255,255,0),rgba(255,255,255,.55))}
.st-przewin i::after{content:"";position:absolute;left:-1.5px;top:-12px;width:4.5px;height:12px;border-radius:3px;background:#22D3EE;animation:stKropla 1.9s cubic-bezier(.5,0,.5,1) infinite}
@keyframes stKropla{to{transform:translateY(54px)}}
.st-pod{position:absolute;z-index:3;left:max(28px,5vw);bottom:clamp(30px,6.5vh,70px);width:min(860px,64vw);transform:translateY(calc((1 - var(--v,0)) * 26px));opacity:var(--v,0)}
.st-pod h2{font-size:clamp(30px,2.9vw,48px);letter-spacing:-.035em;line-height:1.02;text-wrap:balance}
.st-pod p{margin-top:12px;max-width:66ch;font-size:clamp(17px,1.2vw,19px);line-height:1.55;color:rgba(255,255,255,.76)}
.st-final{position:absolute;z-index:4;top:50%;left:max(28px,5vw);width:min(560px,38vw);transform:translateY(calc(-50% + (1 - var(--v,0)) * 40px));opacity:var(--v,0)}
.st-final h2{font-size:clamp(40px,4.6vw,76px);letter-spacing:-.04em;line-height:.98}
.st-final .lead{margin-top:20px;color:rgba(255,255,255,.74)}
.st-pomin{position:absolute;z-index:5;right:max(20px,3vw);bottom:16px;display:flex;align-items:center;gap:6px;padding:6px 0;font-size:14px;font-weight:600;color:rgba(255,255,255,.6);text-decoration:none;opacity:var(--pm,0)}
.st-pomin:hover{color:#fff}
.st-pomin svg{width:15px;height:15px}

/* telefon pionowo: scena u góry, tekst na dole */
.st-kino.pion .st-cien,.st-kino.pion .st-cien-d{background:linear-gradient(0deg,rgba(3,4,11,.96) 0,rgba(3,4,11,.8) 34%,rgba(3,4,11,0) 55%)}
.st-kino.pion .st-cien-d{opacity:0}
.st-kino.pion .st-start{top:auto;bottom:20px;left:18px;right:18px;width:auto;transform:translateY(calc((1 - var(--h,1)) * -30px))}
.st-kino.pion .st-start h1{font-size:clamp(34px,9.4vw,44px)}
.st-kino.pion .st-start .lead{margin-top:14px;font-size:16px}
.st-kino.pion .st-cta{margin-top:20px;gap:12px 20px}
.st-kino.pion .st-cta .btn{font-size:16px;padding:14px 20px}
.st-kino.pion .st-pod{top:auto;bottom:22px;left:18px;right:18px;width:auto;transform:translateY(calc((1 - var(--v,0)) * 20px))}
.st-kino.pion .st-pod h2{font-size:30px}
.st-kino.pion .st-pod p{margin-top:10px;font-size:16px}
.st-kino.pion .st-final{top:auto;bottom:20px;left:18px;right:18px;width:auto;transform:translateY(calc((1 - var(--v,0)) * 20px))}
.st-kino.pion .st-final h2{font-size:36px}
.st-kino.pion .st-final .lead{font-size:16px}
.st-kino.pion .st-przewin{display:none}
.st-kino.pion .st-pomin{top:12px;bottom:auto}

/* bez ruchu: jeden ekran startowy */
.st-kino.statyczne .st-scena{position:relative;top:0}
.st-kino.statyczne .st-pod,.st-kino.statyczne .st-final,.st-kino.statyczne .st-pomin,.st-kino.statyczne .st-przewin{display:none}

/* Strona główna pod kinem: cała ciemna, w tym samym świetle co kino (body.noc nadpisuje jasne style z ok.css).
   Zrzuty jak świecące monitory, liczniki, wejścia sekcji (.rv z ok.js), ciemny formularz audytu i stopka. */
body.noc{background:#05060F;color:#fff}
body.noc .sec,body.noc .sec.dark,body.noc .sec.paper2{background:transparent;border:0;color:#fff}
body.noc .sec{position:relative;padding:clamp(70px,9vw,130px) 0}
body.noc #co-robimy{background:radial-gradient(55% 60% at 50% 100%,rgba(79,70,229,.16),transparent 70%)}
body.noc .proof{background:radial-gradient(60% 55% at 50% 30%,rgba(79,70,229,.22),transparent 70%),radial-gradient(30% 40% at 95% 90%,rgba(6,182,212,.1),transparent 70%)}
body.noc #audyt{background:radial-gradient(50% 70% at 90% 50%,rgba(79,70,229,.2),transparent 70%)}
body.noc .sec + .sec::before{content:"";position:absolute;left:50%;top:0;width:min(1200px,100% - 40px);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent)}
body.noc h2,body.noc h3,body.noc .num{color:#fff}
body.noc .lead{color:rgba(255,255,255,.72)}
body.noc .mute,body.noc .num small,body.noc .cap{color:rgba(255,255,255,.55)}
body.noc .cap b{color:#fff}
body.noc .link{color:#fff;border-color:#22D3EE}
body.noc .link:hover{color:#A5F3FC}
body.noc .btn.acc{box-shadow:0 0 0 1px rgba(255,255,255,.08),0 14px 40px -14px rgba(22,130,74,.9)}
/* wejścia */
body.noc .rv{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}
body.noc .rv.in{opacity:1;transform:none}
body.noc .sit > a.rv:nth-child(2),body.noc .g3 > .rv:nth-child(2),body.noc .apps > .rv:nth-child(2),body.noc .steps > .rv:nth-child(2),body.noc .works > .rv:nth-child(3n+2){transition-delay:.12s}
body.noc .sit > a.rv:nth-child(3),body.noc .g3 > .rv:nth-child(3),body.noc .apps > .rv:nth-child(3),body.noc .steps > .rv:nth-child(3),body.noc .works > .rv:nth-child(3n){transition-delay:.24s}
body.noc .sit > a.rv:nth-child(4){transition-delay:.36s}
@media (prefers-reduced-motion:reduce){body.noc .rv{opacity:1;transform:none;transition:none}}
/* co robimy */
body.noc .sit > a{border-top-color:rgba(255,255,255,.22);transition:border-color .3s}
body.noc .sit > a:hover{border-top-color:#22D3EE}
body.noc .sit p{color:rgba(255,255,255,.68)}
/* zrzuty jak monitory */
body.noc .shot{background:#0C0F22;box-shadow:0 0 0 1px rgba(255,255,255,.14),0 40px 90px -30px rgba(0,0,0,.95),0 0 90px -24px rgba(99,102,241,.45);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}
body.noc .shot.big{box-shadow:0 0 0 1px rgba(255,255,255,.16),0 70px 140px -40px rgba(0,0,0,.95),0 0 160px -30px rgba(99,102,241,.6)}
body.noc a.shot:hover,body.noc .proj:hover .shot{transform:translateY(-6px);box-shadow:0 0 0 1px rgba(255,255,255,.24),0 50px 100px -30px rgba(0,0,0,.95),0 0 120px -20px rgba(34,211,238,.45)}
body.noc .proof .nums{border-top-color:rgba(255,255,255,.14)}
body.noc .num{text-shadow:0 0 40px rgba(99,102,241,.35)}
/* programy */
body.noc .apps a{background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);transition:background .3s,box-shadow .3s,transform .5s cubic-bezier(.2,.8,.2,1)}
body.noc .apps a:hover{background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(34,211,238,.5),0 20px 50px -20px rgba(0,0,0,.8);transform:translateY(-4px)}
body.noc .apps small{color:rgba(255,255,255,.58)}
body.noc .apps img,body.noc .apps svg{box-shadow:0 10px 30px -10px rgba(0,0,0,.8)}
/* realizacje i kroki */
body.noc .proj p{color:rgba(255,255,255,.66)}
body.noc .steps .n{color:#22D3EE}
body.noc .steps p{color:rgba(255,255,255,.68)}
/* pytania */
body.noc .faq details{border-color:rgba(255,255,255,.14)}
body.noc .faq summary::after{color:#22D3EE}
body.noc .faq details p{color:rgba(255,255,255,.68)}
/* audyt: formularz na ciemnym szkle (pola i skrypt bez zmian) */
body.noc .audyt ul{color:rgba(255,255,255,.72)}
body.noc .audyt li{border-top-color:rgba(255,255,255,.12)}
body.noc .audyt form{background:rgba(255,255,255,.045);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 60px 120px -40px rgba(0,0,0,.9);backdrop-filter:blur(10px)}
body.noc .field label{color:rgba(255,255,255,.72)}
body.noc input,body.noc select,body.noc textarea{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#fff}
body.noc input::placeholder,body.noc textarea::placeholder{color:rgba(255,255,255,.35)}
body.noc input:focus,body.noc textarea:focus{border-color:#22D3EE;box-shadow:0 0 0 3px rgba(34,211,238,.18)}
/* stopka */
body.noc footer{background:#03040B;border-top-color:rgba(255,255,255,.1);color:rgba(255,255,255,.72)}
body.noc footer h4{color:rgba(255,255,255,.5)}
body.noc footer a:hover{color:#A5F3FC}
body.noc footer .bot{color:rgba(255,255,255,.45)}

/* numery w kolorach neonu, przejazd światła po zrzutach przy wjeździe, pochylenie dużego ekranu, kafle za myszą, ziarno */
body.noc .idx{display:block;margin-bottom:14px;font-size:clamp(34px,3.2vw,52px);font-weight:700;letter-spacing:-.04em;line-height:1;background:linear-gradient(90deg,#818CF8,#22D3EE);-webkit-background-clip:text;background-clip:text;color:transparent}
body.noc .shot{position:relative}
body.noc .shot::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.28) 50%,transparent 68%);transform:translateX(-130%)}
body.noc .rv.in .shot::after,body.noc .rv.in.shot::after{animation:stSweep 1.5s .3s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes stSweep{to{transform:translateX(130%)}}
body.noc .shot.big{transform-origin:50% 100%;will-change:transform}
body.noc .proj .shot,body.noc .apps a{transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s}
body.noc .proj:hover .shot{transform:perspective(1200px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-6px)}
body.noc .apps a:hover{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-4px)}
body.noc::after{content:"";position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.065;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@media (prefers-reduced-motion:reduce){body.noc .rv.in .shot::after,body.noc .rv.in.shot::after{animation:none}body.noc .shot.big{transform:none !important}}