.app-container {
  .slider-big-elements {
    background-color: #191325;
    margin-top: -1px;

    .slider-nav {
      display: flex;
      width: 100%;
      margin: auto;
      width: 100%;
      max-width:789px;
      margin-top: 32px;
      align-items: center;
      gap: 32px;
      .slider-dots {
        width: 100%;
        height: 4px;
        background: linear-gradient(
          198deg,
          #7b4fff 0,
          #e5c64f 53%,
          #c8ff50 100%
        );
        border-radius: 360px;
        display: flex;
        .slider-dot {
          background-color: #3b3645;
          width: 100%;
          height: 100%;
          transition: 0.6s;
          &.active {
            opacity: 0;
          }
        }
      }
      .slider-nav__buttons {
        display: flex;
        align-items: center;
        gap: 8px;
        .slider-arrow {
          border: 1px solid #3c3646;
          background-color: transparent;
          border-radius: 50%;
          width: 48px;
          height: 48px;
          cursor: pointer;
          display: flex;
          align-items: center;
          justify-content: center;
          transition: 0.3s;
          &:hover {
            background-color: #3c3646;
          }
        }
      }
    }
    .slider-big-elements__header {
      max-width: 584px;
      width: 100%;
      margin: 0px 104px;
      margin-bottom: 48px;

      @media (max-width: 1000px) {
        margin: 0;
        margin-bottom:32px;


      }
     
        p {
          margin-bottom: 0;
        }
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        color: white;
        margin-bottom: 8px;
      }
      p,
      ul li {
        color: #ffffffbf;
      }
      span.subheader {
        color: rgba(255, 255, 255, 0.5);
        svg {
          path {
            fill: rgba(255, 255, 255, 0.5);
          }
      }
    }
    .slider-big-elements__container {
      position: relative;
      z-index: 2;
      max-width: 1400px;
      padding: 48px 100px;
      width: 100%;
      margin: auto;

      @media (max-width: 1400px) {
        padding: 48px 50px;
      }
      @media (max-width: 1000px) {
        padding: 32px 16px;
      }
    }
    .slider-big-elements__items {
      display: flex;
      gap: 32px;
      transition: 0.3s;
    }

    .slider-big-elements__item {
      width: 100%;
      min-width: 100%;
      text-decoration: none;
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      .slider-big-elements__item-media {
        width: 100%;
        height: 580px;
 
@media (max-width: 1000px) {
  height: 400px;
}
@media (max-width:768px) {
  height: 300px;
}
        img {
          width: 100%;
          height: 100%;
          position: relative;
          display: flex;
          object-fit: cover;
          border-radius: 8px;
        }
      }
      .video-image {
        position: absolute;
        border-radius: 4px;
        top: -1px;
        left: -1px;
        width: calc(100% + 1px);
        height: calc(100% + 1px);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        z-index: 0;
        transition: 0.3s;
        &::after {
          content: "";
          width: 100%;
          height: 100%;
          background-color: black;
          opacity: 0.2;
          position: absolute;
          left: 0;
          border-radius: 4px;

          top: 0;
        }
        &.play {
          opacity: 0;
          visibility: hidden;
        }
      }
      .video {
        width: 100%;
        height: 100%;
        position: relative;
        display: flex;
        border-radius: 8px;

        video {
          width: 100%;
          height: 100%;
          object-fit: cover;
          border-radius: 8px;
        }
        button {
          border: 0;
          background-color: transparent;
          cursor: pointer;
          position: absolute;
          width: 100%;
          height: 100%;
          left: 0;
          top: 0;
          display: flex;
          align-items: center;
          justify-content: center;
          z-index: 3;
          svg {
            transition: 0.3s;
          }

          &.icon-play {
            svg {
              opacity: 0;
            }
          }
        }
      }
      .slider-big-elements__item-text {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        max-width: 584px;
      width: 100%;
      margin: 0px 104px;


      margin-top: 48px;
      @media (max-width: 1000px) {
        margin: 0;
        margin-top:24px;

      }
        p {
          width: 100%;
        }
      }
      span.arrow {
        display: flex;
        margin-top: 16px;
      }
      @media (max-width: 600px) {
        width: 100%;
        min-height: 0;
      }

      .slider-big-elements__item-text {
        z-index: 2;
      }
      p.title {
        color: #ffffff;
        font-weight: 600;
        font-size: 28px;
        line-height: 1.2;
        margin-bottom: 16px;

        font-family: var(--mainfont);
        @media (max-width: 1000px) {
          font-size: 20px;
        }
      }
      p.desc {
        font-size: 16px;
        font-weight: 300;
        margin-bottom: 0;
        color: rgba(255, 255, 255, 0.75);
        position: relative;
        z-index: 1;
      }
      svg {
        z-index: 1;
        path {
          transition: 0.4s;
        }
      }
    }
  }
}