/* ═══════════════════════════════════════════════════════════════
   she-starts.css — She Starts Case Study theme
   Builds on luma.css + fitnex.css (layout, chapter dividers) and
   swaps the palette for the app's own: ink · pink.
   Load AFTER fitnex.css.
   ═══════════════════════════════════════════════════════════════ */

body.shestarts-body {
  --luma-bg: #101010;
  --luma-surface: #181818;
  --luma-surface-elevated: #202020;
  --luma-border: #2C2C2C;
  --luma-border-bright: #424242;
  --luma-blue: #FA4D87;
  --luma-blue-glow: rgba(250, 77, 135, 0.35);
  --luma-cyan: #FF8FB4;
  --luma-cyan-glow: rgba(255, 143, 180, 0.22);
  --luma-muted: #ABABAB;
  --luma-dim: #8F8F8F;
  --fitnex-control: #181818;

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

.shestarts-body .luma-progress-bar {
  background: linear-gradient(90deg, #D92E6B, #FA4D87, #FF8FB4);
  box-shadow: 0 0 10px rgba(250, 77, 135, 0.6);
}

.shestarts-body .luma-hero-title .text-gradient {
  background: linear-gradient(135deg, #FF8FB4 0%, #FA4D87 60%, #D92E6B 100%);
  -webkit-background-clip: text;
  background-clip: text;
}

/* White on #FA4D87 fails contrast — use ink text on accent fills */
.shestarts-body .luma-cta-scroll,
.shestarts-body .luma-act-pill.active {
  color: #101010;
}

.shestarts-body .luma-cta-scroll:hover {
  background: #FF6F9E;
}

.shestarts-body .luma-act-frame:hover {
  border-color: rgba(250, 77, 135, 0.5);
}

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

.shestarts-body .luma-topnav.scrolled {
  background-color: rgba(16, 16, 16, 0.96);
  border-bottom-color: rgba(250, 77, 135, 0.4);
}

.shestarts-body .luma-act-pill:hover {
  background: rgba(250, 77, 135, 0.15);
}

.shestarts-body .luma-hero-prompt,
.shestarts-body .luma-act-badge .badge-tag {
  background: rgba(250, 77, 135, 0.12);
  border-color: rgba(255, 143, 180, 0.35);
}

.shestarts-body .luma-overview-strip {
  background: rgba(250, 77, 135, 0.06);
  border-color: rgba(250, 77, 135, 0.25);
}

.shestarts-body .luma-footer {
  background: #0A0A0A;
}