.vf-summary--has-image {

  column-gap: 18px;
  grid-template-areas: 'image text' 'image text' 'image text';
  grid-template-columns: minmax($vf-summary--has-image-width, auto) 1fr;
  @include margin--block(bottom, 48px);

  & > .vf-summary__link,
  & > .vf-summary__image {
    grid-area: image;
  }
  .vf-summary__image {
    width: 180px;
  }

  .vf-summary__image--thumbnail {
    width: $vf-summary--has-image-width;
  }

  .vf-summary__title {
    grid-column: 2 / -1;
  }

  .vf-summary__text {
    display: block;
    grid-column: 2 / -1;
  }

}
