/* ESPFlight v41 — Why ESPFlight appearance correction
 * Explicit light/dark tokens. Scoped to the homepage section; it does not affect
 * navigation, documentation, other cards, or application/API endpoints.
 */
.homePage #why-espflight {
  --why-surface-top: #ffffff;
  --why-surface-bottom: #f9fbfa;
  --why-inner-top: #fcfefd;
  --why-inner-bottom: #f4f8f5;
  --why-border: rgba(44, 70, 59, .14);
  --why-divider: rgba(44, 70, 59, .14);
  --why-shadow: 0 12px 36px rgba(25, 62, 43, .065);
  --why-signal-top: #eff9f1;
  --why-signal-bottom: #e7f5eb;
  --why-signal-border: rgba(36, 118, 83, .18);
  --why-number-background: #e1f3e7;
  --why-pill-background: #e8f5ed;
  --why-pill-border: rgba(36, 118, 83, .18);
  --why-glow-opacity: .38;
}
html[data-theme="dark"] .homePage #why-espflight {
  --why-surface-top: #202127;
  --why-surface-bottom: #1b1d22;
  --why-inner-top: #272931;
  --why-inner-bottom: #22252b;
  --why-border: rgba(255, 255, 255, .12);
  --why-divider: rgba(255, 255, 255, .10);
  --why-shadow: 0 18px 42px rgba(0, 0, 0, .23);
  --why-signal-top: #263b32;
  --why-signal-bottom: #20342b;
  --why-signal-border: rgba(66, 211, 146, .25);
  --why-number-background: rgba(66, 211, 146, .16);
  --why-pill-background: rgba(66, 211, 146, .12);
  --why-pill-border: rgba(66, 211, 146, .24);
  --why-glow-opacity: .8;
}

/* Replace fixed dark gradients introduced in v40 with the active theme. */
.homePage #why-espflight :is(.whyHeroCopy, .whyHeroAside, .whyValueCard, .whyPlatformStrip) {
  background: linear-gradient(180deg, var(--why-surface-top), var(--why-surface-bottom));
  border-color: var(--why-border);
  box-shadow: var(--why-shadow);
  color: var(--text);
}
.homePage #why-espflight .whyPlatformItem {
  background: linear-gradient(180deg, var(--why-inner-top), var(--why-inner-bottom));
  border-color: var(--why-border);
  box-shadow: none;
  color: var(--text);
}
.homePage #why-espflight .whySignalCard {
  background: linear-gradient(180deg, var(--why-signal-top), var(--why-signal-bottom));
  border-color: var(--why-signal-border);
}
.homePage #why-espflight .whyQuickList li {
  border-top-color: var(--why-divider);
}
.homePage #why-espflight :is(.whyQuickList span, .whyValueLabel, .whyPlatformItem span) {
  background: var(--why-pill-background);
  border-color: var(--why-pill-border);
}
.homePage #why-espflight .whyQuickList span {background:var(--why-number-background)}
.homePage #why-espflight :is(.whyHeroCopy h2, .whyValueCard h3, .whyPlatformIntro h3, .whyPlatformItem strong, .whyQuickList strong, .whySignalCard strong) {
  color:var(--text);
}
.homePage #why-espflight :is(.whyHeroCopy p, .whySignalCard p, .whyQuickList p, .whyValueCard p, .whyPlatformIntro p, .whyPlatformItem p) {
  color:var(--muted);
}
.homePage #why-espflight :is(.whyHeroCopy, .whyHeroAside, .whyPlatformStrip)::before {
  opacity: var(--why-glow-opacity);
}
/* Focus rings and actionable labels keep the parent site's green system. */
.homePage #why-espflight a:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 4px;
  border-radius: 4px;
}
