/*
* Puente CSS para la reconstrucción 100% nativa (bloques de Gutenberg) de
* las páginas de servicio v2 (servicio.css). Traduce el sistema .sx-btn
* al marcado que genera core/button y ajusta las imágenes editoriales
* (wp:image) a las medidas que tenían sus placeholders en el HTML de
* mano. Se carga al final para poder sobreescribir con seguridad.
*/
/* ---------- Muro de clientes (.sx-mq__tile): logos deformados ----------
servicios-approved.css solo define max-width:100%/max-height:100% en
.sx-mq__tile img, sin width:auto — funciona con un de HTML puro
(sin atributos width/height), pero desde que esos logos se sirven vía
wp_get_attachment_image() (que sí pone width/height reales, para evitar
CLS), esos atributos actúan como un width fijo de baja prioridad; sin
width:auto que lo anule, la imagen se estira a un ancho que no
corresponde a su alto real. Bug real reportado por el propietario del
sitio (2026-08-19): varios logos (los de proporción distinta a 120:46)
se veían deformados en las páginas de servicio. */
.sx-mq__tile img { width: auto; }
/* ---------- Botones (core/button) ----------
Escopado a variantes .sx-btn--* explícitas: un selector genérico
".wp-block-button .wp-block-button__link" aquí se filtraría también al
botón del header/footer compartido (que no lleva ninguna clase
.sx-btn--*), pisando su radio pill con el de esta página.
Radio: pill (var(--radius-pill)), igual que TODOS los botones ya
construidos en home y blog (native-blocks-bridge.css,
blog-approved-bridge.css) — no var(--radius-md), que es el valor
literal de servicio.css pero rompe la consistencia visual del sitio ya
construido. Se sobreescribe también .sx-btn (botón HTML plano del
formulario) por la misma razón, sin tocar servicios-approved.css. */
.sx-btn { border-radius: var(--radius-pill); }
/* servicio.css define .sx-btn--accent/--secondary/--lg/--block como
clases sueltas (pensadas para un único
en el HTML de mano). El bloque nativo core/button pone esas mismas
clases en el