/* The whole hall-pass sign is clickable, but only the actual CTA should react visually. */

.hero-ticket-hotspot::before,
.hero-ticket-hotspot:hover::before,
.hero-ticket-hotspot:focus-visible::before {
  display: none;
  border: 0;
  box-shadow: none;
}

.hero-ticket-hotspot:focus-visible {
  outline: 0;
}

.hero-ticket-hotspot:hover span,
.hero-ticket-hotspot:focus-visible span {
  background: var(--yellow);
  box-shadow: 9px 9px 0 var(--red);
  transform: translateY(-3px) rotate(-1deg);
}

.hero-ticket-hotspot:focus-visible span {
  outline: 3px solid var(--white);
  outline-offset: 3px;
}