/* ============================================================
   Görsel büyüteci (lightbox) + misafir yorumu kaydırağı
   Her ikisi de tasarımda yoktu; ana sayfa ve galeri sayfasında
   kullanılır.
   ============================================================ */

/* ---------------- BÜYÜTEÇ ---------------- */
.buyutulebilir { cursor: zoom-in; }

.buyutec {
  position: fixed; inset: 0; z-index: 9000;
  display: flex; align-items: center; justify-content: center;
  gap: 1rem; padding: clamp(1rem, 4vw, 3rem);
  background: rgba(12, 10, 9, 0.92);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  opacity: 0; transition: opacity 0.2s ease;
}
/* display:flex, tarayicinin [hidden] icin verdigi display:none kuralini
   eziyor: katman kapaliyken de tum sayfanin uzerinde duruyor ve gorunmez
   oldugu halde her tiklamayi yutuyordu. Bu satir sart. */
.buyutec[hidden] { display: none; }
.buyutec.gorunur { opacity: 1; }
body.buyutec-acik { overflow: hidden; }

.buyutec-sahne {
  margin: 0; max-width: min(1200px, 100%); max-height: 100%;
  display: flex; align-items: center; justify-content: center;
}
.buyutec-sahne img {
  max-width: 100%; max-height: calc(100vh - 8rem);
  width: auto; height: auto; display: block;
  border-radius: 10px; box-shadow: 0 24px 70px rgba(0, 0, 0, 0.55);
  transform: scale(0.96); transition: transform 0.25s ease;
}
.buyutec.gorunur .buyutec-sahne img { transform: scale(1); }

.buyutec-ok,
.buyutec-kapat {
  flex: 0 0 auto;
  display: grid; place-items: center;
  width: 48px; height: 48px; border: 0; border-radius: 50%;
  background: rgba(255, 255, 255, 0.12); color: #fff;
  cursor: pointer; transition: background 0.16s, transform 0.16s;
}
.buyutec-ok:hover,
.buyutec-kapat:hover { background: rgba(255, 255, 255, 0.24); }
.buyutec-ok:active { transform: scale(0.94); }
.buyutec-ok[hidden],
.buyutec-sayac[hidden] { display: none; }

.buyutec-kapat { position: absolute; top: 1.2rem; right: 1.2rem; }

.buyutec-sayac {
  position: absolute; bottom: 1.4rem; left: 50%; transform: translateX(-50%);
  font-family: var(--ff-mono, monospace); font-size: 0.8rem; letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.75);
}

@media (max-width: 640px) {
  .buyutec { gap: 0.4rem; padding: 1rem 0.5rem 3.5rem; }
  .buyutec-ok, .buyutec-kapat { width: 42px; height: 42px; }
  /* dar ekranda oklar görselin üzerine biner */
  .buyutec-ok { position: absolute; top: 50%; transform: translateY(-50%); }
  .buyutec-ok.prev { left: 0.5rem; }
  .buyutec-ok.next { right: 0.5rem; }
  .buyutec-sahne img { max-height: calc(100vh - 10rem); }
}

@media (prefers-reduced-motion: reduce) {
  .buyutec, .buyutec-sahne img { transition: none; }
}

/* ---------------- YORUM KAYDIRAĞI ---------------- */
/* min-width:0 şart. Kaydırak ızgara (grid) hücresinde duruyor ve ızgara
   hücrelerinin varsayılan min-width'i "auto"; içerideki ray 5 kartı yan yana
   taşıdığı için hücre içerik genişliğine göre şişiyor, kapsayıcıyı aşıp yan
   sütunu (istatistikler) sayfanın dışına itiyordu. */
.testimonial-inner > * { min-width: 0; }
/* Izgara "align-items: center" ile geliyordu. Tek kart varken iki sutun
   yakin yukseklikteydi ve fark belli olmuyordu; kaydiraga gecince sol sutun
   ok/nokta seridi kadar uzadi, kisa kalan sag sutun ortalanip yaklasik 50px
   asagi kaydi. Ustten hizalanmali. */
.testimonial-inner { align-items: start; }
.testi-slider { position: relative; min-width: 0; }
.testi-viewport { overflow: hidden; }
.testi-track {
  display: flex; align-items: stretch;
  transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
}
/* her slayt tam genişlik — yükseklik en uzun yoruma göre oturur */
.testi-track > .testi-card { flex: 0 0 100%; width: 100%; }

.testi-nav {
  display: flex; align-items: center; justify-content: center; gap: 1rem;
  margin-top: 1.4rem;
}
.testi-arrow {
  display: grid; place-items: center;
  width: 42px; height: 42px; border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: transparent; color: inherit;
  cursor: pointer; transition: background 0.16s, transform 0.16s, border-color 0.16s;
}
.testi-arrow:hover { background: rgba(255, 255, 255, 0.14); border-color: rgba(255, 255, 255, 0.5); }
.testi-arrow:active { transform: scale(0.94); }

.testi-dots { display: flex; align-items: center; gap: 0.5rem; }
.testi-dot {
  width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%;
  background: rgba(255, 255, 255, 0.32); cursor: pointer;
  transition: width 0.22s, background 0.22s;
}
.testi-dot.is-active { width: 22px; border-radius: 4px; background: #fff; }

/* yorum kartındaki tur etiketi bağlantı olabilir */
a.testi-tag { text-decoration: none; }
a.testi-tag:hover { text-decoration: underline; }

@media (prefers-reduced-motion: reduce) {
  .testi-track { transition: none; }
}