/*
 * Arka planlı vitrin görseli — ölçümler `data/mobil-anasayfa-vitrin.md`
 * (mobil.pdf s1; 360pt artboard, 1pt = 1px).
 *
 *   başlık kutusu  114.61 × 29.72, köşe ~4, zemin #E4E7EC
 *                  metin 13pt Gilroy-Medium #000, iç boşluk 12.4 / 12.0
 *   bant           tam genişlik, y 1239.75–1496.5 (256.75)
 *   kart           343.25 × 238 (oran 1.442), köşe ~12
 *                  sol 9.25 · sağ 7.5 · bant üstünden 10.75 · altına 8
 *   binme          kutu bandın üstüne 3.63 biniyor
 *
 * Bandın rengi tasarımda düz değil, hafif geçişli (#E4E6ED → #F4F5F7);
 * tek renge indirildi ve PROP yapıldı — marka "renk ayarlı istiyoruz" dedi.
 */

.cc_jcmnugos_l5NwfiR8IL .ms-vitrin {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: var(--ms-vitrin-must, 0);
}

  /*
   * `display` AÇIKÇA yazılı: tema başlıklara çok geniş bir reset uyguluyor
   * (`button, h1..h6, input… { … display: unset … }`) ve `display` miras
   * alınmadığı için `unset` = başlangıç değeri = **inline**. Satır içi h2'nin
   * kutusu içeriğe daralıyor, `text-align: center` de hiçbir şey yapmıyor —
   * canlıda başlık 126px'lik kutuda sola yapışık çıktı.
   */
.cc_jcmnugos_l5NwfiR8IL .ms-vitrin-baslik {
  /* satır içi kalsaydı dikey margin uygulanmaz, banda binme kaybolurdu */
  display: inline-block;
  position: relative;
  z-index: 1;
  /* bandın üst kenarına binen 3.6 — tasarımdaki binme */
  margin: 0 0 -4px;
  padding: 0 12px;
  border-radius: 4px;
  background-color: var(--ms-vitrin-baslik-zemin, #e4e7ec);
  color: var(--ms-vitrin-baslik-renk, #000);
  font-size: 13px;
  font-weight: 500;
  line-height: 30px;
  white-space: nowrap;
}

.cc_jcmnugos_l5NwfiR8IL .ms-vitrin-zemin {
  align-self: stretch;
  padding: var(--ms-vitrin-ic-ust, 11px) var(--ms-vitrin-kenar, 8px) var(--ms-vitrin-ic-alt, 8px);
  background-color: var(--ms-vitrin-zemin, #e9ebf0);
}

.cc_jcmnugos_l5NwfiR8IL .ms-vitrin-alan {
  display: block;
  aspect-ratio: var(--ms-vitrin-oran, 343 / 238);
  border-radius: var(--ms-vitrin-yaricap, 12px);
  overflow: hidden;
}

.cc_jcmnugos_l5NwfiR8IL .ms-vitrin-gorsel {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (min-width: 1024px) {
  .cc_jcmnugos_l5NwfiR8IL .ms-vitrin {
    margin-top: var(--ms-vitrin-ust, 0);
  }

  .cc_jcmnugos_l5NwfiR8IL .ms-vitrin-alan {
    aspect-ratio: var(--ms-vitrin-oran-web, var(--ms-vitrin-oran, 343 / 238));
  }
}