.blog-post-page { background: #fff; }
.post-hero { min-height: 424px; background: #121212; color: #fff; display: flex; align-items: center; padding: 106px 24px 35px; }
.post-hero-inner { width: min(100%, 920px); margin: 0 auto; text-align: center; }
.post-hero h1 { color: #fff; font-size: clamp(55px, 6.25vw, 80px); max-width: 760px; margin: 0 auto 24px; line-height: 1.08; }
.post-hero p { color: #fff; font-size: 17px; line-height: 1.5; margin: 0; }
.post-hero p a:hover { color: #cb0404; }
.post-hero p span::before { content: '|'; display: inline-block; margin: 0 13px; color: #fff; }

.post-main { padding: 82px 24px 78px; }
.post-layout { width: min(100%, 1190px); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 700px) 380px; gap: 74px; align-items: start; }
.post-article { min-width: 0; font-size: 17px; line-height: 1.9; }
.post-article p { margin: 0 0 26px; }
.post-article h2, .post-article h3 { scroll-margin-top: 24px; text-transform: none; letter-spacing: 0; }
.post-article h2 { font-size: 35px; margin: 34px 0 19px; line-height: 1.18; }
.post-article h3 { font-size: 29px; margin: 32px 0 18px; line-height: 1.25; }
.post-article a { color: #cb0404; }
.post-article a:hover { color: #4b0202; }
.post-article ul { margin: -4px 0 26px 28px; list-style: circle; }
.post-article li { padding-left: 5px; margin-bottom: 4px; }
.post-article figure:has(> .post-featured-image) { width: 100%; margin-left: 0; margin-right: 0; }
.post-article .post-featured-image { display: block; width: 100%; max-width: none; height: auto; }
.post-article :is(div, p, section, blockquote, ul, ol, figure, table).has-background,
.post-article :is(div, p, section, blockquote, ul, ol, figure, table)[style*="background-color"] { padding: 24px; }
.post-figure { margin: 0 0 28px; }
.post-figure img { width: 100%; height: auto; }
.post-figure figcaption { font-size: 16px; font-style: italic; line-height: 1.7; margin-top: 5px; }
.post-figure-plain { margin-top: 10px; }

.post-toc { border: 1px solid #aaa; margin: 0 0 25px; background: #f5f5f5; }
.post-toc-heading { width: 100%; height: 67px; border: 0; padding: 0 23px; display: flex; align-items: center; justify-content: space-between; background: #121212; color: #fff; cursor: pointer; font-family: 'Bebas Neue', sans-serif; font-size: 24px; text-transform: uppercase; }
.post-toc-heading span { font-family: Arial, sans-serif; font-size: 28px; line-height: 1; }
.post-toc-list { list-style: decimal; margin: 0; padding: 19px 35px 39px 45px; }
.post-toc-list li { padding-left: 3px; margin: 0 0 9px; }
.post-toc-list a { color: #333; }
.post-toc-list a:hover { color: #cb0404; }

.post-sidebar { position: sticky; top: 30px; }
.post-sidebar .contact-form-section { min-height: 0; padding: 0; background: transparent; }
.post-sidebar .contact-form-overlay,
.post-sidebar .contact-form-title,
.post-sidebar .contact-form-subtitle,
.post-sidebar .what-we-do-wrapper { display: none; }
.post-sidebar .contact-form-container { width: 100%; max-width: none; padding: 0; }
.post-sidebar .contact-form-card { width: 100%; max-width: none; margin: 0; padding: 24px 24px 28px; background: #f2f2f2; border-radius: 0; box-shadow: none; }
.post-sidebar .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.post-sidebar .form-group-title { font-size: 18px; line-height: 1.28; margin-bottom: 15px; }
.post-sidebar .form-group-title-secondary { margin-top: 14px; }
.post-sidebar .form-field-group { margin-bottom: 13px; }
.post-sidebar .form-input,
.post-sidebar .form-textarea,
.post-sidebar .form-select { min-height: 47px; padding: 13px 16px; border: 0; border-radius: 0; font-size: 15px; }
.post-sidebar .form-textarea { min-height: 104px; }
.post-sidebar .form-checkbox-group { margin: 17px 0; }
.post-sidebar .form-checkbox-label { font-size: 12px; line-height: 1.45; }
.post-sidebar .contact-form-submit-btn { border-radius: 0; font-size: 22px; padding: 12px; }

.related-posts { background: #f2f2f2; padding: 78px 24px 82px; }
.related-inner { width: min(100%, 1190px); margin: 0 auto; }
.related-inner > h2 { text-align: center; font-size: 55px; margin-bottom: 37px; }
.related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.related-grid article { background: #fff; min-height: 310px; padding: 32px 32px 29px; box-shadow: 0 2px 9px rgba(0,0,0,.14); display: flex; flex-direction: column; }
.related-grid h3 { text-transform: none; letter-spacing: 0; font-size: 30px; line-height: 1.12; margin-bottom: 14px; }
.related-grid p { font-size: 17px; line-height: 1.75; margin: 0 0 22px; }
.related-grid .read-more { color: #cb0404; font-size: 15px; margin-top: auto; }

@media (max-width: 1024px) {
  .post-hero { min-height: 421px; }
  .post-hero h1 { max-width: 650px; }
  .post-layout { grid-template-columns: 1fr; gap: 32px; }
  .post-sidebar { position: static; }
  .post-sidebar .contact-form-section { max-width: 700px; }
  .related-grid { grid-template-columns: 1fr; gap: 20px; }
  .related-grid article { min-height: 0; }
}

@media (max-width: 767px) {
  .post-hero { min-height: 333px; padding: 106px 24px 28px; }
  .post-hero h1 { font-size: 42px; margin-bottom: 18px; }
  .post-hero p { font-size: 15px; }
  .post-hero p span::before { margin: 0 8px; }
  .post-main { padding: 48px 24px; }
  .post-article { font-size: 16px; line-height: 1.9; }
  .post-article h2 { font-size: 31px; }
  .post-article h3 { font-size: 27px; }
  .post-article :is(div, p, section, blockquote, ul, ol, figure, table).has-background,
  .post-article :is(div, p, section, blockquote, ul, ol, figure, table)[style*="background-color"] { padding: 18px; }
  .post-toc-heading { font-size: 22px; }
  .post-toc-list { padding: 18px 25px 25px 42px; }
  .post-sidebar .contact-form-card { padding: 20px; }
  .related-posts { padding: 48px 24px; }
  .related-inner > h2 { font-size: 42px; }
  .related-grid article { padding: 28px; }
  .related-grid h3 { font-size: 28px; }
}
