/* Decorative service photos. Loaded only by front-page.php and scoped to #oferta. */
#oferta .mk-card--photo {
  isolation: isolate;
  background: #0a1820;
}

#oferta .mk-card--photo .mk-card__background {
  position: absolute;
  inset: 0;
  display: block;
  z-index: -2;
  pointer-events: none;
  opacity: .72;
}

#oferta .mk-card--photo .mk-card__background img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 65% center;
  filter: saturate(.82);
}

#oferta .mk-card--photo::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(6,16,22,.36) 0%, rgba(6,16,22,.72) 30%, rgba(6,16,22,.90) 65%, rgba(6,16,22,.95) 100%),
    linear-gradient(90deg, rgba(6,16,22,.42), rgba(6,16,22,.08));
}

#oferta .mk-card--photo::after {
  display: none;
}

#oferta .mk-card--wide.mk-card--photo {
  display: block;
}

#oferta .mk-card--wide.mk-card--photo .mk-card__content {
  max-width: 460px;
}

@media (min-width: 981px) {
  #oferta .mk-card--wide.mk-card--photo .mk-card__background img {
    object-position: 65% 42%;
  }
}

#oferta .mk-card--wide.mk-card--photo::before {
  background:
    linear-gradient(90deg, rgba(6,16,22,.96) 0%, rgba(6,16,22,.90) 42%, rgba(6,16,22,.50) 72%, rgba(6,16,22,.32) 100%),
    linear-gradient(180deg, rgba(6,16,22,.10) 0%, rgba(6,16,22,.50) 100%);
}

#oferta .mk-card--photo p {
  color: #c2d2d7;
}

#oferta .mk-card--photo .mk-card__number {
  background: rgba(6,32,40,.88);
}

@media (max-width: 980px) {
  #oferta .mk-card--wide.mk-card--photo::before {
    background:
      linear-gradient(180deg, rgba(6,16,22,.36) 0%, rgba(6,16,22,.72) 30%, rgba(6,16,22,.90) 65%, rgba(6,16,22,.95) 100%),
      linear-gradient(90deg, rgba(6,16,22,.42), rgba(6,16,22,.08));
  }
}

@media (max-width: 680px) {
  #oferta .mk-card--photo .mk-card__background img {
    object-position: 65% top;
  }
}