.cc_xz5rynac_qFCW0UESXC .promo {
  width: 100%;
  padding: var(--space-md) 0;
}

.cc_xz5rynac_qFCW0UESXC .promo-container {
  max-width: var(--page-max);
  margin: 0 auto;
  padding: 0 var(--page-gutter);
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-sm);
}

/* ---------- Kart ---------- */

.cc_xz5rynac_qFCW0UESXC .promo-card {
  position: relative;
  display: block;
  border-radius: 12px;
  overflow: hidden;
  background: var(--color-surface-alt);
  text-decoration: none;
  color: inherit;
  transition: transform 220ms ease, box-shadow 220ms ease;
}

.cc_xz5rynac_qFCW0UESXC .promo-card:not(.promo-card--static):hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
}

.cc_xz5rynac_qFCW0UESXC .promo-media {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 7;
  background: var(--color-surface-alt);
}

.cc_xz5rynac_qFCW0UESXC .promo-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.cc_xz5rynac_qFCW0UESXC .promo-media--empty {
  display: block;
  width: 100%;
  height: 100%;
  /* Görsel eklenmemiş kart için nötr yer tutucu */
  background:
    repeating-linear-gradient(45deg, rgba(0, 0, 0, 0.015) 0 12px, transparent 12px 24px),
    linear-gradient(135deg, #F7F8FA 0%, #ECEFF3 100%);
}

/* ---------- Metin katmanı ----------
   Görselin üzerine oturan beyaz köşe kutusu — referansta başlık ve buton
   görselin sol altında beyaz bir alan içinde duruyor. */

.cc_xz5rynac_qFCW0UESXC .promo-body {
  position: absolute;
  left: 0;
  bottom: 0;
  max-width: 72%;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 18px 12px 16px;
  background: var(--color-surface);
  border-top-right-radius: 14px;
}

.cc_xz5rynac_qFCW0UESXC .promo-title {
  font-family: var(--font-label);
  font-size: var(--text-body);
  font-weight: 700;
  line-height: 1.25;
  color: var(--color-text-primary);
}

.cc_xz5rynac_qFCW0UESXC .promo-subtitle {
  font-family: var(--font-body);
  font-size: var(--text-small);
  line-height: 1.35;
  color: var(--color-error);
}

.cc_xz5rynac_qFCW0UESXC .promo-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  align-self: flex-start;
  margin-top: 8px;
  padding: 5px 12px;
  border-radius: 5px;
  background: var(--color-accent);
  color: var(--color-surface);
  font-family: var(--font-label);
  font-size: var(--text-label);
  font-weight: 700;
  letter-spacing: 0.04em;
}

.cc_xz5rynac_qFCW0UESXC .promo-cta svg {
  width: 12px;
  height: 12px;
}

.cc_xz5rynac_qFCW0UESXC .promo-card:hover .promo-cta {
  background: var(--color-accent-dark);
}

/* ---------- Sütunlar ---------- */

@media (min-width: 768px) {
  .cc_xz5rynac_qFCW0UESXC .promo--cols-2 .promo-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cc_xz5rynac_qFCW0UESXC .promo--cols-3 .promo-container, .cc_xz5rynac_qFCW0UESXC .promo--cols-4 .promo-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .cc_xz5rynac_qFCW0UESXC .promo--cols-3 .promo-container {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .cc_xz5rynac_qFCW0UESXC .promo--cols-4 .promo-container {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc_xz5rynac_qFCW0UESXC .promo-card {
    transition: none;
  }

  .cc_xz5rynac_qFCW0UESXC .promo-card:not(.promo-card--static):hover {
    transform: none;
  }
}