.album-section-wrap  {
  position: relative;
  z-index: 2;
}

.album-slider, .collection-carousel__wrap {
  overflow: hidden;
  .swiper-navigation.style--modern {

    --swiper-size: 20px;
    @media only screen and (min-width: 1024px) {
      --swiper-size: 22px;
    }
  }
}

content-slider.swiper-container {
  width: 100%;
  display: block;
  overflow: visible;
  &>ul.swiper-wrapper {
    margin: 1.75rem auto;
  }
  .swiper-button-disabled {
    opacity: 0.1
  }
}
.icon-link__wrap {
  margin-left: -4px;
  li {
    display: inline-block;
  }
  .icon-link {
    color: inherit;
    margin: 4px;
    padding: 2px;
    display: inline-block;

    svg {
      width: 1.25em;
      height: 1.25em;
      object-fit: cover;
      object-position: 50% 50%;
    }
  }
}

ul.album-slides {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  .album-slide , .carousel-slide {
    flex: 1 1 280px;
    margin: var(--grid-desktop-horizontal-spacing) var(--grid-desktop-vertical-spacing);

    @media only screen and (max-width: 749px) {
       margin: var(--grid-mobile-horizontal-spacing) var(--grid-mobile-vertical-spacing);
    }
  }
  &.full-width {
    .album-slide , .carousel-slide{
      flex:  0 0 100%;
      margin-left: auto;
      margin-right: auto;
       @media only screen and (min-width: 1420px) {
          flex:  1 0 800px;
          min-width: 45%;
          margin: var(--grid-mobile-horizontal-spacing) var(--grid-mobile-vertical-spacing);
       }

    }
  }
}

.collection-carousel[data-full-width=true][data-effect="coverflow"] {
  max-width: clamp(50vh, 500px, 85vw);
}

.album-slide,
.swiper-slide.album-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  box-sizing: border-box;
  transition: opacity 300ms ease, transform 300ms ease;
  &.swiper-slide {
    height: auto;
  }

  .album-slide__cover, .album-slide__content {
    max-width: 600px;
    margin: 0 auto 1.5rem;

    @media only screen and (max-width: 479px) {
      margin-bottom: 0;
    }
  }

  .album-slide__cover {
    svg {
      width: 100%;
      height: auto;
    }
  }

  &.layout--columns {
    width: auto;
    flex-direction: column;
    flex: 1 1 300px;
    max-width: 500px;
    justify-content: flex-start;
    height: auto !important;

    .swiper-initialized &  {
      flex: none;
    }

    @media only screen and (min-width: 1420px) {
      width: 450px;
      max-width: 650px;
    }
    .album-slide__cover, .album-slide__content {
      width: 100%;
    }
    .album-slide__content {
      margin: 1.5rem auto 0;
       h3.heading:first-child {
        margin-top: 0;
      }
    }
  }

  &.layout--full-width {
    @media only screen and (min-width: 750px) {
      flex-wrap: nowrap;

      margin: auto;
    }
    .album-slide__content,
    .album-slide__cover {
      margin: 0 0 1.5rem;

      @media only screen and (max-width: 479px) {
        margin-bottom: 0;
      }
    }

    .album-slide__cover {
      flex: 1 1 300px;
      max-width: 450px;
      @media only screen and (min-width: 1024px) {
        max-width: 500px;
      }
    }
    .album-slide__content {
      flex: 1 1 250px;
      max-width: 450px;
      padding: clamp(1.5rem, calc(1.2rem + 2.1vw), 4.5rem);

      @media only screen and (max-width: 479px) {
        padding-bottom: 0;
      }
    }
  }
}
li.swiper-slide.album-slide.layout--full-width.swiper-slide-prev, li.swiper-slide.album-slide.layout--full-width.swiper-slide-next {
    opacity: 0.4;
}

.album-slide .swiper-lazy-preloader {
  display: none;
}

.swiper-container-initialized .album-slide {
    flex: none;
  }
