.seo-dek {
  color: var(--ink-mid, var(--mid, #4a4540));
  font-size: 19px;
  line-height: 1.65;
  max-width: 700px;
  margin: -2px 0 30px;
}

.article-hero {
  margin: 0 0 52px;
}

.article-hero img {
  display: block;
  width: 100%;
  height: clamp(240px, 55vw, 430px);
  object-fit: cover;
  border-radius: 4px;
  background: #f0ebe3;
}

.article-hero figcaption {
  margin-top: 10px;
  color: var(--ink-soft, var(--soft, #827c76));
  font-family: "DM Mono", monospace;
  font-size: 9px;
  letter-spacing: .08em;
  line-height: 1.5;
  text-transform: uppercase;
}

.author-note,
.related-reading {
  margin-top: 48px;
  padding: 26px 28px;
  border: 1px solid var(--border, #e5dfd6);
  border-radius: 4px;
  background: var(--white, #fff);
}

.author-note .seo-label,
.related-reading .seo-label {
  display: block;
  margin-bottom: 10px;
  color: var(--orange, #d94f0a);
  font-family: "DM Mono", monospace;
  font-size: 9px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.author-note p,
.related-reading li {
  color: var(--ink-mid, var(--mid, #4a4540));
  font-size: 15px;
  line-height: 1.7;
}

.author-note p { margin: 0; }
.author-note a,
.related-reading a {
  color: var(--orange, #d94f0a);
  text-underline-offset: 3px;
}

.related-reading h2 {
  margin: 0 0 14px;
  font-family: "Fraunces", serif;
  font-size: 27px;
  font-weight: 400;
  line-height: 1.2;
}

.related-reading ul {
  margin: 0;
  padding-left: 20px;
}

.related-reading li { margin: 7px 0; }

.cta-block.article-cta h2 {
  margin: 0 0 12px;
  font-family: "Fraunces", serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 1.2;
}

.cta-block.article-cta p {
  margin-bottom: 20px;
  color: var(--ink-mid, var(--mid, #4a4540));
  line-height: 1.65;
}

.cta-block.article-cta a.button {
  display: inline-flex;
  padding: 12px 18px;
  border-radius: 2px;
  background: var(--orange, #d94f0a);
  color: #fff;
  font-family: "DM Mono", monospace;
  font-size: 9px;
  font-weight: 500;
  letter-spacing: .12em;
  text-decoration: none;
  text-transform: uppercase;
}

@media (max-width: 700px) {
  .seo-dek { font-size: 17px; }
  .article-hero { margin-bottom: 38px; }
  .article-hero img { height: clamp(220px, 62vw, 330px); }
  .author-note,
  .related-reading { padding: 22px; }
}
