.external-media-gallery {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
  align-items: start;
}
@media (min-width: 768px) {
  .external-media-gallery { grid-template-columns: repeat(min(var(--em-columns, 3), 2), minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .external-media-gallery { grid-template-columns: repeat(var(--em-columns, 3), minmax(0, 1fr)); }
}

.external-media { margin: 0; display: flex; flex-direction: column; gap: .5rem; min-width: 0; }

.external-media__frame { position: relative; width: 100%; margin: 0 auto; border-radius: .75rem; overflow: hidden; background: #0001; }
.external-media__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.external-media__frame--wide { aspect-ratio: 16 / 9; }
.external-media__frame--vertical { aspect-ratio: 9 / 16; max-width: 340px; }
.external-media__frame--instagram { height: 560px; max-width: 400px; }
.external-media__frame--instagram-reel { height: 700px; max-width: 400px; }
.external-media__frame--fb-post { height: 560px; max-width: 500px; }
.external-media__frame--audio { height: 175px; background: none; }
.external-media__frame--audio-list { height: 450px; background: none; }

.external-media__card { position: relative; display: block; border-radius: .75rem; overflow: hidden; aspect-ratio: 16 / 9; }
.external-media__thumb { width: 100%; height: 100%; object-fit: cover; display: block; }
.external-media__thumb--blank { display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 1.25rem; color: #fff; background: #334155; }
.external-media--youtube .external-media__thumb--blank { background: #c4302b; }
.external-media--facebook .external-media__thumb--blank { background: #1877f2; }
.external-media--tiktok .external-media__thumb--blank { background: #010101; }
.external-media--spotify .external-media__thumb--blank { background: #1db954; }
.external-media--apple_music .external-media__thumb--blank { background: #fa243c; }
.external-media--instagram .external-media__thumb--blank { background: linear-gradient(45deg, #f09433, #dc2743, #bc1888); }
.external-media__badge { position: absolute; left: .75rem; bottom: .75rem; padding: .2rem .6rem; border-radius: 999px; font-size: .75rem; font-weight: 600; color: #fff; background: #000a; }

.external-media__caption { display: flex; flex-direction: column; gap: .25rem; font-size: .95rem; }
.external-media__source { font-size: .85rem; opacity: .75; text-decoration: underline; }
