/* Single blog post pages */
.blog-post-page.breakdance,
.blog-post-page.breakdance .breakdance {
  background-color: #fff;
}

/* Match homepage header/footer colors on blog detail pages */
.blog-post-page .bde-header-builder-529-111.dh_header {
  background: #202020CC !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.blog-post-page .dan-burger-529-153.hamburger {
  --burguer-stroke-color: #fff;
}

.blog-post-page .dh_footer.bde-section-61-100 {
  --hcl-neutral-1: #111;
  --hcl-neutral-2: #191919;
  --hcl-neutral-3: #222;
  --hcl-neutral-4: #2a2a2a;
  --hcl-neutral-6: #3a3a3a;
  --hcl-neutral-11: #b4b4b4;
  --hcl-neutral-12: #eee;
  --hcl-on-bronze: #fff;
  --bde-body-text-color: #b4b4b4;
  --bde-headings-color: #eee;
  background-color: #191919;
  border-top: 1px solid #222;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: #eee;
}

.blog-post-page .dh_footer .bde-text-61-109,
.blog-post-page .dh_footer .bde-text-61-117,
.blog-post-page .dh_footer .bde-text-61-126,
.blog-post-page .dh_footer .bde-text-61-171 {
  color: #eee;
}

.blog-post-page .dh_footer .bde-text-61-106,
.blog-post-page .dh_footer .bde-text-61-107,
.blog-post-page .dh_footer .bde-text-61-169 {
  color: #b4b4b4;
}

.blog-post-page .dh_footer .dan-underline-hover__anchor,
.blog-post-page .dh_footer .dan-underline-hover__inner {
  color: #eee;
}

.blog-post-page .dh_footer .dan-underline-hover__inner {
  --background: #eee;
}

.blog-post-page .dh_footer .bde-div-61-132 {
  background-color: #222;
}

.blog-post-page .dh_footer .dan-toolteam-61-201 .dan-toolteam__tooltip {
  background-color: #222;
  color: #eee;
}

.blog-post-page .dh_footer .dan-toolteam-61-201 .dan-toolteam__name {
  color: #eee;
}

.blog-post-page .dh_footer .dan-toolteam-61-201 .dan-toolteam__role {
  color: #b4b4b4;
}

.blog-post-page .dh_footer .dan-toolteam-61-201 img {
  border-color: #3a3a3a;
}

.blog-post-page main,
.blog-post-page .blog-post {
  --hcl-on-bronze: #202020;
  --hcl-neutral-10: #838383;
  --hcl-neutral-11: #646464;
  --bde-headings-color: #202020;
  --bde-body-text-color: #646464;
  background-color: #fff;
  color: #646464;
}

.blog-post-page main {
  padding-top: calc(var(--site-header-height, 76px) + var(--hero-top-gap, 48px));
}

.blog-post-page .blog-post__title,
.blog-post-page .blog-post__body h2,
.blog-post-page .blog-post__body h3,
.blog-post-page .blog-post__body strong {
  color: #202020;
}

.blog-post-page .blog-post__back {
  color: #646464;
}

.blog-post-page .blog-post__back:hover {
  color: #202020;
}

.blog-post-page .blog-post__category {
  color: #838383;
}

.blog-post-page .blog-post__meta {
  color: #838383;
}

.blog-post-page .blog-post__body {
  color: #646464;
}

.blog-post {
  max-width: 760px;
  margin: 0 auto;
  padding: 2rem var(--bde-section-horizontal-padding, 20px) 5rem;
}

.blog-post__back {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--hcl-neutral-11, #646464);
  text-decoration: none;
}

.blog-post__back:hover {
  color: var(--hcl-on-bronze, #202020);
}

.blog-post__category {
  display: inline-block;
  margin-bottom: 1rem;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--hcl-neutral-10, #838383);
}

.blog-post__title {
  margin: 0 0 1rem;
  font-size: clamp(2rem, 1.4rem + 2vw, 2.75rem);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.04em;
  color: var(--hcl-on-bronze, #202020);
}

.blog-post__meta {
  margin-bottom: 2rem;
  font-size: 0.875rem;
  color: var(--hcl-neutral-10, #838383);
}

.blog-post__body {
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--hcl-neutral-11, #646464);
}

.blog-post__body h2 {
  margin: 2.5rem 0 1rem;
  font-size: clamp(1.35rem, 1.1rem + 0.8vw, 1.75rem);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.03em;
  color: var(--hcl-on-bronze, #202020);
}

.blog-post__body h3 {
  margin: 1.75rem 0 0.75rem;
  font-size: 1.125rem;
  font-weight: 500;
  color: var(--hcl-on-bronze, #202020);
}

.blog-post__body p {
  margin: 0 0 1.25rem;
}

.blog-post__body ul,
.blog-post__body ol {
  margin: 0 0 1.25rem;
  padding-left: 1.35rem;
}

.blog-post__body li {
  margin-bottom: 0.5rem;
}

.blog-post__body strong {
  color: var(--hcl-on-bronze, #202020);
  font-weight: 500;
}

.blog-post__cta {
  margin-top: 3rem;
  padding: 1.5rem;
  border-radius: var(--hrd-l, 18px);
  background: var(--hcl-brand-3, #1f2917);
  border: 1px solid var(--hcl-brand-5, #334423);
}

.blog-post__cta p {
  margin: 0 0 1rem;
  color: #fff;
}

.blog-post__cta p:last-child {
  margin-bottom: 0;
}

.blog-post__cta a {
  color: #fff;
  font-weight: 500;
}

@media (min-width: 768px) and (max-width: 1119px) {
  .blog-post-page main {
    padding-top: calc(var(--site-header-height, 68px) + var(--hero-top-gap, 30px));
  }

  .blog-post {
    padding-left: clamp(28px, 5vw, 48px);
    padding-right: clamp(28px, 5vw, 48px);
  }
}

@media (min-width: 1120px) {
  .blog-post {
    padding-left: clamp(24px, 2.5vw, 32px);
    padding-right: clamp(24px, 2.5vw, 32px);
  }
}
