/* Rekomendacje z LinkedIna — przesuwany rząd kart (decyzja Michała 2026-10-22), wspólny dla strony głównej
   i stron usług (inc/recs.php). Komputer: 3 karty w widoku, kolejna wystaje z prawej. */
.recs__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; }
.recs__nav{ display:flex; gap:8px; flex:none; margin-bottom:24px; }
.recs__nav[hidden]{ display:none; }
.recs__btn{
  width:44px;
  height:44px;
  border-radius:50%;
  border:1px solid var(--line-strong);
  background:transparent;
  color:var(--wm-forest);
  font:inherit;
  font-size:18px;
  cursor:pointer;
}
.recs__btn:hover:not(:disabled){ border-color:var(--wm-neoblue); color:var(--wm-neoblue); }
.recs__btn:focus-visible{ outline:2px solid var(--wm-neoblue); outline-offset:2px; }
.recs__btn:disabled{ opacity:.35; cursor:default; }
.recs{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:calc((100% - 28px) / 3.15); /* 3 pełne karty + skrawek czwartej */
  gap:14px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  scrollbar-width:none;
  overscroll-behavior-x:contain;
}
.recs::-webkit-scrollbar{ display:none; }
.recs--fit{ grid-auto-columns:calc((100% - 28px) / 3); } /* do 3 kart: wypełniają rząd, nic nie wystaje */
.recs > .rec{ scroll-snap-align:start; }
@media (prefers-reduced-motion:reduce){ .recs{ scroll-behavior:auto; } }
.recs__more{ margin:22px 0 0; }
.recs__more a{ color:var(--wm-neoblue); font-weight:600; }
.recs__more a:hover{ text-decoration:underline; text-underline-offset:3px; }

.rec{
  margin:0;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:18px;
  padding:22px;
  border:1px solid var(--line-strong);
  border-radius:var(--radius);
}
.rec blockquote{ margin:0; font-size:15px; line-height:1.6; color:var(--text); }
.rec figcaption{ display:flex; gap:10px; align-items:center; font-size:13px; color:var(--muted); }
.rec figcaption i{
  flex:none;
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border-radius:50%;
  background:var(--wm-forest-10);
  color:var(--wm-forest);
  font-style:normal;
  font-weight:700;
}
.rec figcaption img{
  flex:none;
  width:48px;
  height:48px;
  border-radius:50%;
  object-fit:cover;
}
.rec figcaption b{ display:block; color:var(--text); font-size:14px; }
.rec figcaption a{ color:var(--wm-neoblue); }
.rec figcaption b a{ color:inherit; text-decoration:none; }   /* nazwisko = profil osoby, jak w polecajce we wpisach */
.rec figcaption b a:hover{ text-decoration:underline; }

@media (max-width:960px){
  .recs, .recs--fit{ grid-auto-columns:calc((100% - 14px) / 2.15); }
}
@media (max-width:760px){
  /* Telefon: przesuwanie palcem, wystający skrawek kolejnej karty zamiast strzałek */
  .recs, .recs--fit{ grid-auto-columns:85%; }
  .recs__nav{ display:none; }
}