/* Shared Real Traço CTA — mirrors the Hero Banner button. */
.rtx-cta-button {
  all: unset;
  box-sizing: border-box;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 292px;
  min-height: 68px;
  padding: 12px 30px !important;
  overflow: hidden;
  border: 2px solid var(--rtx-cta-border, rgba(164, 218, 243, .72)) !important;
  border-radius: 10px !important;
  background:
    linear-gradient(
      112deg,
      var(--rtx-cta-start, var(--rtx-hero-button-start, #3b83a7)) 0%,
      var(--rtx-cta-mid, var(--rtx-hero-button-mid, #5298bb)) 51%,
      var(--rtx-cta-end, var(--rtx-hero-button-end, #6eb7da)) 100%
    ) !important;
  background-size: 128% 100% !important;
  background-position: 8% 50% !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .19),
    inset 0 -1px 0 rgba(7, 36, 50, .08),
    0 2px 7px rgba(0, 0, 0, .08) !important;
  font-family: "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  font-size: 21px;
  font-weight: 700;
  font-style: normal;
  line-height: 1;
  letter-spacing: .022em;
  text-transform: uppercase;
  text-decoration: none !important;
  text-align: center;
  color: var(--rtx-cta-text, #fff) !important;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transform: translateZ(0);
  transition:
    transform .42s cubic-bezier(.22, 1, .36, 1),
    background-position .62s cubic-bezier(.22, 1, .36, 1),
    border-color .34s ease,
    box-shadow .42s ease !important;
}

.rtx-cta-button::before {
  content: '';
  position: absolute;
  inset: 1px;
  border-radius: max(0px, calc(var(--rtx-cta-radius, 10px) - 3px));
  border-top: 1px solid rgba(255, 255, 255, .13);
  pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
  .rtx-cta-button:hover {
    transform: translate3d(0, -1px, 0);
    background-position: 92% 50% !important;
    border-color: var(--rtx-cta-border-hover, rgba(188, 229, 247, .9)) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, .24),
      0 7px 20px rgba(27, 100, 133, .12) !important;
  }
}

.rtx-cta-button:focus-visible {
  outline: 2px solid rgba(255, 255, 255, .96) !important;
  outline-offset: 4px !important;
}

@media (max-width: 767px) {
  .rtx-cta-button {
    min-width: 0;
    min-height: 54px;
    padding: 10px 18px !important;
    border-width: 1px !important;
    border-radius: 9px !important;
    font-size: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rtx-cta-button {
    animation: none !important;
    transition: none !important;
  }
}