/* Demo voicebota (/voicebot-demo/): style strony. */

/* Czcionka Outfit z serwera strony (Google Fonts blokuje Content-Security-Policy z vercel.json). */
@font-face{font-family:'Outfit';font-style:normal;font-weight:100 900;font-display:swap;src:url(../assets/fonts/outfit-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Outfit';font-style:normal;font-weight:100 900;font-display:swap;src:url(../assets/fonts/outfit-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

[hidden]{display:none!important}
body{margin:0;background:#F8FAFC}
*{box-sizing:border-box}
a{color:#0B1B2B}a:hover{color:#0A5CD6}
[id]{scroll-margin-top:90px}
input,select,textarea,button{font:inherit;color:inherit}
.vb-head{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.vb-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.vb-nosb{scrollbar-width:none}.vb-nosb::-webkit-scrollbar{display:none}
.vb-sticky{flex:0 1 460px;min-width:0;position:sticky;top:96px}
.vb-step{flex:0 0 33.3333%}
.vb-form{grid-template-columns:repeat(2,minmax(0,1fr))}

.hs-panel{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.hs-item{animation-duration:12s;animation-timing-function:ease;animation-iteration-count:infinite}
.hs-1{animation-name:hS1}.hs-2{animation-name:hS2}.hs-3{animation-name:hS3}.hs-4{animation-name:hS4}.hs-5{animation-name:hS5}.hs-6{animation-name:hS6}
@keyframes hS1{0%,2.5%{opacity:0;transform:translateY(10px)}5.8%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
@keyframes hS2{0%,14.2%{opacity:0;transform:translateY(10px)}17.5%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
@keyframes hS3{0%,25.8%{opacity:0;transform:translateY(10px)}29.2%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
@keyframes hS4{0%,37.5%{opacity:0;transform:translateY(10px)}40.8%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
@keyframes hS5{0%,49.2%{opacity:0;transform:translateY(10px)}52.5%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
@keyframes hS6{0%,60.8%{opacity:0;transform:translateY(10px)}64.2%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
.hs-line{transform-origin:top center;animation:hLine 12s linear infinite}
@keyframes hLine{0%,5%{transform:scaleY(0);opacity:1}52.5%,90%{transform:scaleY(1);opacity:1}95%,100%{transform:scaleY(1);opacity:0}}
.hs-ring{opacity:0;animation:hRing 12s ease-out infinite}
@keyframes hRing{0%,3%{opacity:0;transform:scale(1)}4%{opacity:.8;transform:scale(1)}9%{opacity:0;transform:scale(1.8)}9.1%{opacity:.8;transform:scale(1)}14%,100%{opacity:0;transform:scale(1.8)}}
.hs-wave{display:flex;align-items:center;gap:2px;height:16px}
.hs-wave i{display:block;width:3px;height:16px;border-radius:2px;background:currentColor;animation:vbWv 1s ease-in-out infinite}
.hs-wave i:nth-child(2){animation-delay:.15s}.hs-wave i:nth-child(3){animation-delay:.3s}.hs-wave i:nth-child(4){animation-delay:.45s}
.vb-live{animation:vbPulse 1.4s ease-in-out infinite}
@keyframes vbPulse{0%,100%{opacity:1}50%{opacity:.3}}
.vb-wheel{animation:vbWheel 1.8s ease-in-out infinite}
@keyframes vbWheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(4px);opacity:0}100%{transform:translateY(0);opacity:0}}

.vb-wrap{position:relative;width:280px;height:560px;margin:0 auto}
.vb-attract{animation:vbLoop 20s linear infinite}
@keyframes vbLoop{0%{opacity:1}100%{opacity:1}}
.vb-phone{position:absolute;inset:0;background:#FFFFFF;border-radius:40px;overflow:hidden;box-shadow:0 0 0 7px rgba(255,255,255,.7),0 0 0 8px rgba(10,92,214,.12),0 40px 80px -30px rgba(10,92,214,.55),0 0 70px rgba(120,195,255,.5)}
.vb-speaker{position:absolute;top:14px;left:50%;width:60px;height:6px;margin-left:-30px;border-radius:3px;background:#E3E9EF}
.vb-scr{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;transition:opacity .45s ease,transform .45s ease}
.vb-call,.vb-sum{opacity:0}
.vb-sum{transform:translateY(14px)}
.vb-demo .vb-scr{pointer-events:none}
.vb-demo .vb-dial{opacity:0}
.vb-demo .vb-scr.on{opacity:1;transform:none;pointer-events:auto}
.vb-attract .vb-dial{animation:aDial 20s infinite}
.vb-attract .vb-call{animation:aCall 20s infinite}
.vb-attract .vb-sum{animation:aSum 20s infinite}
@keyframes aDial{0%,18%{opacity:1}20%,97%{opacity:0}99%,100%{opacity:1}}
@keyframes aCall{0%,18%{opacity:0}20%,85.5%{opacity:1}87.5%,100%{opacity:0}}
@keyframes aSum{0%,85.5%{opacity:0;transform:translateY(14px)}87.5%,96%{opacity:1;transform:none}98%,100%{opacity:0;transform:none}}
.vb-num{height:40px;display:flex;align-items:center;justify-content:center;font-size:30px;font-weight:400;color:#0B1B2B;letter-spacing:.02em}
.vb-dg{display:inline-block;opacity:0}
.vb-gap{display:inline-block;width:10px}
.vb-attract .vb-dg{animation:aDig 20s infinite}
@keyframes aDig{0%,3.9%{opacity:0}4%,50%{opacity:1}50.1%,100%{opacity:0}}
.vb-demo .vb-dg.on{opacity:1}
.vb-keys{display:grid;grid-template-columns:repeat(3,60px);gap:12px 20px;justify-content:center}
.vb-key{width:60px;height:60px;border-radius:50%;background:#F1F4F7;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;transition:background-color .15s,transform .15s}
.vb-key b{font-weight:400;font-size:25px;color:#0B1B2B}
.vb-key small{display:block;height:9px;margin-top:3px;font-size:8px;letter-spacing:.14em;color:#5B6B7B}
.vb-attract .vb-key.pk{animation:aKey 20s infinite}
@keyframes aKey{0%,3.9%{background-color:#F1F4F7;transform:none}4%,5%{background-color:#C6D2DE;transform:scale(.92)}5.8%,100%{background-color:#F1F4F7;transform:none}}
.vb-demo .vb-key.on{background-color:#C6D2DE;transform:scale(.92)}
.vb-green,.vb-red{width:64px;height:64px;border-radius:50%;border:0;padding:0;display:flex;align-items:center;justify-content:center;color:#FFFFFF;transition:transform .15s,filter .15s}
.vb-green{background:#16A34A}.vb-red{background:#DC2626}
button.vb-red{cursor:pointer}
.vb-attract .vb-green{animation:aGreen 20s infinite}
@keyframes aGreen{0%,16.4%{transform:none;filter:none}16.5%,17.8%{transform:scale(.88);filter:brightness(.88)}18%,100%{transform:none;filter:none}}
.vb-demo .vb-green.on{transform:scale(.88);filter:brightness(.88)}
.vb-attract .vb-red{animation:aRed 20s infinite}
@keyframes aRed{0%,82.9%{transform:none;filter:none}83%,84.4%{transform:scale(.88);filter:brightness(.88)}84.5%,100%{transform:none;filter:none}}
.vb-av{position:relative;width:92px;height:92px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#FFFFFF}
.vb-rings{position:absolute;inset:0;opacity:0;transition:opacity .3s}
.vb-rings span{position:absolute;inset:0;border-radius:50%;border:2px solid currentColor;animation:vbAvRing 1.6s ease-out infinite}
.vb-rings span:nth-child(2){animation-delay:.8s}
@keyframes vbAvRing{0%{transform:scale(1);opacity:.75}100%{transform:scale(1.75);opacity:0}}
.vb-attract .vb-rings{animation:aRings 20s infinite}
@keyframes aRings{0%,19.9%{opacity:0}20%,27.5%{opacity:1}28.5%,100%{opacity:0}}
.vb-demo .vb-rings.on{opacity:1}
.vb-st{position:relative;width:100%;height:20px;margin-top:4px;font-size:14px;color:#5E7083;text-align:center}
.vb-st span{position:absolute;left:0;right:0;top:0}
.vb-st .sa{opacity:0}
.vb-attract .vb-st .sd{display:none}
.vb-demo .vb-st .sa{display:none}
.vb-attract .vb-st .sa1{animation:aSt1 20s infinite}
.vb-attract .vb-st .sa2{animation:aSt2 20s infinite}
.vb-attract .vb-st .sa3{animation:aSt3 20s infinite}
@keyframes aSt1{0%,19.9%{opacity:0}20%,27.9%{opacity:1}28%,100%{opacity:0}}
@keyframes aSt2{0%,27.9%{opacity:0}28%,82.9%{opacity:1}83%,100%{opacity:0}}
@keyframes aSt3{0%,82.9%{opacity:0}83%,100%{opacity:1}}
.vb-ctl{display:grid;grid-template-columns:repeat(3,62px);gap:14px 18px;justify-content:center}
.vb-ctl span{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;color:#5E7083}
.vb-ctl i{width:54px;height:54px;border-radius:50%;background:#F1F4F7;display:flex;align-items:center;justify-content:center;color:#3D5166}
.vb-card{position:absolute;top:250px;width:232px;z-index:4;padding:12px 14px 14px;border-radius:18px;opacity:0;transform:translateY(36px);transition:opacity .45s ease,transform .45s ease;box-shadow:0 18px 40px -18px rgba(11,27,43,.4)}
.vb-card.l{left:-122px;background:#FFFFFF;color:#0B1B2B;border:1px solid #E1EAF2}
.vb-card.r{right:-122px;color:#FFFFFF}
.vb-attract .vb-card.c0{animation:aC0 20s infinite}
.vb-attract .vb-card.c1{animation:aC1 20s infinite}
.vb-attract .vb-card.c2{animation:aC2 20s infinite}
.vb-attract .vb-card.c3{animation:aC3 20s infinite}
@keyframes aC0{0%,29%{opacity:0;transform:translateY(36px)}31%,42.5%{opacity:1;transform:none}44.5%,56%{opacity:.5;transform:translateY(-76px)}58%,100%{opacity:0;transform:translateY(-150px)}}
@keyframes aC1{0%,42.5%{opacity:0;transform:translateY(36px)}44.5%,56%{opacity:1;transform:none}58%,69.5%{opacity:.5;transform:translateY(-76px)}71.5%,100%{opacity:0;transform:translateY(-150px)}}
@keyframes aC2{0%,56%{opacity:0;transform:translateY(36px)}58%,69.5%{opacity:1;transform:none}71.5%,83%{opacity:.5;transform:translateY(-76px)}85%,100%{opacity:0;transform:translateY(-150px)}}
@keyframes aC3{0%,69.5%{opacity:0;transform:translateY(36px)}71.5%,83%{opacity:1;transform:none}85%,100%{opacity:0;transform:translateY(-24px)}}
.vb-demo .vb-card.st-hide,.vb-demo .vb-card.st-enter{transition:none;opacity:0;transform:translateY(36px)}
.vb-demo .vb-card.st-cur{opacity:1;transform:none}
.vb-demo .vb-card.st-prev{opacity:.5;transform:translateY(-76px)}
.vb-demo .vb-card.st-gone{opacity:0;transform:translateY(-150px)}
.vb-wave{display:flex;align-items:center;gap:3px;height:26px;margin:8px 0 6px}
.vb-wave i{display:block;width:3px;border-radius:2px;background:currentColor;opacity:.6;animation:vbWv 1.1s ease-in-out infinite}
.vb-wave i:nth-child(3n){animation-delay:.2s}.vb-wave i:nth-child(3n+1){animation-delay:.45s}.vb-wave i:nth-child(4n){animation-delay:.7s}
@keyframes vbWv{0%,100%{transform:scaleY(.45)}50%{transform:scaleY(1)}}
.vb-overlay{position:absolute;inset:0;z-index:6;border:0;padding:0;background:transparent;border-radius:40px;cursor:pointer;transition:box-shadow .2s}
.vb-overlay:hover{box-shadow:0 0 0 4px rgba(10,92,214,.35)}
.vb-overlay:focus-visible{outline:3px solid #0A5CD6;outline-offset:8px}

/* Przyciski wyboru branży pod telefonem */
.vb-pill{min-height:44px;padding:10px 16px;border-radius:999px;border:1px solid #C3D4E3;background:#FFFFFF;color:#0B1B2B;font-size:14px;font-weight:400;cursor:pointer}
.vb-pill.on{border-color:#0B1B2B;background:#0B1B2B;color:#FFFFFF;font-weight:500}
.vb-voice-state{display:inline-flex;align-items:center;gap:8px}

.vb-field{display:flex;flex-direction:column;gap:8px;padding:18px 0 8px;border-top:1px solid #D6E0EA;font-size:14px;font-weight:500;color:#0B1B2B}
.vb-field input,.vb-field select,.vb-field textarea{width:100%;border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;padding:6px 0 10px;font-size:17px;font-weight:400;color:#0B1B2B;outline:none}
.vb-field input:focus,.vb-field select:focus,.vb-field textarea:focus{border-bottom-color:#0A5CD6}
.vb-field input::placeholder,.vb-field textarea::placeholder{color:#5E7083}
.vb-err{grid-column:1 / -1;font-size:14px;font-weight:600;color:#B42318}
.vb-err:not(:empty){margin-top:18px}
.vb-form button[type="submit"]:disabled{opacity:.6;cursor:default}
.vb-done{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:44px;padding:40px 24px;border-radius:24px;background:#EAF6FF;text-align:center}
.vb-done h3{margin:0;font-size:28px;font-weight:500;color:#0B1B2B}
.vb-done p{margin:0;font-size:17px;line-height:1.55;color:#4A5D70}

@media (max-width: 960px){.vb-sticky{position:static;order:-1;flex:1 1 100%}}
@media (max-width: 900px){.vb-step{flex-basis:50%}}
@media (max-width: 700px){.vb-card{width:196px}.vb-card.l{left:-10px}.vb-card.r{right:-10px}.vb-form{grid-template-columns:minmax(0,1fr)}.vb-step{flex-basis:86%}}
@media (prefers-reduced-motion: reduce){.vb-attract,.vb-attract *,.hs-item,.hs-line,.hs-ring,.hs-wave i,.vb-live,.vb-wheel,.vb-wave i,.vb-rings span{animation:none!important}}

/* Okno zgody cookies z assets/consent.js. Style skopiowane z assets/site.css, żeby okno wyglądało tak samo jak na reszcie strony. */
.agc-backdrop{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(5,8,10,.72);font-family:'Manrope',sans-serif}
.agc{box-sizing:border-box;width:100%;max-width:560px;max-height:calc(100vh - 40px);overflow:auto;display:flex;flex-direction:column;gap:20px;padding:clamp(24px,4vw,36px);border-radius:20px;background:#121A21;color:#EEF2F6;border:1px solid #2E3B47;box-shadow:0 30px 80px rgba(0,0,0,.5);font-size:15px;line-height:1.6}
.agc h2{margin:0;font-size:26px;font-weight:600;letter-spacing:-.01em;line-height:1.2}
.agc p{margin:0;color:#C8D1DA;text-wrap:pretty}
.agc p a{text-decoration:underline}
.agc a{color:inherit}.agc a:hover{color:#3B82F6}
.agc-list{display:flex;flex-direction:column}
.agc-row{display:flex;gap:20px;align-items:flex-start;justify-content:space-between;padding:16px 0;border-top:1px solid #1F2A33;cursor:pointer}
.agc-row strong{display:block;font-weight:600}
.agc-row span{display:block;color:#9AA8B6;font-size:14px;text-wrap:pretty}
.agc-sw{appearance:none;-webkit-appearance:none;flex:none;margin:2px 0 0;width:44px;height:26px;border-radius:999px;background:#2E3B47;position:relative;cursor:pointer;transition:background .2s}
.agc-sw::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#EEF2F6;transition:transform .2s}
.agc-sw:checked{background:#3B82F6}
.agc-sw:checked::after{transform:translateX(18px)}
.agc-sw:disabled{opacity:.5;cursor:not-allowed}
.agc-btns{display:flex;flex-wrap:wrap;gap:10px}
.agc-btn{flex:1 1 160px;padding:13px 18px;border-radius:999px;border:1px solid #EEF2F6;background:#EEF2F6;color:#0C1013;font-weight:600;font-size:15px;cursor:pointer;transition:background .2s}
.agc-btn:hover{background:#FFFFFF}
.agc-ghost{flex:1 1 100%;padding:8px;border:0;background:none;color:#9AA8B6;font-weight:600;font-size:15px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.agc-ghost:hover{color:#EEF2F6}
.agc-link{padding:0;border:0;background:none;font:inherit;color:inherit;cursor:pointer;text-align:left;transition:color .2s}
.agc-link:hover{color:#3B82F6}
.agc-backdrop :focus-visible,footer .agc-link:focus-visible{outline:2px solid #3B82F6;outline-offset:3px}
/* Przycisk "Ustawienia cookies", który consent.js wstawia w stopce obok polityki prywatności */
footer .agc-link{color:#E6EDF4;text-decoration:underline}