/* ==========================================================================
   Major-partner presented-by treatment for the sticky header.
   Loaded GLOBALLY (every page) on top of the per-page stylesheet, because the
   header markup is shared but each page enqueues a different base CSS file.
   New classes only — additive, never overrides an existing rule by name.
   ========================================================================== */

/* the whole header (band + nav row) is the sticky unit; base .hdr already
   sets position:sticky; top:0. Add motion + a lift shadow once scrolled. */
.hdr{transition:box-shadow .25s ease}
.hdr.scrolled{box-shadow:0 12px 30px -20px rgba(10,22,40,.28)}
.navrow{transition:height .25s ease}
.brand img{transition:height .25s ease}

/* ---- Presented-by band (large, at the very top of the page) ---- */
.njl-band{background:var(--bone);border-bottom:1px solid var(--line);overflow:hidden;
  max-height:120px;opacity:1;
  transition:max-height .32s ease, opacity .24s ease, border-color .32s ease}
.hdr .njl-band .wrap{display:flex;align-items:center;justify-content:center;gap:24px;
  height:auto;min-height:84px;padding-top:14px;padding-bottom:14px}
.njl-eyebrow{font:600 11px/1 'Inter';letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);white-space:nowrap}
.njl-lockup{display:inline-flex;align-items:center;border-left:1px solid #d7d9dd;padding-left:24px}
.njl-lockup img{height:56px;width:auto;display:block;transition:transform .2s ease}
.njl-lockup:hover img{transform:translateY(-1px)}

/* keep nav labels on one line — the compact lockup tightens the row on scroll */
nav.main a{white-space:nowrap}

/* ---- Compact lockup that rides in the nav once the band folds away ---- */
.njl-mini{display:none;align-items:center;gap:9px;margin-right:16px;white-space:nowrap}
.njl-mini span{font:600 9px/1.15 'Inter';letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.njl-mini img{height:30px;width:auto;display:block}

/* ---- Scrolled state (JS toggles .scrolled on .hdr) ---- */
.hdr.scrolled .njl-band{max-height:0;opacity:0;border-color:transparent}
.hdr.scrolled .njl-mini{display:inline-flex}
.hdr.scrolled .navrow{height:64px;gap:22px}
.hdr.scrolled nav.main{gap:22px}
.hdr.scrolled .brand img{height:40px}

/* ---- Mobile: nav row is too tight for the mini lockup, so the band itself
   carries NJL and stays PERSISTENT (never fully folds) — major partner is
   always on screen. Slim, centred, sticky under the compact header. ---- */
@media(max-width:900px){
  .njl-mini{display:none !important}
  .hdr .navrow{justify-content:space-between;gap:10px;padding-left:18px;padding-right:18px}
  .brand img{height:34px}
  .brand b{font-size:14.5px}
  .hdr .navrow .btn-red{padding:10px 15px;font-size:12.5px;white-space:nowrap}
  .hdr .njl-band .wrap{min-height:44px;gap:10px;padding:8px 18px}
  .njl-eyebrow{font-size:8.5px;letter-spacing:.12em}
  .njl-lockup{padding-left:12px}
  .njl-lockup img{height:30px}
  .hdr.scrolled .njl-band{max-height:120px;opacity:1;border-color:var(--line)}
  .hdr.scrolled .navrow{height:56px}
}
