.news {
  //margin-left: -180px;
  //margin-right: -180px;
  .article {
    .teaser-text {
      margin-bottom: 0;
    }
  }
  .news-slider-outer {
    padding-left: 180px;
    padding-right: 180px;
    position: relative;
    .swiper {
      .swiper-wrapper {
        align-items: flex-end;
      }
      .article {
        .news-img-wrap {
          float: none;
          margin: 0 0 40px 0;
          a {
            border: none;
            padding: 0;
            float: none;
            img {
              float: none;
              width: 100%;
              border-radius: 20px;
            }
          }
        }
        .header {
          h4 {
            margin: 0;
          }
          a {
            color: $black;
            font-weight: 500;
          }
        }
        .news-category {
          color: $purple;
          font-weight: 500;
          margin-bottom: 20px;
        }
        .more {
          font-weight: 500;
        }
      }
    }
    .swiper-button-prev, .swiper-button-next {
      width: 30px;
      height: 60px;
      top: 180px;
      z-index: 1;
      &:after {
        content: '';
        height: 60px;
        width: 30px;
        background-size: cover;
        background-repeat: no-repeat;
      }
    }
    .swiper-button-prev {
      left: 80px;
      &:after {
        background-image: url("../../Images/slider-arrow-left.svg");
      }
    }
    .swiper-button-next {
      right: 80px;
      &:after {
        background-image: url("../../Images/slider-arrow-right.svg");
      }
    }
  }
  .textimage-wrapper {
    margin-top: 150px;
    &:first-child {
      margin-top: 105px;
    }
    .frame-container {
      .textimage-image {
        z-index: 0 ;
        img {
          max-width: 940px;
        }
      }
      .textimage-text {
        background-color: $white ;
        max-width: 600px ;
        padding: 50px 70px !important;
      }
      .more {
        font-weight: 500;
        &:after {
          transition: all .3s ease-in-out;
        }
        &:hover {
          &:after {
            right: -45px;
          }
        }
      }
    }
  }
  .filter-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 35px;
    .btn-transparent {
      cursor: pointer;
      &:hover {
        @extend .btn-purple
      }
      &:has(.category-check:checked) {
        @extend .btn-purple;
      }
    }
    .category-check {
      opacity: 0;
    }
    span {
      margin-left: -15px;
    }
  }
  .news-search-form {
    margin: 52px;
    .form-group {
      position: relative;
      .search-go {
        border: none;
        border-radius: 50%;
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        width: 40px;
        height: 40px;
        background-image: url("../../Images/go.svg");
        background-size: 100% 100%;
      }
      &.search-inner {
        max-width: 615px;
      }
      .form-control {
        border-radius: 50px;
        border: none;
        box-shadow: none;
        background: $white;
        padding: 16px 32px;
        &::placeholder {
          color: $black;
          font-size: 1.5rem;
          font-weight: 500;
        }
      }
    }
  }
  &.news-single {
    .header {
      display: flex;
      justify-content: space-between;
      .socials {
        width: 160px;
        height: 40px;
      }
    }
    .date-category {
      display: flex;
      justify-content: space-between;
      .news-list-category {
        color: $purple;
        font-weight: 500;
        .separator:last-child {
          display: none;
        }
      }
    }
    .teaser-text {
      color: $black;
      font-size: 1rem;
    }
    .news-image-wrapper {
      img {
        border-radius: 20px;
      }
    }
  }
}

@media (max-width: 1100px) {
  .news {
    .textimage-wrapper {
      .frame-container {
        .textimage-image {
          img {
            max-width: 100%;
          }
        }
      }
    }
  }
}
@media (max-width: 768px) {
  .news {
    .news-slider-outer {
      padding-right: 100px;
      padding-left: 100px;
    }
    .textimage-wrapper {
      .frame-container {
        .textimage-text {
          padding: 25px 35px !important;
          max-width: unset;
          hyphens: auto;
        }
      }
    }
  }
}