/* =========================
   1) LOCATION TITLES – no highlight
   ========================= */

.cap.short {
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
  border: none !important;
}

/* Kill the gradient bubble on ALL .btn-bar layers */
.btn-bar,
.btn-bar * {
  background: none !important;
  background-image: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Treat the bar itself as the “button” */
.btn-bar {
  text-align: center;
  padding: 6px 0 !important;
  position: relative;
}

/* Style the clickable text inside */
.btn-bar,
.btn-bar a,
.btn-bar span {
  display: inline-block;
  cursor: pointer;

  font-family: inherit !important;
  font-size: 1.1rem !important;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.18em;

  color: #DE3163 !important;  /* soft lavender */
  text-decoration: none !important;

  transition:
    transform 0.45s cubic-bezier(.19, 1, .22, 1),
    color 0.45s ease,
    text-shadow 0.45s ease;
}

/* Dark purple “rune” underline on the bar */
.btn-bar::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 100%;
  height: 2px;

  background: linear-gradient(
    90deg,
    transparent,
    #9F2B68,
    #320066,
  );

  opacity: 0;
  transform: scaleX(0.3);
  transform-origin: left;
  transition:
    opacity 0.3s ease,
    transform 0.45s ease;
}

/* Hover: tarot card lift + dark mystic glow */
.btn-bar:hover,
.btn-bar:hover a,
.btn-bar:hover span {
  transform: translateY(-5px) scale(1.04);
  color: #F8C8DC !important;
}

.btn-bar:hover::after {
  opacity: 1;
  transform: scaleX(1);
}
