/* SY Mobil Uyum: yerlesim.css (sy-mobil.php yükler; Elementor ve temadan sonra)
   Y ajanı: Elementor kapsayıcı yerleşimi, dikey ritim, kenar boşlukları. Yalnızca body.single-portfolio. */

@media (max-width: 767px) {

  /* 1) KÖK NEDEN (boşluk): Elementor mobilde dikey kapsayıcılara flex-wrap:wrap veriyor (--flex-wrap-mobile:wrap).
        Çok satırlı dikey esnek kutuda bazı öğeler (ör. ESGE kartı) içeriğinden 500-700px uzun ölçülüyor.
        Sayfa içeriğindeki e-con'lar nowrap olur. Kenar çubuğu (gizli, içinde satır yönlü kapsayıcı var) hariç. */
  body.single-portfolio #pxl-content-main .e-con.e-flex:not(.sy-sidebar-sticky-parent):not(.sy-sidebar-sticky-parent *) {
    flex-wrap: nowrap;
  }

  /* 2) Kenar boşlukları: tema 15 + e-parent 10 + sarmal 10+1 + kart 10+1 = ~47px/yan harcıyordu (296px içerik).
        Sayfa kenar boşluğu 12px; iç içe sarmallar sıfırlanır; kartın iç boşluğu 14px. Kart kenarlığı ve köşeler korunur. */
  body.single-portfolio #pxl-content-area { padding-left: 12px; padding-right: 12px; }
  body.single-portfolio #pxl-content-main .elementor > .e-con.e-parent { padding-left: 0; padding-right: 0; }
  body.single-portfolio #pxl-content-main .e-parent > .e-con-inner > .e-con.e-child:not(.sy-sidebar-sticky-parent) {
    padding-left: 0; padding-right: 0;
    /* dış sarmalın kenarlığı beyaz (#FFF) ve görünmez; yalnızca 2px genişlik harcıyordu */
    border-left-width: 0; border-right-width: 0;
  }
  body.single-portfolio #pxl-content-main .e-parent > .e-con-inner > .e-con.e-child > .e-con.e-child {
    padding-left: 14px; padding-right: 14px;
  }

  /* 3) Harita kapsayıcısı mobilde min-height:80vh; HTML widget'ı büyür ama iframe sabit height="450" kaldığında altında
        ~230px boş alan kalıyordu (Adenomyozis, Anormal Kanama). İframe widget'ın yüksekliğini doldursun. */
  body.single-portfolio #pxl-content-main .elementor-widget-html > iframe[src*="google.com/maps"],
  body.home #pxl-content-main .elementor-widget-html > iframe[src*="google.com/maps"] { /* ana sayfada da aynı harita boşluğu vardı */
    display: block; width: 100%; height: 100%; min-height: 320px;
  }

  /* 5) Sabit alt menü (70px, ortadaki telefon düğmesi ~10px taşar) son içeriği (telefon/telif satırı) örtmesin. */
  body.single-portfolio { padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
}

/* 4) Tablet (768-1024): iki sütun korunur; kenar çubuğu 168-239px'e sıkışıyordu. Ana %69, kenar çubuğu %28
      (+20px boşluk toplamı satır sarmasına yol açmayacak şekilde 100% altında). Yapışkanlık Elementor Pro JS'iyle çalışır,
      width/align-self'e dokunulmadı. Yalnızca kenar çubuğunun kardeşi olan ana sütun hedeflenir. */
@media (min-width: 768px) and (max-width: 1024px) {
  body.single-portfolio #pxl-content-main .e-parent > .e-con-inner > .e-con.e-child:has(~ .sy-sidebar-sticky-parent) { --width: 69%; }
  body.single-portfolio #pxl-content-main .e-parent > .e-con-inner > .e-con.sy-sidebar-sticky-parent { --width: 28%; }
}

/* 4b) Tam 768px (iPad mini dikey): site özel CSS'i `(max-width:768px)` ile kenar çubuğunu gizliyor (!important) ama Elementor
      mobil eşiği 767; ana sütun %75'te kalıp sağda ~240px boş alan bırakıyordu. Gizli olduğu genişlikte ana sütun tam genişlik. */
@media (min-width: 768px) and (max-width: 768px) {
  body.single-portfolio #pxl-content-main .e-parent > .e-con-inner > .e-con.e-child:has(~ .sy-sidebar-sticky-parent) { --width: 100%; }
}