/* Naming direction article — page extensions (shared: insight-article.css) */


/* =========================================================
   HERO FLAT-LAY — editorial horizontal crop
   ========================================================= */

.article-hero-image img {
  object-position: center 42%;
}


/* =========================================================
   MEDIA PLACEHOLDERS
   ========================================================= */

.article-figure .article-media-placeholder {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: var(--radius-md);
  overflow: hidden;
}

.article-media-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--space-9);
  aspect-ratio: 4 / 3;
  background: var(--surface-soft);
  border: 1px solid var(--border-soft-color);
  border-radius: var(--radius-md);
}

.article-media-placeholder__label {
  max-width: 28ch;
  padding-inline: var(--space-4);
  font-family: var(--font-primary);
  font-size: var(--text-sm);
  line-height: var(--leading-snug);
  letter-spacing: var(--tracking-body);
  text-align: center;
  color: var(--text-secondary);
}

@media (max-width: 760px) {

  .article-figure .article-media-placeholder {
    border-radius: var(--radius-sm);
  }

}