/* Step117 — final, late-loaded blog post reading layer.
   Loaded after the legacy editorial CSS on purpose. */

body:has(.blog-detail-page.blog-detail-page--pro) .site-main > .site-container{
  max-width:none !important;
}

body .blog-detail-page.blog-detail-page--pro{
  max-width:760px !important;
  background:#fff !important;
  border:1px solid #e7eaee !important;
  border-radius:8px !important;
  box-shadow:none !important;
  overflow:hidden !important;
}

body .blog-detail-page.blog-detail-page--pro .blog-detail-header{
  padding:18px 26px 14px !important;
}

body .blog-detail-page.blog-detail-page--pro .blog-detail-author{
  gap:10px !important;
  margin:0 0 13px !important;
  align-items:center !important;
}
body .blog-detail-page.blog-detail-page--pro .blog-detail-author__avatar{
  width:38px !important;height:38px !important;flex:0 0 38px !important;
}
body .blog-detail-page.blog-detail-page--pro .blog-detail-author__avatar img{
  width:38px !important;height:38px !important;border-radius:50% !important;object-fit:cover !important;
}
body .blog-detail-page.blog-detail-page--pro .blog-detail-author__name{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
  font-size:15px !important;font-weight:700 !important;line-height:1.2 !important;color:#292d32 !important;
}
body .blog-detail-page.blog-detail-page--pro .blog-detail-author__meta{
  display:flex !important;align-items:center !important;gap:7px !important;flex-wrap:wrap !important;
  margin:2px 0 0 !important;color:#8a9098 !important;
  font:500 12.5px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
}

/* Kill the old global newspaper title completely on blog posts. */
html body .blog-detail-page.blog-detail-page--pro .blog-detail-header > h1.editorial-page-title,
html body .blog-detail-page.blog-detail-page--pro h1.editorial-page-title{
  display:block !important;
  margin:8px 0 8px !important;
  max-width:none !important;
  width:auto !important;
  color:#272b30 !important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
  font-size:27px !important;
  font-weight:700 !important;
  font-style:normal !important;
  line-height:1.2 !important;
  letter-spacing:-.015em !important;
  text-wrap:wrap !important;
  text-align:left !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  hyphens:none !important;
}

.blog-detail-postmeta{
  display:flex;align-items:center;gap:13px;flex-wrap:wrap;
  margin:0 0 8px;color:#9499a1;
  font:400 13px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.blog-detail-postmeta__item{white-space:nowrap}

body .blog-detail-page.blog-detail-page--pro .userblog-tag-row--detail{
  margin:7px 0 0 !important;gap:11px !important;
}
body .blog-detail-page.blog-detail-page--pro .userblog-tag-row--detail .userblog-tag-pill{
  padding:0 !important;background:none !important;border:0 !important;border-radius:0 !important;
  color:#777d84 !important;font-size:13px !important;font-weight:500 !important;text-decoration:none !important;
}

body .blog-detail-page.blog-detail-page--pro .article-content.blog-detail-content{
  padding:18px 26px 22px !important;
  color:#41464c !important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
  font-size:18px !important;font-weight:400 !important;line-height:1.52 !important;letter-spacing:0 !important;
}
body .blog-detail-page.blog-detail-page--pro .article-content.blog-detail-content p{
  margin:0 0 1.02em !important;line-height:1.52 !important;
}
body .blog-detail-page.blog-detail-page--pro .article-content.blog-detail-content p:last-child{margin-bottom:0 !important}
body .blog-detail-page.blog-detail-page--pro .article-content.blog-detail-content h2{
  margin:1.25em 0 .42em !important;font:700 23px/1.25 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
}
body .blog-detail-page.blog-detail-page--pro .article-content.blog-detail-content h3{
  margin:1.15em 0 .38em !important;font:700 20px/1.28 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
}
body .blog-detail-page.blog-detail-page--pro .article-content.blog-detail-content blockquote{
  margin:1em 0 !important;padding:2px 0 2px 14px !important;background:none !important;border-left:3px solid #c9cdd2 !important;color:#565b61 !important;
}
body .blog-detail-page.blog-detail-page--pro .blog-detail-cover--after-text{
  display:block !important;width:100% !important;height:auto !important;margin:0 !important;object-fit:contain !important;
}

@media(max-width:760px){
  body:has(.blog-detail-page.blog-detail-page--pro) .site-main{
    padding-top:0 !important;
  }
  body:has(.blog-detail-page.blog-detail-page--pro) .site-main > .site-container{
    width:100% !important;max-width:none !important;padding-left:0 !important;padding-right:0 !important;margin:0 !important;
  }
  body .blog-detail-page.blog-detail-page--pro{
    width:100% !important;max-width:none !important;margin:0 !important;border:0 !important;border-radius:0 !important;
  }
  body .blog-detail-page.blog-detail-page--pro .blog-editorial-breadcrumbs{
    padding:10px 20px !important;font-size:13px !important;
  }
  body .blog-detail-page.blog-detail-page--pro .blog-detail-header{
    padding:15px 20px 13px !important;
  }
  html body .blog-detail-page.blog-detail-page--pro .blog-detail-header > h1.editorial-page-title,
  html body .blog-detail-page.blog-detail-page--pro h1.editorial-page-title{
    margin:9px 0 8px !important;
    font-size:24px !important;
    line-height:1.22 !important;
    letter-spacing:-.012em !important;
  }
  body .blog-detail-page.blog-detail-page--pro .article-content.blog-detail-content{
    padding:16px 20px 20px !important;
    font-size:17px !important;
    line-height:1.52 !important;
  }
  body .blog-detail-page.blog-detail-page--pro .article-content.blog-detail-content p{
    line-height:1.52 !important;margin-bottom:.95em !important;
  }
  body .blog-detail-page.blog-detail-page--pro .blog-detail-actions--pro{
    padding-left:20px !important;padding-right:20px !important;
  }
}

@media(max-width:380px){
  body .blog-detail-page.blog-detail-page--pro .blog-detail-header,
  body .blog-detail-page.blog-detail-page--pro .article-content.blog-detail-content{
    padding-left:18px !important;padding-right:18px !important;
  }
  html body .blog-detail-page.blog-detail-page--pro h1.editorial-page-title{font-size:23px !important;}
}
