/* Strona glowna (O nas / About Us): film, uslugi + "O nas", zdjecie krow. Wartosci z PROD (strony 1199 i 7). */

/* --- Film w tle --- */
.hero {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 52.315vw;
  background: url("/assets/img/about-us-bg-hero.webp") 50% 50% / cover;
}

/* --- Uslugi + O nas --- */
.about {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 0 20px;
  background: var(--color-primary) url("/assets/img/about-services-ellipse-bg.svg") no-repeat 46% 27vw / 82.002vw auto;
  color: var(--color-white);
}

.about__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: min(100%, var(--content-width));
  margin: 0 auto;
  padding: 97px 0 165px;
}

.services {
  position: relative;
  display: flex;
  justify-content: space-evenly;
  gap: 7.523vw;
  width: 63.6vw;
  margin-bottom: 175px;
}

.service {
  position: relative;
  width: 16.262vw;
  max-width: 16.262vw;
  text-align: center;
}
/* Ikona w bloku o pelnej szerokosci: na PROD wyrownana do lewej mimo centrowanego tekstu. */
.service__icon { display: inline-block; width: 100%; margin: 0 0 12px; }
.service__icon img { display: block; }
.service__title {
  margin-bottom: 28px;
  font-weight: 700;
  color: var(--color-white);
}
.service--tight .service__title { line-height: 1em; }
.service__text {
  margin: 0;
  font-family: var(--font);
  font-size: var(--fs-small);
  font-weight: 500;
  line-height: var(--lh-body);
}

.about__title {
  position: relative;
  width: 53vw;
  max-width: 53vw;
  margin: 0 0 20px;
  font-size: 2.3rem;
  font-weight: 700;
  line-height: 1;
}
.about__text {
  position: relative;
  align-self: center;
  width: 53vw;
  max-width: 53vw;
  font-family: var(--font);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}
/* PL: drugi akapit byl na PROD blokiem bez marginesu */
.about--pl .about__text p:last-child { margin-bottom: 0; }
/* EN: inny naglowek (wezszy, wysrodkowany, cienszy) i wysrodkowany tekst */
.about--en .about__title { width: 23vw; max-width: 23vw; font-size: 2.4rem; font-weight: 500; text-align: center; }
.about--en .about__text { text-align: center; }

/* --- Zdjecie krow --- */
.cows {
  position: relative;
  min-height: 38.75vw;
  background: url("/assets/img/about-bg-2.webp") center / cover no-repeat;
}

@media (max-width: 1024px) {
  .about { background-position: 46% 87vw; }
  .about__inner { padding: 50px 0; }
  .services { margin-bottom: 30px; }
  .service { width: 33%; max-width: 33%; }
  .service__icon { margin-bottom: 0; }
  .service__title { margin-bottom: 10px; }
  .about__title,
  .about__text,
  .about--en .about__title { width: 100%; max-width: 100%; }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .services { width: 100%; }
}

@media (max-width: 767px) {
  .hero { min-height: 350px; --video-overlay: .5; }
  .about { background-position: 100% 100%; }
  .services { flex-wrap: wrap; width: 100%; }
  .service { width: 100%; max-width: 100%; }
}