/* mojszablon – slider newsów w wersji kompaktowej; plik dołącza układ modułu slider.php */
/* Slider w wersji kompaktowej: zdjęcie zawsze 16:9 (kadrowane), mniejszy tytuł, zajawka max 3 linijki.
   Style są tutaj, żeby nie zmieniać style.css – nadpisują jego reguły slidera. */
.news--compact .slide__media { aspect-ratio: 16 / 9; min-height: 0; position: relative; overflow: hidden; }
.news--compact .slide__body { padding: 18px 18px 20px; gap: 10px; }
.news--compact .slide__title { font-size: clamp(19px, 4.6vw, 24px); line-height: 1.22; letter-spacing: -.015em;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; }
.news--compact .slide__body p { margin: 0; font-size: 15px; line-height: 1.55;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; }
.news--compact .slide .btn { margin-top: 2px; }

/* tablet: zdjęcie nad tekstem (obok byłoby za niskie przy 16:9) */
@media (min-width: 768px) and (max-width: 1099px) {
  .news--compact { padding: 32px 0 48px; }
  .news--compact .slide { grid-template-columns: 1fr; }
  .news--compact .slide__body { padding: 24px 28px 28px; }
  .news--compact .slider__controls { position: static; width: auto; }
}

/* komputer: zdjęcie 16:9 po lewej, tekst po prawej; przycisk i strzałki w jednej linii na dole */
@media (min-width: 1100px) {
  .news--compact { padding: 32px 0 56px; }
  .news--compact .slide { grid-template-columns: 7fr 5fr; align-items: stretch; }
  .news--compact .slide__media { align-self: start; }
  .news--compact .slide__body { padding: 30px 36px 30px; justify-content: flex-start; }
  .news--compact .slide__title { font-size: clamp(21px, 1.85vw, 27px); }
  .news--compact .slide .btn { margin-top: auto; }
  .news--compact .slider__controls { right: 36px; bottom: 30px; width: auto; gap: 18px; justify-content: flex-end; }
  .news--compact .slider__count { min-width: 56px; text-align: right; }
  .news--compact .slider__tabs { gap: 18px; }
  .news--compact .slider__tab { padding-top: 12px; }
  .news--compact .slider__tab-title { font-size: 14px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
}
