/*
 * Pembe koleksiyonlar — ölçümler `data/mobil-anasayfa-pembe-koleksiyonlar.md`
 * (mobil.pdf s1, y 3510.40–3842.96; 360pt artboard, 1pt = 1px).
 *
 *   bölüm zemini  #F8FAFB, tam genişlik, y 3510.40–3842.96
 *   başlık        14.70pt Gilroy-ExtraBold #000, SOLDA (x 18.08)
 *   yönlendirme   pembe etiket #EA6CA4, 88.33 × 13.68, içinde 7pt SemiBold
 *                 beyaz yazı + sağ ok
 *   kartlar       174.10 × 261.14 → oran 0.667, iki sütun
 *   kart konumu   x 12.15 ve 202.25 → kenar 12, ara 16
 *
 * Etiketin puntosu 7 ve yüksekliği 13.68 — ikisi de kuralın altında
 * (taban 11, dokunma hedefi 44). Punto 11'e, yükseklik 24'e çıkarıldı;
 * dokunma alanı görünmez katmanla 44. Etiketin pembesi ve şekli korundu.
 */

.cc_jcmnugos_3wQ8GJkkB9 .ms-pk {
  margin-top: var(--ms-pk-must, 0);
  padding: var(--ms-pk-ic-ust, 15px) var(--ms-pk-kenar, 12px) var(--ms-pk-ic-alt, 28px);
}

.cc_jcmnugos_3wQ8GJkkB9 .ms-pk-satir {
  /*
   * Başlık satırının kendi payı var: tasarımda başlık x 18.08'den başlıyor,
   * etiketin kutusu sağdan 23.69 içeride bitiyor — kartlar ise 12'den
   * başlıyor. Bölümün 12'lik payına satır kendi 6 / 12'sini ekliyor.
   */
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  /*
   * Sağ pay 20: eğim yüzünden etiketin ÇİZİLEN kutusu düzen kutusundan
   * 8 daha geniş (24 × tan33.87° = 16.1, merkeze göre ±8). Tasarımda çizilen
   * kutu sağdan 23.69 içeride bitiyor → düzen payı 12 (bölüm) + 20 (satır)
   * eksi 8 = 24 ≈ 23.69.
   */
  padding: 0 20px 0 6px;
  margin-bottom: var(--ms-pk-baslik-ara, 10px);
}

.cc_jcmnugos_3wQ8GJkkB9 .ms-pk-baslik {
  /* flex öğesi olduğu için zaten bloklaşıyor; yine de açıkça yazılı
     (bkz. temanın h1..h6 display: unset reset'i) */
  display: block;
  margin: 0;
  color: var(--ms-pk-baslik-renk, #000);
  font-size: 15px;
  font-weight: 800;
  line-height: 20px;
}

.cc_jcmnugos_3wQ8GJkkB9 .ms-pk-tumu {
  /*
   * ETİKET PARALELKENAR, yuvarlak hap DEĞİL — tasarımın vektör yolundan
   * çözüldü (x 247.98–336.31, y 3530.44–3544.12):
   *   alt kenar  250.63 → 324.47
   *   üst kenar  259.81 → 333.65   (alt kenardan 9.18 SAĞA kayık)
   *   yükseklik  13.68
   *   eğim       atan(9.18 / 13.68) = 33.87°
   *
   * `skewX(-33.87deg)` üst kenarı sağa kaydırıyor (CSS'te y aşağı büyüdüğü
   * için açı NEGATİF). İçerik ters eğimle düzeltiliyor, yoksa yazı da yatar.
   * Köşeler tasarımda çok hafif yuvarlak (~1.6) — 2 bırakıldı.
   */
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 12px;
  border-radius: 2px;
  background-color: var(--ms-pk-etiket, #ea6ca4);
  color: var(--ms-pk-etiket-yazi, #fff);
  text-decoration: none;
  white-space: nowrap;
  transform: skewX(-33.87deg);
}

.cc_jcmnugos_3wQ8GJkkB9 .ms-pk-tumu-ic {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  /* kutunun eğimi geri alınıyor: yazı ve ok dik duruyor */
  transform: skewX(33.87deg);
}

.cc_jcmnugos_3wQ8GJkkB9 .ms-pk-tumu::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: max(100%, 44px);
  transform: translate(-50%, -50%);
}

.cc_jcmnugos_3wQ8GJkkB9 .ms-pk-ok {
  width: 14px;
  height: 10px;
  flex: none;
}

.cc_jcmnugos_3wQ8GJkkB9 .ms-pk-izgara {
  display: grid;
  grid-template-columns: repeat(var(--ms-pk-sutun, 2), minmax(0, 1fr));
  gap: var(--ms-pk-ara, 16px);
}

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