/* Site-specific adjustments and interactions. Edit directly, without a build. */

/* Keep the mobile menu hidden even though its utility classes use display:flex. */
[hidden] {
  display: none !important;
}

#menu-toggle {
  cursor: pointer;
  flex-shrink: 0;
}

#menu-toggle[aria-expanded="true"] > div:nth-child(1) {
  transform: translateY(7px) rotate(45deg) !important;
}

#menu-toggle[aria-expanded="true"] > div:nth-child(2) {
  opacity: 0 !important;
}

#menu-toggle[aria-expanded="true"] > div:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg) !important;
}

/* Replace the React hover handlers with CSS. */
nav a:not([href="#book"]):hover,
nav a:not([href="#book"]):focus-visible {
  color: white !important;
}

nav a[href="#book"]:hover,
nav a[href="#book"]:focus-visible {
  background: #1345b5 !important;
}

section a[href="#book"]:hover,
section a[href="#book"]:focus-visible {
  transform: translateY(-1px);
}

#staff .group:hover {
  box-shadow: 0 6px 20px rgba(26, 86, 219, 0.12) !important;
  transform: translateY(-1px);
}

.solution-card:hover {
  border-color: var(--solution-color, #dae6ff) !important;
  box-shadow: 0 8px 32px var(--solution-shadow, transparent) !important;
}

section[id] {
  scroll-margin-top: 64px;
}
