/* Genel Reset */

* { margin: 0; padding: 0; box-sizing: border-box; }



/* Slider */

.slider { position: relative; width: 100%; overflow: hidden; }



/* Slide Wrapper */

.slides { display: flex; width: 100%; transition: transform 0.6s ease; cursor: grab; }



/* Her Slide */

.slide { flex-shrink: 0; width: 100%; position: relative; user-select: none; }



/* Resim: contain kullanıldı */

.slide img {

  width: 100%;

  height: auto;           /* slider yüksekliği resim yüksekliği kadar */

  display: block;

  object-fit: contain;    /* kırpmadan tam göster */

  object-position: center;

  background: #000;

}



/* Caption */

.caption {

  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);

  color: white; font-size: 35px; font-weight: normal; text-shadow: 0 2px 8px rgba(0,0,0,0.6);

  text-align: center; padding: 0 20px; line-height: 1.3;

}

@media (max-width: 1024px) { .caption { font-size: 25px; } }

@media (max-width: 768px)  { .caption { font-size: 18px; } }

@media (max-width: 480px)  { .caption { font-size: 13px; } }



/* Prev / Next Buttons */

.prev, .next {

  position: absolute; top: 50%; transform: translateY(-50%);

  font-size: 1.5rem; color: #a7856a;

  background: rgba(255,255,255,0.25); border: none; cursor: pointer;

  padding: 5px 8px; border-radius: 50%; user-select: none; transition: background 0.3s ease; z-index: 10;

}

.prev:hover, .next:hover { background: rgba(255,255,255,0.5); }

.prev { left: 10px; } .next { right: 10px; }

@media (max-width: 480px) { .prev, .next { font-size: 1.2rem; padding: 4px 6px; } }



/* Dots */

.dots {

  position: absolute; bottom: 15px; left: 50%; transform: translateX(-50%);

  display: flex; gap: 6px;

}

.dot { width: 20px; height: 4px; background: rgba(200,200,200,0.5); cursor: pointer; border-radius: 2px; transition: background 0.3s ease; }

.dot.active { background: #a7856a; }