:root {
  --af-main-text-gradient: linear-gradient(90deg, #42D392 0%, #647EFF 100%);
}

/* Utility spans must not pick up the pages' card, metric, or icon span styles. */
:is(.af-main-gradient-run, .af-main-gradient-text) {
  display: inline !important;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  box-shadow: none !important;
  font: inherit !important;
  letter-spacing: inherit !important;
  text-transform: inherit !important;
  white-space: inherit !important;
  vertical-align: baseline !important;
  overflow: visible !important;
  text-overflow: clip !important;
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

.af-main-gradient-run {
  background-image: none !important;
}

:is(.af-main-gradient-run, .af-main-gradient-text)::before,
:is(.af-main-gradient-run, .af-main-gradient-text)::after {
  content: none !important;
  display: none !important;
}

@supports ((background-clip: text) or (-webkit-background-clip: text)) {
  .af-main-gradient-text {
    background-image: linear-gradient(90deg, #42D392 var(--af-main-gradient-offset, 0px), #647EFF calc(var(--af-main-gradient-offset, 0px) + var(--af-main-gradient-width, 100%))) !important;
    background-size: 100% 100% !important;
    background-position: 0 0 !important;
    background-repeat: no-repeat !important;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    -webkit-text-stroke: 0 transparent !important;
    text-shadow: none !important;
  }
}

/* Keep legacy text dimming from changing the approved gradient colors. */
main :is(
  .policy p,
  .policy li,
  .step .n,
  .spec small,
  .coordinate-mark:not([hidden]),
  [aria-labelledby^="service-location-title-"] p,
  [aria-labelledby^="service-location-title-"] span
):has(.af-main-gradient-text) {
  opacity: 1 !important;
}

main a:hover:has(.af-main-gradient-text):not([disabled]):not([aria-disabled="true"]) {
  opacity: 1 !important;
}

/* Preserve letter movement while preventing the old cyan/brightness effects. */
main :is(.char, .glow-char):is(.af-main-gradient-text, :has(.af-main-gradient-text)) {
  filter: none !important;
  text-shadow: none !important;
}

main .btn:hover:has(.af-main-gradient-text):not(:disabled):not([aria-disabled="true"]) {
  filter: none !important;
}

main figcaption .af-main-gradient-text,
main .tile-caption .af-main-gradient-text,
main .tile .label .af-main-gradient-text {
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .9)) !important;
}

@supports ((background-clip: text) or (-webkit-background-clip: text)) {
  /* Numbered labels generated by CSS have no text node for the renderer. */
  main .process .step::before,
  main .rendering-step::before,
  main .rendering-video-process-list li::before,
  main .industry-benefit::after {
    background-image: var(--af-main-text-gradient) !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    text-shadow: none !important;
  }

  main .process .step::before {
    width: fit-content;
  }

  main :is(input, textarea)::placeholder {
    background-image: var(--af-main-text-gradient) !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    text-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
  }
}

@media (forced-colors: active) {
  .af-main-gradient-text,
  main .process .step::before,
  main .rendering-step::before,
  main .rendering-video-process-list li::before,
  main .industry-benefit::after {
    background-image: none !important;
    color: CanvasText !important;
    -webkit-text-fill-color: CanvasText !important;
    -webkit-text-stroke: 0 transparent !important;
    text-shadow: none !important;
    filter: none !important;
  }

  main :is(input, textarea)::placeholder {
    background-image: none !important;
    color: CanvasText !important;
    -webkit-text-fill-color: CanvasText !important;
    text-shadow: none !important;
  }
}