/* Hover/interaction layer for the statically-baked pages.
   Replaces the React hover handlers that existed in the dc-runtime version. */

button { cursor: pointer; }

/* primary (navy fill) */
button[style*="var(--navy-800)"][style*="var(--white)"]:hover {
  background: var(--navy-600) !important;
  border-color: var(--navy-600) !important;
}
/* accent (teal fill) */
button[style*="var(--teal-600)"]:hover {
  background: var(--teal-700) !important;
  border-color: var(--teal-700) !important;
}
/* hero accent variant (teal-500 fill, navy text) */
button[style*="var(--teal-500)"][style*="var(--navy-900)"]:hover {
  background: var(--teal-400) !important;
  border-color: var(--teal-400) !important;
}
/* secondary (hairline outline) */
button[style*="var(--navy-200)"]:hover {
  background: var(--navy-50) !important;
  border-color: var(--navy-400) !important;
}
/* inverse-ghost (on navy) */
button[style*="rgba(255, 255, 255, 0.34)"]:hover,
button[style*="rgba(255,255,255,.34)"]:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.7) !important;
}
/* press feedback */
button:active { transform: translateY(1px); }