/* Newsletter Glue "painted" sitewide layer (2026-11-09).
   Printed last in <head> by mu-plugin ng-painted.php when option ngk_live=1 (or ?ngk_preview=1). Body class .ngk-site.
   Restyles the existing ngx-* page components without touching page content.
   Rollback: wp option update ngk_live 0 && wp bs_cache purge_cache */

html body.ngk-site{
  --n-ink:#0e2a33; --n-text:#33505a; --n-muted:#5b7079;
  --n-cream:#f6f3ec; --n-sand:#e7eeec; --n-line:#dde3df; --n-white:#fff;
  --n-red:#dd3714; --n-red-d:#c9300f; --n-red-t:#a3290f; --n-peach:#fdede9; --n-peach-d:#fad6cc; --n-sage:#e4efee;
  --n-head:"Inter Tight",Inter,system-ui,sans-serif; --n-body:Inter,system-ui,sans-serif;
  --n-art:url(ng-head-morning.webp); --n-art-m:url(ng-head-morning-1200.webp); --n-sky:#e3eeee;
  /* remap the sitewide tokens */
  --ng-bg:#ffffff; --ng-cream:#f6f3ec; --ng-mint:#e4efee; --ng-line:#dde3df; --ng-line-soft:#e9ece6;
  background:#f6f3ec!important;
}
html body.ngk-site.ngk-art-golden{--n-art:url(ng-head-golden.webp);--n-art-m:url(ng-head-golden-1200.webp);--n-sky:#eef0e6}
html body.ngk-site :is(#main,.site-main,#main-container){background:transparent!important}

/* ---------- sections ---------- */
html body.ngk-site .entry-content > .ngx{background:var(--n-cream)!important}
html body.ngk-site .entry-content > .ngx.ngx-white{background:#fff!important}
html body.ngk-site .entry-content :is(h1,h2,h3){font-family:var(--n-head)!important;letter-spacing:-.015em}
html body.ngk-site .entry-content .ngx h2{text-wrap:balance}
html body.ngk-site .entry-content .ngx :is(.ngx-kicker){color:var(--n-red-t)!important;font-style:normal!important;font-weight:600!important;letter-spacing:.08em!important;text-transform:uppercase!important;font-size:13px!important}

/* cards: white on cream, cream on white; 12px corners, hairline, no heavy shadow */
html body.ngk-site .entry-content .ngx :is(.ngx-card,.ngx-feature,.ngx-panel,.ngx-step,.ngx-plan,.ngx-team__card,.ngx-ct-card,.ngx-vs-feat,.ngx-qs__grid > *){background:#fff!important;border:1px solid var(--n-line)!important;border-radius:12px!important;box-shadow:none!important}
html body.ngk-site .entry-content .ngx.ngx-white :is(.ngx-card,.ngx-feature,.ngx-panel,.ngx-step,.ngx-team__card,.ngx-vs-feat){background:var(--n-cream)!important}
html body.ngk-site .entry-content .ngx :is(.ngx-panel--mint,.ngx-ct-card--mint){background:var(--n-sage)!important;border-color:transparent!important}
html body.ngk-site .entry-content .ngx :is(.ngx-step__num,.ngx-num){background:var(--n-peach)!important;color:var(--n-red-t)!important}
html body.ngk-site .entry-content .ngx .ngx-quote{background:var(--n-sage)!important;border-radius:12px!important;border:0!important}

/* buttons: solid red, ghost becomes soft peach; 8px corners */
html body.ngk-site .ngx a.ngx-btn:not(.ngx-btn--ghost):not(.ngx-btn--ink),html body.ngk-site .ngx .ngx-btn:not(.ngx-btn--ghost):not(.ngx-btn--ink){background:var(--n-red)!important;color:#fff!important;border-radius:8px!important;box-shadow:none!important}
html body.ngk-site .ngx a.ngx-btn:not(.ngx-btn--ghost):not(.ngx-btn--ink):hover{background:var(--n-red-d)!important}
html body.ngk-site .entry-content .ngx:not(.ngx-final) a.ngx-btn--ghost{background:var(--n-peach)!important;color:var(--n-red-t)!important;border:1px solid var(--n-peach)!important;border-radius:8px!important}
html body.ngk-site .entry-content .ngx:not(.ngx-final) a.ngx-btn--ghost:hover{background:var(--n-peach-d)!important;border-color:var(--n-peach-d)!important}
html body.ngk-site .ngx a.ngx-btn:focus-visible{outline:3px solid var(--n-ink)!important;outline-offset:3px!important}

/* ---------- painted page heads (first section of a page) ---------- */
html body.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head){
  position:relative!important;isolation:isolate;overflow:hidden!important;
  background:var(--n-sky) var(--n-art) 50% 100%/cover no-repeat!important;padding-bottom:240px!important;color:var(--n-ink)!important}
html body.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head)::before{
  content:""!important;position:absolute!important;left:0;right:0;bottom:-1px;top:auto!important;height:80px;z-index:-1;background:linear-gradient(rgba(246,243,236,0),var(--n-cream))!important;pointer-events:none;border-radius:0!important;opacity:1!important}
html body.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head)::after{display:none!important;content:none!important}
html body.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head) :is(h1,h2,p,li,span,strong,b,em,.ngx-lead,.ngx-guarantee,.ngx-eyebrow):not(.ngx-btn *):not([class*="ngx-btn"]){color:var(--n-ink)!important}
html body.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head) .ngx-accent{color:var(--n-red-t)!important}
html body.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head) .ngx-kicker{color:var(--n-red-t)!important}
html body.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head) :is(.ngx-lead,p){opacity:.9}
html body.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head) a:not(.ngx-btn){color:var(--n-ink)!important;text-decoration-color:rgba(14,42,51,.4)!important;border-bottom-color:rgba(14,42,51,.4)!important}
html body.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head) a.ngx-btn--ghost{background:var(--n-peach)!important;color:var(--n-red-t)!important;border-color:var(--n-peach)!important}
html body.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head) :is(hr,.ngx-rule){border-color:rgba(14,42,51,.2)!important;background:rgba(14,42,51,.2)!important}
/* the old scene layer (page scenes snippet) is replaced by the painting */
html body.ngk-site.ngp-on .entry-content > section.ngx:first-of-type::after,
html body.ngk-site.ngp-on .ngbh::after{display:none!important;content:none!important}

/* ---------- closing band: the harbour at dusk ---------- */
html body.ngk-site .entry-content > .ngx.ngx-final{position:relative!important;isolation:isolate;overflow:hidden!important;
  background:#0f3a44 url(ng-town-dusk.webp) 50% 100%/cover no-repeat!important;padding-bottom:360px!important;min-height:760px}
html body.ngk-site .entry-content > .ngx.ngx-final::before,html body.ngk-site .entry-content > .ngx.ngx-final::after{display:none!important}

/* ---------- blog head ---------- */
html body.ngk-site .ngbh{background:var(--n-sky) var(--n-art) 50% 100%/cover no-repeat!important}
html body.ngk-site .ngbh :is(h1,h2,p,span){color:var(--n-ink)!important}

/* ---------- strip of the harbour above the footer on pages with no closing band ---------- */
html body.ngk-site:not(.ngk-page):not(:has(.entry-content > .ngx.ngx-final)):not(.ngp-checkout):not(.ngp-account) :is(footer.ngf,.ngf,#footer){position:relative}
html body.ngk-site:not(.ngk-page):not(:has(.entry-content > .ngx.ngx-final)):not(.ngp-checkout):not(.ngp-account) .ngf::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:240px;pointer-events:none;
  background:url(ng-strip-dusk.webp) 50% 100%/cover no-repeat;-webkit-mask-image:linear-gradient(transparent,#000 90px);mask-image:linear-gradient(transparent,#000 90px)}
html body.ngk-site:not(.ngk-page):not(:has(.entry-content > .ngx.ngx-final)):not(.ngp-checkout):not(.ngp-account) .ngf{margin-top:240px!important}

/* ---------- homepage (.ngk): hold its colours against the older layers ---------- */
html body.ngk-site .ngk :is(h1,h2,h3){color:var(--n-ink)!important;font-family:var(--n-head)!important}
html body.ngk-site .ngk .ngk-eyebrow{color:var(--n-red-t)!important}
html body.ngk-site .ngk a:not(.ngk-btn){color:var(--n-red-t)!important}
html body.ngk-site .ngk .ngk-final h2{color:#fff!important}
html body.ngk-site .ngk .ngk-final p{color:#e6efee!important}
html body.ngk-site .ngk .ngk-btn--primary,html body.ngk-site .ngk .ngk-btn--ink,html body.ngk-site .ngk .ngk-btn--glass{color:#fff!important}
html body.ngk-site .ngk .ngk-btn--soft{color:var(--n-red-t)!important}

@media (max-width:760px){
  html body.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head){
    background:var(--n-art-m) 42% 100%/auto 420px no-repeat,var(--n-sky)!important;padding-bottom:200px!important}
  html body.ngk-site .entry-content > .ngx.ngx-final{background:#0f3a44 url(ng-town-dusk-1200.webp) 50% 100%/auto 440px no-repeat!important;padding-bottom:280px!important;min-height:600px}
  html body.ngk-site:not(.ngk-page):not(:has(.entry-content > .ngx.ngx-final)):not(.ngp-checkout):not(.ngp-account) .ngf::before{height:160px;background-image:url(ng-strip-dusk-1200.webp);background-size:auto 190px}
  html body.ngk-site:not(.ngk-page):not(:has(.entry-content > .ngx.ngx-final)):not(.ngp-checkout):not(.ngp-account) .ngf{margin-top:160px!important}
}

/* page background behind the floating header: the painting's own sky colour, no teal gradient */
html body.ngk-site.ngk-site{background-color:var(--n-sky)!important;background-image:none!important}
html body.ngk-site.ngk-page{background-color:#e3eeee!important}
/* any "on dark" text left inside a painted head */
html body.ngk-site .entry-content > .ngx:first-child :is(blockquote,figcaption,cite,.ngx-quiet-quote,.ngx-quiet-quote *){color:var(--n-ink)!important}
html body.ngk-site .entry-content > .ngx:first-child .ngx-quiet-quote{border-color:rgba(14,42,51,.2)!important}

/* blog head: its teal band is a ::before layer; replace it with the painting, full width */
html body.ngk-site .ngbh{background:transparent!important;position:relative;isolation:isolate;padding-bottom:230px!important}
html body.ngk-site .ngbh::before{content:""!important;position:absolute!important;z-index:-1!important;top:-120px!important;bottom:0!important;height:auto!important;
  left:calc(50% - 50vw)!important;right:auto!important;width:100vw!important;background:var(--n-sky) var(--n-art) 50% 100%/cover no-repeat!important}
html body.ngk-site .ngbh :is(.ngbh__kicker){color:var(--n-red-t)!important}
html body.ngk-site .ngbh :is(p,small,.ngxs-note,.ngxs-note *){color:var(--n-ink)!important}
html body.ngk-site .ngbh a:not([class*="btn"]){color:var(--n-ink)!important}
html body.ngk-site .ngbh ul a{background:rgba(255,255,255,.75)!important;color:var(--n-ink)!important;border:1px solid rgba(14,42,51,.15)!important;border-radius:8px!important}
html body.ngk-site .ngbh ul a:is([aria-current],.is-active,.current),html body.ngk-site .ngbh ul li:first-child a[href$="/blog/"]{background:var(--n-ink)!important;color:#fff!important;border-color:var(--n-ink)!important}
html body.ngk-site.blog #main > :not(.ngbh),html body.ngk-site.archive #main > :not(.ngbh){background:transparent}
html body.ngk-site.blog,html body.ngk-site.archive{--ng-mint:#f6f3ec}
@media (max-width:760px){ html body.ngk-site .ngbh::before{background:var(--n-art-m) 42% 100%/auto 420px no-repeat,var(--n-sky)!important} html body.ngk-site .ngbh{padding-bottom:180px!important} }

/* dark teal bands that hold light text (CEO note, VIP pill) stay dark */
html body.ngk-site .entry-content > .ngx.ngx-note{background:#0f3a44!important}
html body.ngk-site .entry-content > .ngx.ngx-note::before,html body.ngk-site .entry-content > .ngx.ngx-note::after{display:none!important}

/* post heads (.ngph) and guide heads (.ngx-mg-hero): painted, like page heads */
html body.ngk-site :is(.ngph,.entry-content > .ngx.ngx-mg-hero){position:relative;isolation:isolate;padding-bottom:220px!important}
html body.ngk-site :is(.ngph,.entry-content > .ngx.ngx-mg-hero)::before{content:""!important;position:absolute!important;z-index:-1!important;top:-120px!important;bottom:0!important;height:auto!important;
  left:calc(50% - 50vw)!important;right:auto!important;width:100vw!important;background:var(--n-sky) var(--n-art) 50% 100%/cover no-repeat!important;border-radius:0!important}
html body.ngk-site .ngph::after{display:none!important}
html body.ngk-site :is(.ngph,.entry-content > .ngx.ngx-mg-hero) :is(h1,h2,p,span,time,li,a:not([class*="btn"]),.ngbp-title,.ngbp-author,.ngbp-date,.ngx-lead,.ngx-mg-back){color:var(--n-ink)!important}
html body.ngk-site :is(.ngph,.entry-content > .ngx.ngx-mg-hero) :is(.ngx-kicker,.ngbp-cat,.ngbp-cat a){color:var(--n-red-t)!important}
@media (max-width:760px){ html body.ngk-site :is(.ngph,.entry-content > .ngx.ngx-mg-hero)::before{background:var(--n-art-m) 42% 100%/auto 400px no-repeat,var(--n-sky)!important} html body.ngk-site :is(.ngph,.entry-content > .ngx.ngx-mg-hero){padding-bottom:170px!important} }

/* labels on dark bands keep the light accent */
html body.ngk-site .entry-content > .ngx:is(.ngx-note,.ngx-final) .ngx-kicker{color:#ffad97!important}
/* video length chips */
html body.ngk-site .ngx .ngx-len{color:#4a5e66!important}
/* sky colour only behind the floating header, cream for the rest of the page */
html body.ngk-site.ngk-site:not(.ngk-page){background:linear-gradient(var(--n-sky) 0,var(--n-sky) 160px,var(--n-cream) 160px)!important;background-color:var(--n-cream)!important}

/* every text element inside a painted head is dark ink, whatever the old "on dark" colour was */
html body.ngk-site :is(.entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head,.ngx-mg-hero),.ngbh,.ngph) :is(p,span,em,i,strong,b,small,blockquote,figcaption,cite,q,li,dt,dd,time,label,h1,h2,h3,h4,div):not([class*="btn"]):not([class*="btn"] *):not(.ngx-card *):not(.ngx-team__card *):not(.ngx-step *):not(.ngx-mg-step *):not(input):not(button){color:var(--n-ink)!important;opacity:1!important}
html body.ngk-site :is(.entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head,.ngx-mg-hero),.ngbh,.ngph) :is(.ngx-kicker,.ngx-accent,.ngbh__kicker){color:var(--n-red-t)!important}
html body.ngk-site .entry-content > .ngx .ngx-quiet-quote{border-color:rgba(14,42,51,.2)!important}
html body.ngk-site .entry-content > .ngx .ngx-quiet-quote blockquote{font-style:italic}
/* header rows: no teal band behind the floating white header bar */
html body.ngk-site header.ct-header [data-row]{background:transparent!important;background-image:none!important}

/* ---------- checkout: one calm cream surface with dark text (no scene, no teal) ---------- */
html body.ngk-site.ngp-checkout,html body.ngk-site.ngd-checkout{background:var(--n-cream)!important;background-image:none!important}
html body.ngk-site .ngc-top{background:var(--n-cream)!important;border-bottom:1px solid var(--n-line)!important;box-shadow:none!important;color:var(--n-ink)!important}
html body.ngk-site .ngc-top::before,html body.ngk-site .ngc-top::after{display:none!important;content:none!important}
html body.ngk-site .ngc-top :is(h1,h2,p,span,a:not(.ngc-secure)){color:var(--n-ink)!important}
html body.ngk-site .ngc-top .ngc-logo{content:url(/wp-content/uploads/2021/02/NG-Newsletter-Glue-green.png);width:auto!important;height:30px!important}
html body.ngk-site .ngc-top .ngc-secure{background:#fff!important;color:var(--n-ink)!important;border:1px solid var(--n-line)!important;border-radius:8px!important}
html body.ngk-site .ngc-top .ngc-secure *{color:var(--n-ink)!important;fill:currentColor}
html body.ngk-site :is(.ngc-main,.ngc-foot){background:transparent!important}

/* ---------- account login / account area hero: painted, dark text ---------- */
html body.ngk-site.ngp-account,html body.ngk-site.ngd-account{background:var(--n-cream)!important;background-image:none!important}
html body.ngk-site section.ngxl{position:relative;isolation:isolate;background:var(--n-sky) url(ng-head-golden.webp) 50% 100%/cover no-repeat!important}
html body.ngk-site section.ngxl::before,html body.ngk-site section.ngxl::after{display:none!important;content:none!important}
html body.ngk-site .ngxl-hero :is(h1,h2,p,li,span,strong){color:var(--n-ink)!important}
html body.ngk-site .ngxl-hero .ngxl-hero__kicker{color:var(--n-red-t)!important}
html body.ngk-site .ngxl-hero :is(li svg,.ngxl-points li::before){color:var(--n-ink)!important;background-color:rgba(255,255,255,.75)!important;border-color:transparent!important}
html body.ngk-site .ngxl-card{border-radius:12px!important;border:1px solid var(--n-line)!important;box-shadow:0 24px 50px -30px rgba(14,42,51,.45)!important}
@media (max-width:760px){ html body.ngk-site section.ngxl{background:var(--n-sky) url(ng-head-golden-1200.webp) 42% 100%/auto 420px no-repeat!important} }
html body.ngk-site.ngk-site.ngk-site section.ngxl .ngxl-points li,
html body.ngk-site.ngk-site.ngk-site section.ngxl .ngxl-points li span{color:var(--n-ink)!important;font-weight:500}
html body.ngk-site.ngk-site.ngk-site section.ngxl .ngxl-points li svg{color:#fff!important;stroke:#fff!important;background:var(--n-ink)!important;border-radius:50%!important;padding:5px}

/* ---------- logged-in account head (section.ngd-head): painted, dark text, clear tabs ---------- */
html body.ngk-site section.ngd-head{position:relative;isolation:isolate;background:var(--n-sky) url(ng-head-golden.webp) 50% 100%/cover no-repeat!important;padding-bottom:120px!important}
html body.ngk-site section.ngd-head::before,html body.ngk-site section.ngd-head::after{display:none!important;content:none!important}
html body.ngk-site.ngk-site section.ngd-head :is(h1,h2,p,span,strong,small){color:var(--n-ink)!important}
html body.ngk-site.ngk-site section.ngd-head .ngd-head__text > p:first-child{color:var(--n-red-t)!important}
html body.ngk-site.ngk-site section.ngd-head :is(.ngd-avatar,[class*="avatar"]){background:#fff!important;color:var(--n-ink)!important;box-shadow:0 8px 20px -12px rgba(14,42,51,.5)!important}
html body.ngk-site.ngk-site section.ngd-head a[href*="ngx_logout"]{background:#fff!important;color:var(--n-ink)!important;border:1px solid var(--n-line)!important;border-radius:8px!important}
html body.ngk-site.ngk-site section.ngd-head a[href*="ngx_logout"] *{color:var(--n-ink)!important;stroke:currentColor}
html body.ngk-site.ngk-site section.ngd-head nav ul{background:rgba(255,255,255,.85)!important;border:1px solid var(--n-line)!important;border-radius:12px!important;box-shadow:0 12px 30px -20px rgba(14,42,51,.45)!important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
html body.ngk-site.ngk-site section.ngd-head nav ul a{color:var(--n-ink)!important;background:transparent!important;border-radius:8px!important;font-weight:600}
html body.ngk-site.ngk-site section.ngd-head nav ul a:hover{background:var(--n-sage)!important}
html body.ngk-site.ngk-site section.ngd-head nav ul a:is([aria-current],.is-active,.current){background:var(--n-ink)!important;color:#fff!important}
@media (max-width:760px){ html body.ngk-site section.ngd-head{background:var(--n-sky) url(ng-head-golden-1200.webp) 42% 100%/auto 380px no-repeat!important;padding-bottom:150px!important} }

/* ---------- account body: cream page, single white cards (no card-inside-card) ---------- */
html body.ngk-site section.ngd-body{background:var(--n-cream)!important}
html body.ngk-site section.ngd-body .ngd-card:has(> .ngd-subs){background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important}
html body.ngk-site section.ngd-body .ngd-subs{display:grid;gap:14px}
html body.ngk-site section.ngd-body .ngd-sub{background:#fff!important;border:1px solid var(--n-line)!important;border-radius:12px!important;box-shadow:none!important}
html body.ngk-site section.ngd-body .ngd-card{border-color:var(--n-line)!important;box-shadow:none!important}
@media (max-width:760px){ html body.ngk-site :is(section.ngd-head,section.ngd-body) .ngd-in{padding-left:16px!important;padding-right:16px!important} }

/* account head + login: plain warm sky behind the text, a short strip of the town along the bottom (never behind the text) */
html body.ngk-site.ngk-site :is(section.ngd-head,section.ngxl){
  background:url(ng-strip-golden.webp) 50% 100%/max(100%,900px) auto no-repeat,linear-gradient(#eef0e6,#f2dbb3)!important;
  padding-bottom:calc(max(100vw,900px) * .1875 + 16px)!important}
html body.ngk-site.ngk-site section.ngxl{padding-bottom:calc(max(100vw,900px) * .1875 + 24px)!important}
@media (max-width:760px){
  html body.ngk-site.ngk-site :is(section.ngd-head,section.ngxl){background:url(ng-strip-golden-1200.webp) 46% 100%/760px auto no-repeat,linear-gradient(#eef0e6,#f2dbb3)!important;padding-bottom:156px!important}
}
/* strip as its own layer, faded in at the top so there is no seam */
html body.ngk-site.ngk-site.ngk-site :is(section.ngd-head,section.ngxl){position:relative!important;isolation:isolate;overflow:hidden;background:linear-gradient(#eef0e6,#f2dbb3)!important}
html body.ngk-site.ngk-site.ngk-site :is(section.ngd-head,section.ngxl)::after{content:""!important;display:block!important;position:absolute!important;left:0;right:0;bottom:0;top:auto!important;z-index:-1!important;
  height:calc(max(100vw,900px) * .1875);background:url(ng-strip-golden.webp) 50% 100%/max(100%,900px) auto no-repeat!important;
  -webkit-mask-image:linear-gradient(transparent,#000 70px);mask-image:linear-gradient(transparent,#000 70px);pointer-events:none}
html body.ngk-site.ngk-site.ngk-site :is(section.ngd-head,section.ngxl)::before{display:none!important}
@media (max-width:760px){
  html body.ngk-site.ngk-site.ngk-site :is(section.ngd-head,section.ngxl)::after{height:142px;background:url(ng-strip-golden-1200.webp) 46% 100%/760px auto no-repeat!important}
}

/* ---------- logged-in account head: compact plain band (no painting) ---------- */
html body.ngk-site.ngk-site.ngk-site.ngk-site section.ngd-head{background:#efe9dd!important;padding:28px 0 0!important;overflow:visible;border-bottom:1px solid var(--n-line)!important;min-height:0!important}
html body.ngk-site.ngk-site.ngk-site.ngk-site section.ngd-head::after,html body.ngk-site.ngk-site.ngk-site.ngk-site section.ngd-head::before{display:none!important;content:none!important}
html body.ngk-site.ngk-site section.ngd-head .ngd-head__row{align-items:center!important;margin:0!important}
html body.ngk-site.ngk-site section.ngd-head :is(.ngd-avatar,[class*="avatar"]){width:48px!important;height:48px!important;font-size:16px!important;box-shadow:none!important;border:1px solid var(--n-line)!important}
html body.ngk-site.ngk-site section.ngd-head h1{font-size:30px!important;line-height:1.15!important;margin:2px 0 2px!important}
html body.ngk-site.ngk-site section.ngd-head .ngd-head__text > p:first-child{font-size:12px!important;margin:0!important}
html body.ngk-site.ngk-site section.ngd-head .ngd-head__text > p:last-child{font-size:14px!important;margin:0!important}
/* tabs sit on the bottom edge like real tabs */
html body.ngk-site.ngk-site.ngk-site section.ngd-head nav{margin:22px 0 0!important;padding:0!important}
html body.ngk-site.ngk-site.ngk-site section.ngd-head nav ul{background:transparent!important;border:0!important;box-shadow:none!important;-webkit-backdrop-filter:none;backdrop-filter:none;padding:0!important;gap:4px!important;border-radius:0!important}
html body.ngk-site.ngk-site.ngk-site section.ngd-head nav ul a{border-radius:8px 8px 0 0!important;padding:11px 16px!important;min-height:0!important;border:1px solid transparent!important;border-bottom:0!important;margin-bottom:-1px}
html body.ngk-site.ngk-site.ngk-site section.ngd-head nav ul a:hover{background:rgba(255,255,255,.6)!important}
html body.ngk-site.ngk-site.ngk-site section.ngd-head nav ul a:is([aria-current],.is-active,.current){background:var(--n-cream)!important;color:var(--n-ink)!important;border-color:var(--n-line)!important;box-shadow:inset 0 3px 0 var(--n-red)!important}
html body.ngk-site section.ngd-body{padding-top:32px!important}
@media (max-width:760px){
  html body.ngk-site.ngk-site.ngk-site.ngk-site section.ngd-head{padding-top:20px!important}
  html body.ngk-site.ngk-site section.ngd-head h1{font-size:26px!important}
}
@media (max-width:760px){ html body.ngk-site.ngk-site.ngk-site.ngk-site section.ngd-head > .ngd-in{padding-left:16px!important;padding-right:16px!important} }

/* the strip behind the floating menu bar matches whatever starts right below it */
html body.ngk-site.ngk-site.ngk-site:has(section.ngd-head){background:#efe9dd!important;background-image:none!important}
html body.ngk-site.ngk-site.ngk-site:has(section.ngxl){background:#eef0e6!important;background-image:none!important}
html body.ngk-site.ngk-site.ngk-site:is(.ngp-checkout,.ngd-checkout){background:var(--n-cream)!important;background-image:none!important}
html body.ngk-site.ngk-site.ngk-site:not(.ngk-page):has(:is(.entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head,.ngx-mg-hero),.ngbh,.ngph)){background:var(--n-sky)!important;background-image:none!important}
html body.ngk-site.ngk-site.ngk-site:not(.ngk-page):not(:has(:is(.entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head,.ngx-mg-hero),.ngbh,.ngph,section.ngd-head,section.ngxl,.ngc-top))){background:var(--n-cream)!important;background-image:none!important}

/* fade the top of every painted head into the colour behind the menu bar, so there is never a step */
html body.ngk-site{--n-sky-0:rgba(227,238,238,0)}
html body.ngk-site.ngk-art-golden{--n-sky-0:rgba(238,240,230,0)}
html body.ngk-site.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head){
  background:linear-gradient(var(--n-sky),var(--n-sky-0) 110px),var(--n-art) 50% 100%/cover no-repeat,var(--n-sky)!important}
@media (max-width:760px){
  html body.ngk-site.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head){
    background:linear-gradient(var(--n-sky),var(--n-sky-0) 90px),var(--n-art-m) 42% 100%/auto 420px no-repeat,var(--n-sky)!important}
}

/* account head: compact, with the harbour fading in on the right (text stays on solid sand) */
html body.ngk-site.ngk-site.ngk-site.ngk-site section.ngd-head{
  background:linear-gradient(90deg,#efe9dd 38%,rgba(239,233,221,.6) 58%,rgba(239,233,221,0) 78%),url(ng-strip-golden.webp) 100% 100%/auto 100% no-repeat,#efe9dd!important}
html body.ngk-site.ngk-site.ngk-site.ngk-site section.ngd-head nav ul a:not([aria-current]){background:rgba(255,255,255,.55)!important}
@media (max-width:760px){
  html body.ngk-site.ngk-site.ngk-site.ngk-site section.ngd-head{background:linear-gradient(90deg,#efe9dd 45%,rgba(239,233,221,0) 100%),url(ng-strip-golden-1200.webp) 100% 100%/auto 100% no-repeat,#efe9dd!important}
}

/* compact painted heads: less room above and below the text */
html body.ngk-site.ngk-site.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head,.ngx-mg-hero){padding-top:48px!important;padding-bottom:150px!important}
html body.ngk-site.ngk-site.ngk-site :is(.ngbh,.ngph){padding-bottom:150px!important}
html body.ngk-site.ngk-site.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head,.ngx-mg-hero) :is(h1){margin-bottom:12px!important}
@media (max-width:760px){
  html body.ngk-site.ngk-site.ngk-site .entry-content > .ngx:is(.ngx-hero,.ngx-about-head,.ngx-lg-head,.ngx-bl-hero,.ngx-cl-head,.ngx-ct-head,.ngx-gs-hero,.ngx-sv-head,.ngx-in-head,.ngx-vs-hero,.ngx-pd-head,.ngx-qs-head,.ngx-demo-head,.ngx-pc-head,.ngx-mg-hero){padding-top:36px!important;padding-bottom:120px!important}
  html body.ngk-site.ngk-site.ngk-site :is(.ngbh,.ngph){padding-bottom:120px!important}
}
html body.ngk-site.ngk-site .entry-content > .ngx .ngx-quiet-quote{background:rgba(246,243,236,.9)!important;border:0!important;border-radius:12px!important;padding:12px 20px!important;max-width:560px!important;margin-left:auto!important;margin-right:auto!important}
/* r4: more air above the floating menu card */
html body.ngk-site header.ct-header [data-row*="middle"]{padding-top:10px!important}