/* Blog layouts: article visibility must never depend on a scroll animation. */
html body .blog-page .blog-banner {
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:center !important;
  gap:32px !important;
  min-height:0 !important;
  height:auto !important;
  padding:64px 6% 48px !important;
  text-align:center !important;
}
html body .blog-page .blog-banner .page-banner-content {
  order:0 !important;
  width:100% !important;
  max-width:1000px !important;
  margin:0 auto !important;
  padding:0 !important;
}
html body .blog-page .blog-banner .hero-eyebrow { justify-content:center !important; flex-wrap:wrap !important; }
html body .blog-page .blog-banner .page-banner-title { font-size:clamp(28px,4vw,52px) !important; line-height:1.3 !important; overflow-wrap:anywhere !important; }
html body .blog-page .blog-banner .page-banner-desc { max-width:800px !important; margin:0 auto !important; overflow-wrap:anywhere !important; }
.blog-page .blog-featured-image {
  display:block;
  width:100%;
  height:auto;
  max-height:520px;
  object-fit:contain;
  margin:0 0 28px;
  border-radius:20px;
}
html body .blog-page .blog-banner .page-banner-content::before,
html body .blog-page .blog-banner .page-banner-content::after { display:none !important; }
html body .blog-page .blog-banner .page-banner-motion { display:none !important; }
.blog-page .course-detail-grid { grid-template-columns:minmax(0,1fr) 300px; gap:28px; }
.blog-page .course-detail-main,
.blog-page .course-detail-sidebar,
.blog-page .course-grid > * { min-width:0; }
.blog-page .course-detail-body { overflow-wrap:anywhere; }
.blog-page .course-detail-body img,
.blog-page .course-detail-body video,
.blog-page .course-detail-body iframe { max-width:100%; }
.blog-page .course-detail-body img { height:auto; }
.blog-page .course-detail-body figure { max-width:100%; margin:24px auto; }
.blog-page .course-detail-body figure.image { text-align:center; }
.blog-page .course-detail-body figcaption { font-size:14px; color:#6f5d7d; }
.blog-page .course-detail-body table { display:block; max-width:100%; width:100%; overflow-x:auto; border-collapse:collapse; }
.blog-page .course-detail-body th,
.blog-page .course-detail-body td { padding:10px; border:1px solid #ded7e7; min-width:100px; }
.blog-page .course-detail-body pre { max-width:100%; overflow-x:auto; white-space:pre; }
.blog-page .course-detail-body .table { overflow-x:auto; }
.blog-page .course-card-title,
.blog-page .course-card-tag,
.blog-page .cdi-val { overflow-wrap:anywhere; }
.blog-page .course-card-tag { max-width:calc(100% - 24px); white-space:normal; }
.blog-page .course-card-meta { flex-wrap:wrap; }
.blog-cta,
.blog-interlinks { margin:28px 0; padding:24px; border:1px solid #f4c4a6; border-left:4px solid #f15a24; border-radius:16px; background:linear-gradient(120deg,#fff5eb,#f5f8fc); }
.blog-page .blog-cta p { margin:0 0 16px; font-size:19px; font-weight:600; color:var(--kn-navy, #16243c); white-space:pre-line; }
.blog-page .blog-cta .btn-red { white-space:normal; text-align:center; max-width:100%; }
.blog-interlinks h2 { margin:0 0 16px; font-size:24px; color:var(--kn-navy, #16243c); }
.blog-interlinks ul { list-style:none; margin:0; padding:0; }
.blog-interlinks li + li { border-top:1px solid #ead9d1; margin-top:12px; padding-top:12px; }
.blog-interlinks a { color:#9d3817; font-weight:600; overflow-wrap:anywhere; }
@media(max-width:900px) {
  .blog-page .course-detail-grid { grid-template-columns:minmax(0,1fr); }
  .blog-page .course-detail-sidebar { position:static; }
}
@media(max-width:600px) {
  html body .blog-page .blog-banner { padding:40px 5% 32px !important; gap:24px !important; }
  .blog-page .blog-featured-image { border-radius:14px; margin-bottom:20px; }
  .blog-page .section { padding:32px 4%; }
  .blog-page .course-detail-main { padding:20px 16px; border-radius:16px; }
  .blog-page .course-grid { grid-template-columns:minmax(0,1fr); }
  .blog-page .course-detail-body h2 { font-size:25px; line-height:1.4; }
  .blog-page .course-detail-body h3 { font-size:21px; line-height:1.4; }
  .blog-cta, .blog-interlinks { padding:20px 16px; }
}