/* QA-D — accessibility pass.
   Keyboard focus styles, skip link, and cursor affordances for the
   role="button" divs added in index.html. No color-palette changes here:
   the contrast audit (1440/390, hero/sidebar/pricing/testimonials/FAQ/
   footer) passed against every static/resting background found. */

/* #1 — visually-hidden "Skip to content" link, revealed on keyboard focus. */
.wx-skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  z-index: 10000;
  padding: 0.6em 1em;
  background: #ffff23;
  color: #0b0b0d;
  font-weight: 600;
  text-decoration: none;
  border-radius: 0 0 6px 0;
}
.wx-skip-link:focus,
.wx-skip-link:focus-visible {
  left: 0;
  top: 0;
  width: auto;
  height: auto;
  overflow: visible;
  clip: auto;
  clip-path: none;
}

/* #2 — visible focus ring for every keyboard-reachable link/button.
   Yellow buttons get a black outline instead, so the ring stays visible
   against the bright fill. */
:focus-visible {
  outline: 2px solid #ffff23;
  outline-offset: 3px;
}
.w-button:focus-visible,
.hero-cta:focus-visible,
.nav-button:focus-visible,
a[class*="button"]:focus-visible {
  outline-color: #0b0b0d;
}

/* #3 — the mobile menu trigger and the "copy email" row are plain divs
   wired up to click handlers in script.js; they're now real tab stops
   (role="button" tabindex="0" in index.html), so give them a pointer
   cursor to match their behaviour. */
.mobile-menu,
.nav-email-item {
  cursor: pointer;
}