.image-component {
  margin-bottom: 50px;
}

/* Contained images never overflow their column. */
.image-component__img.img-fluid {
  max-width: 100%;
  height: auto;
}

/* Full-width images fill the available width edge to edge. */
.image-component--full .image-component__img {
  display: block;
  width: 100%;
  height: auto;
}

.image-component__caption {
  /* font-size: 0.875rem; */
}

.image-component figcaption {
  display: flex;
  padding: 15px 30px;
  justify-content: start;
  align-items: center;
  gap: 10px;
  align-self: stretch;
}

/* Light theme: light caption text for dark backgrounds. */

.image-theme-light .image-component__caption {
  color: var(--black);
}

.image-theme-light figcaption {
  border-radius: 0 0 5px 5px;
  border-top: 3px solid var(--gold);
  background: var(--offwhite);
}

/* Dark theme: dark caption text for light backgrounds. */

.image-theme-dark .image-component__caption {
  color: var(--offwhite);
}

.image-theme-dark figcaption {
  border-radius: 0 0 5px 5px;
  border-top: 3px solid var(--gold);
  background: var(--teal);
}
