.button-hover-text {
  position: relative;
  display: inline-block;
  min-width: 100%;
  height: 1.2em;
  overflow: hidden;
  font: inherit;
  line-height: 1.2;
  vertical-align: top;
}

.button-hover-text--global {
  min-width: 0;
}

.global-text-hover__label {
  display: inline-block;
}

.button-hover-text__line {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  font: inherit;
  white-space: nowrap;
}

.button-hover-text__line--hover {
  position: absolute;
  inset: 0;
}

.button-hover-text__char {
  display: inline-block;
  transform: translate3d(0, 0, 0) rotate(0deg);
  transform-origin: 0 50%;
  transition: transform 520ms cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: calc(var(--button-char-index) * 18ms);
  will-change: transform;
}

.button-hover-text__line--hover .button-hover-text__char {
  transform: translate3d(0, 145%, 0) rotate(9deg);
}

:is(.shiny-cta, [data-global-text-hover="true"]):is(:hover, :focus-visible, .is-touch-feedback) .button-hover-text__line--base .button-hover-text__char {
  transform: translate3d(0, -145%, 0) rotate(-7deg);
}

:is(.shiny-cta, [data-global-text-hover="true"]):is(:hover, :focus-visible, .is-touch-feedback) .button-hover-text__line--hover .button-hover-text__char {
  transform: translate3d(0, 0, 0) rotate(0deg);
}

/* Touch feedback belongs to the header CTA; other mobile labels stay static. */
@media (max-width: 767px) and (prefers-reduced-motion: no-preference) {
  .site-navigation > .site-outline-cta[data-touch-feedback-ready] .button-hover-text__char {
    transition: transform 520ms cubic-bezier(0.16, 1, 0.3, 1) !important;
    transition-delay: calc(var(--button-char-index) * 18ms) !important;
  }

  .site-navigation > .site-outline-cta[data-touch-feedback-ready] .button-hover-text__line--hover {
    display: flex !important;
  }

  .site-navigation > .site-outline-cta[data-touch-feedback-ready] .button-hover-text__line--base .button-hover-text__char {
    transform: none !important;
  }

  .site-navigation > .site-outline-cta[data-touch-feedback-ready] .button-hover-text__line--hover .button-hover-text__char {
    transform: translate3d(0, 145%, 0) rotate(9deg) !important;
  }

  .site-navigation > .site-outline-cta[data-touch-feedback-ready]:is(.is-touch-feedback, :focus-visible) .button-hover-text__line--base .button-hover-text__char {
    transform: translate3d(0, -145%, 0) rotate(-7deg) !important;
  }

  .site-navigation > .site-outline-cta[data-touch-feedback-ready]:is(.is-touch-feedback, :focus-visible) .button-hover-text__line--hover .button-hover-text__char {
    transform: none !important;
  }
}

@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
  .button-hover-text__char {
    transition: none !important;
  }

  .button-hover-text__line--hover {
    display: none !important;
  }

  :is(.shiny-cta, [data-global-text-hover="true"]):is(:hover, :focus-visible) .button-hover-text__line--base .button-hover-text__char {
    transform: none !important;
  }
}
