.rwr-blog-description {
  max-width: 48ch;
  margin-top: 1.5rem;
  color: var(--color-gray-lightest);
  font: 400 1.0625rem/1.8 var(--font-base);
}

.rwr-blog-description p {
  margin: 0 0 .75em;
}

.rwr-blog-description a {
  color: inherit;
  text-underline-offset: .2em;
}

.rwr-blog-list {
  padding: 0 clamp(1.25rem, 5vw, 4rem);
}

.rwr-blog-card {
  display: flex;
  align-items: start;
  gap: clamp(1.5rem, 4vw, 3rem);
  padding-block: clamp(2rem, 5vw, 3.5rem);
  border-bottom: 1px solid var(--color-highlight-soft);
}

.rwr-blog-card:last-child {
  border-bottom: 0;
}

.rwr-blog-image {
  flex: 0 0 32%;
  overflow: hidden;
  background: #efe4ce;
}

.rwr-blog-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.rwr-blog-copy {
  flex: 1;
  min-width: 0;
}

.rwr-blog-date {
  color: var(--color-gray);
  font: 500 .75rem/1.6 var(--font-primary);
}

.rwr-blog-copy h2,
.rwr-blog-empty h2 {
  margin: .5rem 0 1rem;
  color: var(--color-dark-offset);
  font: 700 clamp(1.5rem, 3vw, 2rem)/1.3 var(--font-primary);
}

.rwr-blog-copy h2 a {
  color: inherit;
  text-decoration: none;
}

.rwr-blog-copy h2 a:hover {
  text-decoration: underline;
  text-underline-offset: .15em;
}

.rwr-blog-excerpt,
.rwr-blog-empty p {
  color: var(--color-text-base);
  font: 400 1.0625rem/1.8 var(--font-base);
}

.rwr-blog-excerpt p {
  margin: 0 0 1rem;
}

.rwr-blog-read,
.rwr-blog-empty a {
  display: inline-block;
  margin-top: .5rem;
  padding-block: .5rem;
  color: var(--color-link);
  font: 600 .875rem/1.6 var(--font-primary);
  text-underline-offset: .25em;
}

.rwr-blog-read:hover,
.rwr-blog-empty a:hover {
  color: var(--color-dark-offset);
}

.rwr-blog-empty {
  padding-block: clamp(2rem, 5vw, 4rem);
  max-width: 52ch;
}

.rwr-blog-pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: .5rem;
  padding: 1.5rem clamp(1.25rem, 5vw, 4rem) 2.5rem;
  border-top: 1px solid var(--color-highlight-soft);
  font: 600 .875rem/1.5 var(--font-primary);
}

.rwr-blog-pagination :where(a, span) {
  padding: .75rem 1rem;
}

.rwr-blog-pagination a {
  color: var(--color-link);
  text-underline-offset: .2em;
}

.rwr-blog-pagination [aria-current] {
  background: var(--color-dark-offset);
  color: var(--reading-paper);
}

@media (max-width: 600px) {
  .rwr-blog-card {
    flex-direction: column;
  }

  .rwr-blog-image {
    flex: none;
    width: 100%;
  }
}