/* Vuvito 3-2 Grid
 *
 * Tek 6 kolonluk grid. Yerleşim sıraya göre:
 *   1-2-3. kart → 2 kolon (4:5 dikey)
 *   4-5. kart   → 3 kolon (16:9 yatay)
 * Kural `5n+…` ile yazıldığı için desen her 5 kartta tekrar eder.
 * Mobilde tek kolon, hepsi aynı: 2:1 yatay.
 *
 * Grid sınıfı IkasComponentRenderer'ın sarmalayıcısına verilir; doğrudan
 * çocukları kartların kapsayıcılarıdır, bu yüzden nth-child güvenle çalışır.
 */

.cc_lqof57t2_Jyxu2gqy1c .vt-grid32 {
  width: 100%;
  background: var(--color-bg);
}

.cc_lqof57t2_Jyxu2gqy1c .vt-grid32__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--vt-grid32-gap, 24px);
}

@media (min-width: 768px) {
  .cc_lqof57t2_Jyxu2gqy1c .vt-grid32__grid {
    grid-template-columns: repeat(6, 1fr);
  }

  /* DİKKAT: her çocuk component'in sarmalayıcısı da satır içi
   * `display: contents` taşır. Böyle bir eleman kutu ağacında olmadığı için
   * `grid-column` ona UYGULANMAZ — gerçek grid ögesi bir alt katmandaki
   * kart köküdür. (Custom property'ler miras geçtiği için --vt-cat-ratio
   * sarmalayıcıda da çalışır, `grid-column` çalışmaz.)
   *
   * Bu yüzden kural hem sarmalayıcıya hem de bir alt elemana yazılır:
   * hangisi gerçek grid ögesiyse orada tutar. */

  /* Üst sıra: üç dikey kart */
  .cc_lqof57t2_Jyxu2gqy1c .vt-grid32__grid > *:nth-child(5n + 1), .cc_lqof57t2_Jyxu2gqy1c .vt-grid32__grid > *:nth-child(5n + 2), .cc_lqof57t2_Jyxu2gqy1c .vt-grid32__grid > *:nth-child(5n + 3), .cc_lqof57t2_Jyxu2gqy1c .vt-grid32__grid > *:nth-child(5n + 1) > *, .cc_lqof57t2_Jyxu2gqy1c .vt-grid32__grid > *:nth-child(5n + 2) > *, .cc_lqof57t2_Jyxu2gqy1c .vt-grid32__grid > *:nth-child(5n + 3) > * {
    grid-column: span 2;
    --vt-cat-ratio: 4 / 5;
  }

  /* Alt sıra: iki geniş kart */
  .cc_lqof57t2_Jyxu2gqy1c .vt-grid32__grid > *:nth-child(5n + 4), .cc_lqof57t2_Jyxu2gqy1c .vt-grid32__grid > *:nth-child(5n + 5), .cc_lqof57t2_Jyxu2gqy1c .vt-grid32__grid > *:nth-child(5n + 4) > *, .cc_lqof57t2_Jyxu2gqy1c .vt-grid32__grid > *:nth-child(5n + 5) > * {
    grid-column: span 3;
    --vt-cat-ratio: 16 / 9;
  }
}

/* Kart bu değişkenleri miras alır — ebeveyn hangi oranı ve davranışı
   istiyorsa oradan iner (bkz. CategoryCard/styles.css).

   Buradaki oran MOBİL varsayılandır: 768px üstünde yukarıdaki 3-2 deseni
   kart sırasına göre kendi oranını yazar ve bunu ezer. Dar ekranda dikey
   4:5 kartlar sayfayı gereksiz uzatıyordu; hepsi aynı yatay 2:1 olunca
   liste tek bakışta taranıyor. */
.cc_lqof57t2_Jyxu2gqy1c .vt-grid32 {
  --vt-cat-ratio: 2 / 1;
  --vt-cat-scrim: 0;
  --vt-cat-zoom: 1;
}

.cc_lqof57t2_Jyxu2gqy1c .vt-grid32--scrim {
  --vt-cat-scrim: 1;
}

.cc_lqof57t2_Jyxu2gqy1c .vt-grid32--zoom {
  --vt-cat-zoom: 1.08;
}
