.hb-article-content {
  color: #35472b;
  font:
    400 15px/1.8 Inter,
    sans-serif;
  overflow-wrap: anywhere;
}
.hb-article-content :is(h2, h3, h4) {
  color: #263b20;
  line-height: 1.35;
}
.hb-article-content h2 {
  font-size: 24px;
  margin: 32px 0 14px;
}
.hb-article-content h3 {
  font-size: 20px;
  margin: 24px 0 12px;
}
.hb-article-content h4 {
  font-size: 17px;
  margin: 22px 0 10px;
}
.hb-article-content p {
  margin: 0 0 18px;
}
.hb-article-content a {
  color: #ab472c;
}
.hb-article-content blockquote {
  border-left: 3px solid #a4b58e;
  margin: 26px 0;
  padding: 6px 20px;
  color: #718160;
  font-style: italic;
}
.hb-article-content figure {
  margin: 24px 0;
}
.hb-article-content img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
}
.hb-article-content figcaption {
  margin-top: 8px;
  font-size: 11px;
  color: #839474;
  line-height: 1.6;
}
.hb-content-gallery {
  display: grid;
  gap: 16px;
  margin: 28px 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.hb-content-gallery[data-columns="3"] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.hb-content-gallery .hb-content-image {
  margin: 0;
  min-width: 0;
}
.hb-content-gallery img {
  aspect-ratio: 1;
  object-fit: cover;
}
.hb-content-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  align-items: center;
  margin: 30px 0;
}
.hb-content-split[data-side="right"] > figure {
  order: 2;
}
.hb-content-split > figure {
  margin: 0;
}
.hb-content-split h3 {
  margin-top: 0;
}
.hb-content-callout {
  border-left: 3px solid #96aa7d;
  background: #f0f5e8;
  border-radius: 0 9px 9px 0;
  padding: 24px;
  margin: 28px 0;
}
.hb-content-callout[data-tone="tip"] {
  background: #f8f2e9;
  border-color: #b39975;
}
.hb-content-callout[data-tone="stat"] {
  background: #eaf1ed;
  border-color: #7b9c88;
}
.hb-content-callout h3 {
  margin: 0 0 10px;
  font-size: 18px;
}
.hb-content-callout p:last-child {
  margin: 0;
}
.hb-content-table {
  overflow-x: auto;
  margin: 28px 0;
  border: 1px solid #dce5d1;
  border-radius: 8px;
}
.hb-content-table table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.hb-content-table :is(td, th) {
  text-align: left;
  border: 1px solid #e4ebdc;
  padding: 13px 15px;
  min-width: 110px;
}
.hb-content-table th {
  background: #edf3e5;
  color: #506c3a;
  font-weight: 550;
}
.hb-content-action {
  margin: 26px 0 !important;
}
.hb-article-content .hb-content-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  background: #cf4726;
  border: 1px solid #cf4726;
  color: white;
  border-radius: 7px;
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
}
.hb-article-content .hb-content-button[data-style="secondary"] {
  color: #56713f;
  background: #f1f6e9;
  border-color: #d9e4cb;
}
.hb-article-content .hb-content-download {
  display: flex;
  justify-content: space-between;
  gap: 22px;
  align-items: center;
  background: #f6f9f1;
  border: 1px solid #e2ead8;
  border-radius: 9px;
  padding: 22px;
  margin: 26px 0;
  text-decoration: none;
  color: #536e40;
}
.hb-content-download strong {
  font-size: 14px;
  font-weight: 550;
}
.hb-content-download > span {
  font-size: 11px;
  color: #859771;
  white-space: nowrap;
}
.hb-content-video {
  margin: 28px 0;
}
.hb-content-video iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16/9;
  border: 0;
  border-radius: 8px;
}
.hb-content-faq {
  margin: 28px 0;
  border-top: 1px solid #dce5d1;
}
.hb-content-faq details {
  border-bottom: 1px solid #dce5d1;
  padding: 16px 0;
}
.hb-content-faq summary {
  cursor: pointer;
  color: #506d3b;
  font-weight: 550;
  font-size: 14px;
}
.hb-content-faq p {
  margin: 14px 0 0 18px;
}
.hb-content-divider {
  border: 0;
  border-top: 1px solid #dce6d1;
  margin: 32px 0;
}
.hb-content-code {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 8px;
  background: white;
  margin: 26px 0;
}
.hb-content-toc {
  margin: 26px 0;
  padding: 22px;
  background: #f7f9f3;
  border: 1px solid #e5ebdd;
  border-radius: 9px;
}
.hb-content-toc strong {
  font-size: 12px;
  color: #667f50;
}
.hb-content-toc ol {
  margin: 12px 0 0;
  padding-left: 20px;
}
.hb-content-toc a {
  color: #7a8f66;
  font-size: 12px;
  text-decoration: none;
}
.hb-content-toc li[data-level="3"] {
  margin-left: 15px;
}
@media (max-width: 600px) {
  .hb-content-gallery,
  .hb-content-gallery[data-columns="3"],
  .hb-content-split {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .hb-content-split[data-side="right"] > figure {
    order: 0;
  }
  .hb-article-content .hb-content-download {
    flex-wrap: wrap;
    gap: 8px;
  }
}
