/* A photographic backdrop only; the approved CTA layout stays unchanged. */
:root[data-palette] .final-cta-photo {
  background: #030c2e;
  color: #fff;
}

:root[data-palette] .final-cta-photo::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0 0 0 auto;
  width: 70%;
  height: 100%;
  aspect-ratio: auto;
  background: url("assets/images/backgrounds/arena-imersiva-cta.webp") right 43% / cover no-repeat;
  opacity: 1;
  filter: none;
  pointer-events: none;
}

.final-cta-photo::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background: linear-gradient(90deg, #030c2e 0%, #030c2e 38%, #030c2ef0 51%, #030c2eb8 65%, #030c2e38 83%, #030c2e20);
  pointer-events: none;
}

@media (max-width: 767px) {
  :root[data-palette] .final-cta-photo::before {
    width: 100%;
    background-position: 72% center;
  }

  .final-cta-photo::after {
    background: linear-gradient(90deg, #030c2ee8, #030c2ec9 50%, #030c2e90), linear-gradient(180deg, #030c2e40 50%, #030c2e);
  }
}