.p-blog,
.p-downloads,
.p-post,
.p-styleguide {
  margin: 0 auto;
  max-width: 1120px;
  padding: var(--space-7) var(--space-5);
}

.p-blog__header,
.p-downloads__header,
.p-blog__section,
.p-post__article {
  max-width: var(--measure);
}

.p-blog h1,
.p-downloads h1,
.p-post h1,
.p-styleguide h1 {
  font-size: clamp(2.25rem, 6vw, 4.5rem);
  line-height: 1;
  margin: 0 0 var(--space-4);
}

.p-blog__section,
.p-styleguide__section {
  margin-block-start: var(--space-7);
}

.p-post {
  display: grid;
  gap: var(--space-7);
  grid-template-columns: minmax(0, var(--measure)) minmax(12rem, 18rem);
}

.p-post__rail {
  align-self: start;
  background: var(--brand-panel-background-quiet);
  border: var(--line-thin);
  border-radius: var(--radius-medium);
  padding: var(--space-5);
  position: sticky;
  top: var(--space-5);
}

.p-post__rail h2 {
  font-size: 1.2rem;
}

.p-post__rail ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

.p-post__rail-item {
  font-size: 0.92rem;
  margin-block-start: var(--space-2);
}

.p-post__rail-item--level-3,
.p-post__rail-item--level-4,
.p-post__rail-item--level-5,
.p-post__rail-item--level-6 {
  padding-inline-start: var(--space-4);
}

.p-post--story .p-post__article {
  border-inline-start: 4px solid var(--brand-genre-story);
  padding-inline-start: var(--space-5);
}

.p-post--log .p-post__article {
  border-inline-start: 4px solid var(--brand-genre-log);
  padding-inline-start: var(--space-5);
}

.p-styleguide__token-grid {
  display: grid;
  gap: var(--space-4);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
}

.p-styleguide__component-grid {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
}