.avs-image {
  display: block;
}


.avs-image > picture,
.avs-image > img {
  display: block;
  width: 100%;
  height: 100%;
}


.avs-image img {
  display: block;
  width: 100%;
  height: 100%;
  transform: scale(1);
  transition: transform 0.3s ease;
}

.avs-image__img--cover img,
.avs-image__img--cover {
  object-fit: cover;
}

.avs-image__img--contain img,
.avs-image__img--contain {
  object-fit: contain;
}


.avs-image--ratio-1x1,
.avs-image--ratio-4x3,
.avs-image--ratio-3x2,
.avs-image--ratio-16x9,
.avs-image--ratio-21x9 {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.avs-image--ratio-1x1 { aspect-ratio: 1 / 1; }
.avs-image--ratio-4x3 { aspect-ratio: 4 / 3; }
.avs-image--ratio-3x2 { aspect-ratio: 3 / 2; }
.avs-image--ratio-16x9 { aspect-ratio: 16 / 9; }
.avs-image--ratio-21x9 { aspect-ratio: 21 / 9; }

.avs-image--avs,
.avs-image--avs_flat {
  border-radius: 30px 30px 30px 3px;
  overflow: hidden;
  background: radial-gradient(circle at 10% 0, #e6f7f8 0, #ffffff 55%);
}

.avs-image--avs {
  box-shadow: 0 22px 45px rgba(0, 0, 0, 0.12);
}

.avs-image--avs_flat {
  box-shadow: none;
}

.avs-image--photo,
.avs-image--photo_flat {
  border-radius: 50% 50% 50% 3px;
  overflow: hidden;
  border: 15px solid var(--avs-primary);
}

.avs-image--photo {
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.18), 0 0 0 10px #ffffff;
}

.avs-image--photo_flat {
  box-shadow: 0 0 0 10px #ffffff;
}

/* Hover effect */
.avs-image:hover img {
  transform: scale(1.05);
}