@import url("animate.css");
@import url("fakeLoader.min.css");
@import url('https://fonts.googleapis.com/css?family=Rubik:400,500,700&display=swap&subset=latin-ext');

.main-slider {
  position: relative;
  padding-bottom: 20px; /* Alt kısımda dots için boşluk bırak */
}

/* Owl Nav Butonları */
.main-slider .owl-nav button {
  width: 50px;
  height: 50px;
  display: block;
  position: absolute;
  top: calc(50% - 50px);
}
.main-slider .owl-nav button.owl-prev {
  background: url(../img/prev.png);
  left: 20px;
}
.main-slider .owl-nav button.owl-next {
  background: url(../img/prev.png);
  transform: rotate(180deg);
  right: 20px;
}

/* Dots */
.main-slider .owl-dots {
  position: relative !important;
  bottom: auto !important;
  margin-top: 10px;
  display: flex;
  justify-content: center;
  width: 100%;
}
.main-slider .owl-dots .owl-dot {
  width: 20px;
  height: 20px;
  margin: 5px 7px;
  background: #000;
  display: block;
  border-radius: 50%;
}
.main-slider .owl-dots .owl-dot.active {
  background: #E46307;
}

/* --- SLIDER GÖRSELİ ZOOM EFEKTI --- */
.main-slider .owl-item img {
  transform: scale(1);
  transition: transform 8s ease;
}
.main-slider .owl-item.active img {
  transform: scale(1.15);
}

/* --- YAZI KUTUSU --- */
.slider-caption {
  position: absolute;
  top: 200px;
  left: 40px;
  text-align: left;
  z-index: 2;

  /* Başlangıç zoom ve fade */
  opacity: 0;
  transform: scale(0.8);
  animation: captionZoom 1.5s forwards;
}

/* Yazı stilleri */
.slider-caption .line1,
.slider-caption .line2 {
  font-weight: bold;
  color: white;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7);
}

.slider-caption .line1 {
  font-size: 55px;
  margin-bottom: 5px;
}
.slider-caption .line2 {
  font-size: 55px;
}

/* Animasyonlar */
@keyframes captionZoom {
  0% {
    opacity: 0;
    transform: scale(0.8);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

/* Mobil görünüm */
@media (max-width: 768px) {
  .slider-caption {
    top: 40px;
    left: 20px;
  }
  .slider-caption .line1 {
    font-size: 24px;
  }
  .slider-caption .line2 {
    font-size: 20px;
  }

  @keyframes captionZoom {
    0% {
      opacity: 0;
      transform: scale(0.8);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
}