/* TOR B: 02 realizacje. Karuzela i jej style 1:1 z produkcji (refresh.css, bundle). Tu tylko dodatki v6. */
.r55-home-gallery .rf-slide[data-pos="c"] .rf-slide_frame{cursor:pointer;transition:transform .3s var(--e-out)}
@media (hover:hover) and (pointer:fine){
  .r55-home-gallery .rf-slide[data-pos="c"] .rf-slide_frame:hover{transform:translateY(-6px)}
}
html.rf-reduced .r55-home-gallery .rf-slide_frame{transition:none}

/* KOREKTA 4 (TOR A): układ S2 wg mkvision. Biegnący pas "Wybrane realizacje" (tekst + gwiazdka), pod nim rząd: biała karta
 * "Nasze realizacje" (etykieta, nagłówek z kursywą, licznik, przycisk) + karuzela produkcji (mechanika bez zmian, tylko szerokość).
 * Dół sekcji: zapas na zaokrąglony róg ciemnej S3 (flow.css). Brak poziomego wycieku: overflow-x clip na sekcji. */
#realizacje.rz{padding:clamp(40px,4.4444vw,64px) 0 calc(var(--fl-r,40px) + clamp(80px,7.7778vw,112px));overflow-x:clip}
.rz-mq{position:relative;overflow:hidden;margin:0 0 clamp(36px,3.8889vw,56px);pointer-events:none;user-select:none;-webkit-user-select:none}
.rz-mq_track{display:flex;width:max-content;will-change:transform}
.rz-mq_it{display:flex;flex:none;align-items:center;gap:.3em;padding-right:.3em;white-space:nowrap;font-family:var(--f-text);font-weight:700;font-size:clamp(56px,8.3333vw,120px);line-height:1.16;letter-spacing:-.035em;color:var(--ink)}
.rz-mq_star{flex:none;display:block;width:.4em;height:.4em;fill:var(--red)}
.rz-row{display:grid;grid-template-columns:minmax(0,330px) minmax(0,1fr);gap:var(--gap);align-items:stretch;padding:0 var(--m)}
.rz-intro{display:flex;flex-direction:column;justify-content:space-between;gap:40px;min-width:0;padding:32px 30px 30px;border-radius:24px;background:#fff}
.rz-kick{display:flex;align-items:center;gap:10px;margin:0 0 22px;color:#6B6B66}
.rz-dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--red)}
.rz-h{margin:0;font-size:clamp(36px,3.3333vw,48px);line-height:1.04;letter-spacing:-.02em;font-weight:700}
.rz-badge{display:inline-grid;place-items:center;min-width:30px;height:24px;margin-left:10px;padding:0 8px;border-radius:999px;background:var(--red);color:var(--paper);font:700 13px/1 var(--f-text);letter-spacing:0;vertical-align:.9em}
.rz-btn{align-self:flex-start}
.rz-car{position:relative;min-width:0}
.rz-car .rf-car{--sw:min(44vw,700px);left:auto;width:100%;margin:0;padding-top:0;border-radius:24px}
@media (max-width:1023px){
  #realizacje.rz{padding:28px 0 calc(var(--fl-r,28px) + 64px)}
  .rz-mq{margin-bottom:28px}
  .rz-mq_it{font-size:clamp(44px,13vw,64px)}
  .rz-row{grid-template-columns:minmax(0,1fr);gap:20px;padding:0}
  .rz-intro{flex-direction:row;flex-wrap:wrap;align-items:flex-end;gap:20px;margin:0 var(--m);padding:24px 22px}
  .rz-car .rf-car{--sw:min(78vw,560px);border-radius:0}
}

/* KOREKTA 6 (18.10, Rafał: "wywal ten panel z lewej, wyśrodkuj i powiększ realizacje"): bez białej karty "Nasze realizacje".
   Karuzela na całą szerokość strony, wyśrodkowana, kadr aktywny większy (--sw do 1240 px) i pas nad nią bez zmian. */
.rz-row{display:block;padding:0}
.rz-car{width:100%}
.rz-car .rf-car{--sw:min(78vw,1240px);width:100%;left:auto;margin:0 auto;padding-top:.4rem;border-radius:0}
.rz-car .rf-car_bar{width:min(92vw,var(--sw))}
@media (max-width:1023px){
  .rz-car .rf-car{--sw:min(86vw,640px)}
}
@media (max-width:700px){
  .rz-car .rf-car{--sw:84vw}
}

/* KOREKTA 7: mobile. Pas "Wybrane realizacje" nie ucięty u startu (pierwsze słowo w pełni widoczne przed ruchem), mniejsza luka nad karuzelą */
@media (max-width:1023px){
  .rz-car .rf-car{margin-top:0}
  #realizacje.rz{padding-top:36px}
  .rz-mq{margin-bottom:20px}
  .rz-mq_it{font-size:clamp(40px,11.4vw,56px)}
  .rz-car .rf-car_bar{margin-top:.9rem}
}

/* KOREKTA 9 (18.10): stary styl produkcji (.r55-home-gallery / wrapper sekcji) dawał #realizacje zewnętrzne marginesy 110 px u góry i u dołu,
   przez co na telefonie wychodziły puste pasy ok. 220 px nad pasem i pod karuzelą. Odstępy ma tylko padding sekcji. */
#realizacje.rz{margin-top:0!important;margin-bottom:0!important}
@media (max-width:1023px){#realizacje.rz{padding-bottom:calc(var(--fl-r,28px) + 36px)}}

/* KOREKTA R2-C (18.10, Rafał: "dodaj z powrotem rozmycie z lewej i prawej a pod spodem przycisk zobacz więcej realizacji"):
   blok P5 usunięty, boczne slajdy znów rozmyte (stan z 18.10 15:59/17:06). Pod paskiem karuzeli pigułka z obrysem (.pill.pill--out, efekt btnfx). */
.rz-more{display:flex;justify-content:center;margin-top:40px;padding:0 var(--m)}
/* przycisk przejmuje rolę domknięcia sekcji: mniejszy dolny zapas na desktopie (mobile: KOREKTA 9 bez zmian) */
@media (min-width:1024px){#realizacje.rz{padding-bottom:calc(var(--fl-r,40px) + clamp(56px,5vw,72px))}}
@media (max-width:1023px){.rz-more{margin-top:22px}}

/* KOREKTA R3-C (18.10, Rafał: "zmniejsz trochę karuzelę by było więcej oddechu" + "obwód czerwony na guziku zobacz więcej realizacji zrób na grafitowo ciemny"):
   kadr aktywny ok. 13,5% mniejszy na komputerze (78vw/1240 px -> 67.5vw/1072 px), ok. 8% na telefonie (84vw -> 77vw); boki liczy carousel.js
   od --sw, więc rozmycie, maska i proporcje boków bez zmian. Pionowe odstępy sekcji na komputerze +32 px (góra, pas -> karuzela, karuzela -> przycisk, dół).
   Obrys przycisku pod karuzelą: grafit #26282B zamiast czerwieni (tylko ten guzik; nakładka koła .bf-o dziedziczy box-shadow, więc po hoverze też grafit). */
.rz-car .rf-car{--sw:min(67.5vw,1072px)}
/* perspektywa produkcji (1700 px) skalowana razem z kadrem, żeby rozmyte boki zachowały ten sam wygląd i proporcje względem środka */
.rz-car .rf-car--on .rf-car_track{perspective:1470px}
.rz-more .pill.pill--out{box-shadow:inset 0 0 0 1px #26282B}@media (hover:hover) and (pointer:fine){html .rz-more .pill.pill--out:is(:hover,:focus-visible,:active){box-shadow:inset 0 0 0 1px #26282B}}
@media (min-width:1024px){
  #realizacje.rz{padding-top:calc(clamp(40px,4.4444vw,64px) + 32px);padding-bottom:calc(var(--fl-r,40px) + clamp(56px,5vw,72px) + 32px)}
  .rz-mq{margin-bottom:calc(clamp(36px,3.8889vw,56px) + 32px)}
  .rz-more{margin-top:72px}
}
@media (max-width:1023px){
  .rz-car .rf-car{--sw:min(79vw,590px)}
  .rz-car .rf-car--on .rf-car_track{perspective:1560px}
  .rz-mq{margin-bottom:28px}
  .rz-more{margin-top:28px}
}
@media (max-width:700px){
  .rz-car .rf-car{--sw:77vw}
}
