/* KOPIA 1:1 wzorca z https://redford-sub-strony.vercel.app/v6/sub/strony/css/strony.css (pobrane 20.10.2026 13:03, karta R9-B). Nie edytować; zmiany dla Taxi w taxi.css / taxi.js. 
 * R10 (t_781dd77a): usunięte martwe reguły sekcji "Jak pracujemy" (.sp-pr-*) i "Czas i etapy" (.sp-czas*). */
/* REDFORD V6 · strony.css: podstrona /strony-internetowe-warszawa/ (sub/strony, 19.10.2026).
 * Ładowany PO wspólnych arkuszach (tokens, base, nav, offer, faq, footer, flow, cookies, btnfx, mkfx). Tylko klasy sp-*, sk-*
 * oraz lokalne nadpisania sekcji wspólnych w obrębie tej strony. Jeden krój (--f-text), akcent tylko kolorem, tło płaskie. */

/* ---------- przejścia sekcji jak flow.css: sekcja w innym kolorze wchodzi NAD poprzednią z zaokrągloną górą ---------- */
#start,#dla-kogo,#zakres,#technologie,#sp-realizacje,#problem,#inne-uslugi{position:relative;isolation:isolate}
#dla-kogo,#zakres,#technologie,#sp-realizacje{margin-top:calc(-1 * var(--fl-r));border-radius:var(--fl-r) var(--fl-r) 0 0}
#start,#zakres,#sp-realizacje,#problem,#inne-uslugi{background:var(--paper);color:var(--ink)}
#dla-kogo,#technologie{background:var(--ink);color:var(--paper)}

/* ---------- wspólne elementy podstrony ---------- */
.sp-k{display:flex;align-items:center;gap:12px;margin:0 0 28px;font:700 var(--fs-lbl)/1.2 var(--f-text);letter-spacing:var(--ls-lbl);text-transform:uppercase;color:rgba(243,243,239,.62)}
.sp-k::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--red)}
.sp-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:end;margin-bottom:clamp(40px,4.4vw,64px)}
.sp-h2{grid-column:1/span 7;margin:0;font:700 var(--fs-h2)/var(--lh-h) var(--f-text);letter-spacing:var(--ls-h)}
.sp-go{flex:none;display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%}

/* ---------- HERO ---------- */
.sp-hero{padding:clamp(128px,15vh,168px) 0 calc(var(--fl-r) + clamp(80px,9vh,120px))}
.sp-hero-top{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:clamp(28px,3.3vw,48px)}
.sp-crumbs ol{display:flex;flex-wrap:wrap;align-items:center;margin:0;padding:0;list-style:none;font:700 var(--fs-sm)/1.3 var(--f-text);color:#6B6B66}
.sp-crumbs li+li::before{content:"/";margin:0 10px;color:rgba(14,14,14,.3)}
.sp-crumbs a{color:var(--ink);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .5s var(--e-out)}
.sp-crumbs a:hover,.sp-crumbs a:focus-visible{background-size:100% 1px}
.sp-eyebrow{margin:0;font:700 var(--fs-lbl)/1.2 var(--f-text);letter-spacing:var(--ls-lbl);text-transform:uppercase;color:var(--red)}
.sp-h1{max-width:13.5em;margin:0;font:700 var(--fs-xl)/var(--lh-h) var(--f-text);letter-spacing:-.035em;text-wrap:balance}
.sp-hero-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:start;margin-top:clamp(40px,4.4vw,64px)}
.sp-hero-txt{grid-column:1/span 5;padding-top:6px}
.sp-lead{max-width:19em;margin:0;font-size:var(--fs-lead);line-height:1.22;letter-spacing:-.01em}
.sp-hero-cta{margin-top:clamp(28px,2.8vw,40px)}
.sp-en{margin:24px 0 0;max-width:30em;font-size:var(--fs-sm);line-height:1.45;color:#6B6B66}
.sp-en[hidden]{display:none}

/* szkielet strony: okno przeglądarki z klockami sekcji (SVG); stan końcowy bez JS i przy reduced motion */
.sp-sk{grid-column:7/-1;margin:0}
.sk-win{position:relative;overflow:hidden;border-radius:18px;background:var(--ink);will-change:clip-path}
.sk-svg{display:block;width:100%;height:auto;overflow:visible}
.sk-b{will-change:transform}
.sk-bar circle{fill:rgba(243,243,239,.22)}
.sk-bar rect,.sk-div{fill:rgba(243,243,239,.08)}
.sk-o{opacity:.15}
.sk-o>*{fill:none;stroke:var(--paper);stroke-opacity:.5;stroke-width:1.25;vector-effect:non-scaling-stroke}
.sk-leg{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);margin:18px 0 0;padding:0;list-style:none;font:700 var(--fs-lbl)/1.3 var(--f-text);color:var(--ink)}
.sk-leg li{min-width:0}
.sk-leg i{display:block;position:relative;height:2px;margin-bottom:10px;background:rgba(14,14,14,.12);overflow:hidden}
.sk-leg b{position:absolute;inset:0;background:var(--red);transform-origin:0 50%}
.sk-leg span{margin-right:8px;color:#6B6B66;font-variant-numeric:tabular-nums}

/* ---------- DLA KOGO (ciemna) ---------- */
.sp-dk{padding:clamp(96px,10vw,152px) 0 calc(var(--fl-r) + clamp(88px,9vw,136px))}
.sp-big{max-width:25em;margin:0;font:700 clamp(28px,3.3vw,50px)/1.14 var(--f-text);letter-spacing:-.02em}
.sp-dk-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);margin-top:clamp(40px,4.4vw,64px)}
.sp-dk-p{grid-column:7/-1;max-width:28em;margin:0;font-size:clamp(18px,1.5vw,22px);line-height:1.45;color:rgba(243,243,239,.68)}

/* ---------- ZAKRES: wiersze z numerem i strzałką (jak "Wszystko dla mocnej strony") ---------- */
.sp-zk{padding:clamp(96px,9vw,136px) 0 calc(var(--fl-r) + clamp(80px,8vw,120px))}
.sp-zk-list{margin:0;padding:0;list-style:none;border-top:1px solid rgba(14,14,14,.14)}
.sp-zk-row{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr) 52px;align-items:center;column-gap:24px;min-height:104px;padding:22px 0}
.sp-zk-ln{position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(14,14,14,.14);transform-origin:0 50%}
.sp-zk-n{font:700 14px/1 var(--f-text);letter-spacing:.08em;color:#6B6B66;font-variant-numeric:tabular-nums}
.sp-zk-t{max-width:34em;font:700 clamp(20px,2vw,30px)/1.25 var(--f-text);letter-spacing:-.015em;transition:transform .55s var(--e-out),color .35s var(--e-out)}
.sp-zk-t::first-letter{text-transform:uppercase}
.sp-zk-go{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(14,14,14,.2);font-size:20px;line-height:1;color:var(--red);transition:background-color .35s var(--e-out),color .35s var(--e-out),box-shadow .35s var(--e-out),transform .45s var(--e-out)}
@media (hover:hover){
  .sp-zk-row:hover .sp-zk-t{transform:translateX(12px)}
  .sp-zk-row:hover .sp-zk-go{background:var(--red);color:var(--paper);box-shadow:inset 0 0 0 1px var(--red);transform:rotate(-45deg)}
}


/* ---------- CENNIK (offer.css) z blokiem "Czas i etapy" ---------- */
.sp-of{padding-top:clamp(96px,9vw,136px);padding-bottom:calc(var(--fl-r) + 112px)}
.sp-of .of-grid{margin-top:40px}

/* ---------- TECHNOLOGIE (ciemna) ---------- */
.sp-tech{padding:clamp(96px,9vw,136px) 0 calc(var(--fl-r) + clamp(88px,9vw,136px))}
.sp-tech-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:start}
.sp-tech .sp-h2{grid-column:1/span 4}
.sp-tech-txt{grid-column:6/-1}
.sp-tech-big{margin:0;font:700 clamp(24px,2.5vw,36px)/1.24 var(--f-text);letter-spacing:-.015em}
.sp-tech-p{margin:32px 0 0;max-width:32em;font-size:clamp(18px,1.5vw,22px);line-height:1.45;color:rgba(243,243,239,.68)}

/* ---------- REALIZACJE ---------- */
.sp-rz{padding:clamp(96px,9vw,136px) 0 clamp(64px,7vw,104px)}
.sp-rz .sp-h2{grid-column:1/span 6}
.sp-rz-lead{grid-column:8/-1;margin:0;font-size:var(--fs-txt);line-height:1.45;color:#3A3A37}
.sp-rz-lead a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:color .3s var(--e-out)}
.sp-rz-lead a:hover{color:var(--red)}
.sp-rz-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(48px,4.4vw,64px) var(--gap);margin:0;padding:0;list-style:none}
.sp-rz-a{display:block;color:inherit;text-decoration:none}
.sp-rz-img{aspect-ratio:16/10;overflow:hidden;border-radius:20px;background:var(--tone)}
.sp-rz-img img{display:block;width:100%;height:112%;object-fit:cover;object-position:50% 0;will-change:transform}
.sp-rz-meta{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:22px}
.sp-rz-name{margin:0;font:700 var(--fs-h3)/1.1 var(--f-text);letter-spacing:-.02em;transition:color .35s var(--e-out)}
.sp-rz-go{flex:none;display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(14,14,14,.2);font-size:20px;line-height:1;transition:background-color .35s var(--e-out),color .35s var(--e-out),box-shadow .35s var(--e-out),transform .45s var(--e-out)}
.sp-rz-d{margin:10px 0 0;max-width:30em;font-size:var(--fs-txt);line-height:1.45;color:#3A3A37}
.sp-rz-a:hover .sp-rz-name,.sp-rz-a:focus-visible .sp-rz-name{color:var(--red)}
.sp-rz-a:hover .sp-rz-go,.sp-rz-a:focus-visible .sp-rz-go{background:var(--red);color:var(--paper);box-shadow:inset 0 0 0 1px var(--red);transform:rotate(-45deg)}
.sp-rz-a:focus-visible{outline:2px solid var(--red);outline-offset:6px;border-radius:20px}

/* ---------- NAJPIERW USTALAMY PROBLEM ---------- */
.sp-pb{padding:clamp(56px,6vw,96px) 0 clamp(72px,7vw,112px)}
.sp-pb-in{display:flex;flex-direction:column;align-items:center;text-align:center}
.sp-pb-in::before{content:"";width:10px;height:10px;margin-bottom:32px;border-radius:50%;background:var(--red)}
.sp-pb-h{max-width:12em;margin:0;font:700 var(--fs-88)/var(--lh-h) var(--f-text);letter-spacing:var(--ls-h);text-wrap:balance}
.sp-pb-p{max-width:30em;margin:28px 0 0;font-size:var(--fs-lead);line-height:1.3;color:#3A3A37;text-wrap:balance}

/* ---------- INNE USŁUGI ---------- */
.sp-in{padding:clamp(56px,6vw,96px) 0 clamp(96px,9vw,136px)}
.sp-in-list{margin:clamp(32px,3.3vw,48px) 0 0;padding:0;list-style:none;border-top:1px solid rgba(14,14,14,.14)}
.sp-in-a{display:grid;grid-template-columns:64px minmax(0,1fr) 52px;align-items:center;column-gap:24px;min-height:120px;padding:20px 0;border-bottom:1px solid rgba(14,14,14,.14);color:inherit;text-decoration:none}
.sp-in-n{font:700 14px/1 var(--f-text);letter-spacing:.08em;color:#6B6B66}
.sp-in-t{font:700 clamp(24px,2.8vw,40px)/1.15 var(--f-text);letter-spacing:-.02em;transition:transform .55s var(--e-out),color .35s var(--e-out)}
.sp-in-go{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(14,14,14,.2);font-size:20px;line-height:1;transition:background-color .35s var(--e-out),color .35s var(--e-out),box-shadow .35s var(--e-out),transform .45s var(--e-out)}
.sp-in-a:hover .sp-in-t,.sp-in-a:focus-visible .sp-in-t{transform:translateX(12px);color:var(--red)}
.sp-in-a:hover .sp-in-go,.sp-in-a:focus-visible .sp-in-go{background:var(--red);color:var(--paper);box-shadow:inset 0 0 0 1px var(--red);transform:rotate(-45deg)}
.sp-in-a:focus-visible{outline:2px solid var(--red);outline-offset:4px}

/* ---------- KONTAKT: adres z produkcji pod przyciskami ---------- */
.sp-ct-addr{margin:24px 0 0;font:700 var(--fs-sm)/1.45 var(--f-text);color:rgba(243,243,239,.78)}

/* ---------- poniżej desktopu ---------- */
@media (max-width:1023px){
  .sp-head{display:block}
  .sp-hero{padding:112px 0 calc(var(--fl-r) + 64px)}
  .sp-hero-top{flex-direction:column;align-items:flex-start;gap:12px}
  .sp-h1{font-size:clamp(40px,11.2vw,64px);letter-spacing:-.03em}
  .sp-hero-row{grid-template-columns:minmax(0,1fr);row-gap:44px}
  .sp-hero-txt,.sp-sk{grid-column:1/-1}
  .sk-win{border-radius:14px}
  .sk-leg{gap:10px;margin-top:14px;font-size:12px}
  .sk-leg span{display:block;margin:0 0 2px}
  .sp-dk-row{display:block}
  .sp-zk-row{grid-template-columns:32px minmax(0,1fr) 40px;column-gap:12px;min-height:0;padding:20px 0}
  .sp-zk-n{font-size:12px}
  .sp-zk-t{font-size:19px}
  .sp-zk-go{width:40px;height:40px;font-size:16px}
  .sp-of{padding-top:96px;padding-bottom:calc(var(--fl-r) + 80px)}
  #kontakt .ct_h{font-size:clamp(36px,10.4vw,64px)}
  .sp-tech-in{display:block}
  .sp-tech-txt{margin-top:28px}
  .sp-rz-lead{margin-top:20px}
  .sp-rz-grid{grid-template-columns:minmax(0,1fr)}
  .sp-rz-img{border-radius:16px}
  .sp-rz-go{width:44px;height:44px;font-size:18px}
  .sp-pb-h{font-size:clamp(36px,10vw,56px)}
  .sp-pb-p{font-size:20px}
  .sp-in-a{grid-template-columns:32px minmax(0,1fr) 40px;column-gap:12px;min-height:96px}
  .sp-in-n{font-size:12px}
  .sp-in-t{font-size:22px}
  .sp-in-go{width:40px;height:40px;font-size:16px}
}
@media (prefers-reduced-motion:reduce){
  .sp-zk-row:hover .sp-zk-t,.sp-in-a:hover .sp-in-t{transform:none}
}