@font-face{font-family:'Fira Sans';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/fira-sans-latin-ext-400-normal.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:'Fira Sans';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/fira-sans-latin-400-normal.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}
@font-face{font-family:'Fira Sans';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/fira-sans-latin-ext-500-normal.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:'Fira Sans';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/fira-sans-latin-500-normal.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}
@font-face{font-family:'Fira Sans';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/fira-sans-latin-ext-600-normal.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:'Fira Sans';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/fira-sans-latin-600-normal.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}
@font-face{font-family:'Fira Sans';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/fira-sans-latin-ext-700-normal.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:'Fira Sans';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/fira-sans-latin-700-normal.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}
@font-face{font-family:'Fira Sans Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/fira-sans-condensed-latin-ext-600-normal.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:'Fira Sans Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/fira-sans-condensed-latin-600-normal.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}
@font-face{font-family:'Fira Sans Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/fira-sans-condensed-latin-ext-700-normal.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:'Fira Sans Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/fira-sans-condensed-latin-700-normal.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}
/* ===== Primeroute – tokeny z systemu „Primeroute” ===== */
:root{
  --amber:#F6A806;--amber-deep:#B97C00;--amber-soft:#FFF4DC;
  --graphite:#1E1E1E;--asphalt:#2A2D31;--line-dark:#3A3E44;
  --steel:#5D646C;--fog:#AEB4BB;--mist:#F3F4F6;--line:#E1E4E8;--white:#FFFFFF;
  --r-sm:10px;--r-md:16px;--r-lg:24px;--r-xl:32px;--pill:999px;
  --sans:"Fira Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --cond:"Fira Sans Condensed","Fira Sans",system-ui,"Arial Narrow",sans-serif;
  --wrap:1360px;--gutter:clamp(16px,3.2vw,48px);--head-h:76px;
  --sec:clamp(80px,10vw,128px);--inset:clamp(0px,1vw,14px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--head-h) + 12px);-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--sans);font-size:17px;line-height:1.6;color:var(--graphite);background:var(--white);-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--amber);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-9999px;top:0;background:var(--amber);color:var(--graphite);padding:12px 18px;z-index:100;font-weight:600;border-radius:var(--pill)}
.skip:focus{left:12px;top:12px}
.wrap{max-width:calc(var(--wrap) + 2 * var(--gutter));margin:0 auto;padding:0 var(--gutter)}
h1,h2,h3{font-family:var(--cond);line-height:1.04;margin:0;font-weight:700;letter-spacing:-.012em;text-wrap:balance}
h1{font-size:clamp(46px,6vw,88px)}
h2{font-size:clamp(34px,4vw,56px)}
h3{font-size:clamp(22px,1.7vw,26px)}
p{margin:0;text-wrap:pretty}
.lead{font-size:clamp(17px,1.3vw,20px);color:var(--steel);max-width:56ch}
.eyebrow{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--amber-deep);margin-bottom:18px}
.eyebrow::before{content:"";width:22px;height:3px;border-radius:2px;background:var(--amber)}
.on-dark .eyebrow{color:var(--amber)}

/* przyciski */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 28px;border-radius:var(--pill);font:600 16px/1 var(--sans);text-decoration:none;border:2px solid transparent;cursor:pointer;transition:background .18s,color .18s,border-color .18s,transform .18s}
.btn svg{width:18px;height:18px;flex:none}
.btn:active{transform:translateY(1px)}
.btn-amber{background:var(--amber);color:var(--graphite)}
.btn-amber:hover{background:#FFB823}
.btn-dark{background:var(--graphite);color:var(--white)}
.btn-dark:hover{background:var(--asphalt)}
.btn-line{border-color:var(--graphite);color:var(--graphite);background:transparent}
.btn-line:hover{background:var(--graphite);color:var(--white)}
.on-dark .btn-line{border-color:rgba(255,255,255,.55);color:var(--white)}
.on-dark .btn-line:hover{background:var(--white);color:var(--graphite);border-color:var(--white)}
.cta{display:flex;flex-wrap:wrap;gap:12px}

/* nagłówek */
.top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .2s,box-shadow .2s}
.top.scrolled{border-bottom-color:var(--line);box-shadow:0 6px 24px -18px rgba(30,30,30,.35)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:var(--head-h);gap:20px}
.logo img{height:40px;width:auto}
.nav{display:flex;align-items:center;gap:6px}
.nav a.nl{text-decoration:none;font-weight:500;font-size:16px;padding:10px 14px;border-radius:var(--pill);transition:background .15s,color .15s}
.nav a.nl:hover{background:var(--mist)}
.nav a.nl[aria-current]{background:var(--amber-soft);color:#7A5200}
.nav .btn{min-height:46px;padding:0 22px;margin-left:8px}
.langsw{display:inline-flex;padding:4px;border-radius:var(--pill);background:var(--mist);margin-left:10px}
.langsw a,.langsw span{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:36px;padding:0 10px;border-radius:var(--pill);font-size:14px;font-weight:700;letter-spacing:.04em;text-decoration:none;color:var(--steel)}
.langsw span{background:var(--white);color:var(--graphite);box-shadow:0 1px 3px rgba(30,30,30,.15)}
.langsw a:hover{color:var(--graphite)}
.burger{display:none;width:48px;height:48px;border:0;border-radius:var(--pill);background:var(--mist);cursor:pointer;align-items:center;justify-content:center}
.burger svg{width:22px;height:22px}

/* hero – osadzony, zaokrąglony panel */
.hero{padding:var(--inset)}
.hero-in{background:var(--graphite);color:var(--white);border-radius:var(--r-xl);overflow:hidden;min-height:calc(100vh - var(--head-h) - 2 * var(--inset));min-height:calc(100svh - var(--head-h) - 2 * var(--inset));display:flex;align-items:center;position:relative}
.hero-in::after{content:"";position:absolute;inset:auto 0 0 0;height:6px;background:var(--amber)}
.hero .wrap{width:100%;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,4vw,72px);align-items:center;padding-top:clamp(48px,6vw,88px);padding-bottom:clamp(56px,6vw,96px)}
.hero h1{margin-bottom:24px;max-width:11ch}
.hero .lead{color:#C4C9CF;margin-bottom:36px;max-width:46ch}
.facts{list-style:none;margin:40px 0 0;padding:28px 0 0;border-top:1px solid var(--line-dark);display:flex;flex-wrap:wrap;gap:14px 28px;font-size:15px;color:#D5D9DE}
.facts li{display:flex;align-items:center;gap:10px}
.facts svg{width:20px;height:20px;color:var(--amber);flex:none}
.map-card{background:var(--asphalt);border:1px solid var(--line-dark);border-radius:var(--r-lg);padding:clamp(16px,2vw,28px)}
.map{width:100%;height:auto}
.map .grid path{stroke:#363A40;stroke-width:1}
.map .route{fill:none;stroke:var(--amber);stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.map .city circle{fill:var(--asphalt);stroke:#8A9199;stroke-width:2}
.map .city text{fill:var(--fog);font:500 13px var(--sans)}
.map .hub circle{fill:var(--amber)}
.map .hub .ring{fill:none;stroke:var(--amber);stroke-width:2;opacity:.5}
.map .hub text{fill:var(--white);font:700 16px var(--sans)}
@media (prefers-reduced-motion:no-preference){
  .map .route{stroke-dasharray:900;stroke-dashoffset:900;animation:draw 1.6s cubic-bezier(.6,.1,.3,1) forwards;animation-delay:var(--d,0s)}
  .map .hub .ring{transform-origin:390px 148px;animation:ping 2.4s 1.8s ease-out infinite}
  @keyframes draw{to{stroke-dashoffset:0}}
  @keyframes ping{0%{transform:scale(1);opacity:.6}100%{transform:scale(2.6);opacity:0}}
}

/* sekcje */
.block{padding:var(--sec) 0}
.head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,72px);align-items:end;margin-bottom:clamp(36px,4vw,56px)}
.head .lead{justify-self:start}

/* usługi – układ kafli */
.bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.tile{position:relative;border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(24px,2.4vw,36px);background:var(--white);display:flex;flex-direction:column;gap:14px;transition:border-color .2s,box-shadow .2s,transform .2s}
.tile:hover{border-color:var(--amber);box-shadow:0 18px 40px -28px rgba(30,30,30,.45);transform:translateY(-2px)}
.tile.wide{grid-column:span 2}
.tile.feature{background:var(--mist);border-color:var(--mist)}
.ico{width:52px;height:52px;border-radius:var(--r-md);background:var(--amber-soft);display:grid;place-items:center;color:var(--amber-deep);flex:none}
.ico svg{width:24px;height:24px}
.tile p{color:var(--steel)}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:auto 0 0;padding:10px 0 0}
.chips li{padding:7px 14px;border-radius:var(--pill);background:var(--mist);font-size:14px;font-weight:600}
.tile.feature .chips li{background:var(--white)}

/* dobór pojazdu */
.vehicles{background:var(--graphite);color:var(--white)}
.vehicles .lead{color:#C4C9CF}
.picker{display:grid;grid-template-columns:minmax(240px,320px) minmax(0,1fr);gap:20px;align-items:stretch}
.vtabs{display:flex;flex-direction:column;gap:8px}
.vtab{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;padding:16px 20px;border-radius:var(--r-md);border:1px solid var(--line-dark);background:var(--asphalt);color:var(--white);cursor:pointer;transition:background .15s,border-color .15s}
.vtab strong{font-family:var(--cond);font-size:21px;font-weight:700}
.vtab small{color:var(--fog);font-size:14px;white-space:nowrap}
.vtab:hover{border-color:#5A5F66}
.vtab[aria-selected="true"]{background:var(--amber);border-color:var(--amber);color:var(--graphite)}
.vtab[aria-selected="true"] small{color:#4A3700}
.vpanel{background:var(--asphalt);border:1px solid var(--line-dark);border-radius:var(--r-lg);padding:clamp(24px,3vw,44px);display:flex;flex-direction:column;gap:22px}
.vpanel[hidden]{display:none}
.vpanel h3{font-size:clamp(28px,2.6vw,40px)}
.vpanel p{color:#C4C9CF;max-width:60ch}
.truck{width:100%;height:auto;margin:6px 0 4px}
.truck .road{stroke:var(--line-dark);stroke-width:2}
.truck .box{fill:#3A3E44;stroke:#5A5F66;stroke-width:1.5}
.truck .cab{fill:var(--amber)}
.truck .win{fill:var(--asphalt)}
.truck .wheel{fill:#141414;stroke:#8A9199;stroke-width:3}
.truck .dim{stroke:var(--fog);stroke-width:1.5}
.truck .dimt{fill:var(--fog);font:600 14px var(--sans)}
.specs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0}
.specs div{background:var(--graphite);border-radius:var(--r-md);padding:16px 18px}
.specs dt{color:var(--fog);font-size:14px}
.specs dd{margin:4px 0 0;font:700 clamp(22px,1.9vw,28px)/1.1 var(--cond);font-variant-numeric:tabular-nums}
.vnote{margin-top:20px;font-size:14px;color:#8A9199}

/* jak zlecić */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;counter-reset:st}
.steps li{counter-increment:st;background:var(--mist);border-radius:var(--r-lg);padding:clamp(24px,2.4vw,36px);display:flex;flex-direction:column;gap:12px;position:relative}
.steps li::before{content:counter(st);display:grid;place-items:center;width:48px;height:48px;border-radius:var(--pill);background:var(--graphite);color:var(--amber);font:700 22px var(--cond);margin-bottom:6px}
.steps p{color:var(--steel)}

/* o nas */
.about{background:var(--amber)}
.about .wrap{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(36px,6vw,104px);align-items:start}
.about .eyebrow{color:var(--graphite)}
.about .eyebrow::before{background:var(--graphite)}
.about h2{margin-bottom:24px}
.about p{max-width:60ch}
.about p+p{margin-top:16px}
.about .lead{color:var(--graphite);font-weight:500}
.values{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.values li{background:var(--white);border-radius:var(--r-md);padding:24px}
.values strong{display:block;font-family:var(--cond);font-size:22px;margin-bottom:6px}
.values span{color:var(--steel);font-size:15px}

/* kontakt */
.contact{padding:var(--sec) var(--inset) var(--inset)}
.contact-in{background:var(--graphite);color:var(--white);border-radius:var(--r-xl);overflow:hidden}
.contact-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px,4vw,64px);padding-top:clamp(56px,6vw,96px);padding-bottom:clamp(56px,6vw,96px);align-items:stretch}
.contact h2{margin-bottom:20px}
.contact .lead{color:#C4C9CF;margin-bottom:32px}
.big-links{display:flex;flex-direction:column;gap:12px;margin-bottom:36px}
.big-link{display:flex;align-items:center;gap:16px;padding:16px 20px 16px 16px;border-radius:var(--r-md);background:var(--asphalt);border:1px solid var(--line-dark);text-decoration:none;transition:border-color .15s,background .15s}
.big-link:hover{border-color:var(--amber)}
.big-link .ico{background:var(--amber);color:var(--graphite)}
.big-link small{display:block;color:var(--fog);font-size:14px}
.big-link b{font:700 clamp(20px,1.8vw,26px)/1.2 var(--cond)}
.cmeta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;font-size:15px;color:#C4C9CF}
.cmeta strong{display:block;color:var(--white);font-family:var(--cond);font-size:19px;margin-bottom:2px}
.reg{margin-top:24px;font-size:14px;color:#8A9199}
.mapbox{position:relative;border-radius:var(--r-lg);background:var(--asphalt);border:1px solid var(--line-dark);min-height:420px;display:grid;place-items:center;text-align:center;padding:32px;overflow:hidden}
.mapbox .ico{margin:0 auto 14px}
.mapbox strong{font-family:var(--cond);font-size:24px}
.mapbox p{color:var(--fog);font-size:15px;max-width:38ch;margin:10px auto 22px}
.mapbox .cta{justify-content:center}
.mapbox iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(1) contrast(1.05)}

/* podstrony */
.page-hero{padding:var(--inset)}
.page-hero-in{background:var(--graphite);color:var(--white);border-radius:var(--r-xl);padding:clamp(48px,7vw,104px) 0;position:relative;overflow:hidden}
.page-hero-in::after{content:"";position:absolute;inset:auto 0 0 0;height:6px;background:var(--amber)}
.page-hero h1{font-size:clamp(40px,5vw,76px);max-width:18ch}
.page-hero .lead{color:#C4C9CF;margin-top:20px}
.page-hero .meta{color:var(--fog);margin-top:14px;font-size:15px}
.page{padding:clamp(48px,6vw,88px) 0 var(--sec)}
.page-grid{display:grid;grid-template-columns:270px minmax(0,1fr);gap:clamp(32px,5vw,88px);align-items:start}
.toc{position:sticky;top:calc(var(--head-h) + 20px);background:var(--mist);border-radius:var(--r-lg);padding:22px 22px 18px}
.toc strong{display:block;font-family:var(--cond);font-size:20px;margin-bottom:8px}
.toc ol{margin:0;padding:0 0 0 20px;font-size:15px}
.toc li{margin:5px 0;color:var(--steel)}
.toc a{text-decoration:none}
.toc a:hover,.toc a.on{color:var(--amber-deep);font-weight:600}
.prose{max-width:76ch}
.prose h2{font-size:clamp(26px,2.1vw,32px);margin:52px 0 14px}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:20px;margin:24px 0 8px}
.prose p,.prose li{color:#3A3F45}
.prose p+p{margin-top:14px}
.prose ul{padding-left:22px}
.prose li{margin:7px 0}
.prose a{color:var(--amber-deep)}
.prose .box{background:var(--amber-soft);border-radius:var(--r-md);padding:20px 24px;margin:20px 0}

/* OWP */
.docs+.docs{margin-top:64px}
.docs h2{font-size:clamp(28px,2.6vw,40px);margin-bottom:18px}
.doc-card{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px;padding:clamp(22px,2.4vw,34px);border-radius:var(--r-lg);border:2px solid var(--amber);background:var(--white)}
.doc-id{display:flex;align-items:center;gap:18px}
.doc-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.doc-title strong{font-family:var(--cond);font-size:26px}
.badge{padding:4px 12px;border-radius:var(--pill);font-size:13px;font-weight:600;background:var(--amber);color:var(--graphite)}
.badge.muted{background:var(--mist);color:var(--steel)}
.doc-meta{color:var(--steel);font-size:15px;margin-top:2px}
.doc-links{display:flex;flex-wrap:wrap;gap:10px}
.btn.soon{background:transparent;color:var(--steel);border:1.5px dashed #B9BFC6;cursor:default}
.btn.soon small{font-size:12px;font-weight:500}
.doc-note{margin-top:14px;font-size:15px;color:var(--steel)}
.arch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}
.arch-item{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;border:1px solid var(--line);border-radius:var(--r-md);padding:20px 22px}
.arch-empty{border:1.5px dashed #C9CED4;border-radius:var(--r-md);padding:22px;color:var(--steel);font-size:15px;display:grid;place-items:center;text-align:center;min-height:92px}

.notfound{padding:120px 0 140px}
.notfound .code{font:700 clamp(96px,16vw,180px)/1 var(--cond);color:var(--amber)}
.notfound h1{margin:12px 0 18px}
.notfound .lead{margin-bottom:34px}

/* stopka */
footer{padding:0 var(--inset) var(--inset)}
.foot-in{background:var(--graphite);color:var(--fog);border-radius:var(--r-xl);padding:clamp(48px,5vw,72px) 0 28px;font-size:15px;margin-top:var(--inset)}
.contact+footer .foot-in{margin-top:var(--inset)}
.foot-cols{display:grid;grid-template-columns:1.6fr 1fr 1.3fr 1fr;gap:40px;padding-bottom:40px;border-bottom:1px solid var(--line-dark)}
.foot-in img{height:38px;width:auto;margin-bottom:18px}
.foot-in h2{color:var(--white);font:600 16px var(--sans);margin:0 0 14px}
.foot-in ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.foot-in a{text-decoration:none}
.foot-in a:hover{color:var(--amber)}
.legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:24px}

/* pasek „Zadzwoń / Napisz” na telefonie */
.callbar{display:none}

/* responsywność */
@media (max-width:1200px){
  .specs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .foot-cols{grid-template-columns:1fr 1fr}
  .foot-cols>div:first-child{grid-column:1/-1}
}
@media (max-width:1000px){
  .hero .wrap,.head,.about .wrap,.contact-grid,.page-grid,.picker{grid-template-columns:minmax(0,1fr)}
  .hero-in{min-height:0}
  .bento{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tile.wide{grid-column:1/-1}
  .steps{grid-template-columns:minmax(0,1fr)}
  .vtabs{flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:thin}
  .vtab{flex:none;width:auto;scroll-snap-align:start;flex-direction:column;align-items:flex-start;gap:2px}
  .toc{position:static}
}
@media (max-width:900px){
  .burger{display:inline-flex}
  .nav{display:none;position:absolute;top:var(--head-h);left:0;right:0;flex-direction:column;align-items:stretch;gap:4px;background:var(--white);border-bottom:1px solid var(--line);padding:12px var(--gutter) 20px;box-shadow:0 18px 30px -24px rgba(30,30,30,.5)}
  .nav.open{display:flex}
  .nav a.nl{padding:14px 16px}
  .langsw{align-self:flex-start;margin:10px 0 0}
  .nav .btn{margin:12px 0 0}
  .callbar{display:flex;position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:40;gap:8px;padding:8px;border-radius:var(--pill);background:var(--graphite);box-shadow:0 10px 30px -10px rgba(0,0,0,.5)}
  .callbar a{flex:1;min-height:48px}
  body{padding-bottom:84px}
}
@media (max-width:640px){
  body{font-size:16px}
  .bento,.values,.arch,.cmeta{grid-template-columns:minmax(0,1fr)}
  .specs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-in,.contact-in,.foot-in,.page-hero-in{border-radius:0}
  :root{--inset:0px}
}

/* dane firmy w „O nas” */
.company{background:var(--white);border-radius:var(--r-lg);padding:clamp(24px,2.6vw,36px)}
.company h3{margin-bottom:12px}
.company dl{margin:0}
.company dl div{display:grid;grid-template-columns:minmax(110px,40%) 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.company dl div:last-child{border-bottom:0}
.company dt{color:var(--steel);font-size:15px}
.company dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums}
.hours{color:#C4C9CF;font-size:16px}
.hours strong{color:var(--white);margin-right:8px}
.foot-cols{grid-template-columns:2fr 1fr 1.3fr}
@media (max-width:1200px){.foot-cols{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.foot-cols{grid-template-columns:minmax(0,1fr)}}

/* płynne „przyciąganie” sekcji na stronie głównej (komputer):
   każda sekcja ma wysokość ekranu i zatrzymuje się dokładnie na jego środku */
@media (min-width:1280px) and (min-height:740px){
  html:has(.hero){scroll-snap-type:y mandatory;scroll-padding-top:var(--head-h)}
  .hero,.block{scroll-snap-align:center;scroll-snap-stop:always}
  html:has(.hero) footer{scroll-snap-align:end;scroll-snap-stop:always}
  html:has(.hero){--sec:clamp(24px,4.5vh,88px)}
  .tile{padding:clamp(20px,3vh,36px);gap:min(14px,1.4vh)}
  .vtabs{gap:min(8px,.8vh)}
  .vtab strong{font-size:clamp(18px,2.4vh,21px)}
  .vpanel p{font-size:clamp(15px,2vh,17px)}
  .block{min-height:calc(100vh - var(--head-h));min-height:calc(100svh - var(--head-h));display:flex;align-items:center}
  .block>.wrap{width:100%}
  .hero-in{min-height:calc(100vh - var(--head-h) - 2 * var(--inset));min-height:calc(100svh - var(--head-h) - 2 * var(--inset))}
  .hero .wrap{padding-top:4vh;padding-bottom:5vh}
  .hero h1{font-size:clamp(46px,min(5.6vw,9vh),88px);margin-bottom:2.4vh}
  .hero .lead{margin-bottom:3.6vh}
  .facts{margin-top:4vh;padding-top:3vh}
  .map{max-height:calc(100vh - var(--head-h) - 22vh);max-height:calc(100svh - var(--head-h) - 22vh)}
  .head{margin-bottom:clamp(20px,4vh,52px)}
  .head h2,.about h2,.contact h2{font-size:clamp(34px,min(4vw,6.4vh),56px)}
  .bento{grid-template-columns:repeat(4,minmax(0,1fr))}
  .tile.wide{grid-column:auto}
  .vtab{padding:min(16px,1.6vh) 20px;line-height:1.2}
  .vpanel{padding:clamp(20px,3vh,40px) clamp(24px,2.4vw,40px);gap:min(18px,2vh)}
  .vpanel h3{font-size:clamp(26px,min(2.6vw,4.4vh),40px)}
  .truck{height:min(18vh,240px);width:auto;max-width:100%;align-self:flex-start}
  .specs{grid-template-columns:repeat(4,minmax(0,1fr))}
  .specs dd{font-size:clamp(20px,2.8vh,28px)}
  .specs div{padding:min(14px,1.6vh) 16px}
  .vnote{margin-top:1.4vh;font-size:13px}
  /* ostatni ekran: kontakt + niska stopka razem */
  .contact{padding-top:var(--inset);min-height:calc(100vh - var(--head-h) - var(--foot-h,150px));min-height:calc(100svh - var(--head-h) - var(--foot-h,150px));display:flex;flex-direction:column;justify-content:center}
  .contact-in{width:100%;flex:1;display:flex;align-items:center}
  .contact-grid{width:100%;padding-top:clamp(20px,4vh,88px);padding-bottom:clamp(20px,4vh,88px)}
  .contact h2{margin-bottom:clamp(10px,2vh,20px);font-size:clamp(34px,min(3.5vw,5.8vh),56px)}
  .big-links{gap:min(12px,1.2vh)}
  .contact-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
  .reg{margin-top:1.2vh}
  .contact .lead{margin-bottom:clamp(16px,3vh,32px)}
  .big-links{margin-bottom:clamp(14px,3vh,36px)}
  .big-link{padding:min(16px,1.6vh) 20px min(16px,1.6vh) 16px}
  html:has(.hero) .foot-in{padding:clamp(14px,2.4vh,28px) 0 clamp(12px,2vh,22px)}
  html:has(.hero) .foot-cols{grid-template-columns:auto 1fr auto;align-items:center;gap:32px;padding-bottom:clamp(10px,1.8vh,18px)}
  html:has(.hero) .foot-cols>div:first-child{grid-column:auto;display:flex;align-items:center;gap:18px}
  html:has(.hero) .foot-in img{height:30px;margin:0}
  html:has(.hero) .foot-in h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  html:has(.hero) .foot-in ul{display:flex;flex-wrap:wrap;gap:6px 22px}
  html:has(.hero) .foot-cols>div:nth-child(2) ul{justify-content:flex-end}
  html:has(.hero) .legal{padding-top:clamp(10px,1.6vh,16px)}
  .mapbox{min-height:0}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.nav a.nl.active{background:var(--amber-soft);color:#7A5200}

/* baner = O nas */
.hero .lead{margin-bottom:16px}
.hero .more{color:var(--fog);max-width:52ch;margin-bottom:34px;font-size:16px}
@media (min-width:1280px) and (min-height:740px){
  .hero .lead{margin-bottom:1.6vh}
  .hero .more{margin-bottom:3.4vh;font-size:clamp(15px,1.9vh,16px)}
  .hero h1{font-size:clamp(42px,min(5.2vw,7.4vh),84px)}
  .facts{margin-top:3vh;padding-top:2.4vh;gap:1.2vh 28px}
}
.reg{margin-top:14px;font-size:14px;color:#8A9199}

/* baner: mapa tras jako tło całej sceny */
.hero-in{position:relative;isolation:isolate}
.map-bg{position:absolute;top:4%;bottom:4%;right:1.5%;width:54%;height:92%;z-index:-2}
.hero-in{background-image:linear-gradient(#2A2E33 1px,transparent 1px),linear-gradient(90deg,#2A2E33 1px,transparent 1px);background-size:80px 80px;background-position:center}
.hero-in::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,var(--graphite) 0%,rgba(30,30,30,.9) 28%,rgba(30,30,30,0) 52%)}
.hero .wrap{grid-template-columns:minmax(0,1fr)}
.hero .wrap>div{max-width:min(560px,39vw)}
.hero h1 em{font-style:normal;color:var(--amber)}
.map-bg .gl{stroke:#2C3035;stroke-width:1}
.map-bg .route{fill:none;stroke:var(--amber);stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.map-bg .city circle{fill:var(--graphite);stroke:#9AA1A9;stroke-width:2.5}
.map-bg .city text{fill:#C4C9CF;font:500 17px var(--sans)}
.map-bg .hub circle{fill:var(--amber)}
.map-bg .hub .ring{fill:none;stroke:var(--amber);stroke-width:2.5;opacity:.5}
.map-bg .hub text{fill:var(--white);font:700 22px var(--sans)}
@media (prefers-reduced-motion:no-preference){
  .map-bg .route{stroke-dasharray:1200;stroke-dashoffset:1200;animation:draw 1.8s cubic-bezier(.6,.1,.3,1) forwards;animation-delay:var(--d,0s)}
  .map-bg .hub .ring{transform-box:fill-box;transform-origin:center;animation:ping 2.4s 1.8s ease-out infinite}
}
@media (max-width:1000px){
  .hero-in{flex-direction:column;align-items:stretch}
  .hero-in::before{background:linear-gradient(180deg,var(--graphite) 55%,rgba(30,30,30,0) 75%)}
  .map-bg{position:relative;inset:auto;width:100%;height:300px;order:2;z-index:-2;margin:-20px 0 0;right:auto;top:auto;bottom:auto}
  .hero .wrap>div{max-width:none}
  .hero .wrap{padding-bottom:0}
}

/* głębia mapy w banerze */
.map-bg .net{fill:none;stroke:#3A3F45;stroke-width:1.5;stroke-dasharray:2 6;stroke-linecap:round}
.map-bg .minor circle{fill:#4A5057}
.map-bg .glow path{fill:none;stroke:var(--amber);stroke-width:16;stroke-linecap:round;stroke-linejoin:round;opacity:.22}
.map-bg .hub .core{fill:var(--graphite)}
.map-bg .movers circle{fill:#FFE2A3;filter:drop-shadow(0 0 6px rgba(246,168,6,.9))}
.map-bg .city circle{filter:drop-shadow(0 0 0 transparent)}
@media (prefers-reduced-motion:no-preference){
  .map-bg .glow{opacity:0;animation:fadein 1.2s 1.4s ease forwards}
  .map-bg .hub .r2{animation-delay:3s}
  @keyframes fadein{to{opacity:1}}
}
@media (prefers-reduced-motion:reduce){.map-bg .movers{display:none}}
/* stonowanie */
.map-bg .glow path{opacity:.07;stroke-width:12}
.map-bg .movers circle{fill:#E9C26A;filter:none;opacity:.85}
.map-bg .route{stroke-width:5}
.map-bg .net{stroke:#33373C}
.map-bg .minor circle{fill:#3F454B}

/* ===== małe telefony i telefon w poziomie ===== */
.langsw a,.langsw span{height:40px}
@media (max-width:600px){
  /* mapa w banerze: przy tej skali podpisy byłyby nieczytelne – zostaje sama grafika */
  .map-bg .city text,.map-bg .hub text{display:none}
  .map-bg{height:240px}
  .specs dt{font-size:13px}
  .specs dd{font-size:21px;white-space:nowrap}
  .vpanel{padding:22px 18px}
  .mapbox{padding:28px 18px}
  .mapbox .cta{flex-direction:column;align-items:stretch}
  .big-link{padding:14px}
  .big-link b{font-size:19px;word-break:break-word}
  .doc-card .doc-links,.doc-card .doc-links .btn{width:100%}
  .arch-item .doc-links{width:100%}
}
@media (max-width:380px){
  :root{--gutter:14px}
  h1{font-size:40px}
  .hero h1{font-size:40px}
  .btn{padding:0 18px}
  .cta .btn{flex:1 1 100%}
  .callbar{left:8px;right:8px;gap:6px;padding:6px}
  .callbar .btn{padding:0 10px;font-size:15px}
  .langsw a,.langsw span{min-width:40px}
  .specs{gap:8px}
  .specs div{padding:12px}
  .specs dd{font-size:19px}
}
/* telefon w poziomie: niższy nagłówek, bez dolnego paska (zasłaniałby pół ekranu) */
@media (max-width:900px) and (max-height:500px){
  :root{--head-h:60px}
  .logo img{height:32px}
  .burger{width:44px;height:44px}
  .callbar{display:none}
  body{padding-bottom:0}
  .nav{max-height:calc(100vh - var(--head-h));max-height:calc(100svh - var(--head-h));overflow-y:auto}
}
.logo{display:flex;align-items:center;min-height:44px}

/* ===== nagłówek: menu w drugim rzędzie zamiast „hamburgera” ===== */
.top .wrap{gap:8px}
.nav{margin-left:auto}
.nav a.nl.nl-contact{display:none}
.top-cta{min-height:46px;padding:0 22px;margin-left:8px}
.langsw{margin-left:10px}
@media (max-width:900px){
  :root{--head-h:108px}
  .burger{display:none!important}
  .top .wrap{height:auto;flex-wrap:wrap;padding-top:8px;row-gap:2px}
  .logo{order:1}
  .langsw{order:2;margin:0 0 0 auto}
  .top-cta{display:none}
  .nav,.nav.open{order:3;display:flex;position:static;flex:1 1 100%;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:2px;margin:0 calc(-1 * var(--gutter));padding:2px var(--gutter) 8px;background:none;border:0;box-shadow:none;max-height:none;
    overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
  .nav::-webkit-scrollbar{display:none}
  .nav a.nl{flex:none;padding:0 11px;min-height:40px;display:inline-flex;align-items:center;font-size:15px;white-space:nowrap;border-bottom:0;scroll-snap-align:start}
  .nav a.nl.nl-contact{display:none}
}
@media (max-width:900px) and (max-height:500px){
  :root{--head-h:92px}
  .top .wrap{padding-top:4px}
  .nav,.nav.open{padding-bottom:4px}
  .nav a.nl{min-height:40px}
  .nav a.nl.nl-contact{display:inline-flex}
  :root{--head-h:96px}
}
@media (max-width:380px){.nav a.nl{padding:0 9px}}
@media (max-width:340px){.nav a.nl{padding:0 7px;font-size:14px}.nav,.nav.open{gap:0}}