/* ==========================================================================
   VisionLovers · Bloque al final de cada artículo (inc/cta-articulo.php · partes/cta-articulo.php) · 28/09/2026
   Sustituye el CSS en línea del mu-plugin zz-vl-cta.php. Mobile first, tokens, sin !important.
   Marca: halo rosa de las tarjetas (capa 1 del neón) y mancha de luz de fondo (capa 3); los botones son los de la casa.
   Modo oscuro: solo con el botón (html[data-tema="oscuro"]), nunca solo por el aparato.
   ========================================================================== */
html body .vl-cta-articulo { position: relative; overflow: hidden; margin: 40px 0 0; padding: 24px 20px; border-radius: var(--vl-radius-xl, 24px); background: var(--vl-bg-card, #fff); box-shadow: var(--vl-halo); color: var(--vl-text, #0f172a); }
html body .vl-cta-articulo__mancha { position: absolute; top: -60px; right: -40px; width: 200px; height: 200px; border-radius: 50%; background: var(--vl-mancha); filter: blur(var(--vl-mancha-blur, 60px)); pointer-events: none; }
html body .vl-cta-articulo > :not(.vl-cta-articulo__mancha) { position: relative; }
html body .vl-cta-articulo .vl-cta-articulo__titulo { margin: 0 0 8px; font-family: var(--vl-font-titulos, Manrope), Manrope, "Manrope Relleno", Inter, sans-serif; font-weight: 700; font-size: 20px; line-height: 1.3; word-spacing: 0.12em; color: var(--vl-text, #0f172a); }
html body .vl-cta-articulo .vl-cta-articulo__texto { margin: 0 0 16px; font-size: 16px; line-height: 1.6; color: var(--vl-text-muted, #475569); }
html body .vl-cta-articulo .vl-cta-articulo__botones { display: flex; flex-direction: column; gap: 12px; margin: 0; }
html body .vl-cta-articulo a.vl-cta-articulo__boton { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; width: 100%; text-decoration: none; }
html body .vl-cta-articulo .vl-cta-articulo__icono { width: 20px; height: 20px; flex: 0 0 20px; }
html body .vl-cta-articulo .vl-cta-articulo__llamar { margin: 16px 0 0; font-size: 15px; line-height: 1.5; color: var(--vl-text-muted, #475569); }
html body .vl-cta-articulo .vl-cta-articulo__llamar a { color: var(--vl-secondary-dark, #035377); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 600px) {
  html body .vl-cta-articulo { padding: 32px; }
  html body .vl-cta-articulo .vl-cta-articulo__botones { flex-direction: row; flex-wrap: wrap; }
  html body .vl-cta-articulo a.vl-cta-articulo__boton { width: auto; }
}
html[data-tema="oscuro"] body .vl-cta-articulo { background: var(--vl-bg-card); color: var(--vl-text); }