/* WRAPPER */
.slider-wrapper {
  width: 100%;
  overflow: hidden;
  position: relative;
}

/* SLIDER */
.slider-container {
  display: flex;
  transition: transform 0.5s ease;
}

/* EACH SLIDE */
.slide-item {
  width: 100%;
  min-width: 100%;
  display: flex;
  align-items: center;
  gap: 100px;
  padding: 66px 0px;
}

/* LEFT / RIGHT */
.slide-left {
  width: 65%;
}

.slide-right {
  width: 35%;
}

/* IMAGE */
.slide-left img {
  width: 100%;
}

/* HEADING */
.slide-right h4 {
  font-family: 'aeonikmedium';
  font-size: 1.375rem;
  line-height: 1.625rem;
  margin-bottom: 20px;
  font-weight: 500;
}
.slide-right h4 span {
  display: block;
}
.slide-right p {
  color: #fff;
  font-size: 1.125rem;
  line-height: 1.5rem;
  margin-bottom: 0.25rem;
  font-weight:400;
}
.slide-right span.des{
  color: #988fa6;
  font-size: 1rem;
  line-height: 1.25rem;
}

/* TEXT COLORS */
.text-white {
  color: #fff;
}

.text-purple {
  color: #241046;
}

/* BUTTON GROUP */
.slide-actions {
  display: flex;
  gap: 25px;
  margin-top: 40px;
}


/* BUTTON COLORS */
.primary-light {
  background: #fff;
  color: #1c0b38;
}

.primary-dark {
  background: #241046;
  color: #fff;
}

/* ARROWS */
.slider-prev,
.slider-next {
  position: absolute;
  bottom: 10px;
  background: transparent;
  border: none;
  cursor: pointer;
  font-size: 24px;
  z-index: 10;
  color: #fff;
}

.slider-prev {
  right:46px;
}

.slider-next {
  right:0px;
}

/* DOTS */
.slider-dots {
  position: absolute;
  bottom: 20px;
  left:0%;
  display: flex;
  gap: 12px;
  padding:0px
}

.slider-dots button {
  width: 6px;
  height: 4px;
  background: #333;
  border: none;
  cursor: pointer;
  transition: 0.3s;
}

.slider-dots button.active {
  width: 30px;
  background: #fff;
}

/* ---------------- RESPONSIVE ---------------- */

@media (max-width: 1280px) {
  .slider-prev {
    right: 120px;
  }
  .slider-next {
    right: 80px;
  }
}

/* MOBILE */
@media (max-width: 768px) {
  .slide-item {
    flex-direction: column;
    text-align: center;
    gap: 20px;
  }

  .slide-left,
  .slide-right {
    width: 100%;
  }

  .slide-right {
    text-align: left;
  }

  .slide-right h2 {
    font-size: 2.2rem;
    line-height: normal;
  }

  .slide-right h2 span {
    display: inline;
  }

  .slide-actions {
    display: block;
    margin-top: 10px;
  }

  .btn {
    margin: 10px auto;
    display: inline-flex;
  }

  .slider-prev {
    right: 60px;
  }

  .slider-next {
    right: 10px;
  }

  .slider-dots {
    left: 20%;
  }
}