:root{--bg:#f7f3ea;--ink:#1d1a17;--mut:#5f5a52;--line:#cfc8b8;--c:#0b4f94;--m:#e5565f;--y:#f7941d;color-scheme:light;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);box-sizing:border-box}

*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:17px/1.6 "Space Grotesk",system-ui,sans-serif;overflow-x:hidden}
h1,h2,.big{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-weight:800;line-height:.95;letter-spacing:-.03em}
a{color:inherit;text-decoration:none}
.w{max-width:1280px;margin:auto;padding:0 24px}
.top{position:fixed;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:30;display:flex;justify-content:space-between;align-items:center;padding:16px 24px;mix-blend-mode:normal}
.logo{font:800 1.4rem "Bricolage Grotesque",sans-serif;background:var(--bg);padding:4px 12px;border:2px solid var(--line);border-radius:10px}
.logo i{font-style:normal;color:var(--m)}
.mbtn{font:500 .95rem "Space Grotesk";background:var(--m);color:#fff;border:0;border-radius:999px;padding:12px 22px;cursor:pointer}
.ov{position:fixed;inset:0;z-index:25;background:var(--m);color:#fff;display:flex;flex-direction:column;justify-content:center;padding:90px 24px 40px;transform:translateY(-100%);transition:transform .5s cubic-bezier(.7,0,.2,1)}
.ov.open{transform:none}
.ov a{font:800 clamp(2rem,7vw,4.5rem)/1.05 "Bricolage Grotesque",sans-serif;display:block;transition:transform .2s}
.ov a:hover{transform:translateX(14px);color:var(--y)}
.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:110px 0 40px;position:relative;overflow:hidden;background:radial-gradient(circle at 78% 90%,rgba(255,212,0,.45),transparent 38%)}.hero .w{position:relative;z-index:1}
.hero::before,.hero::after{content:"";position:absolute;pointer-events:none;border-radius:50%;filter:blur(70px);mix-blend-mode:multiply}
.hero::before{width:46vmax;height:46vmax;right:-10vmax;top:-12vmax;background:var(--c);opacity:.45;animation:fl1 14s ease-in-out infinite alternate;transform:translate(calc(var(--px,0)*36px),calc(var(--py,0)*36px))}
.hero::after{width:36vmax;height:36vmax;left:-12vmax;bottom:-14vmax;background:var(--m);opacity:.32;animation:fl2 18s ease-in-out infinite alternate;transform:translate(calc(var(--px,0)*-30px),calc(var(--py,0)*-30px))}
@keyframes fl1{to{translate:-8vmax 10vmax}}@keyframes fl2{to{translate:10vmax -8vmax}}
.big{font-size:clamp(3.2rem,13vw,11.5rem);text-transform:uppercase}
.big span{display:inline-block;padding:0 .12em;margin-left:-.06em;transition:transform .3s}
.big span:hover{transform:rotate(-2deg) scale(1.02)}
.hc{background:var(--c);color:#06202b}.hm{background:var(--m);color:#fff}.hy{background:var(--y);color:#2b2300}
.sub{max-width:34ch;margin-top:28px;font-size:1.25rem;color:var(--mut);animation:up .8s 3s both}
@keyframes up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.big i{font-style:normal;position:relative;display:inline-block}
.big i span{animation:rev 1s var(--d) cubic-bezier(.65,0,.25,1) both}
@keyframes rev{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.ph{position:absolute;top:-8%;bottom:-8%;left:0;width:12px;border-radius:4px;background:var(--ink);animation:swp 1s var(--d) cubic-bezier(.65,0,.25,1) both;pointer-events:none}
.ph::before{content:"";position:absolute;left:-7px;right:-7px;top:-10px;height:12px;border-radius:4px;background:var(--m)}
@keyframes swp{0%{left:0;opacity:1}99%{opacity:1}100%{left:calc(100% - 12px);opacity:0}}
.stk{position:absolute;right:6vw;top:26%;width:170px;height:170px;animation:sp 20s linear infinite;z-index:1}
.reg{position:absolute;right:24px;bottom:60px;width:84px;height:84px;opacity:.55;animation:sp 24s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.tick{border-block:2px solid var(--line);overflow:hidden;white-space:nowrap;background:var(--y);color:#14110f;padding:14px 0}
.tick div{display:inline-block;animation:mq 30s linear infinite;font:800 1.5rem "Bricolage Grotesque",sans-serif;text-transform:uppercase}
.tick span{margin:0 22px}.tick b{color:var(--m)}
@keyframes mq{to{transform:translateX(-50%)}}
section{padding:100px 0}
.lab{font:500 .85rem "Space Grotesk";letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin-bottom:26px;display:block}
.idx{display:grid;grid-template-columns:1fr 1fr;column-gap:50px;list-style:none;padding:0}
.idx li{display:flex}
.idx a{flex:1;display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:16px 8px;border-top:2px solid var(--line);font:800 clamp(1.3rem,2.4vw,2rem)/1.1 "Bricolage Grotesque",sans-serif;transition:padding .25s,background .25s,color .25s}
.idx li:nth-child(3n+1) a:hover{background:var(--c);color:#06202b}.idx li:nth-child(3n+2) a:hover{background:var(--m);color:#fff}.idx li:nth-child(3n) a:hover{background:var(--y);color:#2b2300}
.idx a:hover{padding-left:24px}
.idx small{font:500 .8rem "Space Grotesk";opacity:.6}
.road{background:#d4f1fc;color:#1d1a17;overflow:hidden;padding:100px 0 0}
.road h2{font-size:clamp(2.2rem,6vw,5rem);max-width:16ch}
.road p{max-width:50ch;margin:22px 0 28px;color:#1d1a17;opacity:.75;font-size:1.15rem}
.cta{display:inline-block;background:var(--y);color:#14110f;font-weight:500;padding:16px 30px;border-radius:999px;transition:transform .2s}
.cta:hover{transform:scale(1.06) rotate(-1deg)}
.lane{margin-top:50px;border-bottom:6px dashed #1d1a17;padding-bottom:4px;position:relative;height:170px}
.lane svg{position:absolute;bottom:-4px;width:380px;animation:drive 14s linear infinite}
@keyframes drive{from{left:-400px}to{left:100%}}
.mach{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.mach span{border:2px solid var(--line);border-radius:999px;padding:8px 18px}
.two{display:grid;grid-template-columns:1fr 1.2fr;gap:60px}
.two h2{font-size:clamp(2.2rem,5vw,4rem)}
details{border-top:2px solid var(--line);padding:18px 0}
summary{cursor:pointer;font:800 1.25rem "Bricolage Grotesque",sans-serif;list-style:none;display:flex;justify-content:space-between}
summary::after{content:"+";color:var(--m)}details[open] summary::after{content:"–"}
details p{margin-top:10px;color:var(--mut)}
.ct{background:var(--c);color:#06202b;border-block:2px solid var(--line)}
.ct .big{font-size:clamp(2.6rem,9vw,8rem)}
.ct .row{display:flex;flex-wrap:wrap;gap:40px;margin-top:40px;font-size:1.15rem}
.ct a.btn{background:#06202b;color:#fff;padding:14px 26px;border-radius:999px;display:inline-block}
.logos{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin-top:10px}
.logos a{height:80px;display:grid;place-items:center;border:2px dashed var(--line);border-radius:14px;color:var(--mut);font-size:.8rem}
footer{padding:30px 0;color:var(--mut);font-size:.9rem}
.rv{opacity:0;transform:translateY(30px);transition:opacity .7s,transform .7s}.rv.in{opacity:1;transform:none}
/* paleta i menu wg oryginalnej strony */
.top{padding:10px max(24px,calc((100vw - 1280px)/2 + 24px));gap:24px;border-bottom:3px solid var(--y);box-shadow:0 8px 26px rgba(0,0,0,.28);background:radial-gradient(1.5px 1.5px at 12% 30%,#fffa,transparent),radial-gradient(1px 1px at 33% 70%,#fff8,transparent),radial-gradient(1.5px 1.5px at 58% 25%,#fff9,transparent),radial-gradient(1px 1px at 79% 62%,#fff8,transparent),radial-gradient(1.5px 1.5px at 93% 28%,#fffa,transparent),linear-gradient(180deg,#34373b,#1b1d20)}
.logo{font:800 1.5rem/1 "Bricolage Grotesque",sans-serif;font-style:italic;letter-spacing:.02em;color:#14110f;background:radial-gradient(ellipse at 50% 30%,#ffbf6b,var(--y));padding:10px 28px;border:3px solid var(--c);border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.25),0 4px 14px rgba(0,0,0,.5)}
.logo i{font-style:italic;color:inherit}
.dn{display:flex;align-items:center;margin-left:auto;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:4px}
.dn a{display:flex;align-items:center;height:42px;padding:0 17px;color:#fff;font:600 .78rem "Space Grotesk",sans-serif;letter-spacing:.07em;text-transform:uppercase;position:relative;border-radius:8px;transition:background .25s}
.dn a+a::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:1px;background:rgba(255,255,255,.12)}
.dn a::after{content:"";position:absolute;left:17px;right:17px;bottom:7px;height:2px;background:var(--y);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.dn a:hover{background:rgba(255,255,255,.08)}.dn a:hover::after{transform:scaleX(1)}
.dn a:first-child{font-size:1.2rem;padding:0 15px}
.dn a.hot{background:var(--m);margin:0 4px}.dn a.hot::before,.dn a.hot::after,.dn a.hot+a::before{display:none}.dn a.hot:hover{background:#ee707a}
.mbtn{display:none;background:var(--y);color:#1d1a17;font-weight:600}
.ov{background:#26282b;justify-content:flex-start;padding:104px 24px 40px;border-bottom:4px solid var(--y)}
.ov a{font:600 1.25rem/1.2 "Space Grotesk",sans-serif;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.12);color:#fff}
.ov a:hover{transform:none;color:var(--y)}.ov a:nth-child(5){color:var(--y)}
@media (max-width:980px){.dn{display:none}.mbtn{display:block;margin-left:auto}}
@media (min-width:981px){.ov{display:none}}
.hc{color:#fff}.hm{color:#fff}.hy{color:#2a1600}
.hero{background:radial-gradient(circle at 78% 90%,rgba(247,148,29,.4),transparent 38%)}.hero::before{opacity:.3}
.stk circle{fill:var(--y)}.stk text:last-child{fill:var(--c)}
.idx li:nth-child(3n+1) a:hover{color:#fff}
.road{background:linear-gradient(180deg,#f9a74a,#f58a24)}.road .lab{color:#1d1a17!important}.road .cta{background:var(--c);color:#fff}
.lane rect[fill="#00aeef"]{fill:var(--c)}.lane rect[fill="#ec008c"]{fill:var(--m)}.lane rect[fill="#ffd400"]{fill:var(--y)}
.ct{color:#fff}.ct a.btn{background:var(--y);color:#1d1a17}
/* menu v2: jasne, w stylu strony */
.top{background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:2px solid #1d1a17;box-shadow:none;padding:12px max(24px,calc((100vw - 1280px)/2 + 24px))}
.logo{font:800 1.75rem/1 "Bricolage Grotesque",sans-serif;font-style:normal;letter-spacing:-.02em;color:#1d1a17;background:none;border:0;border-radius:0;box-shadow:none;padding:0;display:flex;align-items:center}
.logo i{display:inline-block;width:.8em;height:.8em;margin:0 .03em;border-radius:50%;background:var(--y);border:.11em solid var(--c);font-size:0}
.dn{background:none;border:0;border-radius:0;padding:0;gap:4px;margin-left:auto}
.dn a{height:auto;padding:9px 14px;color:#1d1a17;font:700 .98rem/1 "Bricolage Grotesque",sans-serif;letter-spacing:0;text-transform:none;border-radius:8px;transition:background .2s,color .2s,transform .2s}
.dn a::before,.dn a::after{display:none!important}
.dn a:first-child{font-size:1.3rem;padding:6px 12px}
.dn a:nth-child(odd):hover{background:var(--y);color:#1d1a17}
.dn a:nth-child(even):hover{background:var(--c);color:#fff}
.dn a:hover{transform:translateY(-2px)}
.dn a.hot{background:var(--m);color:#fff;margin:0 4px 0 8px;padding:9px 18px;border-radius:999px}
.dn a.hot:hover{background:var(--m);color:#fff;transform:rotate(-2deg) scale(1.06)}
.mbtn{border-radius:999px}
.ov{background:var(--bg);color:#1d1a17;border-bottom:0;padding:110px 24px 40px;justify-content:center}
.ov a{font:800 clamp(2rem,8vw,3.4rem)/1.1 "Bricolage Grotesque",sans-serif;color:#1d1a17;border-bottom:2px solid var(--line);padding:12px 0}
.ov a:nth-child(5){color:var(--m)}
.ov a:hover{color:var(--c);transform:translateX(10px)}
/* hero: asymetria */
.stk{display:none!important}
.big i:nth-of-type(1){transform:rotate(-.8deg)}
.big i:nth-of-type(2){margin-left:clamp(1.2rem,9vw,8rem);transform:rotate(-2.5deg)}
.big i:nth-of-type(3){margin-left:clamp(0rem,3vw,2.5rem);transform:rotate(1.2deg)}
.sub{max-width:28ch;margin-left:clamp(1.2rem,9vw,8rem);margin-top:34px;font:700 clamp(1.25rem,2.6vw,1.9rem)/1.25 "Bricolage Grotesque",sans-serif;color:var(--ink);letter-spacing:-.01em}
.sub mark{background:linear-gradient(transparent 58%,var(--y) 58%);color:inherit;padding:0 .08em}
/* logo jak w oryginale */
.logo{display:block;line-height:0;padding:0;border:0;background:none;box-shadow:none}
.logo svg{height:54px;width:auto;display:block;overflow:visible;transition:transform .3s}
.logo:hover svg{transform:rotate(-2deg) scale(1.05)}
/* zdjecia */
.pcard{position:relative;margin:0;background:#fff;padding:8px;border-radius:6px;box-shadow:0 20px 44px -16px rgba(0,0,0,.5);transition:transform .35s}
.pcard img{display:block;width:100%;height:auto;border-radius:3px}
.pcard::before{content:"";position:absolute;top:-11px;left:50%;width:78px;height:24px;margin-left:-39px;background:rgba(247,148,29,.88);transform:rotate(-3deg)}
.hstack{position:relative;width:min(80%,380px);margin:38px 0 0 clamp(1.2rem,9vw,8rem);animation:up .8s 3.3s both}
.pc1{transform:rotate(2deg)}
.pc2{position:absolute;width:52%;left:-12%;bottom:-16%;transform:rotate(-5deg)}
.pc2::before{display:none}
.hstack:hover .pc1{transform:rotate(1deg) scale(1.02)}.hstack:hover .pc2{transform:rotate(-3deg) translateY(-6px)}
.road .w{position:relative}
.rphoto{width:100%;max-width:420px;margin:36px 0 0;transform:rotate(-1.5deg)}
@media (min-width:981px){
 .big{font-size:clamp(3.2rem,8.6vw,8rem)}
 .hstack{position:absolute;right:24px;top:50%;margin:-150px 0 0;width:min(34vw,430px)}
 .rphoto{position:absolute;right:24px;top:70px;margin:0;width:min(36vw,440px);transform:rotate(2.5deg)}
}
/* zdjecia obok tekstu, nigdy na nim */
.hstack{margin-bottom:64px}.pc2{left:-4%}
.pcard.rphoto.rv.in{transform:rotate(-1.5deg)}
@media (min-width:981px){
 .hero .w{display:grid;grid-template-columns:minmax(0,1fr) min(34vw,420px);column-gap:56px;align-items:center}
 .hero .big{font-size:clamp(3rem,6.8vw,6.8rem)}
 .hero .big,.hero .sub{grid-column:1}
 .hero .sub{margin-left:clamp(1.2rem,5vw,5rem)}
 .hero .hstack{position:relative;right:auto;top:auto;margin:0 0 40px;width:100%;grid-column:2;grid-row:1/3;align-self:center}
 .road .w{display:grid;grid-template-columns:minmax(0,1fr) min(36vw,440px);column-gap:56px;align-items:start}
 .road .w>*{grid-column:1}
 .road .w>.cta{justify-self:start}
 .road .w>.rphoto{grid-column:2;grid-row:1/5;align-self:center;position:relative;top:auto;right:auto;width:100%;margin:0}
 .pcard.rphoto.rv.in{transform:rotate(2.5deg)}
 .road .w>.lane{grid-column:1/-1}
}
/* dojazd */
.dojazd{display:grid;grid-template-columns:1.5fr 1fr;gap:28px;margin-top:56px;align-items:stretch}
.mapcard{border-radius:22px;overflow:hidden;border:3px solid #fff;box-shadow:0 22px 50px -20px rgba(0,0,0,.5);min-height:300px;background:#f4efe3}
.mapcard svg{display:block;width:100%;height:100%;min-height:300px}
.pulse{transform-box:fill-box;transform-origin:center;animation:pl 2s ease-out infinite}
@keyframes pl{from{transform:scale(.4);opacity:.7}to{transform:scale(2.6);opacity:0}}
.dinfo{display:flex;flex-direction:column;justify-content:center;gap:14px}
.dinfo h3{font:800 clamp(1.5rem,3vw,2.2rem)/1.1 "Bricolage Grotesque",sans-serif;color:#fff}
.dinfo p{font-size:1.1rem;line-height:1.7}
.dbtn{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.btn2{display:inline-block;padding:14px 24px;border-radius:999px;font-weight:600;background:var(--y);color:#1d1a17;transition:transform .2s}
.btn2.alt2{background:none;color:#fff;border:2px solid #fff}
.btn2:hover{transform:translateY(-2px) rotate(-1deg)}
@media (max-width:860px){.dojazd{grid-template-columns:1fr}.mapcard,.mapcard svg{min-height:240px}}
@media (prefers-reduced-motion:reduce){.pulse{animation:none}}
/* kontakt: dane + mapa obok siebie */
.ct2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:center}
.ct .ct2 .big{font-size:clamp(2.4rem,5.6vw,5.2rem)}
.ct2 .row{margin-top:30px;gap:24px 36px}
.ct .dbtn{margin-top:28px}
.ct2 .mapcard{height:100%;min-height:400px}.ct2 .mapcard svg{min-height:400px}
@media (max-width:860px){.ct2{grid-template-columns:1fr;gap:34px}.ct2 .mapcard,.ct2 .mapcard svg{min-height:260px}}
/* ilustracje */
.pcard svg{display:block;width:100%;height:auto;border-radius:3px}
.phead{animation:hd 3.2s ease-in-out infinite alternate}
@keyframes hd{to{transform:translateX(188px)}}
/* ciemne menu i stopka */
.top{background:rgba(24,22,20,.95);border-bottom:3px solid var(--y);box-shadow:0 8px 24px rgba(0,0,0,.28)}
.logo svg,.flogo svg{filter:drop-shadow(0 0 1.5px rgba(255,255,255,.7))}
.dn a{color:#f3efe6}
.dn a:nth-child(odd):hover{background:var(--y);color:#1d1a17}
.dn a:nth-child(even):hover{background:var(--c);color:#fff}
.dn a.hot,.dn a.hot:hover{background:var(--m);color:#fff}
.mbtn{background:var(--y);color:#1d1a17}
.ov{background:#1d1a17;color:#f3efe6}
.ov a{color:#f3efe6;border-bottom-color:rgba(255,255,255,.14)}
.ov a:hover{color:var(--y)}.ov a:nth-child(5){color:var(--y)}
footer{background:#1d1a17;color:#b9b2a3;padding:56px 0 0;font-size:.95rem;border-top:3px solid var(--y)}
.fgrid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:40px;padding-bottom:40px}
.flogo{display:block;line-height:0}.flogo svg{height:54px;width:auto;display:block;margin-bottom:16px;overflow:visible}
.fb p{max-width:30ch}
.fn{display:flex;flex-direction:column;gap:8px}
.fn a{color:#f3efe6;width:fit-content;border-bottom:2px solid transparent;transition:color .2s,border-color .2s}
.fn a:hover{color:var(--y);border-color:var(--y)}
.fc b{color:#f3efe6}
.fcopy{border-top:1px solid rgba(255,255,255,.12);padding:18px 24px;font-size:.82rem;color:#8b8478}
@media (max-width:860px){.fgrid{grid-template-columns:1fr;gap:28px}}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.tick div,.lane svg,.reg,.stk,.hero::before,.hero::after,.sub,.hstack,.big i span,.phead{animation:none}.ph{display:none}}
@media (max-width:860px){.idx{grid-template-columns:1fr}.two{grid-template-columns:1fr;gap:30px}section{padding:64px 0}.reg{display:none}.stk{width:104px;height:104px;right:16px;top:auto;bottom:56px}}