/* t58u – article cards on phones: one consistent near-borderless frame, whole picture (no cropping), badge below the picture. Desktop (> 760px) unchanged. */
.mk-card .mk-badge-m { display: none; }
@media (max-width: 760px) {
  .mk-card .mk-media.mk-media { aspect-ratio: 1 / 1; isolation: isolate; }
  .mk-card .mk-media.mk-media[class*="ith-"], .mk-card .mk-media.mk-media.is-contain { padding: 4px; background: var(--card); }
  /* soft blurred fill of the same picture behind it – visible only where the picture is not square */
  .mk-card .mk-media[class*="ith-"]::before { content: ""; position: absolute; inset: 4px; border-radius: 14px; background-color: var(--bg-2); background-image: var(--mk-fill, none); background-size: cover; background-position: center; filter: blur(16px) saturate(1.1); opacity: .55; transform: none; z-index: 0; }
  .mk-card .mk-media[class*="ith-"]::after { content: none; }
  .mk-card .mk-media.mk-media.is-contain.ith-d::after, .mk-card .mk-media.mk-media.is-contain.ith-l::after, .mk-card .mk-media.mk-media.is-contain.ith-auto::after { content: ""; inset: 4px; border-radius: 14px; }
  .mk-card .mk-media[class*="ith-"] img[data-ith].ith-img.ith-img { position: relative; z-index: 1; object-fit: contain; object-position: center; background: transparent; border-radius: 12px; }
  /* no hover zoom / lift on phones (iOS keeps :hover after a tap, which made one card look different) */
  .card.item.mk-card, .card.item.mk-card:hover { transform: none; }
  .mk-card:hover .mk-media img.thumb, .mk-card .mk-media img.thumb { transform: none; }
  /* price / tickets: below the picture instead of on top of it */
  .mk-card .mk-media .mk-badge { display: none; }
  .mk-card .mk-badge-m { display: inline-flex; position: static; align-self: flex-start; box-shadow: none; margin: 0 0 2px; font-size: .82rem; padding: 5px 11px; }
  .mk-card .mk-media .mk-flag { top: 10px; right: 10px; }
}
@media (hover: none) {
  .card.item.mk-card:hover { transform: none; }
  .mk-card:hover .mk-media img.thumb { transform: none; }
}
/* single column: cards without a picture don't need a full square */
@media (max-width: 519px) { .mk-card .mk-media.mk-media.is-empty { aspect-ratio: 4 / 3; } }
