/* ================================================================
   customcss/post-37183.css — Made To Play: Hareket Okulda (projeler)
   ----------------------------------------------------------------
   inc/custom-css.php bu dosyayı yalnızca bu projede, customcss/
   type-projeler.css'ten SONRA yükler. Elementor düzenleyici
   önizlemesinde de yüklenir; orada gövde `.post-layout` olmadan
   `.erg-section .erg-content--elementor` içinde durduğu için
   seçiciler ondan başlar. Bölüm aralığına bağlı tek kural (başlık
   bantları) `.post-layout` ister: aralık yalnızca sitede var.

   Sayfadaki sorunlar ve kimlikleri:
   1) Destekçiler (c2cab37) — başlıklardan biri ortalı ikisi sola
      yaslı, logolar farklı boyda; masaüstünde sütunlar eşit değil,
      dar ekranda üç blok alt alta ve hizasız.
   2) Yan yana sütunlar (b34d676, 2d0ae56, 9e622f7) — sütun arası
      boşluk yok, içerik Elementor'un 10px iç boşluğuyla sayfanın sol
      hizasından içeri kayıyor; 2d0ae56'da pasta grafiği ve iki metin
      183px'lik dört dar sütuna sıkışmış.
   3) "Hareket Elçileri" galerisi (a677899) — masaüstünde satır
      kapsayıcısında içeriğe göre daralıp 120px'lik tek sütuna iniyor.
   4) Başlık bantları — başlık ayrı bir kapsayıcıda; bölüm aralığı
      (48px) + iç boşluklarla paragrafından 68px kopuk.
   5) Grafikler (EAEL / ApexCharts) — eklentinin gri, mavi ve yeşil
      renkleri, Helvetica yazı ve indirme menüsü.
   6) "Evde Hareket" — öğrenci görüşü düz paragraf olarak duruyordu.
   7) "ERG Sözlük" (7938e54) — altında içerik olmayan yetim başlık.
   ================================================================ */

/* ----------------------------------------------------------------
   Ortak: iç sütunlar sayfanın sol hizasında
   ----------------------------------------------------------------
   İç içe kapsayıcıların yatay iç boşluğu (Elementor varsayılanı
   10px) kalkar; sütunlar arasını aşağıdaki ızgaralar verir.
   Zemini boyanmış kutular (erg-box) kendi payını taşır.
   ---------------------------------------------------------------- */

.erg-section .erg-content--elementor > .elementor .e-con .e-con:not(.erg-box) { padding-inline: 0; }

/* ----------------------------------------------------------------
   1) Destekçiler — eşit kartlar, mono etiket, aynı boyda logo
   ---------------------------------------------------------------- */

.erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-c2cab37,
.erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-c2cab37 > .e-con-inner { padding: 0; }
.erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-c2cab37 > .e-con-inner {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.erg-section:not(#_) .erg-content--elementor > .elementor .elementor-element-c2cab37 > .e-con-inner > .e-con {
  --width: auto;
  width: auto;
  padding: 20px 24px 24px;
  gap: 18px;
  align-items: flex-start;
  justify-content: flex-start;
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  background: var(--paper);
}
.erg-section:not(#_) .erg-content--elementor > .elementor .elementor-element-c2cab37 .elementor-widget-heading,
.erg-section:not(#_) .erg-content--elementor > .elementor .elementor-element-c2cab37 .elementor-widget-image {
  width: 100%;
  margin: 0;
  text-align: start;
}
.erg-section:not(#_) .erg-content--elementor > .elementor .elementor-element-c2cab37 .elementor-widget-heading .elementor-heading-title {
  font-family: var(--ff-mono);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: start;
  color: var(--ink-soft);
}
.erg-section:not(#_) .erg-content--elementor > .elementor .elementor-element-c2cab37 .elementor-widget-image img {
  display: block;
  width: auto;
  max-width: 100%;
  height: 64px;
  object-fit: contain;
  object-position: left center;
  border-radius: 0;
}

/* ----------------------------------------------------------------
   2) Yan yana sütunlar — ızgara, okuma hizası, sütun arası 40px
   ---------------------------------------------------------------- */

.erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-b34d676 > .e-con-inner,
.erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-2d0ae56 > .e-con-inner,
.erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-9e622f7 > .e-con-inner {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 32px 40px;
  align-items: center;
  padding-block: 0;
}
/* Metin + madde listesi geniş, koşan çocuk görseli dar sütunda. */
.erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-9e622f7 > .e-con-inner { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.erg-section .erg-content--elementor > .elementor :is(.elementor-element-b34d676, .elementor-element-2d0ae56, .elementor-element-9e622f7) > .e-con-inner > .e-con.e-con {
  --width: auto;
  width: auto;
  min-width: 0;
  padding-block: 0;
}
/*
 * Grafikler sütunu doldurur; pasta grafiği tek sütunda (dar ekran) 600px'lik
 * bir daireye büyümesin. Görseller doğal boyutlarını aşmaz (koşan çocuk
 * 122×150'lik bir GIF), ortalanır; Elementor'daki sabit 150px yükseklik
 * kalkar.
 */
.erg-section .erg-content--elementor > .elementor :is(.elementor-element-b34d676, .elementor-element-2d0ae56) .elementor-widget-eael-fancy-chart { width: 100%; }
.erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-5c7fa80 { max-width: 400px; margin-inline: auto; }
.erg-section .erg-content--elementor > .elementor :is(.elementor-element-746ecd7, .elementor-element-2aaca13) .elementor-widget-image { height: auto; text-align: center; }
.erg-section .erg-content--elementor > .elementor :is(.elementor-element-746ecd7, .elementor-element-2aaca13) .elementor-widget-image img {
  width: auto;
  max-width: min(100%, 320px);
  height: auto;
  margin-inline: auto;
}

/* ----------------------------------------------------------------
   3) "Hareket Elçileri" galerisi — satırın tamamını kaplar
   ---------------------------------------------------------------- */

.erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-16eb870 { padding: 0; }
.erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-a677899 {
  --container-widget-width: 100%;
  width: 100%;
  align-self: stretch;
}

/* ----------------------------------------------------------------
   4) Başlık bantları — başlık kendi paragrafına yaklaşır
   ----------------------------------------------------------------
   Bölüm aralığı (--erg-band-space, type-projeler.css) yalnızca
   sitede; düzenleyici önizlemesinde negatif boşluk üst üste
   bindirirdi, o yüzden `.post-layout` koşulu.
   ---------------------------------------------------------------- */

.erg-section .post-layout > .erg-content--elementor > .elementor > :is(.elementor-element-dad88fa, .elementor-element-9410d56, .elementor-element-241ef66).elementor-element {
  margin-bottom: calc(12px - var(--erg-band-space, 48px));
}
.erg-section .erg-content--elementor > .elementor > :is(.elementor-element-dad88fa, .elementor-element-9410d56, .elementor-element-241ef66) > .e-con-inner { padding-bottom: 0; }

/* ----------------------------------------------------------------
   5) Grafikler — tema renkleri ve yazı ailesi
   ----------------------------------------------------------------
   ApexCharts rengi SVG `fill` özniteliğine yazar; CSS onu ezer.
   Göstergedeki kutucukların zemini satır içi `!important`; üstüne
   iç gölgeyle boyanır. Ana seri magenta, ikincil seri gri
   (beyaz değer etiketi iki zeminde de okunur).
   ---------------------------------------------------------------- */

.erg-section .erg-content--elementor > .elementor .elementor-widget-eael-fancy-chart .apexcharts-toolbar { display: none; }
.erg-section .erg-content--elementor > .elementor .elementor-widget-eael-fancy-chart :is(.apexcharts-text, .apexcharts-datalabel, .apexcharts-pie-label, .apexcharts-legend-text) {
  font-family: var(--ff-sans);
}
.erg-section .erg-content--elementor > .elementor .elementor-widget-eael-fancy-chart .apexcharts-xaxis-label,
.erg-section .erg-content--elementor > .elementor .elementor-widget-eael-fancy-chart .apexcharts-yaxis-label { fill: var(--muted); }
.erg-section .erg-content--elementor > .elementor .elementor-widget-eael-fancy-chart .apexcharts-gridline { stroke: var(--rule-soft); }

.erg-section .erg-content--elementor > .elementor .elementor-element-700793f .apexcharts-bar-area { fill: var(--erg-p1); }
.erg-section .erg-content--elementor > .elementor .elementor-element-700793f .apexcharts-datalabel { font-weight: 600; }

.erg-section .erg-content--elementor > .elementor .elementor-element-5c7fa80 .apexcharts-pie-slice-0 { fill: var(--erg-p1); }
.erg-section .erg-content--elementor > .elementor .elementor-element-5c7fa80 .apexcharts-pie-slice-1 { fill: var(--grey-600); }
.erg-section .erg-content--elementor > .elementor .elementor-element-5c7fa80 .apexcharts-pie-area { stroke: var(--paper); }
.erg-section .erg-content--elementor > .elementor .elementor-element-5c7fa80 .apexcharts-legend-series[rel="1"] .apexcharts-legend-marker { box-shadow: inset 0 0 0 12px var(--erg-p1); }
.erg-section .erg-content--elementor > .elementor .elementor-element-5c7fa80 .apexcharts-legend-series[rel="2"] .apexcharts-legend-marker { box-shadow: inset 0 0 0 12px var(--grey-600); }

/* ----------------------------------------------------------------
   6) "Evde Hareket" — öğrenci görüşü alıntı kutusunda
   ----------------------------------------------------------------
   İlk paragraf görüş; gövdedeki alıntıyla (main.css → blockquote)
   aynı dil. Künye ("5. Sınıf, Aktif Olmayan Kız Öğrenci…") ikinci
   paragrafın başında, ardından gelen metinle <br> ile aynı
   paragrafta — CSS onu ayıramaz, düz metin olarak kalır.
   ---------------------------------------------------------------- */

.erg-section .erg-content--elementor > .elementor .elementor-element-9c457b5 :is(.elementor-widget-container, .elementor-text-editor) > p:first-child,
.erg-section .erg-content--elementor > .elementor .elementor-element-9c457b5.elementor-widget > p:first-child {
  margin: 0 0 16px;
  padding: 24px 28px;
  background: var(--accent-soft);
  border-left: 3px solid var(--accent-ink);
  border-radius: 0 var(--r-md) var(--r-md) 0;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.55;
  color: var(--ink);
}

/* ----------------------------------------------------------------
   7) Yetim "ERG Sözlük" başlığı
   ---------------------------------------------------------------- */

.erg-section .erg-content--elementor > .elementor > .elementor-element.elementor-element-7938e54 { display: none; }

/* ----------------------------------------------------------------
   Dar ekranlar — her şey tek sütun
   ---------------------------------------------------------------- */

@media (max-width: 767px) {
  .erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-c2cab37 > .e-con-inner { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .erg-section:not(#_) .erg-content--elementor > .elementor .elementor-element-c2cab37 > .e-con-inner > .e-con {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
  }
  .erg-section:not(#_) .erg-content--elementor > .elementor .elementor-element-c2cab37 .elementor-widget-heading,
  .erg-section:not(#_) .erg-content--elementor > .elementor .elementor-element-c2cab37 .elementor-widget-image { width: auto; }
  .erg-section:not(#_) .erg-content--elementor > .elementor .elementor-element-c2cab37 .elementor-widget-image img { height: 48px; }

  .erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-b34d676 > .e-con-inner,
  .erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-2d0ae56 > .e-con-inner,
  .erg-section .erg-content--elementor > .elementor .elementor-element.elementor-element-9e622f7 > .e-con-inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }

  .erg-section .erg-content--elementor > .elementor .elementor-element-9c457b5 :is(.elementor-widget-container, .elementor-text-editor) > p:first-child,
  .erg-section .erg-content--elementor > .elementor .elementor-element-9c457b5.elementor-widget > p:first-child { padding: 20px; font-size: 17px; }
}