/* CMS V5 detail bridge: aligns CMS detail pages with Novel Patterns theme */
html,body.np-cms-detail-shell{margin:0!important;padding:0!important;width:100%!important;min-height:100%!important;overflow-x:hidden!important;background:#f8fafc!important;color:#0f172a!important;font-family:Inter,system-ui,sans-serif!important}body.np-cms-detail-shell:before,body.np-cms-detail-shell:after{display:none!important;content:none!important}.np-cms-detail-shell .np-global-header{position:sticky!important;top:0!important;left:0!important;right:0!important;margin:0!important;padding:0!important;width:100%!important;min-height:76px!important;background:#030914f5!important;z-index:2147481000!important}.np-cms-detail-shell .np-nav-wrap{height:76px!important;min-height:76px!important;margin:0 auto!important}.np-cms-detail-shell .np-mobile-toggle{display:none}.np-cms-detail-shell main{margin:0!important;padding:0!important}.np-cms-detail-shell .np-blog-article-hero{padding-top:88px!important;padding-bottom:70px!important;min-height:auto!important}.np-cms-detail-shell .np-blog-hero-inner{display:grid!important;grid-template-columns:minmax(0,1.05fr) 420px!important;gap:64px!important;align-items:center!important;max-width:none!important}.np-cms-detail-shell .np-blog-hero-copy{max-width:920px}.np-cms-detail-shell .np-blog-hero-copy h1{font-size:clamp(2rem,3.2vw,3.75rem)!important;line-height:1.08!important;letter-spacing:-.045em!important;max-width:920px!important;overflow-wrap:break-word!important;color:#fff!important}.np-cms-detail-shell .np-blog-hero-copy p{max-width:760px!important;color:#d7e4f5!important}.np-cms-detail-shell .np-blog-article-meta{display:flex!important;gap:10px!important;flex-wrap:wrap!important}.np-cms-detail-shell .np-blog-article-meta span{color:#dbeafe!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.14)!important}.np-cms-detail-shell .np-blog-visual{display:block!important}.np-cms-detail-shell .np-cms-hero-img{width:100%;height:100%;object-fit:cover;border-radius:24px;position:relative;z-index:3}.np-cms-detail-shell .np-blog-summary-section,.np-cms-detail-shell .np-blog-body-section,.np-cms-detail-shell .np-blog-cta-section{background:#f8fafc!important;color:#0f172a!important}.np-cms-detail-shell .np-blog-summary-card{background:#fff!important;border:1px solid #dbe5f4!important;box-shadow:0 18px 50px rgba(15,23,42,.08)!important}.np-cms-detail-shell .np-blog-summary-card p{color:#334155!important;opacity:1!important}.np-cms-detail-shell .np-blog-toc{background:#fff!important;color:#0f172a!important}.np-cms-detail-shell .np-blog-toc strong{color:#0f172a!important}.np-cms-detail-shell .np-blog-toc a{color:#475569!important}.np-cms-detail-shell .np-blog-toc a:hover{color:#2563eb!important}.np-cms-detail-shell .np-blog-body-wrap{display:grid!important;grid-template-columns:minmax(0,1fr) 300px!important;gap:42px!important;align-items:start!important}.np-cms-detail-shell .np-blog-body{background:#fff!important;color:#1e293b!important;overflow-wrap:break-word!important;word-break:normal!important}.np-cms-detail-shell .np-blog-body p,.np-cms-detail-shell .np-blog-body li{color:#334155!important;font-size:1.02rem!important;line-height:1.85!important}.np-cms-detail-shell .np-blog-body h1,.np-cms-detail-shell .np-blog-body h2,.np-cms-detail-shell .np-blog-body h3{color:#0f172a!important}.np-cms-detail-shell .np-blog-body a{color:#2563eb!important;font-weight:800}.np-cms-detail-shell .np-blog-body img{max-width:100%;height:auto;border-radius:20px}.np-cms-detail-shell .cms-video{position:relative;width:100%;padding-top:56.25%;border-radius:22px;overflow:hidden;background:#020817;margin:24px 0}.np-cms-detail-shell .cms-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.np-cms-detail-shell .np-side-card{background:#071322!important;color:#eaf4ff!important;border:1px solid rgba(147,197,253,.18)!important;border-radius:16px!important;padding:18px!important;margin-bottom:14px!important;box-shadow:0 18px 36px rgba(2,8,23,.16)!important}.np-cms-detail-shell .np-side-card h4{color:#fff!important;margin:0 0 12px!important;font-size:.95rem!important}.np-cms-detail-shell .np-side-card a{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;color:#dbeafe!important;border-top:1px solid rgba(255,255,255,.12)!important;padding:10px 0!important;font-size:.84rem!important;font-weight:800!important;text-decoration:none!important}.np-cms-detail-shell .np-side-card a:first-of-type{border-top:0!important}.np-cms-detail-shell .np-share-row{display:flex!important;gap:8px!important;flex-wrap:wrap!important}.np-cms-detail-shell .np-share-row a,.np-cms-detail-shell .np-share-row button{display:inline-flex!important;align-items:center!important;justify-content:center!important;border:1px solid rgba(96,165,250,.35)!important;border-radius:9px!important;background:#0b1f3b!important;color:#dbeafe!important;padding:7px 10px!important;font-weight:800!important;cursor:pointer!important}.np-cms-detail-shell .np-cms-newsletter-form{display:grid!important;gap:9px!important}.np-cms-detail-shell .np-cms-newsletter-form input{width:100%!important;border-radius:10px!important;border:1px solid rgba(255,255,255,.2)!important;background:#fff!important;color:#0f172a!important;padding:10px 11px!important}.np-cms-detail-shell .np-cms-newsletter-form button{border:0!important;border-radius:10px!important;padding:11px!important;background:linear-gradient(135deg,#2563eb,#7c3aed)!important;color:#fff!important;font-weight:900!important}.np-cms-detail-shell .np-blog-cta-wrap{background:linear-gradient(110deg,#071322,#0b2b52 55%,#eef8ff)!important;color:#fff!important}.np-cms-detail-shell .np-blog-cta-copy h2,.np-cms-detail-shell .np-blog-cta-copy p{color:#fff!important;opacity:1!important}.np-cms-detail-shell .np-blog-cta-points span{color:#dbeafe!important;border-color:rgba(219,234,254,.22)!important}.np-cms-detail-shell .np-blog-form{background:#fff!important;color:#0f172a!important;border:1px solid #dbe5f4!important;border-radius:22px!important;padding:24px!important;display:grid!important;gap:12px!important}.np-cms-detail-shell .np-blog-form label{display:block!important;color:#0f172a!important;font-weight:800!important}.np-cms-detail-shell .np-blog-form input,.np-cms-detail-shell .np-blog-form textarea{width:100%!important;box-sizing:border-box!important;background:#f8fbff!important;color:#0f172a!important;border:1px solid #cbd5e1!important;border-radius:12px!important;padding:12px!important;font:inherit!important}.np-cms-detail-shell .np-blog-submit{border:0!important;border-radius:13px!important;cursor:pointer!important;background:linear-gradient(135deg,#2563eb,#06b6d4)!important;color:#fff!important;font-weight:900!important;padding:14px 18px!important}.np-cms-detail-shell .np-form-status{font-size:.88rem!important;color:#2563eb!important;font-weight:800!important;margin:4px 0 0!important}.np-cms-detail-shell .np-global-footer a{text-decoration:none!important}
@media(max-width:860px){.np-cms-detail-shell .np-mobile-toggle{display:flex!important}.np-cms-detail-shell .np-nav-wrap{grid-template-columns:1fr 44px!important;height:72px!important;min-height:72px!important}.np-cms-detail-shell .np-demo-btn{display:none!important}.np-cms-detail-shell .np-main-nav{display:none!important}.np-cms-detail-shell .np-global-header.np-mobile-open .np-main-nav{display:flex!important}.np-cms-detail-shell .np-blog-article-hero{padding-top:64px!important;padding-bottom:52px!important}.np-cms-detail-shell .np-blog-hero-inner{display:block!important}.np-cms-detail-shell .np-blog-visual{display:none!important}.np-cms-detail-shell .np-blog-hero-copy h1{font-size:clamp(2rem,9vw,3rem)!important}.np-cms-detail-shell .np-blog-summary-grid,.np-cms-detail-shell .np-blog-body-wrap,.np-cms-detail-shell .np-blog-cta-wrap{grid-template-columns:1fr!important}.np-cms-detail-shell .np-blog-side,.np-cms-detail-shell .np-blog-side-v2{position:static!important}.np-cms-detail-shell .np-global-footer .np-footer-wrap{grid-template-columns:1fr!important}.np-cms-detail-shell .np-footer-bottom{flex-direction:column!important;gap:12px!important}}


/* === CMS V8 live-style preview bar and visibility fixes — 2026-07-10 === */
.np-cms-previewbar{
  position:sticky!important;
  top:0!important;
  z-index:2147483000!important;
  min-height:56px!important;
  background:#07101f!important;
  color:#fff!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  padding:10px max(18px,calc((100vw - 1180px)/2))!important;
  box-shadow:0 12px 35px rgba(2,8,23,.24)!important;
}
.np-cms-previewbar-title{display:flex!important;flex-direction:column!important;gap:2px!important;min-width:0!important}
.np-cms-previewbar-title strong{font-size:15px!important;line-height:1.1!important;color:#fff!important}
.np-cms-previewbar-title span{font-size:12px!important;color:#bfdbfe!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.np-cms-previewbar-actions{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important}
.np-cms-previewbar-actions form{display:inline-flex!important;margin:0!important;padding:0!important}
.np-cms-previewbar-btn{
  border:1px solid rgba(255,255,255,.16)!important;
  background:rgba(255,255,255,.08)!important;
  color:#fff!important;
  border-radius:10px!important;
  padding:8px 12px!important;
  font-weight:900!important;
  font-size:12px!important;
  text-decoration:none!important;
  cursor:pointer!important;
  font-family:inherit!important;
  line-height:1!important;
}
.np-cms-previewbar-btn.primary{background:linear-gradient(135deg,#2563eb,#7c3aed)!important;border-color:transparent!important}
.np-cms-previewbar-btn.danger{background:#fee2e2!important;color:#991b1b!important;border-color:#fecaca!important}
.np-cms-preview-mode .np-global-header{top:0!important}
.np-cms-detail-shell .np-blog-summary-card p,
.np-cms-detail-shell .np-blog-cta-copy p,
.np-cms-detail-shell .np-blog-cta-points span,
.np-cms-detail-shell .np-blog-body p,
.np-cms-detail-shell .np-blog-body li{
  color:#334155!important;
}
.np-cms-detail-shell .np-blog-cta-copy h2,
.np-cms-detail-shell .np-blog-cta-copy h2 span{
  color:#0f172a!important;
}
.np-cms-detail-shell .np-blog-form label{
  color:#0f172a!important;
  font-weight:800!important;
}
.np-cms-detail-shell .np-blog-form input,
.np-cms-detail-shell .np-blog-form textarea{
  color:#0f172a!important;
  background:#fff!important;
}
@media(max-width:860px){
  .np-cms-previewbar{align-items:flex-start!important;flex-direction:column!important;padding:10px 14px!important}
  .np-cms-previewbar-title span{white-space:normal!important}
}


/* === CMS V9 live-preview polish and hard wrapping — 2026-07-10 === */
body.np-cms-preview-mode{
  background:#f8fafc!important;
}
/* Preview toolbar is now a floating control so the page below renders like the live page. */
.np-cms-preview-mode .np-cms-previewbar{
  position:fixed!important;
  right:18px!important;
  bottom:18px!important;
  top:auto!important;
  left:auto!important;
  width:min(560px,calc(100vw - 36px))!important;
  min-height:0!important;
  padding:12px 14px!important;
  border-radius:18px!important;
  border:1px solid rgba(147,197,253,.22)!important;
  background:rgba(7,16,31,.96)!important;
  box-shadow:0 24px 70px rgba(2,8,23,.34)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
.np-cms-preview-mode .np-cms-previewbar-title span{
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.np-cms-preview-mode .np-global-header{
  top:0!important;
}
/* Make pathological test text and pasted long strings wrap instead of breaking preview layout. */
.np-cms-detail-shell .np-blog-hero-copy h1,
.np-cms-detail-shell .np-blog-hero-copy p,
.np-cms-detail-shell .np-blog-summary-card,
.np-cms-detail-shell .np-blog-summary-card p,
.np-cms-detail-shell .np-blog-body,
.np-cms-detail-shell .np-blog-body *,
.np-cms-detail-shell .np-side-card,
.np-cms-detail-shell .np-side-card *,
.np-cms-detail-shell .np-blog-cta-copy,
.np-cms-detail-shell .np-blog-cta-copy *,
.np-cms-detail-shell .np-blog-form,
.np-cms-detail-shell .np-blog-form *{
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}
.np-cms-detail-shell .np-blog-body{
  max-width:100%!important;
  overflow:hidden!important;
}
.np-cms-detail-shell .np-blog-body pre,
.np-cms-detail-shell .np-blog-body code{
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
}
.np-cms-detail-shell .np-blog-body-wrap{
  grid-template-columns:minmax(0,1fr) 320px!important;
}
.np-cms-detail-shell .np-blog-side{
  min-width:0!important;
  max-width:100%!important;
}
@media(max-width:860px){
  .np-cms-preview-mode .np-cms-previewbar{
    left:12px!important;
    right:12px!important;
    bottom:12px!important;
    width:auto!important;
  }
}


/* === CMS V10 publisher/meta + read more refinements — 2026-07-10 === */
.np-cms-detail-shell .np-blog-article-meta span{
  color:#dbeafe!important;
}
.np-cms-detail-shell .np-blog-article-meta span:nth-child(2),
.np-cms-detail-shell .np-blog-article-meta span:nth-child(3){
  text-transform:none!important;
}
.np-cms-detail-shell .np-readmore-card{
  display:block!important;
}
.np-cms-detail-shell .np-readmore-card h4{
  margin-bottom:12px!important;
}
.np-cms-detail-shell .np-readmore-card a{
  display:block!important;
  padding:12px 0!important;
  border-bottom:1px solid rgba(148,163,184,.18)!important;
  color:#dbeafe!important;
  font-size:.88rem!important;
  font-weight:800!important;
  line-height:1.35!important;
}
.np-cms-detail-shell .np-readmore-card a:last-child{
  border-bottom:0!important;
}
.np-cms-detail-shell .np-readmore-card a span{
  display:block!important;
  margin-bottom:4px!important;
  color:#93c5fd!important;
  font-size:.68rem!important;
  text-transform:uppercase!important;
  letter-spacing:.08em!important;
}
.np-cms-detail-shell .np-readmore-card a i{
  float:right!important;
  margin-left:8px!important;
}
.np-cms-detail-shell .np-blog-side-v2{
  display:flex!important;
  flex-direction:column!important;
  gap:16px!important;
}
.np-cms-detail-shell .np-blog-side-v2 .np-side-card{
  margin:0!important;
}
@media(max-width:1024px){
  .np-cms-detail-shell .np-blog-body-wrap{
    grid-template-columns:1fr!important;
  }
  .np-cms-detail-shell .np-blog-side-v2{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    align-items:start!important;
  }
}
@media(max-width:680px){
  .np-cms-detail-shell .np-blog-side-v2{
    grid-template-columns:1fr!important;
  }
}


/* === CMS V11 detail preview refinements — 2026-07-10 ===
   Scope: CMS-created detail/preview pages only. Does not affect old website pages. */

/* 1) Remove the extra category chip after "Back to ..." without touching Article Summary chips. */
.np-cms-detail-shell .np-blog-hero-copy > .np-blog-back + .np-blog-kicker{
  display:none!important;
}
.np-cms-detail-shell .np-blog-hero-copy h1{
  margin-top:22px!important;
}

/* Keep long CMS content from breaking the hero/page. */
.np-cms-detail-shell .np-blog-hero-copy,
.np-cms-detail-shell .np-blog-hero-copy h1,
.np-cms-detail-shell .np-blog-hero-copy p,
.np-cms-detail-shell .np-blog-summary-card p,
.np-cms-detail-shell .np-blog-body,
.np-cms-detail-shell .np-blog-body *{
  min-width:0!important;
  max-width:100%!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}

/* 2) Desktop reading layout: right panel stays intact; left article content scrolls.
   Excluded for Webinar detail pages because webinars can need their own event/session layout. */
@media (min-width:1025px){
  .np-cms-detail-shell:not(.np-cms-type-webinar) .np-blog-body-wrap{
    grid-template-columns:minmax(0,1fr) 320px!important;
    gap:42px!important;
    align-items:start!important;
  }
  .np-cms-detail-shell:not(.np-cms-type-webinar) .np-blog-body{
    max-height:calc(100vh - 118px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-right:16px!important;
    scrollbar-width:thin!important;
  }
  .np-cms-detail-shell:not(.np-cms-type-webinar) .np-blog-side-v2{
    position:sticky!important;
    top:96px!important;
    align-self:start!important;
    max-height:calc(100vh - 112px)!important;
    overflow-y:auto!important;
    padding-right:4px!important;
    scrollbar-width:thin!important;
  }
}

/* 3) CTA section/form visibility and alignment fix. */
.np-cms-detail-shell .np-blog-cta-section{
  background:#f8fafc!important;
  padding:76px 0!important;
}
.np-cms-detail-shell .np-blog-cta-wrap{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(340px,520px)!important;
  gap:40px!important;
  align-items:center!important;
  width:100%!important;
  max-width:1180px!important;
  margin:0 auto!important;
  padding:56px!important;
  border-radius:30px!important;
  overflow:hidden!important;
  background:linear-gradient(110deg,#071322 0%,#0b2b52 58%,#eaf8ff 100%)!important;
  box-shadow:0 28px 80px rgba(15,23,42,.14)!important;
}
.np-cms-detail-shell .np-blog-cta-copy{
  min-width:0!important;
  position:relative!important;
  z-index:2!important;
}
.np-cms-detail-shell .np-blog-cta-copy .np-blog-kicker{
  color:#93c5fd!important;
  background:rgba(37,99,235,.22)!important;
  border-color:rgba(147,197,253,.32)!important;
}
.np-cms-detail-shell .np-blog-cta-copy h2,
.np-cms-detail-shell .np-blog-cta-copy h2 span,
.np-cms-detail-shell .np-blog-cta-copy p{
  color:#ffffff!important;
  opacity:1!important;
  text-shadow:none!important;
}
.np-cms-detail-shell .np-blog-cta-copy h2{
  font-size:clamp(2rem,3.2vw,3.4rem)!important;
  line-height:1.08!important;
  letter-spacing:-.04em!important;
  max-width:640px!important;
}
.np-cms-detail-shell .np-blog-cta-points{
  display:flex!important;
  gap:10px!important;
  flex-wrap:wrap!important;
}
.np-cms-detail-shell .np-blog-cta-points span{
  color:#dbeafe!important;
  background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(219,234,254,.22)!important;
  border-radius:999px!important;
  padding:9px 14px!important;
  font-weight:800!important;
}
.np-cms-detail-shell .np-blog-form{
  width:100%!important;
  max-width:520px!important;
  justify-self:end!important;
  background:#ffffff!important;
  color:#0f172a!important;
  border:1px solid #dbe5f4!important;
  border-radius:22px!important;
  padding:24px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:13px!important;
  box-shadow:0 24px 65px rgba(15,23,42,.18)!important;
}
.np-cms-detail-shell .np-blog-form label{
  display:grid!important;
  gap:7px!important;
  color:#0f172a!important;
  font-weight:800!important;
  line-height:1.2!important;
}
.np-cms-detail-shell .np-blog-form input,
.np-cms-detail-shell .np-blog-form textarea{
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  background:#ffffff!important;
  color:#0f172a!important;
  border:1px solid #cbd5e1!important;
  border-radius:12px!important;
  padding:13px 14px!important;
  font:inherit!important;
  line-height:1.35!important;
  box-shadow:none!important;
}
.np-cms-detail-shell .np-blog-form textarea{
  min-height:118px!important;
  resize:vertical!important;
}
.np-cms-detail-shell .np-blog-submit{
  width:100%!important;
  min-height:50px!important;
  border:0!important;
  border-radius:13px!important;
  cursor:pointer!important;
  background:linear-gradient(135deg,#2563eb,#06b6d4)!important;
  color:#fff!important;
  font-weight:900!important;
  padding:14px 18px!important;
}
.np-cms-detail-shell .np-form-status{
  color:#2563eb!important;
  font-weight:800!important;
  font-size:.9rem!important;
}

/* Keep webinar CMS detail pages free from forced article-scroll behaviour. */
.np-cms-detail-shell.np-cms-type-webinar .np-blog-body,
.np-cms-detail-shell.np-cms-type-webinar .np-blog-side-v2{
  max-height:none!important;
  overflow:visible!important;
  position:static!important;
}

@media (max-width:1024px){
  .np-cms-detail-shell .np-blog-body{
    max-height:none!important;
    overflow:visible!important;
    padding-right:0!important;
  }
  .np-cms-detail-shell .np-blog-side-v2{
    position:static!important;
    max-height:none!important;
    overflow:visible!important;
  }
  .np-cms-detail-shell .np-blog-cta-wrap{
    grid-template-columns:1fr!important;
    padding:34px 22px!important;
    gap:28px!important;
  }
  .np-cms-detail-shell .np-blog-form{
    justify-self:stretch!important;
    max-width:none!important;
  }
}
@media (max-width:640px){
  .np-cms-detail-shell .np-blog-cta-section{
    padding:48px 0!important;
  }
  .np-cms-detail-shell .np-blog-cta-wrap{
    border-radius:22px!important;
  }
}


/* === CMS V12 natural page scroll + responsive sidebar fix — 2026-07-10 ===
   Scope: CMS-created detail/preview pages only.
   Fix:
   - No scrollbar inside Share / Read More right sidebar.
   - No inner scrollbar requiring click/focus on article area.
   - Page scrolls naturally; right sidebar stays sticky on desktop.
   - Mobile/tablet stacks cleanly and removes sticky behaviour.
*/

/* Natural full-page scrolling. */
html,
body.np-cms-detail-shell{
  overflow-y:auto!important;
  height:auto!important;
}

/* Remove all nested scroll behaviour added earlier. */
.np-cms-detail-shell .np-blog-body,
.np-cms-detail-shell .np-blog-side,
.np-cms-detail-shell .np-blog-side-v2,
.np-cms-detail-shell .np-side-card{
  max-height:none!important;
  overflow:visible!important;
  overscroll-behavior:auto!important;
  scrollbar-width:auto!important;
}

/* Desktop: keep right section visually intact/sticky, but do NOT scroll inside it. */
@media (min-width:1025px){
  .np-cms-detail-shell .np-blog-body-wrap{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 320px!important;
    gap:42px!important;
    align-items:start!important;
  }

  .np-cms-detail-shell .np-blog-body{
    max-height:none!important;
    overflow:visible!important;
    padding-right:0!important;
  }

  .np-cms-detail-shell .np-blog-side-v2,
  .np-cms-detail-shell .np-blog-side{
    position:sticky!important;
    top:96px!important;
    align-self:start!important;
    max-height:none!important;
    overflow:visible!important;
    padding-right:0!important;
  }
}

/* Tablet/mobile: fully responsive single-column layout. */
@media (max-width:1024px){
  .np-cms-detail-shell .np-blog-summary-grid,
  .np-cms-detail-shell .np-blog-body-wrap,
  .np-cms-detail-shell .np-blog-cta-wrap{
    grid-template-columns:1fr!important;
  }

  .np-cms-detail-shell .np-blog-side-v2,
  .np-cms-detail-shell .np-blog-side{
    position:static!important;
    top:auto!important;
    max-height:none!important;
    overflow:visible!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:14px!important;
  }

  .np-cms-detail-shell .np-side-card{
    margin:0!important;
  }
}

@media (max-width:680px){
  .np-cms-detail-shell .np-blog-side-v2,
  .np-cms-detail-shell .np-blog-side{
    grid-template-columns:1fr!important;
  }

  .np-cms-detail-shell .np-blog-body-wrap{
    gap:28px!important;
  }

  .np-cms-detail-shell .np-blog-cta-wrap{
    padding:28px 18px!important;
  }
}

/* === CMS V13 remove all inner scrollbars + article background blend — 2026-07-10 ===
   Scope: CMS-created detail/preview pages only.
   Fixes remaining scrollbars caused by earlier high-specificity V11 rules.
*/
html,
html body.np-cms-detail-shell,
html body.np-cms-detail-shell.np-cms-preview-mode{
  height:auto!important;
  min-height:100%!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior-y:auto!important;
}

/* Hard reset any inner scroll areas, including earlier :not(.np-cms-type-webinar) rules. */
html body.np-cms-detail-shell .np-blog-body-section,
html body.np-cms-detail-shell .np-blog-body-section .container,
html body.np-cms-detail-shell .np-blog-body-wrap,
html body.np-cms-detail-shell .np-blog-body,
html body.np-cms-detail-shell .np-blog-body *,
html body.np-cms-detail-shell .np-blog-side,
html body.np-cms-detail-shell .np-blog-side-v2,
html body.np-cms-detail-shell .np-blog-side-v2 *,
html body.np-cms-detail-shell .np-side-card,
html body.np-cms-detail-shell .np-side-card *{
  max-height:none!important;
  overflow-y:visible!important;
  overflow-x:visible!important;
  overscroll-behavior:auto!important;
  scrollbar-width:none!important;
}

html body.np-cms-detail-shell .np-blog-body::-webkit-scrollbar,
html body.np-cms-detail-shell .np-blog-side::-webkit-scrollbar,
html body.np-cms-detail-shell .np-blog-side-v2::-webkit-scrollbar,
html body.np-cms-detail-shell .np-side-card::-webkit-scrollbar{
  display:none!important;
}

@media (min-width:1025px){
  html body.np-cms-detail-shell:not(.np-cms-type-webinar) .np-blog-body,
  html body.np-cms-detail-shell:not(.np-cms-type-webinar) .np-blog-side,
  html body.np-cms-detail-shell:not(.np-cms-type-webinar) .np-blog-side-v2,
  html body.np-cms-detail-shell.np-cms-type-webinar .np-blog-body,
  html body.np-cms-detail-shell.np-cms-type-webinar .np-blog-side,
  html body.np-cms-detail-shell.np-cms-type-webinar .np-blog-side-v2{
    max-height:none!important;
    overflow-y:visible!important;
    overflow-x:visible!important;
    padding-right:0!important;
    scrollbar-width:none!important;
  }

  html body.np-cms-detail-shell .np-blog-body-wrap{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 320px!important;
    gap:42px!important;
    align-items:start!important;
    overflow:visible!important;
  }

  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    position:sticky!important;
    top:96px!important;
    align-self:start!important;
  }
}

/* Blend article content with the page instead of showing a hard white content slab. */
html body.np-cms-detail-shell .np-blog-body-section,
html body.np-cms-detail-shell .np-blog-body-wrap,
html body.np-cms-detail-shell .np-blog-body{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
html body.np-cms-detail-shell .np-blog-body{
  border-radius:0!important;
  padding:0!important;
  color:#102033!important;
}
html body.np-cms-detail-shell .np-blog-body p,
html body.np-cms-detail-shell .np-blog-body li{
  color:#243449!important;
}

@media (max-width:1024px){
  html body.np-cms-detail-shell .np-blog-body-wrap{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:30px!important;
    overflow:visible!important;
  }
  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    position:static!important;
    top:auto!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:14px!important;
  }
}
@media (max-width:680px){
  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    grid-template-columns:1fr!important;
  }
}

/* === CMS V14 article flow, banner, lists and media placement — 2026-07-13 === */
html body.np-cms-detail-shell .np-blog-body-section{
  padding:64px 0 76px!important;
  background:#f8fafc!important;
}
html body.np-cms-detail-shell .np-blog-body-wrap{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 330px!important;
  gap:42px!important;
  align-items:start!important;
}
html body.np-cms-detail-shell .np-blog-main-column{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  gap:30px!important;
}
html body.np-cms-detail-shell .np-cms-inline-summary{
  margin:0!important;
  padding:24px 26px!important;
  border-radius:18px!important;
  background:#fff!important;
  border:1px solid #dbe5f4!important;
  box-shadow:0 16px 42px rgba(15,23,42,.07)!important;
}
html body.np-cms-detail-shell .np-cms-inline-summary p{
  margin:9px 0 0!important;
  color:#334155!important;
  line-height:1.72!important;
}
html body.np-cms-detail-shell .np-blog-body{
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}
html body.np-cms-detail-shell .np-blog-body h2,
html body.np-cms-detail-shell .np-blog-body h3{
  scroll-margin-top:112px!important;
}

/* The desktop resource rail remains in view and scrolls within a website-height panel. */
@media (min-width:1025px){
  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    position:sticky!important;
    top:96px!important;
    align-self:start!important;
    max-height:calc(100vh - 116px)!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    padding-right:6px!important;
    scrollbar-width:thin!important;
    scrollbar-color:#93c5fd transparent!important;
  }
  html body.np-cms-detail-shell .np-blog-side-v2::-webkit-scrollbar{width:6px!important;display:block!important}
  html body.np-cms-detail-shell .np-blog-side-v2::-webkit-scrollbar-track{background:transparent!important}
  html body.np-cms-detail-shell .np-blog-side-v2::-webkit-scrollbar-thumb{background:#93c5fd!important;border-radius:999px!important}
}
html body.np-cms-detail-shell .np-toc-mobile{display:none!important}
html body.np-cms-detail-shell .np-toc-desktop{
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
}
html body.np-cms-detail-shell .np-toc-desktop strong{
  color:#fff!important;
  margin-bottom:7px!important;
}
html body.np-cms-detail-shell .np-toc-desktop a{
  color:#dbeafe!important;
  border-top:1px solid rgba(255,255,255,.12)!important;
  padding:10px 0!important;
  line-height:1.35!important;
  text-decoration:none!important;
}
html body.np-cms-detail-shell .np-toc-desktop a.toc-level-3{
  padding-left:12px!important;
  font-size:.8rem!important;
  opacity:.9!important;
}

/* Dedicated detail-page banner. Listing/card imagery remains independent. */
html body.np-cms-detail-shell .np-cms-banner-visual.has-banner{
  display:block!important;
  min-height:320px!important;
  height:clamp(320px,28vw,430px)!important;
  overflow:hidden!important;
  border-radius:24px!important;
  border:1px solid rgba(147,197,253,.22)!important;
  background:#071322!important;
  box-shadow:0 24px 70px rgba(2,8,23,.35)!important;
}
html body.np-cms-detail-shell .np-cms-banner-visual.has-banner .np-cms-hero-img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:24px!important;
}

/* Reliable list rendering after CMS save/publish. */
html body.np-cms-detail-shell .np-blog-body ul,
html body.np-cms-detail-shell .np-blog-body ol{
  display:block!important;
  margin:18px 0 24px!important;
  padding-left:30px!important;
  list-style-position:outside!important;
}
html body.np-cms-detail-shell .np-blog-body ul{list-style-type:disc!important}
html body.np-cms-detail-shell .np-blog-body ol{list-style-type:decimal!important}
html body.np-cms-detail-shell .np-blog-body ul ul{list-style-type:circle!important}
html body.np-cms-detail-shell .np-blog-body ol ol{list-style-type:lower-alpha!important}
html body.np-cms-detail-shell .np-blog-body li{
  display:list-item!important;
  margin:8px 0!important;
  padding-left:5px!important;
}
html body.np-cms-detail-shell .np-blog-body li::marker{
  color:#2563eb!important;
  font-weight:800!important;
}

/* Inline media keeps the exact editor position and uses polished rounded corners. */
html body.np-cms-detail-shell .np-blog-body figure.cms-media,
html body.np-cms-detail-shell .np-blog-body .cms-image-block{
  margin:30px 0!important;
  width:100%!important;
}
html body.np-cms-detail-shell .np-blog-body img,
html body.np-cms-detail-shell .np-blog-body img.cms-inline-image{
  display:block!important;
  max-width:100%!important;
  width:auto!important;
  height:auto!important;
  border-radius:18px!important;
  box-shadow:0 18px 44px rgba(15,23,42,.12)!important;
}
html body.np-cms-detail-shell .np-blog-body figcaption{
  margin-top:9px!important;
  color:#64748b!important;
  font-size:.86rem!important;
  line-height:1.5!important;
  text-align:center!important;
}
html body.np-cms-detail-shell .np-blog-body figcaption:empty{display:none!important}
html body.np-cms-detail-shell .np-blog-body .cms-video{
  margin:30px 0!important;
  border-radius:18px!important;
  box-shadow:0 18px 44px rgba(15,23,42,.16)!important;
}

@media (max-width:1024px){
  html body.np-cms-detail-shell .np-blog-body-section{padding:46px 0 60px!important}
  html body.np-cms-detail-shell .np-blog-body-wrap{
    grid-template-columns:1fr!important;
    gap:32px!important;
  }
  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    position:static!important;
    top:auto!important;
    max-height:none!important;
    overflow:visible!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:14px!important;
    padding-right:0!important;
  }
  html body.np-cms-detail-shell .np-toc-desktop{display:none!important}
  html body.np-cms-detail-shell .np-toc-mobile{
    display:flex!important;
    flex-direction:column!important;
    background:#fff!important;
    color:#0f172a!important;
    border:1px solid #dbe5f4!important;
    border-radius:16px!important;
    padding:18px!important;
    box-shadow:0 14px 34px rgba(15,23,42,.07)!important;
  }
  html body.np-cms-detail-shell .np-toc-mobile strong{margin-bottom:7px!important;color:#0f172a!important}
  html body.np-cms-detail-shell .np-toc-mobile a{
    color:#475569!important;
    border-top:1px solid #e2e8f0!important;
    padding:10px 0!important;
    text-decoration:none!important;
  }
  html body.np-cms-detail-shell .np-toc-mobile a.toc-level-3{padding-left:12px!important;font-size:.86rem!important}
}

@media (max-width:860px){
  html body.np-cms-detail-shell .np-blog-hero-inner{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:28px!important;
  }
  html body.np-cms-detail-shell .np-blog-visual{display:none!important}
  html body.np-cms-detail-shell .np-cms-banner-visual.has-banner{
    display:block!important;
    width:100%!important;
    min-height:220px!important;
    height:clamp(220px,58vw,340px)!important;
    margin-top:2px!important;
    border-radius:18px!important;
  }
  html body.np-cms-detail-shell .np-cms-banner-visual.has-banner .np-cms-hero-img{border-radius:18px!important}
}

@media (max-width:680px){
  html body.np-cms-detail-shell .np-blog-main-column{gap:24px!important}
  html body.np-cms-detail-shell .np-cms-inline-summary{padding:19px!important}
  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{grid-template-columns:1fr!important}
  html body.np-cms-detail-shell .np-blog-body ul,
  html body.np-cms-detail-shell .np-blog-body ol{padding-left:24px!important}
  html body.np-cms-detail-shell .np-blog-body img,
  html body.np-cms-detail-shell .np-blog-body img.cms-inline-image,
  html body.np-cms-detail-shell .np-blog-body .cms-video{border-radius:14px!important}
}
html body.np-cms-detail-shell .np-toc-desktop a{display:block!important;justify-content:initial!important}

/* === CMS V15 desktop hero, bounded reading panel, clean lists and FAQ accordion — 2026-07-13 === */

/* Keep the detail hero as a true two-column layout on desktop. */
@media (min-width:1025px){
  html body.np-cms-detail-shell .np-blog-article-hero .container{
    width:min(1180px,calc(100% - 48px))!important;
    max-width:1180px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  html body.np-cms-detail-shell .np-blog-article-hero .np-blog-hero-inner{
    display:grid!important;
    grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr)!important;
    gap:54px!important;
    align-items:center!important;
    width:100%!important;
    max-width:none!important;
  }
  html body.np-cms-detail-shell .np-blog-article-hero .np-blog-hero-copy{
    grid-column:1!important;
    grid-row:1!important;
    width:auto!important;
    max-width:700px!important;
    min-width:0!important;
    margin:0!important;
    position:relative!important;
    inset:auto!important;
    transform:none!important;
  }
  html body.np-cms-detail-shell .np-blog-article-hero .np-blog-visual,
  html body.np-cms-detail-shell .np-blog-article-hero .np-cms-banner-visual{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:0!important;
    position:relative!important;
    inset:auto!important;
    transform:none!important;
    align-self:center!important;
  }
  html body.np-cms-detail-shell .np-cms-banner-visual.has-banner{
    min-height:310px!important;
    height:clamp(310px,24vw,390px)!important;
    aspect-ratio:16/10!important;
  }
}

/* On desktop the article and resource rail share one website-height reading area.
   Each side scrolls independently, so the page does not become excessively long. */
@media (min-width:1025px){
  html body.np-cms-detail-shell .np-blog-body-wrap{
    --np-reading-panel-height:clamp(620px,calc(100vh - 112px),820px);
    height:var(--np-reading-panel-height)!important;
    max-height:var(--np-reading-panel-height)!important;
    min-height:620px!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }
  html body.np-cms-detail-shell .np-blog-main-column{
    height:100%!important;
    max-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    padding-right:15px!important;
    scrollbar-gutter:stable!important;
    scrollbar-width:thin!important;
    scrollbar-color:#7aa7e8 transparent!important;
    overscroll-behavior:contain!important;
  }
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar{width:7px!important}
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-track{background:transparent!important}
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-thumb{background:#7aa7e8!important;border-radius:999px!important}
  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    position:static!important;
    top:auto!important;
    align-self:stretch!important;
    width:100%!important;
    min-width:0!important;
    height:100%!important;
    max-height:100%!important;
    margin:0!important;
    padding:0 7px 0 0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    box-sizing:border-box!important;
    scrollbar-gutter:stable!important;
    overscroll-behavior:contain!important;
  }
}

/* Repair inherited widths/margins so the TOC has all four visible borders. */
html body.np-cms-detail-shell .np-blog-side .np-side-card,
html body.np-cms-detail-shell .np-blog-side-v2 .np-side-card,
html body.np-cms-detail-shell .np-toc-desktop{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin-left:0!important;
  margin-right:0!important;
  transform:none!important;
  left:auto!important;
  right:auto!important;
  box-sizing:border-box!important;
}
html body.np-cms-detail-shell .np-toc-desktop{
  overflow:hidden!important;
  padding:20px!important;
  border:1px solid rgba(147,197,253,.28)!important;
  border-radius:17px!important;
}
html body.np-cms-detail-shell .np-toc-desktop a{
  width:100%!important;
  margin:0!important;
  box-sizing:border-box!important;
  overflow-wrap:anywhere!important;
}

/* Completely neutralise legacy feature-card styling on genuine UL/OL content. */
html body.np-cms-detail-shell .np-blog-body ul,
html body.np-cms-detail-shell .np-blog-body ol{
  display:block!important;
  width:auto!important;
  max-width:100%!important;
  margin:20px 0 26px!important;
  padding:0 0 0 32px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  list-style-position:outside!important;
}
html body.np-cms-detail-shell .np-blog-body ul{list-style:disc outside!important}
html body.np-cms-detail-shell .np-blog-body ol{list-style:decimal outside!important}
html body.np-cms-detail-shell .np-blog-body ul ul{list-style-type:circle!important}
html body.np-cms-detail-shell .np-blog-body ol ol{list-style-type:lower-alpha!important}
html body.np-cms-detail-shell .np-blog-body li,
html body.np-cms-detail-shell .np-blog-body ul li,
html body.np-cms-detail-shell .np-blog-body ol li{
  display:list-item!important;
  position:static!important;
  width:auto!important;
  min-height:0!important;
  margin:9px 0!important;
  padding:0 0 0 5px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#243449!important;
  line-height:1.75!important;
  font-style:normal!important;
  transform:none!important;
}
html body.np-cms-detail-shell .np-blog-body li::before,
html body.np-cms-detail-shell .np-blog-body li::after{
  content:none!important;
  display:none!important;
}
html body.np-cms-detail-shell .np-blog-body li::marker{
  color:#2563eb!important;
  font-weight:800!important;
}
html body.np-cms-detail-shell .np-blog-body li>p,
html body.np-cms-detail-shell .np-blog-body li>em,
html body.np-cms-detail-shell .np-blog-body li>strong{
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* CMS-managed FAQ accordion. */
html body.np-cms-detail-shell .np-cms-faq{
  margin:14px 0 8px!important;
  padding:30px!important;
  border:1px solid #dbe5f4!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 18px 48px rgba(15,23,42,.08)!important;
  scroll-margin-top:108px!important;
}
html body.np-cms-detail-shell .np-cms-faq-head{margin-bottom:20px!important}
html body.np-cms-detail-shell .np-cms-faq-head h2{
  margin:8px 0 0!important;
  color:#0f172a!important;
  font-size:clamp(1.55rem,2.4vw,2.2rem)!important;
  line-height:1.18!important;
}
html body.np-cms-detail-shell .np-cms-faq-list{display:grid!important;gap:12px!important}
html body.np-cms-detail-shell .np-cms-faq-item{
  border:1px solid #dbe5f4!important;
  border-radius:15px!important;
  background:#f8fbff!important;
  overflow:hidden!important;
}
html body.np-cms-detail-shell .np-cms-faq-item summary{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  padding:17px 18px!important;
  color:#0f172a!important;
  font-weight:850!important;
  line-height:1.45!important;
  cursor:pointer!important;
  list-style:none!important;
}
html body.np-cms-detail-shell .np-cms-faq-item summary::-webkit-details-marker{display:none!important}
html body.np-cms-detail-shell .np-cms-faq-item summary i{
  flex:0 0 auto!important;
  color:#2563eb!important;
  transition:transform .2s ease!important;
}
html body.np-cms-detail-shell .np-cms-faq-item[open] summary i{transform:rotate(45deg)!important}
html body.np-cms-detail-shell .np-cms-faq-answer{
  padding:0 18px 18px!important;
  border-top:1px solid #e5edf7!important;
}
html body.np-cms-detail-shell .np-cms-faq-answer p{
  margin:15px 0 0!important;
  color:#475569!important;
  font-size:.98rem!important;
  line-height:1.72!important;
}

/* Tablet/mobile: natural document scrolling and stacked hero/sidebar. */
@media (max-width:1024px){
  html body.np-cms-detail-shell .np-blog-body-wrap{
    height:auto!important;
    max-height:none!important;
    min-height:0!important;
    overflow:visible!important;
  }
  html body.np-cms-detail-shell .np-blog-main-column{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    padding-right:0!important;
    scrollbar-gutter:auto!important;
  }
  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    padding-right:0!important;
  }
}
@media (max-width:860px){
  html body.np-cms-detail-shell .np-blog-article-hero .container{
    width:min(100% - 32px,760px)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  html body.np-cms-detail-shell .np-blog-article-hero .np-blog-hero-copy,
  html body.np-cms-detail-shell .np-blog-article-hero .np-blog-visual,
  html body.np-cms-detail-shell .np-blog-article-hero .np-cms-banner-visual{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    position:relative!important;
    inset:auto!important;
    transform:none!important;
  }
}
@media (max-width:680px){
  html body.np-cms-detail-shell .np-cms-faq{padding:20px 16px!important;border-radius:17px!important}
  html body.np-cms-detail-shell .np-cms-faq-item summary{padding:15px!important;font-size:.94rem!important}
  html body.np-cms-detail-shell .np-cms-faq-answer{padding:0 15px 15px!important}
  html body.np-cms-detail-shell .np-blog-body ul,
  html body.np-cms-detail-shell .np-blog-body ol{padding-left:26px!important}
}


/* === CMS V16 taller reading panel, visible scroll rails and 16:9 hero banner — 2026-07-13 === */
@media (min-width:1025px){
  html body.np-cms-detail-shell .np-blog-body-wrap{
    --np-reading-panel-height:clamp(980px,calc(100vh + 90px),1180px);
    grid-template-columns:minmax(0,1fr) 360px!important;
    gap:36px!important;
    height:var(--np-reading-panel-height)!important;
    min-height:980px!important;
    max-height:1180px!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }
  html body.np-cms-detail-shell .np-blog-main-column{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:scroll!important;
    padding:0 20px 52px 0!important;
    box-sizing:border-box!important;
    scroll-padding-top:18px!important;
    scroll-padding-bottom:52px!important;
    scrollbar-gutter:stable!important;
    scrollbar-width:auto!important;
    scrollbar-color:#2563eb #e7eef8!important;
  }
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar{width:11px!important;display:block!important}
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-track{background:#e7eef8!important;border-radius:999px!important}
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#3b82f6,#6366f1)!important;border:2px solid #e7eef8!important;border-radius:999px!important}

  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:scroll!important;
    padding:0 11px 42px 0!important;
    box-sizing:border-box!important;
    scroll-padding-bottom:42px!important;
    scrollbar-gutter:stable!important;
    scrollbar-width:auto!important;
    scrollbar-color:#60a5fa rgba(7,19,34,.16)!important;
  }
  html body.np-cms-detail-shell .np-blog-side::-webkit-scrollbar,
  html body.np-cms-detail-shell .np-blog-side-v2::-webkit-scrollbar{width:10px!important;display:block!important}
  html body.np-cms-detail-shell .np-blog-side::-webkit-scrollbar-track,
  html body.np-cms-detail-shell .np-blog-side-v2::-webkit-scrollbar-track{background:#dfe8f4!important;border-radius:999px!important}
  html body.np-cms-detail-shell .np-blog-side::-webkit-scrollbar-thumb,
  html body.np-cms-detail-shell .np-blog-side-v2::-webkit-scrollbar-thumb{background:#3b82f6!important;border:2px solid #dfe8f4!important;border-radius:999px!important}

  html body.np-cms-detail-shell .np-cms-faq{margin-bottom:36px!important}

  html body.np-cms-detail-shell .np-cms-banner-visual.has-banner{
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    aspect-ratio:16/9!important;
    border-radius:22px!important;
  }
  html body.np-cms-detail-shell .np-cms-banner-visual.has-banner .np-cms-hero-img{
    width:100%!important;
    height:100%!important;
    aspect-ratio:16/9!important;
    object-fit:cover!important;
    object-position:center!important;
    border-radius:22px!important;
  }
}

/* Keep the last article block and FAQ fully reachable above the scroll edge. */
html body.np-cms-detail-shell .np-blog-main-column > :last-child{
  margin-bottom:24px!important;
}

@media (max-width:1024px){
  html body.np-cms-detail-shell .np-blog-main-column,
  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    overflow:visible!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    padding-right:0!important;
  }
}

/* === CMS V17 full resource rail + article-only scrolling — 2026-07-13 ===
   Desktop behaviour:
   - The complete right rail (TOC, sharing, read more, related pages and newsletter)
     is always visible without its own scrollbar.
   - The two-column reading area grows to the natural height of that right rail.
   - Only the longer article column scrolls inside the matching height.
   Mobile/tablet retain normal document scrolling. */
@media (min-width:1025px){
  html body.np-cms-detail-shell .np-blog-body-wrap{
    --np-reading-rail-height:1320px;
    height:var(--np-reading-rail-height)!important;
    min-height:980px!important;
    max-height:none!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }

  html body.np-cms-detail-shell .np-blog-main-column{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    padding:0 20px 54px 0!important;
    box-sizing:border-box!important;
    overscroll-behavior:contain!important;
    scrollbar-gutter:stable!important;
    scrollbar-width:auto!important;
    scrollbar-color:#2563eb #e7eef8!important;
  }
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar{
    width:11px!important;
    display:block!important;
  }
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-track{
    background:#e7eef8!important;
    border-radius:999px!important;
  }
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg,#3b82f6,#6366f1)!important;
    border:2px solid #e7eef8!important;
    border-radius:999px!important;
  }

  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    position:static!important;
    top:auto!important;
    align-self:start!important;
    width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    scrollbar-width:none!important;
  }
  html body.np-cms-detail-shell .np-blog-side::-webkit-scrollbar,
  html body.np-cms-detail-shell .np-blog-side-v2::-webkit-scrollbar{
    display:none!important;
  }

  html body.np-cms-detail-shell .np-blog-side .np-side-card,
  html body.np-cms-detail-shell .np-blog-side-v2 .np-side-card,
  html body.np-cms-detail-shell .np-toc-desktop{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
  }
  html body.np-cms-detail-shell .np-toc-desktop{
    display:flex!important;
    flex-direction:column!important;
  }
}

@media (max-width:1024px){
  html body.np-cms-detail-shell .np-blog-body-wrap{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
  }
  html body.np-cms-detail-shell .np-blog-main-column,
  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    padding-right:0!important;
  }
}

/* === CMS V18 non-overlapping resource rail + slimmer article scrollbar — 2026-07-13 ===
   Fixes:
   - TOC participates in normal document flow and cannot overlap Share this article.
   - The complete right rail determines the reading-section height.
   - Only the left article column scrolls on desktop.
   - Article scrollbar is slimmer and does not reserve an oversized gutter. */
@media (min-width:1025px){
  html body.np-cms-detail-shell .np-blog-body-section{
    padding-top:72px!important;
    padding-bottom:84px!important;
  }

  html body.np-cms-detail-shell .np-blog-body-wrap{
    --np-reading-rail-height:1220px;
    height:var(--np-reading-rail-height)!important;
    min-height:1220px!important;
    max-height:none!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }

  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:14px!important;
    position:static!important;
    inset:auto!important;
    top:auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    scrollbar-width:none!important;
  }

  html body.np-cms-detail-shell .np-blog-side > .np-side-card,
  html body.np-cms-detail-shell .np-blog-side-v2 > .np-side-card,
  html body.np-cms-detail-shell .np-toc-desktop{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    z-index:auto!important;
    flex:0 0 auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
    transform:none!important;
    contain:none!important;
  }

  html body.np-cms-detail-shell .np-toc-desktop{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    padding:20px!important;
  }

  html body.np-cms-detail-shell .np-share-card{
    clear:both!important;
  }

  html body.np-cms-detail-shell .np-blog-main-column{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    padding:0 12px 56px 0!important;
    box-sizing:border-box!important;
    scrollbar-gutter:auto!important;
    scrollbar-width:thin!important;
    scrollbar-color:#4f7ff0 transparent!important;
  }

  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar{
    width:5px!important;
    height:5px!important;
  }
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-track{
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg,#3b82f6,#6366f1)!important;
    border:0!important;
    border-radius:999px!important;
    min-height:54px!important;
  }
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-button{
    display:none!important;
    width:0!important;
    height:0!important;
  }
}

/* === CMS V19 clean reading-panel ending — 2026-07-13 ===
   Keeps a small visual breathing space at the bottom of the desktop reading
   section and fully suppresses native Windows scrollbar arrow buttons. */
@media (min-width:1025px){
  html body.np-cms-detail-shell .np-blog-body-section{
    padding-bottom:96px!important;
  }

  html body.np-cms-detail-shell .np-blog-body-wrap{
    padding-bottom:18px!important;
    box-sizing:border-box!important;
  }

  html body.np-cms-detail-shell .np-blog-main-column{
    height:100%!important;
    min-height:0!important;
    padding-bottom:58px!important;
    box-sizing:border-box!important;
  }

  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-button,
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-button:single-button,
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-button:vertical:decrement,
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-button:vertical:increment,
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-button:start,
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-button:end{
    -webkit-appearance:none!important;
    appearance:none!important;
    display:block!important;
    width:0!important;
    min-width:0!important;
    height:0!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    background-image:none!important;
    box-shadow:none!important;
  }

  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-corner{
    background:transparent!important;
  }
}
/* === CMS V20 clean section finish + single summary placement — 2026-07-13 ===
   - Removes the clipped/shadowed finish at the bottom of the reading panel.
   - Hides the native desktop article scrollbar and replaces it with a slim,
     arrow-free custom indicator created by detail.php.
   - The blog/news summary stays in the dedicated summary card, not in the hero. */
@media (min-width:1025px){
  html body.np-cms-detail-shell .np-blog-body-section{
    padding-bottom:76px!important;
    box-shadow:none!important;
    filter:none!important;
    overflow:visible!important;
  }

  html body.np-cms-detail-shell .np-blog-body-section::before,
  html body.np-cms-detail-shell .np-blog-body-section::after,
  html body.np-cms-detail-shell .np-blog-body-wrap::before,
  html body.np-cms-detail-shell .np-blog-body-wrap::after{
    content:none!important;
    display:none!important;
    background:none!important;
    box-shadow:none!important;
  }

  html body.np-cms-detail-shell .np-blog-body-wrap{
    position:relative!important;
    padding-bottom:0!important;
    margin-bottom:0!important;
    background:transparent!important;
    box-shadow:none!important;
    filter:none!important;
  }

  html body.np-cms-detail-shell .np-blog-main-column{
    padding-bottom:28px!important;
    scrollbar-width:none!important;
    -ms-overflow-style:none!important;
    box-shadow:none!important;
    filter:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }

  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar,
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-track,
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-thumb,
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-button,
  html body.np-cms-detail-shell .np-blog-main-column::-webkit-scrollbar-corner{
    display:none!important;
    width:0!important;
    height:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  html body.np-cms-detail-shell .np-blog-side,
  html body.np-cms-detail-shell .np-blog-side-v2{
    padding-bottom:0!important;
    margin-bottom:0!important;
    box-shadow:none!important;
    filter:none!important;
  }

  html body.np-cms-detail-shell .np-blog-side-v2 > .np-side-card:last-child,
  html body.np-cms-detail-shell .np-blog-side > .np-side-card:last-child{
    margin-bottom:0!important;
    box-shadow:none!important;
    filter:none!important;
  }

  html body.np-cms-detail-shell .np-cms-article-scroll-track{
    position:absolute!important;
    z-index:20!important;
    width:3px!important;
    border-radius:999px!important;
    background:rgba(148,163,184,.20)!important;
    pointer-events:none!important;
    overflow:hidden!important;
  }

  html body.np-cms-detail-shell .np-cms-article-scroll-thumb{
    display:block!important;
    width:100%!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,#3b82f6,#6366f1)!important;
    box-shadow:none!important;
    will-change:transform!important;
  }
}

@media (max-width:1024px){
  html body.np-cms-detail-shell .np-cms-article-scroll-track{
    display:none!important;
  }
}