/* ------------------------------------------------------------------
   Su Değirmeni — tema üzerine yazılan ortak düzen kuralları.
   style.css'ten SONRA yüklenir. Blog sayfasının ölçüsü burada
   iç sayfaların tamamına (galeri, hakkımızda, iletişim, hizmetler)
   taşınır; tema fazla boşluklu geldiği için ölçek küçültülmüştür.
   ------------------------------------------------------------------ */

/* --- 1. Yorum kaydırıcısının ok düğmeleri (yalnızca ok, yazı yok) --- */

.nav-arrow-only {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  margin: 0 0 0 10px;
  padding: 0;
  border: 1px solid var(--primary);
  color: var(--primary);
  background: transparent;
  cursor: pointer;
  transition: background .3s ease, color .3s ease, border-color .3s ease;
}

.nav-arrow-only:hover,
.nav-arrow-only:focus-visible {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
  outline: none;
}

/* Temada ok ikonu metnin soluna/sağına mutlak konumlanıyordu; yazı
   kalkınca kutunun dışında kalıyor. Ok artık kutunun ortasında durur. */
.nav-arrow-only i,
.nav-arrow-only:hover i {
  position: static;
  left: auto;
  right: auto;
  font-size: 22px;
  line-height: 1;
}

/* --- 2. Ana sayfa video bölümü: filtre yok, yüklenen görsel görünür --- */

.video-section {
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}

/* Temada bu bölümün üzerinde beyaz bir kaplama vardı ve başlık koyu renkti.
   Kaplama kaldırıldığı için başlık, yüklenen her fotoğrafta okunur kalsın diye
   beyaza alınıp yumuşak bir gölge veriliyor. Fotoğrafın üstüne filtre konmuyor. */
.video-section .section-head .title {
  color: #fff;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .65);
}

/* --- 3. İç sayfaların ortak dikey ölçüsü (blog sayfasıyla aynı) --- */

.inner-page .dz-bnr-inr,
.inner-page .dz-bnr-inr .dz-bnr-inr-entry {
  height: 300px;
}

.inner-page .content-inner {
  padding-top: 65px;
  padding-bottom: 35px;
}

.inner-page .content-inner-1 {
  padding-top: 65px;
  padding-bottom: 55px;
}

/* Temada bu bölümün altında harita/CTA vardı, bu sitede yok: alt boşluk
   sıfır kalırsa iletişim formu doğrudan altbilgiye yapışıyor. */
.inner-page .content-inner-2 {
  padding-top: 65px;
  padding-bottom: 45px;
}

.inner-page .content-inner-3 {
  padding-top: 45px;
  padding-bottom: 25px;
}

.inner-page .section-head {
  margin-bottom: 30px;
}

/* --- 4. Hizmet kartları: kutunun tamamı tıklanabilir --- */

.flip-bx {
  position: relative;
}

/* Kart yüzeyinin tamamını kaplayan görünmez bağlantı. preserve-3d
   sahnesinde ön/arka yüzün önünde kalması için Z ekseninde öne alınır. */
.flip-card-link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  transform: translateZ(90px);
  border: 0;
  text-indent: -9999px;
  overflow: hidden;
}

.flip-card-link:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: -4px;
}

/* --- 5. Galeri: kenar boşluğu, ızgara aralığı ve dengeli kart yüksekliği --- */

.masonry-portfolio .gallery-wrap {
  max-width: 1640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 40px;
  padding-right: 40px;
}

.masonry-portfolio .site-filters {
  margin-bottom: 35px;
}

.masonry-portfolio #masonry {
  margin-left: -12px;
  margin-right: -12px;
}

.masonry-portfolio #masonry > .card-container {
  padding-left: 12px;
  padding-right: 12px;
  margin-bottom: 24px;
}

.masonry-portfolio .dz-box.overlay .dz-media {
  overflow: hidden;
}

.masonry-portfolio .dz-box.overlay .dz-media img {
  width: 100%;
  height: 300px;
  object-fit: cover;
  transition: transform .5s ease;
}

.masonry-portfolio .dz-box.overlay:hover .dz-media img {
  transform: scale(1.05);
}

.masonry-portfolio .dz-box.overlay .dz-info .title {
  font-size: 20px;
  line-height: 1.3;
  margin-bottom: 0;
}

.masonry-portfolio .dz-box.overlay .dz-info .sub-title {
  font-size: 12px;
  letter-spacing: 2px;
  margin-bottom: 6px;
}

@media only screen and (max-width: 1199px) {
  .masonry-portfolio .dz-box.overlay .dz-media img {
    height: 270px;
  }
}

@media only screen and (max-width: 991px) {
  .inner-page .dz-bnr-inr,
  .inner-page .dz-bnr-inr .dz-bnr-inr-entry {
    height: 250px;
  }

  .inner-page .content-inner,
  .inner-page .content-inner-1,
  .inner-page .content-inner-2 {
    padding-top: 45px;
    padding-bottom: 25px;
  }

  .masonry-portfolio .gallery-wrap {
    padding-left: 20px;
    padding-right: 20px;
  }

  .masonry-portfolio .dz-box.overlay .dz-media img {
    height: 240px;
  }
}

@media only screen and (max-width: 575px) {
  .masonry-portfolio .gallery-wrap {
    padding-left: 12px;
    padding-right: 12px;
  }

  .nav-arrow-only {
    width: 40px;
    height: 40px;
  }
}

/* ------------------------------------------------------------------
   9. Açılış perdesi kaldırıldıktan sonraki düzen güvencesi
   ------------------------------------------------------------------
   Eskiden tam ekran bir "Yükleniyor.." katmanı, Swiper kurulana kadar
   olan ara kareyi saklıyordu. Katman kalktı; ara kareyi saklamak yerine
   ortadan kaldırıyoruz.

   Swiper 11, kurulumda slaytlara satır içi width/margin-right yazar ve
   aşağıdaki kuralları ezer. Yani bunlar YALNIZCA kurulum öncesinde
   geçerlidir ve o anki genişlikleri Swiper'ın hesaplayacağı değerlerle
   birebir eşitler: slayt sayısı değişmediği için dikey kayma olmaz.
   Kırılım noktaları dz.carousel.js'teki breakpoints ile aynıdır. */

/* --- Blog kaydırıcısı (spaceBetween: 0) --- */
.blog-swiper .swiper-slide { width: 100%; }
@media (min-width: 691px)  { .blog-swiper .swiper-slide { width: 50%; } }
@media (min-width: 767px)  { .blog-swiper .swiper-slide { width: 100%; } }
@media (min-width: 991px)  { .blog-swiper .swiper-slide { width: 50%; } }
@media (min-width: 1280px) { .blog-swiper .swiper-slide { width: 33.3333%; } }

/* --- Yorum kaydırıcısı (spaceBetween: 30) --- */
.testimonial-swiper .swiper-slide { width: 100%; margin-right: 30px; }
@media (min-width: 691px)  { .testimonial-swiper .swiper-slide { width: calc((100% - 30px) / 2); } }
@media (min-width: 1191px) { .testimonial-swiper .swiper-slide { width: calc((100% - 60px) / 3); } }

/* Footer iletişim telefonlarını ayrı satırlarda, aynı hizada göster. */
.site-footer .footer-phone-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.site-footer .footer-phone-list a {
  display: block;
  line-height: 1.5;
  white-space: nowrap;
}
