/* Shared action component: retain native links/buttons and wrap their text in
   .dot-action-label. The reserved space keeps the hit area stable on hover. */
.dot-action {
  --action-shift: 22px;
  --action-dot: 7px;
}
body .dot-action .dot-action-label {
  position: relative;
  display: inline-block;
  padding-left: 0;
  padding-right: var(--action-shift);
  margin-left: 0;
  text-align: left;
  transform: none;
  transition: padding 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
}
body .dot-action .dot-action-label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.6em;
  width: var(--action-dot);
  height: var(--action-dot);
  border-radius: 50%;
  background: currentColor;
  opacity: 0;
  transform: translateY(-50%) scale(0.4);
  transition:
    opacity 0.25s,
    transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
}
body .dot-action:focus-visible .dot-action-label {
  padding-left: var(--action-shift);
  padding-right: 0;
}
body .dot-action:focus-visible .dot-action-label::before {
  opacity: 1;
  transform: translateY(-50%) scale(1);
}
@media (hover: hover) {
  body .dot-action:hover .dot-action-label {
    padding-left: var(--action-shift);
    padding-right: 0;
  }
  body .dot-action:hover .dot-action-label::before {
    opacity: 1;
    transform: translateY(-50%) scale(1);
  }
}
body .dot-action:hover {
  text-decoration: none;
}
body .site-nav .nav-links .dot-action:hover {
  text-decoration: none;
}
body .text-button.dot-action {
  border-bottom: 0;
}
body .audience-switch .dot-action {
  border-bottom: 0;
}
body .audience-switch .dot-action[aria-pressed="false"] .dot-action-label {
  padding-left: 0;
  padding-right: var(--action-shift);
}
body
  .audience-switch
  .dot-action[aria-pressed="false"]
  .dot-action-label::before {
  opacity: 0;
  transform: translateY(-50%) scale(0.4);
}
body .audience-switch .dot-action .dot-action-label::before {
  top: 50%;
  transition: none;
}
body .audience-switch .dot-action[aria-pressed="true"] .dot-action-label {
  padding-left: var(--action-shift);
  padding-right: 0;
}
body
  .audience-switch
  .dot-action[aria-pressed="true"]
  .dot-action-label::before {
  opacity: 1;
  transform: translateY(-50%) scale(1);
}
body .concierge-intro .dot-action {
  padding-block: 8px;
  color: var(--ink);
}
body .audience-card.dot-action > .dot-action-label {
  position: absolute;
  top: 24px;
  right: 24px;
  bottom: auto;
  left: auto;
  padding-right: 0;
}
body .audience-card.dot-action {
  color: #000;
}
body .audience-card.dot-action img {
  transform: none;
  filter: none;
}
body .audience-card.dot-action::after {
  background: #fff;
  opacity: 0.2;
  transition: opacity 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}
body .audience-card.dot-action:is(:hover, :focus-visible)::after {
  opacity: 0;
}
body .audience-card.dot-action:is(:hover, :focus-visible) {
  color: #fff;
}
@media (prefers-reduced-motion: reduce) {
  body .dot-action .dot-action-label,
  body .dot-action .dot-action-label::before {
    transition: none;
  }
}
