.how-topics {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--a-sprout) var(--a-bough);
  margin-block-end: var(--a-bough);
}

.how-visual {
  display: grid;
  grid-template-columns: minmax(0, 360px) minmax(0, 1fr);
  align-items: center;
  gap: var(--a-bough);
  margin: var(--a-bough) 0 var(--a-grove);
}

.how-visual img {
  display: block;
  width: 100%;
  max-inline-size: 360px;
  height: auto;
}

.how-visual figcaption {
  margin: 0;
  color: var(--the-understory);
  font-size: var(--speaking-softly);
}

@media (max-width: 650px) {
  .how-visual {
    grid-template-columns: minmax(0, 1fr);
  }

  .how-visual img {
    margin-inline: auto;
  }
}