/* Additions for the landing page, blog and posts. The grid and components come from screen.css. */
.episode > .company a {
  border-bottom-width: 2px;
}

.post {
  grid-column: main;
  max-width: 72ch;
  font-size: var(--font-size-lg);
}

.post > * + * {
  margin-top: var(--space-sm);
}

.post h2,
.post h3 {
  margin-top: var(--space-md);
}

.post pre {
  overflow-x: auto;
  padding: var(--space-sm);
  border: 1px solid var(--color-border);
}

.post img {
  max-width: 100%;
}

@media screen and (min-width: 768px) {
  .post {
    grid-column: 2 / main-end;
  }
}

.about > .about-more {
  grid-column: main;
  grid-row: 4;
}