.hero-illustration {
  width: 1200px;
}
@media only screen and (max-width: 1200px) {
  .hero-illustration {
    width: 700px;
  }
}

.split-windows {
  height: 600px;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 2px;
}

.split-window {
  flex: 1;
  min-height: 100%;
  overflow-y: auto;
}

.output {
  opacity: 90%;
  font-size: 90%;
}

.hero-illustration :global(.theme-code-block) {
  border-radius: 0;
}
