/* ============================================================
   Rotating Word Animation
   ============================================================ */

.ce-rwa {
  --ce-rwa-depth: 25px;
  --ce-rwa-word-width: max-content;
  display: flex;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.ce-rwa__line {
  display: inline-flex;
  align-items: baseline;
  flex-wrap: nowrap;
  justify-content: flex-start;
  column-gap: 12px;
  margin: 0;
  width: auto;
  max-width: 100%;
  min-width: 0;
  line-height: 1.08;
}

.ce-rwa__prefix,
.ce-rwa__words {
  display: inline-block;
  vertical-align: top;
}

.ce-rwa__prefix {
  white-space: nowrap;
}

.ce-rwa__words {
  position: relative;
  display: inline-grid;
  grid-template-areas: "word";
  justify-items: start;
  align-items: baseline;
  flex: 0 1 var(--ce-rwa-word-width);
  width: var(--ce-rwa-word-width);
  max-width: 100%;
  min-width: 0;
  height: 64px;
  vertical-align: baseline;
  transform-style: preserve-3d;
}

.ce-rwa__word {
  position: relative;
  grid-area: word;
  justify-self: start;
  align-self: baseline;
  display: inline-block;
  width: max-content;
  max-width: 100%;
  opacity: 0;
  white-space: nowrap;
  transform-style: preserve-3d;
  will-change: opacity;
  text-align: left;
}

.ce-rwa__word.is-active {
  opacity: 1;
}

.ce-rwa__letter {
  display: inline-block;
  position: relative;
  transform: translateZ(var(--ce-rwa-depth));
  transform-origin: 50% 50% var(--ce-rwa-depth);
  transform-style: preserve-3d;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  will-change: transform, opacity;
}

.ce-rwa__letter.is-out {
  transform: rotateX(90deg);
  transition: transform 0.32s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.ce-rwa[data-axis="y"] .ce-rwa__letter.is-out {
  transform: rotateY(90deg);
}

.ce-rwa__letter.is-behind {
  transform: rotateX(-90deg);
}

.ce-rwa[data-axis="y"] .ce-rwa__letter.is-behind {
  transform: rotateY(-90deg);
}

.ce-rwa__letter.is-in {
  transform: rotateX(0deg);
  transition: transform 0.38s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.ce-rwa[data-axis="y"] .ce-rwa__letter.is-in {
  transform: rotateY(0deg);
}

.ce-rwa__sr-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 767px) {
  .ce-rwa-mobile-wrap-yes .ce-rwa__line {
    flex-wrap: wrap;
    row-gap: 0.18em;
  }

  .ce-rwa-mobile-wrap-yes .ce-rwa__prefix {
    white-space: normal;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ce-rwa__word {
    position: relative;
    opacity: 1;
  }

  .ce-rwa__word:not(:first-child) {
    display: none;
  }

  .ce-rwa__letter {
    transform: none !important;
    transition: none !important;
  }
}