.js-slick-img-carousel-wrapper {
  padding: 38px 40px;
  background: rgba(253, 245, 238, 1);

  @media (min-width: 1200px) {
    padding: 69px 86px;
  }

  .js-slick-img-carousel {
    @media (min-width: 768px) {
      display: flex;
      gap: 30px;

      & > * {
        flex: 1;
      }
    }
  }

  .img-carousel-slide {
    position: relative;
  }

  img {
    aspect-ratio: 1 / 1;
    object-fit: cover;
  }

  .text-overlay {
    position: absolute;
    top: 17px;
    left: 18px;
    z-index: 2;

    p {
      font-size: 10vw;
      font-family: DrukWide, sans-serif;
      color: black;
      text-align: center;
      line-height: 1.1;
      letter-spacing: 0.05em;

      @media (min-width: 768px) {
        font-size: 38px;
      }
      @media (min-width: 1400px) {
        font-size: 38px;
      }
    }
  }

  .slick-dots {
    display: flex;
    margin-top: 30px;

    li {
      flex: 1;
      width: 100%;
      height: auto;
      margin: 0;

      &.slick-active {
        button {
          opacity: 1;
        }
      }

      button {
        width: 100%;
        padding: 0;
        height: 3px;
        background: black;
        opacity: 0.3;

        &:before {
          display: none;
        }
      }
    }
  }
}