/* North Star series navigation — Executive / Technical switch, role finder, promo band.
   CSP-strict (no inline styles). Shared by bluesentinelai.ai and aispg.ai. */
.nsx{--x-bg:#05060b;--x-panel:#0b0d15;--x-line:rgba(255,255,255,.10);--x-line-2:rgba(255,255,255,.18);
  --x-text:#f3f5f9;--x-mute:#9aa3b5;--x-accent:#e5484d;--x-accent-2:#ff6b70;
  --x-display:'Space Grotesk','Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --x-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --x-mono:'JetBrains Mono',ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  background:var(--x-bg);color:var(--x-text);font-family:var(--x-body)}
.nsx[data-site="aispg"]{--x-accent:#e83b63;--x-accent-2:#ff6c8c}
.nsx *,.nsx *::before,.nsx *::after{box-sizing:border-box}
.nsx-wrap{width:min(1360px,calc(100% - 32px));margin:0 auto}

/* series switch */
.nsx-switchbar{padding:28px 0 0}
/* bluesentinelai.ai film pages sit under a fixed header (77–97px): clear it */
.nsx-switchbar[data-site="bsai"]{padding-top:clamp(96px,calc(8vw + 64px),124px)}
/* the theater that follows the switch needs less top air */
.nsx-switchbar + .ns-theater{padding-top:clamp(28px,4vw,48px)}
.nsx-switch{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--x-line);border-radius:999px;background:var(--x-panel);max-width:100%}
.nsx-switch a{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;color:var(--x-mute);
  font:600 12px/1 var(--x-mono);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;white-space:nowrap;transition:color .2s,background-color .2s}
.nsx-switch a:hover{color:var(--x-text)}
.nsx-switch a:focus-visible{outline:2px solid var(--x-accent-2);outline-offset:2px}
.nsx-switch a[aria-current="page"]{background:var(--x-accent);color:#fff}
.nsx-switch .nsx-count{font-weight:500;opacity:.75;letter-spacing:.06em}

/* role finder */
.nsx-roles{padding:0 0 clamp(56px,7vw,96px)}
.nsx-roles-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;border-top:1px solid var(--x-line);padding-top:28px;margin-bottom:18px}
.nsx-roles-head h2{margin:0;font:700 clamp(20px,2.2vw,26px)/1.15 var(--x-display);letter-spacing:-.01em;color:#fff}
.nsx-roles-head p{margin:0;color:var(--x-mute);font-size:14px}
.nsx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;list-style:none;margin:0;padding:0}
.nsx-grid a{display:flex;flex-direction:column;gap:6px;height:100%;padding:14px 16px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-panel);
  color:var(--x-text);text-decoration:none;transition:border-color .2s,background-color .2s}
.nsx-grid a:hover{border-color:var(--x-accent);background:#10131d}
.nsx-grid a:focus-visible{outline:2px solid var(--x-accent-2);outline-offset:2px}
.nsx-grid small{font:600 10.5px/1 var(--x-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--x-accent-2)}
.nsx-grid strong{font:600 15px/1.3 var(--x-display)}
.nsx-grid span{color:var(--x-mute);font-size:13px;line-height:1.45}

/* promo band (home page / executive films page) */
.nsx-promo{padding:0 0 clamp(40px,5vw,64px)}
.nsx-promo-card{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);align-items:center;
  border:1px solid var(--x-line-2);border-radius:16px;background:var(--x-panel);padding:clamp(18px,2.4vw,28px);overflow:hidden}
.nsx-promo-media{display:block;position:relative;border-radius:10px;overflow:hidden;aspect-ratio:16/9;background:#000}
.nsx-promo-media img{display:block;width:100%;height:100%;object-fit:cover}
.nsx-promo-media:focus-visible{outline:2px solid var(--x-accent-2);outline-offset:3px}
.nsx-kicker{display:flex;align-items:center;gap:10px;margin:0 0 12px;font:600 11px/1 var(--x-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--x-accent-2)}
.nsx-kicker b{display:inline-block;padding:4px 7px;border-radius:4px;background:var(--x-accent);color:#fff;letter-spacing:.14em}
.nsx-promo h2{margin:0;font:700 clamp(24px,3vw,38px)/1.06 var(--x-display);letter-spacing:-.02em;color:#fff}
.nsx-promo h2 em{font-style:normal;color:var(--x-accent-2)}
.nsx-promo p{margin:12px 0 0;color:var(--x-mute);font-size:15px;line-height:1.6;max-width:560px}
.nsx-tags{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 0;padding:0;list-style:none}
.nsx-tags li{padding:6px 10px;border:1px solid var(--x-line);border-radius:999px;font:500 11px/1 var(--x-mono);letter-spacing:.06em;color:var(--x-mute)}
.nsx-cta{display:inline-flex;align-items:center;gap:10px;margin-top:20px;padding:13px 20px;border-radius:999px;background:var(--x-accent);color:#fff;
  font:600 13px/1 var(--x-mono);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;transition:background-color .2s}
.nsx-cta:hover{background:var(--x-accent-2)}
.nsx-cta:focus-visible{outline:2px solid #fff;outline-offset:3px}

@media (max-width:760px){
  .nsx-promo-card{grid-template-columns:1fr}
  .nsx-switch{display:flex}
  .nsx-switch a{flex:1 1 0;justify-content:center;padding:10px 10px;letter-spacing:.08em;font-size:11px}
  .nsx-switch .nsx-count{display:none}
  .nsx-roles-head{flex-direction:column;align-items:flex-start;gap:6px}
}
@media (prefers-reduced-motion:reduce){.nsx *{transition:none!important}}

/* no layout shift while the theater mounts: reserve the stage, reveal the role finder once the theater is ready */
.ns-theater[data-ns-src*="/technical/"]:not(.ns-ready){min-height:100vh}
.ns-theater:not(.ns-ready) ~ .nsx-roles{visibility:hidden}

/* flagship spans the full row so the twelve role films form a clean grid (6×2 / 4×3 / 3×4 / 2×6) */
.nsx-grid li:first-child{grid-column:1/-1}
.nsx-grid li:first-child a{flex-direction:row;align-items:center;flex-wrap:wrap;gap:6px 16px;border-color:var(--x-line-2);
  background:linear-gradient(90deg,rgba(229,72,77,.14),transparent 60%),var(--x-panel)}
.nsx[data-site="aispg"] .nsx-grid li:first-child a{background:linear-gradient(90deg,rgba(232,59,99,.14),transparent 60%),var(--x-panel)}
.nsx-grid li:first-child strong{font-size:17px}