/* mobile-hero-contact-fix.css — poprawki mobilne */

/* 1) Hero: obraz nie wychodzi poza ramkę, skaluje się w poziomie */
.hero .hero-art{
  overflow: hidden;            /* trzyma zaokrąglenia */
  border-radius: 18px;
}
.hero .hero-art img{
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;           /* gdy obraz większy niż kontener */
}

/* 2) Uniwersalny padding po bokach na mobile (żeby treść nie kleiła się do krawędzi) */
@media (max-width: 900px){
  .container{
    padding-left: 16px;
    padding-right: 16px;
  }
  /* Sekcja kontakt miała inline: padding:40px 0 — nadpisujemy */
  .contact .container{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* 3) Karty/CTA niech mają oddech */
.card, .contact-cta, .cta-row{
  box-sizing: border-box;
}
@media (max-width: 900px){
  .cta-row, .contact-cta{
    padding-left: 4px;
    padding-right: 4px;
  }
}

/* 4) Na wszelki wypadek: obrazki w kartach i figure nie wychodzą poza kontenery */
figure img, .card img, .o-apacare .illu img{
  max-width: 100%;
  height: auto;
  display: block;
}