/* ============================================================
   Site overrides — loaded AFTER all design-system stylesheets so
   these rules win the cascade. Keep design CSS files pristine.
   ============================================================ */

/* 1. Nav-link + Guides-trigger hover.
   The brand theme set hover to a light purple (hsl 263 82% 84%), which is
   low-contrast on the deep-royal header. Use a light tint of the brand blue
   instead — clearly readable on the navy bar and on-brand. */
body.brand-invesp .nav-links a:hover,
body.brand-invesp .nav-dropdown:hover .nav-dropdown-trigger,
body.brand-invesp .nav-dropdown:focus-within .nav-dropdown-trigger {
  color: hsl(220 95% 82%) !important;
}

/* 2. "Guides" dropdown menu opens on a white background, but its links are also
   `.nav-links a`, which the brand theme forces to white (white-on-white -> invisible
   until hovered). Force them to dark foreground at rest. Extra `.nav-links` in the
   selector raises specificity above `body.brand-invesp .nav-links a`. */
body.brand-invesp .nav-links .nav-dropdown-menu a {
  color: hsl(var(--foreground)) !important;
}
/* On hover within the white menu, keep dark-on-tint readable (brand blue text). */
body.brand-invesp .nav-links .nav-dropdown-menu a:hover {
  color: hsl(var(--primary)) !important;
  background: hsl(var(--muted) / .6) !important;
}

/* 3. Smooth in-page scrolling for nav anchors (e.g. "Pricing" -> #start), and
   offset the target so the sticky header doesn't cover the section heading. */
html { scroll-behavior: smooth; }
#start { scroll-margin-top: 96px; }

/* 4. "More" button below the pricing cards -> full pricing page. */
.prog-more {
  text-align: center;
  margin-top: 44px;
}