/* Klix Link v7 · fluidez en celular, deslizar la ruleta y enlace visible en las respuestas */

/* ---------- 1. Deslizar la ruleta con el dedo ---------- */
.wheel__stage { touch-action: pan-y pinch-zoom; overscroll-behavior-x: contain; -webkit-tap-highlight-color: transparent; }
.wheel__ring, .wheel .arq { will-change: transform; transform-style: preserve-3d; }
.wheel__stage.is-drag, .wheel__stage.is-drag * { cursor: grabbing; }
.wheel__stage.is-drag .arq__btn { pointer-events: none; }

/* sombra y brillo estáticos: antes cambiaban en cada cuadro y obligaban a repintar */
.wheel .phone { box-shadow: inset 0 0 0 1.5px #3a3a44, 0 0 0 1px #000, 0 30px 40px -26px rgba(0,0,0,.75), 0 0 46px -12px rgba(106,77,255,.4); }
.wheel .arq__btn { filter: none; position: relative; }
.wheel .arq__btn::before { content: ""; position: absolute; inset: 0; z-index: 3; border-radius: 28px; background: #0c0a1f; opacity: calc(var(--a, 0) * .2 - .05); pointer-events: none; }
.wheel .arq { transition: none; }
.wheel .arq__meta { transition: none; }

/* ---------- 2. Menos peso gráfico (todos los equipos) ---------- */
/* los destellos de fondo ya son degradados que se desvanecen: el desenfoque pesado no aportaba */
.hero__fx .orb, .fxbg i { filter: none; }
.progress span { width: 100% !important; transform-origin: 0 50%; transform: scaleX(0); will-change: transform; }

/* secciones fuera de pantalla: sus animaciones infinitas se pausan */
.is-offscreen *, .is-offscreen *::before, .is-offscreen *::after { animation-play-state: paused !important; }

@media (max-width: 900px), (pointer: coarse) {
  /* cristal esmerilado = costoso en celular: se cambia por fondos sólidos casi idénticos */
  .site-header.is-scrolled, [data-header].is-scrolled { backdrop-filter: none; -webkit-backdrop-filter: none; background: color-mix(in srgb, var(--bg) 96%, transparent); }
  .wheel__info { backdrop-filter: none; -webkit-backdrop-filter: none; background: linear-gradient(135deg, rgba(40,34,92,.96), rgba(24,20,62,.96)); }
  .wbtn, .kicker--chip { backdrop-filter: none; -webkit-backdrop-filter: none; }
  .wbtn { background: rgba(255,255,255,.16); }
  .kicker--chip { background: rgba(255,255,255,.94); }
  .modal::backdrop { backdrop-filter: none; background: rgba(7,6,26,.86); }
  /* sombras grandes y luces de fondo más ligeras */
  .wheel .phone { box-shadow: inset 0 0 0 1.5px #3a3a44, 0 0 0 1px #000, 0 18px 24px -18px rgba(0,0,0,.7); }
  .fxbg i:nth-child(3), .fxbg::after { display: none; }
  .hero__fx .o3 { display: none; }
  .fxbg i { animation-duration: 20s; }
}

/* ---------- 3. Enlaces dentro de las respuestas: se ven como enlace ---------- */
.faq .ae-acc__body a,
.faq__list .ae-acc__body a {
  color: #4a2fe0; font-weight: 800;
  text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; text-decoration-color: #6a4dff;
  background: linear-gradient(transparent 62%, rgba(198,255,61,.65) 62%);
  padding: 0 .12em; margin: 0 -.12em; border-radius: 3px; -webkit-box-decoration-break: clone; box-decoration-break: clone;
  transition: background-color .2s, color .2s, text-decoration-color .2s, box-shadow .2s;
  -webkit-tap-highlight-color: rgba(106,77,255,.25);
}
.faq .ae-acc__body a[target="_blank"]::after { content: "\2197"; display: inline-block; margin-left: .2em; font-size: .9em; text-decoration: none; }
.faq .ae-acc__body a:hover { color: #0c0a1f; background: var(--accent); text-decoration-color: #0c0a1f; }
.faq .ae-acc__body a:focus-visible { outline: 3px solid #6a4dff; outline-offset: 3px; border-radius: 4px; background: var(--accent); color: #0c0a1f; }
.faq .ae-acc__body a:active { background: #b3ec2a; }

@media (prefers-reduced-motion: reduce) {
  .wheel__ring, .wheel .arq { will-change: auto; }
  .progress span { transition: none; }
}

/* el precio que salta se tiñe de un violeta un poco más oscuro: pasa el contraste de lectura incluso si se pausa a mitad del salto */
@keyframes fxPrice { 0%, 14%, 100% { transform: scale(1); color: inherit; } 22% { transform: scale(1.35); color: #4a2fe0; } 32% { transform: scale(1); } }