body {
  background: #f7f4ee;
  color: #27231d;
  font-family: var(--font-body);
  font-size: var(--type-0);
  line-height: var(--leading-body);
}

.article {
  width: min(calc(100% - var(--space-4)), var(--measure));
  margin: 0 auto;
  padding: var(--space-6) 0;
}

.article-header {
  margin-bottom: var(--space-5);
}

.kicker {
  margin: 0 0 var(--space-2);
  color: #746b5e;
  font-family: var(--font-sans);
  font-size: var(--type--1);
  font-weight: 650;
  letter-spacing: 0;
}

h1 {
  margin: 0 0 var(--space-3);
  color: #1c1813;
  font-size: var(--type-4);
  line-height: var(--leading-tight);
  font-weight: 600;
}

.dek {
  max-width: var(--measure-list);
  margin: 0 0 var(--space-3);
  color: #51483c;
  font-size: var(--type-1);
  line-height: var(--leading-heading);
}

.byline {
  margin: 0;
  color: #746b5e;
  font-family: var(--font-sans);
  font-size: var(--type--1);
  line-height: var(--leading-heading);
}

p {
  margin: 0 0 var(--space-3);
}

h2 {
  margin: var(--space-6) 0 var(--space-2);
  color: #211d17;
  font-size: var(--type-3);
  line-height: var(--leading-heading);
  font-weight: 600;
}

h3 {
  margin: var(--space-5) 0 var(--space-2);
  color: #2f2a22;
  font-size: var(--type-2);
  line-height: var(--leading-heading);
  font-weight: 600;
}

blockquote {
  margin: var(--space-5) 0;
  padding: var(--space-3) var(--space-4);
  border-left: var(--space-1) solid #9b7a48;
  color: #3f372c;
  background: #eee7d9;
  font-size: var(--type-1);
  line-height: var(--leading-body);
}

blockquote p {
  margin: 0;
}

ul,
ol {
  max-width: var(--measure-list);
  margin: 0 0 var(--space-4) var(--space-4);
  padding: 0;
}

li {
  margin: 0 0 var(--space-1);
  line-height: var(--leading-body);
}

li::marker {
  color: #8d6f42;
}

@media (max-width: 40rem) {
  .article {
    width: min(calc(100% - var(--space-3)), var(--measure));
    padding: var(--space-5) 0;
  }

  h1 {
    font-size: var(--type-3);
  }

  h2 {
    font-size: var(--type-2);
  }

  h3,
  .dek,
  blockquote {
    font-size: var(--type-1);
  }

  blockquote {
    padding: var(--space-3);
  }
}
