/* UNIVERSY — redesign 2026-09-24 (kompilacja z projektu canvas) */
html{scroll-behavior:smooth;scroll-padding-top:88px;-webkit-text-size-adjust:100%}
body{margin:0;background:#05070e;color:#05070e;font-family:'Titillium Web',system-ui,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
*,*::before,*::after{box-sizing:border-box}
h1,h2,h3,h4,p,ul,ol,figure,blockquote{margin:0;padding:0}
ul,ol{list-style:none}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
a{color:#2e54c4;text-decoration:none}
a:hover{color:#4a7bf7}
::selection{background:#4a7bf7;color:#fff}
summary{list-style:none}summary::-webkit-details-marker{display:none}
input::placeholder{color:rgba(255,255,255,.38)}
@keyframes uvReveal{from{opacity:0;transform:translateY(44px)}to{opacity:1;transform:none}}
@keyframes uvMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes uvPulse{0%{box-shadow:0 0 0 0 rgba(74,123,247,.75)}70%{box-shadow:0 0 0 10px rgba(74,123,247,0)}100%{box-shadow:0 0 0 0 rgba(74,123,247,0)}}
@keyframes uvFade{from{opacity:0}to{opacity:1}}
@keyframes uvRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes m3dSpin{from{transform:rotateX(-24deg) rotateY(0deg)}to{transform:rotateX(-24deg) rotateY(360deg)}}
@keyframes m3dCounter{from{transform:rotateY(0deg) rotateX(24deg)}to{transform:rotateY(-360deg) rotateX(24deg)}}

/* wejścia sekcji przy przewijaniu — stan początkowy nakłada runtime (uv-app.js),
   więc bez JS treść zostaje widoczna; klasę uv-in dokłada obserwator */
html.uv-js .uv-reveal{opacity:0;transform:translateY(44px);transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)}
html.uv-js .uv-rise{opacity:0;transform:translateY(16px);transition:opacity .45s cubic-bezier(.22,.61,.36,1),transform .45s cubic-bezier(.22,.61,.36,1)}
html.uv-js .uv-reveal.uv-in,html.uv-js .uv-rise.uv-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html.uv-js .uv-reveal,html.uv-js .uv-rise{opacity:1;transform:none;transition:none}}
@media print{html.uv-js .uv-reveal,html.uv-js .uv-rise{opacity:1 !important;transform:none !important}}

/* hover/focus z projektu */
.scp0:hover { color: rgb(139, 176, 255) !important; }
.scp1:hover { color: rgb(255, 255, 255) !important; }
.scp2:hover { background: rgb(139, 176, 255) !important; color: rgb(5, 7, 14) !important; }
.scp3:hover { background: rgb(227, 234, 255) !important; color: rgb(5, 7, 14) !important; transform: translateY(-2px) !important; }
.scp4:hover { background: rgba(255, 255, 255, 0.08) !important; color: rgb(255, 255, 255) !important; }
.scp5:hover { background: rgba(74, 123, 247, 0.1) !important; border-color: rgba(139, 176, 255, 0.35) !important; color: rgb(255, 255, 255) !important; }
.scp6:hover { background: rgba(74, 123, 247, 0.1) !important; color: rgb(255, 255, 255) !important; }
.scp7:hover { animation-play-state: paused !important; }
.scp8:hover { filter: none !important; opacity: 1 !important; }
.scp9:hover { background: rgb(46, 84, 196) !important; color: rgb(255, 255, 255) !important; transform: translateY(-2px) !important; }
.scpa:hover { background: rgb(255, 255, 255) !important; }
.scpb:hover { transform: translateY(-3px) !important; color: rgb(255, 255, 255) !important; box-shadow: rgba(74, 123, 247, 0.7) 0px 50px 90px -50px !important; }
.scpc:hover { background: rgb(46, 84, 196) !important; }
.scpd:hover { transform: translateY(-2px) !important; color: rgb(255, 255, 255) !important; }
.scpe:hover { color: rgb(46, 84, 196) !important; }
.scpf:focus { border-color: rgb(74, 123, 247) !important; background: rgba(74, 123, 247, 0.08) !important; }
.scpg:hover { background: rgb(139, 176, 255) !important; }
.scph:hover { color: rgb(74, 123, 247) !important; }
.scpi:hover { background: rgb(238, 237, 231) !important; }
.scpj:hover { background: rgb(46, 84, 196) !important; color: rgb(255, 255, 255) !important; }

/* responsywność — breakpointy z projektu */
@media (max-width:1199.98px){ .uvif-showLinks{display:none !important} }
@media (max-width:1399.98px){ .uvif-wide{display:none !important} }
@media (max-width:559.98px){ .uvif-navCta{display:none !important} }
@media (min-width:1200px){ .uvif-narrow{display:none !important} }
@media (min-width:900px){ .uvif-mobile{display:none !important} }
@media (max-width:999.98px){
[data-uvb="0"]{padding-top:0px !important}
[data-uvb="1"]{padding-top:0px !important}
}
@media (max-width:899.98px){
[data-uvb="0"]{padding-top:0px !important}
[data-uvb="1"]{padding-top:0px !important}
[data-uvb="2"]{max-width:100% !important;flex-direction:row !important;overflow-x:auto !important;position:static !important}
[data-uvb="3"]{max-width:260px !important}
[data-uvb="4"]{max-width:260px !important}
[data-uvb="5"]{max-width:260px !important}
[data-uvb="6"]{max-width:260px !important}
[data-uvb="7"]{max-width:260px !important}
[data-uvb="8"]{max-width:260px !important}
[data-uvb="9"]{padding-bottom:104px !important}
[data-uvb="10"]{bottom:84px !important}
}

/* @inline2class:begin shell — skóra: nagłówek, menu, stopka, pasek kontaktowy.
   Klasy z dawnych stylów inline (tools/uv_inline2class.py): jedna klasa = jeden dawny atrybut style,
   selektor z identyfikatorem korzenia przebija zwykłe reguły jak styl inline, !important nadal wygrywa. */
#uv-home .us-1,#uv-page .us-1{position: fixed; top: 0px; left: 0px; right: 0px; z-index: 60; background: rgba(5, 7, 14, 0.82); backdrop-filter: blur(18px) saturate(150%); border-bottom: 1px solid rgba(255, 255, 255, 0.08)}
#uv-home .us-2,#uv-page .us-2{max-width: 1440px; margin: 0px auto; padding: 0px clamp(20px, 4vw, 56px); height: 72px; display: flex; align-items: center; gap: 28px}
#uv-home .us-3,#uv-page .us-3{flex: 0 0 auto; display: flex; color: rgb(255, 255, 255)}
#uv-home .us-4,#uv-page .us-4{height: 17px; width: auto; display: block}
#uv-home .us-5,#uv-page .us-5{display:contents}
#uv-home .us-6,#uv-page .us-6{flex: 1 1 auto; min-width: 0px; height: 24px; overflow: hidden; display: flex; flex-wrap: wrap; justify-content: center; gap: 0px 22px; font: 600 12px / 24px "Titillium Web", sans-serif; letter-spacing: 0.08em; text-transform: uppercase}
#uv-home .us-7,#uv-page .us-7{color: rgba(255, 255, 255, 0.7)}
#uv-home .us-8,#uv-page .us-8{margin-left: auto; flex: 0 0 auto; display: flex; align-items: center; gap: 18px}
#uv-home .us-9,#uv-page .us-9{display: flex; align-items: center; gap: 9px; font: 600 13px / 1 "Titillium Web", sans-serif; color: rgb(255, 255, 255)}
#uv-home .us-10,#uv-page .us-10{width: 7px; height: 7px; border-radius: 50%; background: rgb(74, 123, 247); animation: 2.4s ease 0s infinite normal none running uvPulse}
#uv-home .us-11,#uv-page .us-11{display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0px 18px; border-radius: 9px; background: rgb(74, 123, 247); color: rgb(5, 7, 14); font: 600 12.5px / 1 "Titillium Web", sans-serif; letter-spacing: 0.1em; text-transform: uppercase; transition: background 0.3s}
#uv-home .us-12,#uv-page .us-12{display: flex; align-items: center; gap: 10px; height: 44px; padding: 0px 14px; border-radius: 9px; border: 1px solid rgba(255, 255, 255, 0.22); background: transparent; color: rgb(255, 255, 255); font: 600 12.5px / 1 "Titillium Web", sans-serif; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer}
#uv-home .us-13,#uv-page .us-13{display: flex; flex-direction: column; gap: 4px}
#uv-home .us-14,#uv-page .us-14{width: 16px; height: 1.5px; background: rgb(255, 255, 255)}
#uv-home .us-15,#uv-page .us-15{position: absolute; left: 0px; right: 0px; bottom: -1px; height: 2px; background: rgb(74, 123, 247); transform-origin: 0px 50%; transform: scaleX(0)}
#uv-home .us-16,#uv-page .us-16{display:none}
#uv-home .us-17,#uv-page .us-17{position: fixed; inset: 72px 0px 0px; z-index: 59; overflow-y: auto; background: rgb(5, 7, 14); color: rgb(255, 255, 255); padding: 12px clamp(20px, 4vw, 56px) 120px; animation: 0.25s ease 0s 1 normal both running uvFade}
#uv-home .us-18,#uv-page .us-18{display: flex; flex-direction: column}
#uv-home .us-19,#uv-page .us-19{display: flex; align-items: baseline; gap: 16px; padding: 18px 0px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); color: rgb(255, 255, 255); font: 700 30px / 1 "Titillium Web", sans-serif; letter-spacing: -0.02em}
#uv-home .us-20,#uv-page .us-20{font: 600 12px / 1 "Titillium Web", sans-serif; color: rgb(74, 123, 247)}
#uv-home .us-21,#uv-page .us-21{display: flex; flex-direction: column; gap: 12px; margin-top: 32px}
#uv-home .us-22,#uv-page .us-22{display: flex; align-items: center; justify-content: center; height: 60px; border-radius: 9px; background: rgb(255, 255, 255); color: rgb(5, 7, 14); font: 600 14px / 1 "Titillium Web", sans-serif; letter-spacing: 0.1em; text-transform: uppercase}
#uv-home .us-23,#uv-page .us-23{display: flex; align-items: center; justify-content: center; height: 60px; border-radius: 9px; border: 1px solid rgba(255, 255, 255, 0.22); color: rgb(255, 255, 255); font: 600 14px / 1 "Titillium Web", sans-serif; letter-spacing: 0.1em; text-transform: uppercase}
#uv-home .us-24,#uv-page .us-24{background: rgb(5, 7, 14); color: rgb(255, 255, 255); overflow: hidden; padding-bottom: 32px}
#uv-home .us-25,#uv-page .us-25{max-width: 1440px; margin: 0px auto; padding: 0px clamp(20px, 4vw, 56px)}
#uv-home .us-26,#uv-page .us-26{display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 40px; padding: clamp(48px, 5vw, 72px) 0px; border-top: 1px solid rgba(255, 255, 255, 0.1)}
#uv-home .us-27,#uv-page .us-27{font-size: 16px; line-height: 1.6; color: rgba(255, 255, 255, 0.72); max-width: 36ch}
#uv-home .us-28,#uv-page .us-28{margin-top: 20px; font: 600 12px / 1.9 "Titillium Web", sans-serif; letter-spacing: 0.04em; color: rgba(255, 255, 255, 0.5)}
#uv-home .us-29,#uv-page .us-29{font: 600 11px / 1 "Titillium Web", sans-serif; letter-spacing: 0.12em; text-transform: uppercase; color: rgb(139, 176, 255)}
#uv-home .us-30,#uv-page .us-30{margin-top: 18px; display: flex; flex-direction: column; gap: 10px; font-size: 17px}
#uv-home .us-31,#uv-page .us-31{color: rgb(255, 255, 255)}
#uv-home .us-32,#uv-page .us-32{font-size: 15px; line-height: 1.5; color: rgba(255, 255, 255, 0.6)}
#uv-home .us-33,#uv-page .us-33{margin-top: 18px; display: flex; flex-direction: column; gap: 10px; font-size: 16px}
#uv-home .us-34,#uv-page .us-34{color: rgba(255, 255, 255, 0.75)}
#uv-home .us-35,#uv-page .us-35{margin-top: 18px; font-size: 16px; line-height: 1.6; color: rgba(255, 255, 255, 0.72)}
#uv-home .us-36,#uv-page .us-36{color: rgb(255, 255, 255); font-weight: 600}
#uv-home .us-37,#uv-page .us-37{display: block; color: rgb(27, 44, 95); transition: color 0.5s}
#uv-home .us-38,#uv-page .us-38{display: block; width: 100%; height: auto}
#uv-home .us-39,#uv-page .us-39{display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; margin-top: 28px; padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, 0.1); font: 600 12px / 1.5 "Titillium Web", sans-serif; letter-spacing: 0.04em; color: rgba(255, 255, 255, 0.5)}
#uv-home .us-40,#uv-page .us-40{color: rgba(255, 255, 255, 0.62)}
#uv-home .us-41,#uv-page .us-41{position: fixed; left: clamp(12px, 2vw, 24px); bottom: 24px; z-index: 55; width: min(380px, -24px + 100vw); padding: 22px; border-radius: 16px; background: rgb(255, 255, 255); color: rgb(5, 7, 14); border: 1px solid rgba(10, 14, 28, 0.1); box-shadow: rgba(5, 7, 14, 0.5) 0px 30px 80px -20px; animation: 0.45s ease 0s 1 normal both running uvRise}
#uv-home .us-42,#uv-page .us-42{position: absolute; top: 12px; right: 12px; width: 32px; height: 32px; border-radius: 8px; border: 0px; background: rgb(246, 245, 241); color: rgb(5, 7, 14); font-size: 18px; line-height: 1; cursor: pointer}
#uv-home .us-43,#uv-page .us-43{padding-right: 40px; font: 600 11px / 1.45 "Titillium Web", sans-serif; letter-spacing: 0.1em; text-transform: uppercase; color: rgb(46, 84, 196)}
#uv-home .us-44,#uv-page .us-44{margin-top: 12px; font: 700 22px / 1.15 "Titillium Web", sans-serif; letter-spacing: -0.02em}
#uv-home .us-45,#uv-page .us-45{color: rgb(74, 123, 247)}
#uv-home .us-46,#uv-page .us-46{margin-top: 10px; font-size: 15px; line-height: 1.5; color: rgb(74, 85, 104)}
#uv-home .us-47,#uv-page .us-47{margin-top: 16px; display: inline-flex; align-items: center; gap: 12px; height: 46px; padding: 0px 8px 0px 18px; border-radius: 9px; background: rgb(5, 7, 14); color: rgb(255, 255, 255); font: 600 12.5px / 1 "Titillium Web", sans-serif; letter-spacing: 0.1em; text-transform: uppercase; transition: background 0.3s}
#uv-home .us-48,#uv-page .us-48{display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 6px; background: rgb(74, 123, 247); color: rgb(255, 255, 255)}
#uv-home .us-49,#uv-page .us-49{position: fixed; left: 0px; right: 0px; bottom: 0px; z-index: 56; display: flex; gap: 8px; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: rgba(5, 7, 14, 0.92); backdrop-filter: blur(14px); border-top: 1px solid rgba(255, 255, 255, 0.1)}
#uv-home .us-50,#uv-page .us-50{flex: 1 1 0%; display: flex; align-items: center; justify-content: center; height: 52px; border-radius: 9px; background: rgb(255, 255, 255); color: rgb(5, 7, 14); font: 600 13px / 1 "Titillium Web", sans-serif; letter-spacing: 0.08em; text-transform: uppercase}
#uv-home .us-51,#uv-page .us-51{flex: 1.4 1 0%; display: flex; align-items: center; justify-content: center; gap: 10px; height: 52px; border-radius: 9px; background: rgb(74, 123, 247); color: rgb(5, 7, 14); font: 600 13px / 1 "Titillium Web", sans-serif; letter-spacing: 0.08em; text-transform: uppercase}
/* @inline2class:end shell */

/* Ręczne poprawki skóry — poza sekcją narzędzia, więc jego przebieg ich nie rusza.
   2026-10-15 (decyzja człowieka): na telefonie zajawka cennika to wąski pasek nad paskiem kontaktowym, a nie karta
   280 px nad treścią. Uchwyty uv-toast* są w znacznikach zajawki w uv_shell_footer(). */
@media (max-width:899.98px){
#uv-home .uv-toast{padding:8px;border-radius:12px}
#uv-home .uv-toast-text{display:none}
#uv-home .uv-toast-cta{margin-top:0;display:flex;width:calc(100% - 44px);justify-content:space-between}
#uv-home .uv-toast-close{top:50%;right:8px;margin-top:-16px}
}