/* ============================================================================
   NEXUS BRAND CORE — shared enterprise design language
   ----------------------------------------------------------------------------
   One cover identity for the entire public Nexus surface: deep midnight navy,
   electric blue and cyan highlights, disciplined glass, precise spacing.
   Loaded after page-level styles so shared shell rules win the cascade.
   v1.146.0 — homepage transformation pass.
   ========================================================================== */

:root {
  --nx-void: #04070d;
  --nx-bg: #05080f;
  --nx-navy: #0a1220;
  --nx-navy-2: #0e1726;
  --nx-surface: #0b141f;
  --nx-surface-2: #101c2a;
  --nx-surface-3: #142433;
  --nx-glass: rgba(13, 27, 41, .58);
  --nx-glass-strong: rgba(10, 21, 33, .82);
  --nx-line: rgba(148, 190, 214, .13);
  --nx-line-2: rgba(148, 190, 214, .22);
  --nx-line-accent: rgba(92, 220, 234, .2);
  --nx-text: #f3f7fa;
  --nx-muted: #9ab1c0;
  --nx-dim: #6d8494;
  --nx-cyan: #62e9f5;
  --nx-cyan-deep: #35c4d4;
  --nx-electric: #4f9dff;
  --nx-mint: #74f5c0;
  --nx-amber: #ffd08a;
  --nx-danger: #ff707e;
  --nx-glow-cyan: rgba(98, 233, 245, .16);
  --nx-glow-electric: rgba(79, 157, 255, .14);
  --nx-focus-ring: 0 0 0 4px rgba(98, 233, 245, .14);
  --nx-shadow-panel: 0 22px 60px rgba(2, 6, 12, .42);
  --nx-shadow-dialog: 0 28px 90px rgba(2, 6, 12, .55);
  --nx-radius-card: 12px;
  --nx-radius-panel: 16px;
  --nx-mono: "DM Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
  --nx-sans: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --nx-content-max: 1190px;
  --nx-content-pad: clamp(18px, 4vw, 48px);
  --nx-tap: 44px;
  --nx-ease: cubic-bezier(.22, .72, .18, 1);
  --nx-motion: 200ms;
}

/* ── Page canvas ──────────────────────────────────────────────────────────── */

body {
  background:
    radial-gradient(ellipse at 78% -10%, rgba(37, 118, 146, .2) 0, transparent 44rem),
    radial-gradient(ellipse at 8% 24%, rgba(30, 74, 118, .13) 0, transparent 40rem),
    radial-gradient(ellipse at 88% 78%, rgba(27, 96, 94, .08) 0, transparent 34rem),
    var(--nx-bg);
}

body.nx-command {
  background:
    radial-gradient(ellipse at 82% -12%, rgba(31, 126, 140, .18), transparent 42rem),
    radial-gradient(ellipse at 4% 46%, rgba(37, 84, 136, .12), transparent 40rem),
    radial-gradient(ellipse at 90% 84%, rgba(23, 92, 88, .07), transparent 36rem),
    #05080d;
}

/* ── Focus discipline ─────────────────────────────────────────────────────── */

a:focus-visible,
button:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--nx-cyan);
  outline-offset: 3px;
  border-radius: 6px;
}

/* ── Announcement band ────────────────────────────────────────────────────── */

.announcement {
  border-bottom-color: rgba(98, 233, 245, .1);
  color: #8fa6b3;
  background: linear-gradient(90deg, rgba(10, 24, 38, .6), rgba(6, 12, 20, .3));
}

/* ── Header + navigation shell ────────────────────────────────────────────── */

header {
  border-bottom-color: rgba(92, 220, 234, .16);
  background: rgba(5, 9, 16, .88);
  box-shadow: 0 10px 40px rgba(2, 6, 12, .24);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}

.brandmark,
.mark,
.footer-brandmark {
  box-shadow: inset 0 0 26px rgba(98, 233, 245, .07), 0 6px 22px rgba(0, 0, 0, .28);
}

.nav > a:not(.btn) {
  color: #a9bcc7;
  font-weight: 550;
  letter-spacing: .01em;
  transition: color var(--nx-motion) var(--nx-ease);
}

.nav > a:not(.btn):hover,
.nav > a:not(.btn):focus-visible {
  color: var(--nx-text);
}

.nav .btn,
.footer-cta {
  font-weight: 700;
  letter-spacing: .01em;
}

/* ── Buttons ──────────────────────────────────────────────────────────────── */

.btn {
  position: relative;
  border-radius: 8px;
  font-weight: 700;
  box-shadow: 0 10px 30px rgba(28, 120, 134, .16), inset 0 1px 0 rgba(255, 255, 255, .08);
}

.btn:hover {
  filter: brightness(1.07);
}

.btn.secondary {
  box-shadow: none;
}

/* ── Section headers, eyebrows, labels ────────────────────────────────────── */

.eyebrow {
  color: var(--nx-cyan);
  font-family: var(--nx-mono);
  font-weight: 500;
  letter-spacing: .13em;
}

.eyebrow::before {
  content: "";
  width: 18px;
  height: 1px;
  display: inline-block;
  background: linear-gradient(90deg, var(--nx-cyan), transparent);
  margin-right: 9px;
  vertical-align: middle;
}

.section-head h2,
.section-head > div > h2 {
  text-wrap: balance;
}

/* ── Lifecycle flow chips (footer + in-page evidence streams) ─────────────── */

.footer-lifecycle {
  border-color: rgba(92, 220, 234, .2);
  background: linear-gradient(100deg, rgba(13, 40, 52, .66), rgba(6, 13, 21, .84));
  box-shadow: 0 14px 40px rgba(2, 6, 12, .22);
}

.footer-spec,
.footer-status {
  color: #86a0ac;
}

/* ── Footer ───────────────────────────────────────────────────────────────── */

.nexus-site-footer {
  border-top-color: rgba(92, 220, 234, .22);
  background: linear-gradient(180deg, rgba(11, 24, 36, .86), rgba(4, 7, 12, .99));
  margin-top: clamp(48px, 7vw, 84px);
}

.footer-column h2 {
  font-family: var(--nx-mono);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--nx-text);
  font-size: 10px;
}

.footer-column > a {
  transition: color var(--nx-motion) var(--nx-ease);
}

/* ── Proof strip ──────────────────────────────────────────────────────────── */

.proofline span {
  color: #96b0be;
}

.proofline span:not(:first-child)::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(116, 245, 192, .5);
  display: inline-block;
  margin-right: 9px;
  box-shadow: 0 0 10px rgba(116, 245, 192, .35);
}

/* ── Media queries ────────────────────────────────────────────────────────── */

@media (max-width: 700px) {
  :root {
    --nx-content-pad: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .btn,
  .nav > a,
  .footer-column > a {
    transition: none !important;
  }
}
