.wire-free-500-animation-setup-section {
  .section-content {
    width: 100%;
    height: 100vh;
    position: relative;
    overflow: visible;

    @media (max-width: 768px) {
      height: 624px;

      .background-image {
        height: 100%;
      }
    }

    .background-image {
      width: 100%;
      z-index: 0;
      opacity: 0;
      position: relative;

      picture,
      img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }

    .content-image-wrapper {
        width: 100%;
        position: absolute;
        top: calc(13% - 4px);
        left: -5px;
        z-index: 1;

        @media (max-width: 768px) {
          top: 0;
          left: 0;
        }

      .content-image-wrapper-picture {
        width: 100%;
        height: 100%;
        will-change: transform;
        display: flex;
        justify-content: center;
        
        img {
            position: relative;

            @media (max-width: 768px) {
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
        }
      }
    }

    .background-images-container-mark {
      display: none;

      @media (max-width: 768px) {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
        display: block;
        background: linear-gradient(180deg, rgba(182, 204, 218, 0.00) 0%, #B6CCDA 100%);
      }
    }

    .background-image-mark {
      display: block;
      position: absolute;
      left: 0;
      bottom: -1px;
      width: 100%;
      height: 30vh;
      background: linear-gradient(180deg, rgba(189, 207, 218, 0) 0%, #BBCEDC 78.37%, #B6CCDA 100%);
      z-index: 1;
      opacity: 0;
      will-change: opacity;

      @media (max-width: 768px) {
        height: 100px;
      }
    }

    .VIAX-wire_free_animation-images-container {
      display: none;
      padding: 0 24px;

      @media (max-width: 768px) {
        display: flex;
        justify-content: center;
        gap: 15px 9px;
        position: relative;
        z-index: 1;
        bottom: 280px;
        flex-wrap: wrap;
      }

      .images-container-item {
        position: relative;
        height: 100%;

        img {
          width: 167px;
          min-height: 162px;
          object-fit: cover;
          border-radius: 16px;

          @media (max-width: 768px) {
            width: 100%;
            min-height: 94px;
            height: 94px;
            border-radius: 8px;
          }
        }

        .images-container-item-text {
          width: 100%;
          display: flex;
          flex-direction: column;
          align-items: center;

          @media (max-width: 768px) {
            color: #1A1A1A;
            text-align: center;
            font-family: "MiSans Latin VF";
            font-size: 14px;
            font-style: normal;
            font-weight: 520;
            line-height: 130%;
          }

          .item-text-title {
            font-size: 100px;
            line-height: 0.8;

            @media (max-width: 768px) {
              font-size: 48px;
            }
          }

          .item-text-subtitle {
            font-size: 28px;
            font-weight: bold;
            line-height: 1;

            @media (max-width: 768px) {
              font-size: 12px;
            }
          }

          .item-text-text {
            font-size: 16px;

            @media (max-width: 768px) {
              color: #1A1A1A;
              text-align: center;
              font-size: 14px;
              font-weight: 520;
              line-height: 130%;
            }
          }
        }

        &.images-container-item-one {
          width: 100%;
          min-height: 94px;
          display: flex;
          justify-content: center;
          border-radius: 10.162px;
          background: linear-gradient(135deg, #F5E7BE 0%, #C69E6D 96.43%);
          border: 1px solid rgba(255, 255, 255, 0.45);

          .images-container-item-text-one {
            display: flex;
            flex-direction: row;
            justify-content: center;
            gap: 3px;

            .item-text-title {
              color: #1A1A1A;
              text-align: center;
              font-size: 65px;
              font-weight: 520;
              line-height: 120%;
            }

            .item-text-subtitle {
              color: #1A1A1A;
              font-size: 25px;
              font-weight: 520;
              line-height: 100%;
            }

            .item-text-text {
              color: #1A1A1A;
              font-size: 14px;
              font-weight: 520;
              line-height: 100%;
            }
          }

          .images-container-item-sub-text {
            display: flex;
            flex-direction: column;
            align-items: start;
          }
        }

        &.images-container-item-other {
          width: 30%;

          img {
            width: 100%;
            height: 100%;
          }
        }
      }
    }
  }
}