.api-media-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:1rem;
}
.api-media-card{
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  border-radius:17px;
  color:#eef2ff;
  text-decoration:none;
  background:#100b1b;
  transition:.2s ease;
}
.api-media-card:hover{
  transform:translateY(-4px);
  border-color:rgba(139,92,246,.55);
}
.api-media-card>img,
.api-card-placeholder{
  display:block;
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  background:linear-gradient(145deg,#27104d,#100a1e);
}
.api-card-placeholder{
  display:grid;
  place-items:center;
  font-size:2.5rem;
}
.api-media-card>div{
  padding:1rem;
}
.api-media-card small{
  color:#b99cff;
  font-weight:900;
  letter-spacing:.1em;
}
.api-media-card h3{
  margin:.4rem 0;
  overflow-wrap:anywhere;
}
.api-media-card p{
  margin:0;
  color:#b9b3ca;
}