/* ═══════════════════════════════════════════════════════════════
   finserve.css — Finserve Case Study theme
   Builds on luma.css + fitnex.css (layout, chapter dividers) and
   swaps the palette for Finserve Dark: ink · periwinkle.
   Load AFTER fitnex.css.
   ═══════════════════════════════════════════════════════════════ */

body.finserve-body {
  --luma-bg: #09090F;
  --luma-surface: #111118;
  --luma-surface-elevated: #191922;
  --luma-border: #25252F;
  --luma-border-bright: #383846;
  --luma-blue: #8B8CFF;
  --luma-blue-glow: rgba(139, 140, 255, 0.35);
  --luma-cyan: #B4B5FF;
  --luma-cyan-glow: rgba(180, 181, 255, 0.22);
  --luma-muted: #A8A8B8;
  --luma-dim: #8E8EA0;
  --fitnex-control: #13131B;

  background-image: radial-gradient(circle, #25252F 1px, transparent 1px);
}

.finserve-body .luma-progress-bar {
  background: linear-gradient(90deg, #5B5CE6, #8B8CFF, #B4B5FF);
  box-shadow: 0 0 10px rgba(139, 140, 255, 0.6);
}

.finserve-body .luma-hero-title .text-gradient {
  background: linear-gradient(135deg, #B4B5FF 0%, #8B8CFF 50%, #5B5CE6 100%);
  -webkit-background-clip: text;
  background-clip: text;
}

/* White on #8B8CFF fails contrast — use ink text on accent fills */
.finserve-body .luma-cta-scroll,
.finserve-body .luma-act-pill.active {
  color: #09090F;
}

.finserve-body .luma-cta-scroll:hover {
  background: #A3A4FF;
}

.finserve-body .luma-act-frame:hover {
  border-color: rgba(139, 140, 255, 0.5);
}

.finserve-body .luma-progress-container {
  background: rgba(17, 17, 24, 0.8);
}

.finserve-body .luma-topnav.scrolled {
  background-color: rgba(9, 9, 15, 0.96);
  border-bottom-color: rgba(139, 140, 255, 0.4);
}

.finserve-body .luma-act-pill:hover {
  background: rgba(139, 140, 255, 0.15);
}

.finserve-body .luma-hero-prompt,
.finserve-body .luma-act-badge .badge-tag {
  background: rgba(139, 140, 255, 0.12);
  border-color: rgba(180, 181, 255, 0.35);
}

.finserve-body .luma-overview-strip {
  background: rgba(139, 140, 255, 0.06);
  border-color: rgba(139, 140, 255, 0.25);
}

.finserve-body .luma-footer {
  background: #06060A;
}