/**
 * Estilo global «suave-emil» (pruebas, 19-oct-2026). Solo se carga con ?estilo=suave-emil
 * (preprod/local). Todo bajo html[data-estilo="suave-emil"].
 */

/* =====================================================================
 * Lenguaje: el diseño inicial suavizado. Superficies blancas o con un
 * tinte del azul #049EC5 al 6–8 %, bordes finos, radios de 12 px, sombras
 * casi nulas. La única mancha fuerte es el CTA verde #3FBF53 con texto
 * blanco en negrita. Nada de muescas, troqueles ni degradados navy.
 * Movimiento (criterio emil): solo transform y opacity, curvas propias,
 * salidas más rápidas que entradas y nada en lo que se repite mucho
 * (sin latidos ni destellos infinitos salvo el recomendador, que no se toca).
 * Paleta: #3FBF53 / #36a948, #049EC5, #037693, #04C4F6, #131313, #333,
 * #BBBBBB, #E9E9E9, blanco (y transparencias de estos).
 * ===================================================================== */

html[data-estilo="suave-emil"] {
  --se-tinte: rgba(4, 158, 197, .06);
  --se-tinte2: rgba(4, 158, 197, .08);
  --se-borde: rgba(4, 158, 197, .24);
  --se-linea: #E9E9E9;
  --se-sombra: 0 2px 10px rgba(19, 19, 19, .05);
  --se-radio: 12px;
  --se-out: cubic-bezier(.23, 1, .32, 1);
  --se-cajon: cubic-bezier(.32, .72, 0, 1);
  /* La tabla de contenido toma sus colores de aquí. */
  --toc-acento: #037693;
}

/* La página intermedia de afiliados (/goto-book/…) lleva su propio fondo y
   colores en su plantilla (bookmaker_redirect): no se pisan (22-oct-2026). */
html[data-estilo="suave-emil"] body:where(:not(.path-goto-book)) {
  background: #fff;
  color: #131313;
}

/* ---------------------------------------------------------------------
 * 1. Cabecera: blanca, plana, con línea fina. (El logo oscuro va aparte,
 *    en el bloque «LOGO» del final.)
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] header#header .navbar.fixed-top {
  background: #fff !important;
  border-bottom: 2px solid var(--se-tinte2) !important;
  box-shadow: 0 1px 0 var(--se-linea);
}

html[data-estilo="suave-emil"] .wa-nav-toggle__icon,
html[data-estilo="suave-emil"] .wa-nav-toggle__icon::before,
html[data-estilo="suave-emil"] .wa-nav-toggle__icon::after {
  background: #131313;
}

html[data-estilo="suave-emil"] .wa-nav-toggle {
  border-radius: 10px;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .wa-nav-toggle:active {
  transform: scale(.94);
}

html[data-estilo="suave-emil"] .wa-nav-toggle:focus-visible {
  outline: 2px solid #037693;
  outline-offset: 2px;
}

/* ---------------------------------------------------------------------
 * 2. Menú offcanvas: cabecera clara, filas planas, panel con curva de
 *    cajón; la salida (Bootstrap pone .hiding) es más rápida.
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .wa-nav {
  box-shadow: 0 0 0 1px var(--se-linea), 8px 0 24px rgba(19, 19, 19, .08);
}

html[data-estilo="suave-emil"] .offcanvas.wa-nav {
  transition: transform 300ms var(--se-cajon);
}

html[data-estilo="suave-emil"] .offcanvas.wa-nav.hiding {
  transition: transform 200ms var(--se-out);
}

html[data-estilo="suave-emil"] .wa-nav__header {
  border-bottom: 1px solid var(--se-linea);
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-nav__close {
  border-radius: 10px;
  color: #131313;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .wa-nav__close:hover {
  background: none;
}

html[data-estilo="suave-emil"] .wa-nav__close:active {
  transform: scale(.94);
}

html[data-estilo="suave-emil"] .wa-nav__panel {
  transition: transform 280ms var(--se-cajon);
}

html[data-estilo="suave-emil"] .wa-nav__panel-title {
  color: #131313;
  font-family: Poppins, sans-serif;
  font-weight: 600;
}

html[data-estilo="suave-emil"] .wa-nav__item,
html[data-estilo="suave-emil"] .wa-nav__item--all {
  border-bottom-color: var(--se-linea);
  transition: none;
}

html[data-estilo="suave-emil"] .wa-nav__item:hover,
html[data-estilo="suave-emil"] .wa-nav__item--all:hover,
html[data-estilo="suave-emil"] .wa-nav__back:hover {
  background: none;
}

html[data-estilo="suave-emil"] .wa-nav__item i,
html[data-estilo="suave-emil"] .wa-nav__panel-title i,
html[data-estilo="suave-emil"] .wa-nav__back svg {
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-nav__chevron {
  color: #BBBBBB;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .wa-nav__back {
  border-bottom-color: var(--se-linea);
  color: #333;
  transition: none;
}

html[data-estilo="suave-emil"] .wa-nav__item:focus-visible,
html[data-estilo="suave-emil"] .wa-nav__back:focus-visible {
  outline: 2px solid #037693;
  outline-offset: -2px;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .wa-nav__item:hover,
  html[data-estilo="suave-emil"] .wa-nav__item--all:hover,
  html[data-estilo="suave-emil"] .wa-nav__back:hover {
    background: var(--se-tinte);
  }

  html[data-estilo="suave-emil"] .wa-nav__item:hover .wa-nav__chevron {
    color: #037693;
    transform: translateX(2px);
  }

  html[data-estilo="suave-emil"] .wa-nav__close:hover {
    background: var(--se-tinte2);
  }
}

html[data-estilo="suave-emil"] .wa-nav__reco {
  border: 1px solid var(--se-borde);
  border-radius: var(--se-radio);
  background: var(--se-tinte);
  color: #037693;
  box-shadow: none;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .wa-nav__reco:hover {
  background: var(--se-tinte2);
  transform: none;
}

html[data-estilo="suave-emil"] .wa-nav__reco:active {
  transform: scale(.98);
}

html[data-estilo="suave-emil"] .offcanvas-backdrop.show {
  opacity: .35;
}

/* ---------------------------------------------------------------------
 * 3. Barra inferior móvil y círculo del recomendador (solo color/forma).
 * ------------------------------------------------------------------- */
@media (max-width: 767px) {
  html[data-estilo="suave-emil"] .wa-bottombar {
    border-top: 1px solid var(--se-linea) !important;
    background: #fff !important;
    box-shadow: 0 -1px 8px rgba(19, 19, 19, .04) !important;
  }
}

html[data-estilo="suave-emil"] .wa-bottombar__item {
  color: #333;
  transition: none;
}

html[data-estilo="suave-emil"] .wa-bottombar__item i {
  transition: transform 120ms var(--se-out);
}

html[data-estilo="suave-emil"] .wa-bottombar__item:hover,
html[data-estilo="suave-emil"] .wa-bottombar__item:hover i {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-bottombar__item:active i {
  transform: scale(.9);
}

html[data-estilo="suave-emil"] .wa-bottombar__item--active,
html[data-estilo="suave-emil"] .wa-bottombar__item--active i {
  color: #037693;
}

/* Punto de aviso fijo (sin latido infinito) en verde de la web. */
html[data-estilo="suave-emil"] .wa-bottombar__item--notify::before {
  background: #3FBF53;
  animation: none;
}

html[data-estilo="suave-emil"] .wa-bottombar__item--notify::after {
  display: none;
}

html[data-estilo="suave-emil"] .wa-reco-tab {
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-reco-fab,
html[data-estilo="suave-emil"] .wa-reco-tab__circulo {
  border-color: #fff;
  background: #049EC5;
  box-shadow: 0 4px 14px rgba(4, 158, 197, .32), 0 0 0 1px rgba(4, 158, 197, .24);
}

html[data-estilo="suave-emil"] .wa-reco-fab .wa-reco-fab__pulso,
html[data-estilo="suave-emil"] .wa-reco-tab .wa-reco-fab__pulso {
  border-color: #049EC5;
}

html[data-estilo="suave-emil"] .wa-reco-fab__ia,
html[data-estilo="suave-emil"] .wa-reco-tab__ia {
  background: #3FBF53;
}

html[data-estilo="suave-emil"] .wa-reco-fab:focus-visible {
  outline-color: #037693;
}

html[data-estilo="suave-emil"] .wa-reco-tab:focus-visible .wa-reco-tab__circulo {
  outline-color: #037693;
}

@media (min-width: 768px) {
  html[data-estilo="suave-emil"] .wa-reco-fab {
    box-shadow: 0 6px 18px rgba(4, 158, 197, .3), 0 0 0 1px rgba(4, 158, 197, .24);
  }

  html[data-estilo="suave-emil"] .wa-reco-fab:hover {
    box-shadow: 0 6px 18px rgba(4, 158, 197, .3), 0 0 0 1px rgba(4, 158, 197, .24);
  }
}

/* ---------------------------------------------------------------------
 * 4. Migas y títulos.
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .breadcrumb {
  font-size: 13px;
}

html[data-estilo="suave-emil"] .breadcrumb-item,
html[data-estilo="suave-emil"] .breadcrumb-item.active {
  color: #333;
}

html[data-estilo="suave-emil"] .breadcrumb-item a {
  color: #037693;
}

html[data-estilo="suave-emil"] .breadcrumb-item + .breadcrumb-item::before {
  color: #BBBBBB;
}

/* Títulos: no en la página intermedia de afiliados (lleva los suyos). */
html[data-estilo="suave-emil"] :where(body:not(.path-goto-book)) h1,
html[data-estilo="suave-emil"] :where(body:not(.path-goto-book)) h2,
html[data-estilo="suave-emil"] :where(body:not(.path-goto-book)) h3,
html[data-estilo="suave-emil"] :where(body:not(.path-goto-book)) h4 {
  color: #131313;
  font-family: Poppins, sans-serif;
  letter-spacing: -.015em;
}

/* El tema fuerza #555 !important en el h1 de la reseña. */
html[data-estilo="suave-emil"] body.layout-one-sidebar.node--type-casa-de-apuestas h1 {
  color: #131313 !important;
}

html[data-estilo="suave-emil"] :where(body:not(.path-goto-book)) h1,
html[data-estilo="suave-emil"] :where(body:not(.path-goto-book)) .titulo-pagina h1.title {
  color: #131313;
  font-weight: 600;
  letter-spacing: -.02em;
}

/* h3 del cuerpo: el tema lo pinta #555; aquí #333 de la paleta. */
html[data-estilo="suave-emil"] body .node__content > div > h3,
html[data-estilo="suave-emil"] body .casa-apuestas__content > div > h3 {
  color: #333;
}

html[data-estilo="suave-emil"] body .node__content > div > h3.question,
html[data-estilo="suave-emil"] body .casa-apuestas__content > div > h3.question {
  color: #131313;
}

/* La barra de 180 px sobre los h2 pasa a un trazo corto y fino. */
html[data-estilo="suave-emil"] body .node__content > div > h2::before,
html[data-estilo="suave-emil"] body .casa-apuestas__content > div > h2::before,
html[data-estilo="suave-emil"] body .casa-apuestas__content > h2::before,
html[data-estilo="suave-emil"] body .sobre-nosotros h2::before,
html[data-estilo="suave-emil"] body h2.linea::before {
  width: 40px;
  height: 3px;
  margin-bottom: 14px;
  border-radius: 2px;
  background: #049EC5;
  color: transparent;
  font-size: 0;
  line-height: 3px;
}

/* ---------------------------------------------------------------------
 * 5. Texto y enlaces del cuerpo (#037693: contraste 5:1 sobre blanco).
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] body .node__content > div > p > a,
html[data-estilo="suave-emil"] body .casa-apuestas__content > div > p > a,
html[data-estilo="suave-emil"] body .node__content > div > ul > li > a,
html[data-estilo="suave-emil"] body .casa-apuestas__content > div > ul > li > a,
html[data-estilo="suave-emil"] body .node__content > div figcaption a,
html[data-estilo="suave-emil"] main .field--name-body p a,
html[data-estilo="suave-emil"] main .field--name-body li a {
  color: #037693;
  text-decoration: underline !important;
  text-decoration-color: rgba(3, 118, 147, .35);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] main .field--name-body p a:hover,
  html[data-estilo="suave-emil"] main .field--name-body li a:hover {
    text-decoration-color: #037693;
  }
}

html[data-estilo="suave-emil"] main a:focus-visible,
html[data-estilo="suave-emil"] footer a:focus-visible,
html[data-estilo="suave-emil"] [data-lk]:focus-visible,
html[data-estilo="suave-emil"] button:focus-visible {
  outline: 2px solid #037693;
  outline-offset: 2px;
}

html[data-estilo="suave-emil"] a.detalles-link {
  color: #037693;
}

/* ---------------------------------------------------------------------
 * 6. Botones. CTA de afiliado = verde #3FBF53 con texto blanco en
 *    negrita (única mancha fuerte). El resto, azules planos o contorno.
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .btn {
  border-radius: 10px;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] body .btn-success,
html[data-estilo="suave-emil"] body .cta-button,
html[data-estilo="suave-emil"] body a.cta-boton,
html[data-estilo="suave-emil"] body div.cta-boton,
html[data-estilo="suave-emil"] .btn_shortcut a.cta-boton {
  border: 1px solid #3FBF53;
  border-radius: 10px;
  background: #3FBF53;
  box-shadow: none;
  color: #fff !important;
  font-weight: 700;
  transform: none;
  transition: transform 160ms var(--se-out);
}

/* Fuera del puntero fino el hover no cambia nada (evita el «pegado» táctil). */
html[data-estilo="suave-emil"] body .btn-success:hover,
html[data-estilo="suave-emil"] body .cta-button:hover,
html[data-estilo="suave-emil"] body a.cta-boton:hover,
html[data-estilo="suave-emil"] body div.cta-boton:hover {
  border-color: #3FBF53;
  background: #3FBF53;
  color: #fff !important;
  transform: none;
}

html[data-estilo="suave-emil"] body .btn-primary {
  border: 1px solid #037693;
  border-radius: 10px;
  background: #037693;
  color: #fff;
}

html[data-estilo="suave-emil"] body .btn-primary:hover {
  background: #037693;
  color: #fff;
}

html[data-estilo="suave-emil"] .btn-dark {
  border-color: #131313;
  background: #131313;
  color: #fff;
}

html[data-estilo="suave-emil"] .btn-outline-primary {
  border: 1.5px solid var(--se-borde);
  background: #fff;
  color: #037693;
}

html[data-estilo="suave-emil"] .btn-outline-primary:hover {
  border-color: var(--se-borde);
  background: #fff;
  color: #037693;
}

html[data-estilo="suave-emil"] .btn-secondary {
  background: #037693;
  color: #fff;
  transform: none;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] body .btn-success:hover,
  html[data-estilo="suave-emil"] body .cta-button:hover,
  html[data-estilo="suave-emil"] body a.cta-boton:hover,
  html[data-estilo="suave-emil"] body div.cta-boton:hover,
  html[data-estilo="suave-emil"] [data-lk]:hover .btn-success,
  html[data-estilo="suave-emil"] [data-lk]:hover .cta-button {
    border-color: #36a948;
    background: #36a948;
  }

  html[data-estilo="suave-emil"] body .btn-primary:hover,
  html[data-estilo="suave-emil"] .btn-secondary:hover {
    background: #131313;
    border-color: #131313;
  }

  html[data-estilo="suave-emil"] .btn-outline-primary:hover {
    background: var(--se-tinte2);
  }
}

html[data-estilo="suave-emil"] .btn:active,
html[data-estilo="suave-emil"] body .btn-success:active,
html[data-estilo="suave-emil"] body .cta-button:active,
html[data-estilo="suave-emil"] body .cta-boton:active {
  transform: scale(.97);
}

/* ---------------------------------------------------------------------
 * 7. Tablas.
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] main table {
  border-collapse: separate;
  border-spacing: 0;
}

html[data-estilo="suave-emil"] main table td,
html[data-estilo="suave-emil"] .tabla-simple td {
  border-bottom: 1px solid var(--se-linea) !important;
  color: #333;
}

html[data-estilo="suave-emil"] main table th {
  border-bottom: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #131313;
  font-family: Poppins, sans-serif;
  font-weight: 600;
}

html[data-estilo="suave-emil"] main table tr:last-child td {
  border-bottom: 0 !important;
}

html[data-estilo="suave-emil"] .tabla-simple {
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  box-shadow: var(--se-sombra) !important;
}

html[data-estilo="suave-emil"] .tabla-simple thead tr th {
  border-top: 0;
  border-bottom: 1px solid var(--se-borde);
  background-color: var(--se-tinte) !important;
  color: #131313 !important;
}

/* Puntos de valoración (Fiabilidad, Casino…): azul de la web. */
html[data-estilo="suave-emil"] .punto.punto-lleno {
  background-color: #049EC5;
}

html[data-estilo="suave-emil"] .punto.punto-medio {
  background: linear-gradient(90deg, #049EC5 50%, #E9E9E9 50%);
}

html[data-estilo="suave-emil"] .punto.punto-vacio {
  border-color: #BBBBBB;
  background-color: #E9E9E9;
}

/* Características (apuestas, casino, bono) y métodos de pago: cabecera
 * con tinte en lugar de la franja cian, celdas blancas con borde fino. */
html[data-estilo="suave-emil"] body .funciones-caracteristicas-box {
  overflow: hidden;
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  background: #fff;
  box-shadow: var(--se-sombra);
  font-family: Inter, sans-serif;
}

html[data-estilo="suave-emil"] body .funciones-caracteristicas-box h2 {
  margin-bottom: 12px;
  border-bottom: 1px solid var(--se-borde);
  border-radius: 0;
  background: var(--se-tinte);
  color: #131313;
  font-weight: 600;
  padding: 12px;
}

html[data-estilo="suave-emil"] .tabla-funciones .fila .celda,
html[data-estilo="suave-emil"] .tabla-funciones .celda {
  overflow: hidden;
  border: 1px solid var(--se-linea);
  border-radius: 10px;
  background: #fff;
}

html[data-estilo="suave-emil"] .celda-label {
  border-bottom: 1px solid var(--se-linea);
  border-radius: 0;
  background: var(--se-tinte);
  color: #037693;
}

html[data-estilo="suave-emil"] .celda .valor {
  color: #131313;
  font-weight: 500;
}

html[data-estilo="suave-emil"] .celda .icono .fa-check {
  color: #3FBF53;
}

html[data-estilo="suave-emil"] .celda .icono .fa-xmark {
  color: #333;
}

html[data-estilo="suave-emil"] body .pago-top > div {
  color: #131313;
}

html[data-estilo="suave-emil"] body .pago-top > div > strong {
  color: #037693;
}

html[data-estilo="suave-emil"] .velocidad-bar {
  background: #E9E9E9;
}

html[data-estilo="suave-emil"] .velocidad-fill {
  background: #049EC5;
}

html[data-estilo="suave-emil"] .pago-item {
  border: 1px solid var(--se-linea);
  border-radius: 10px;
}

/* Tabla «perla» (ranking expandible): de degradado a superficie clara. */
html[data-estilo="suave-emil"] .tabla-perla {
  --tp-cat1: #049EC5;
  --tp-cat2: #037693;
  --tp-cat3: #04C4F6;
  --tp-cat4: #BBBBBB;
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  background: #fff;
  box-shadow: var(--se-sombra);
  font-family: Inter, sans-serif;
}

html[data-estilo="suave-emil"] .tabla-perla::before {
  display: none;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-pretitle {
  color: #037693;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-title,
html[data-estilo="suave-emil"] .tabla-perla .tp-name,
html[data-estilo="suave-emil"] .tabla-perla .tp-value,
html[data-estilo="suave-emil"] .tabla-perla .tp-detail-inner strong {
  color: #131313;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-title {
  font-family: Poppins, sans-serif;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-tabs {
  background: var(--se-tinte);
}

html[data-estilo="suave-emil"] .tabla-perla .tp-tab {
  color: #333;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-tab:hover {
  background: none;
  color: #131313;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-tab.active {
  background: #fff;
  box-shadow: 0 0 0 1px var(--se-borde);
  color: #037693;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-hint,
html[data-estilo="suave-emil"] .tabla-perla .tp-sub,
html[data-estilo="suave-emil"] .tabla-perla .tp-value[data-unit]::after,
html[data-estilo="suave-emil"] .tabla-perla .tp-footer-note,
html[data-estilo="suave-emil"] .tabla-perla .tp-total,
html[data-estilo="suave-emil"] .tabla-perla .tp-detail-inner {
  color: #333;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-total strong {
  color: #131313;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-row {
  border: 1px solid var(--se-linea);
  background: #fff;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-row:hover {
  border-color: var(--se-linea);
  background: #fff;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-row.open {
  border-color: var(--se-borde);
  background: var(--se-tinte);
}

html[data-estilo="suave-emil"] .tabla-perla .tp-rank {
  color: #BBBBBB;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-rank.top {
  color: #037693;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-bar {
  background: #E9E9E9;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-bar-fill {
  background: #049EC5;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-bar-tip {
  background: #131313;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-bar-tip::after {
  border-top-color: #131313;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-chevron,
html[data-estilo="suave-emil"] .tabla-perla .tp-row:hover .tp-chevron {
  color: #BBBBBB;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-row.open .tp-chevron {
  color: #037693;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-badge {
  background: var(--se-tinte2);
  color: #037693;
}

html[data-estilo="suave-emil"] .tabla-perla .tp-footer-note::before {
  background: #3FBF53;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .tabla-perla .tp-row:hover {
    border-color: var(--se-borde);
  }

  html[data-estilo="suave-emil"] .tabla-perla .tp-tab:hover {
    background: rgba(255, 255, 255, .7);
  }
}

/* ---------------------------------------------------------------------
 * 8. Preguntas frecuentes: filas planas con línea fina; abierta = tinte.
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .question {
  border-top: 0;
  border-bottom: 1px solid var(--se-linea);
  border-radius: 10px;
  color: #131313;
}

html[data-estilo="suave-emil"] .question::before,
html[data-estilo="suave-emil"] .question .question-icon {
  color: #049EC5;
}

html[data-estilo="suave-emil"] .question::after {
  color: #BBBBBB;
  transition: transform 200ms var(--se-out);
}

html[data-estilo="suave-emil"] .question.open {
  border-bottom-color: transparent;
  border-radius: 10px 10px 0 0;
  background: var(--se-tinte);
  color: #037693;
}

html[data-estilo="suave-emil"] .question.open::after {
  color: #037693;
}

html[data-estilo="suave-emil"] .question.open + .response {
  margin-top: -8px;
  border-radius: 0 0 10px 10px;
  background: var(--se-tinte);
  color: #333;
}

html[data-estilo="suave-emil"] .faq-container h2 {
  color: #131313;
}

/* ---------------------------------------------------------------------
 * 9. Índice (sycsl_toc): los colores vienen de las variables.
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .toc,
html[data-estilo="suave-emil"] .toc-hoja,
html[data-estilo="suave-emil"] .toc-burbuja {
  --toc-acento: #037693;
  --toc-texto: #131313;
  --toc-borde: #E9E9E9;
  --toc-suave: rgba(4, 158, 197, .06);
}

html[data-estilo="suave-emil"] .toc {
  border-radius: var(--se-radio);
  background: #fff;
  box-shadow: var(--se-sombra);
}

html[data-estilo="suave-emil"] .toc__cabecera {
  border-radius: var(--se-radio);
}

html[data-estilo="suave-emil"] .toc__title::before {
  color: #049EC5;
}

html[data-estilo="suave-emil"] .toc-hoja__panel {
  border-radius: 16px;
  box-shadow: 0 12px 32px rgba(19, 19, 19, .14);
}

@media (max-width: 767.98px) {
  html[data-estilo="suave-emil"] .toc-burbuja:not([hidden]) {
    border: 1px solid var(--se-borde);
    background: #fff;
    box-shadow: 0 4px 14px rgba(19, 19, 19, .1);
    color: #037693;
    transition: transform 160ms var(--se-out);
  }

  html[data-estilo="suave-emil"] .toc-burbuja:not([hidden]):active {
    transform: scale(.94);
  }
}

/* ---------------------------------------------------------------------
 * 10. Meta de confianza, autor y tooltip.
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .meta-confianza {
  color: #333;
}

html[data-estilo="suave-emil"] .meta-confianza__link {
  color: #037693;
}

html[data-estilo="suave-emil"] .meta-confianza__name {
  color: #131313;
}

html[data-estilo="suave-emil"] .meta-confianza__tiempo i {
  color: #049EC5;
}

html[data-estilo="suave-emil"] .meta-confianza__check {
  color: #3FBF53;
}

html[data-estilo="suave-emil"] .meta-confianza__item + .meta-confianza__item::before {
  background: #BBBBBB;
}

html[data-estilo="suave-emil"] .autor-tooltip {
  border-color: var(--se-linea);
  border-radius: var(--se-radio);
  box-shadow: 0 10px 28px rgba(19, 19, 19, .1);
}

html[data-estilo="suave-emil"] .autor-tooltip::before {
  border-color: var(--se-linea);
}

html[data-estilo="suave-emil"] .autor-tooltip__badge,
html[data-estilo="suave-emil"] .autor-tooltip__bio,
html[data-estilo="suave-emil"] .autor-tooltip__resenas {
  color: #333;
}

html[data-estilo="suave-emil"] .autor-tooltip__resenas i {
  color: #049EC5;
}

html[data-estilo="suave-emil"] .autor-tooltip__btn {
  border: 1.5px solid var(--se-borde);
  background: #fff;
  color: #037693;
}

html[data-estilo="suave-emil"] .autor-tooltip__btn:hover {
  background: #fff;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .autor-tooltip__btn:hover {
    background: var(--se-tinte2);
  }
}

html[data-estilo="suave-emil"] .autor-information {
  border: 1px solid var(--se-borde);
  border-radius: var(--se-radio);
  background: var(--se-tinte);
  box-shadow: none;
}

html[data-estilo="suave-emil"] .autor-label {
  color: #037693;
}

html[data-estilo="suave-emil"] .autor-name,
html[data-estilo="suave-emil"] .autor-name a {
  color: #131313;
}

html[data-estilo="suave-emil"] .autor-bio {
  color: #333;
}

html[data-estilo="suave-emil"] .autor-linkedin,
html[data-estilo="suave-emil"] .autor-linkedin i {
  color: #037693;
}

/* ---------------------------------------------------------------------
 * 11. Blog: tarjetas, artículo y paginador.
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .blog-card {
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  box-shadow: var(--se-sombra);
  transform: none;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .blog-card:hover {
  box-shadow: var(--se-sombra);
  transform: none;
}

html[data-estilo="suave-emil"] .blog-card:active {
  transform: scale(.985);
}

html[data-estilo="suave-emil"] .blog-card__title,
html[data-estilo="suave-emil"] .blog-card__title a {
  color: #131313;
}

html[data-estilo="suave-emil"] .blog-card__excerpt,
html[data-estilo="suave-emil"] .blog-card__meta,
html[data-estilo="suave-emil"] .blog-card__date,
html[data-estilo="suave-emil"] .blog-card__author {
  color: #333;
}

html[data-estilo="suave-emil"] .blog-card__date i {
  color: #049EC5;
}

html[data-estilo="suave-emil"] .blog-card__tags a {
  border: 1px solid var(--se-borde);
  border-radius: 999px;
  background: var(--se-tinte);
  color: #037693;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .blog-card:hover {
    border-color: var(--se-borde);
  }

  html[data-estilo="suave-emil"] .blog-card__title a:hover {
    color: #037693;
  }
}

/* Menú de categorías del blog: de píldoras con degradado a fichas claras. */
html[data-estilo="suave-emil"] ul.navbar-nav.me-auto > li:last-child a.nav-link,
html[data-estilo="suave-emil"] body .menu-blog a {
  border: 1px solid var(--se-borde);
  border-radius: 999px;
  background: var(--se-tinte);
  color: #037693 !important;
  font-weight: 600;
}

html[data-estilo="suave-emil"] .blog-article__meta,
html[data-estilo="suave-emil"] .blog-article__date {
  color: #333;
}

html[data-estilo="suave-emil"] .pager .pager__item a,
html[data-estilo="suave-emil"] .pager__item a {
  border: 1px solid var(--se-linea);
  border-radius: 10px;
  background: #fff;
  color: #037693;
}

html[data-estilo="suave-emil"] .pager__item.is-active a,
html[data-estilo="suave-emil"] .pager__item--current {
  border-color: #037693;
  background: #037693;
  color: #fff;
}

/* Compartir en redes: del degradado a una franja con tinte. */
html[data-estilo="suave-emil"] body .social-share {
  border: 1px solid var(--se-borde);
  border-radius: var(--se-radio);
  background: var(--se-tinte);
}

/* ---------------------------------------------------------------------
 * 12. Bonos (cajas del blog y de la reseña) y cabecera de bono.
 *     Fondo navy -> blanco con borde fino; la imagen se queda tal cual.
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .bono-boxes .bono-card {
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  background: #fff;
  box-shadow: var(--se-sombra);
  color: #131313;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card:hover {
  box-shadow: var(--se-sombra);
  transform: none;
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card:active {
  transform: scale(.985);
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__visual {
  background: var(--se-tinte2);
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__h2 {
  border-bottom: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #131313;
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__h2 i {
  color: #049EC5;
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__amount,
html[data-estilo="suave-emil"] .bonos-boxes-resena .bono-card__amount {
  color: #131313;
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__desc,
html[data-estilo="suave-emil"] .bonos-boxes-resena .bono-card__desc,
html[data-estilo="suave-emil"] .bonos-boxes-resena h3.bono-card__desc {
  color: #333;
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__code {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #131313;
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__code i {
  color: #037693;
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__cta {
  border: 1px solid #3FBF53;
  border-radius: 10px;
  background: #3FBF53;
  color: #fff;
  opacity: 1;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__cta:hover {
  border-color: #3FBF53;
  background: #3FBF53;
  color: #fff;
  opacity: 1;
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__details,
html[data-estilo="suave-emil"] .bono-boxes .bono-card__howto-toggle {
  color: #037693 !important;
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__howto-toggle i {
  transition: transform 200ms var(--se-out);
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__howto {
  background: var(--se-tinte);
  color: #333;
}

html[data-estilo="suave-emil"] .bono-boxes .bono-card__howto-title {
  color: #131313;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .bono-boxes .bono-card:hover {
    border-color: var(--se-borde);
  }

  html[data-estilo="suave-emil"] .bono-boxes .bono-card:hover .bono-card__cta,
  html[data-estilo="suave-emil"] .bono-boxes .bono-card__cta:hover {
    border-color: #36a948;
    background: #36a948;
  }
}

/* Cabecera del bono (node--bonus). */
html[data-estilo="suave-emil"] .bono-detalle-hero {
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  background: #fff;
  box-shadow: var(--se-sombra);
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .bono-detalle-hero:active {
  transform: scale(.99);
}

html[data-estilo="suave-emil"] .bono-detalle-hero .bono-detalle-hero__visual {
  background: var(--se-tinte2);
}

html[data-estilo="suave-emil"] .bono-detalle-hero .bono-detalle-hero__info {
  border-top: 1px solid var(--se-borde);
  background: var(--se-tinte);
}

html[data-estilo="suave-emil"] .bono-detalle-hero .bono-detalle-hero__title {
  color: #131313;
  font-weight: 600;
}

html[data-estilo="suave-emil"] .bono-detalle-hero .bono-detalle-hero__legal {
  color: #333;
}

html[data-estilo="suave-emil"] .bono-detalle-hero .bono-detalle-hero__amount {
  border: 1px solid var(--se-borde);
  border-radius: 10px;
  background: #fff;
}

html[data-estilo="suave-emil"] .bono-detalle-hero .bono-detalle-hero__price {
  color: #131313;
}

html[data-estilo="suave-emil"] .bono-detalle-hero .bono-detalle-hero__type {
  color: #037693;
}

html[data-estilo="suave-emil"] .bono-detalle-hero .bono-detalle-hero__cta,
html[data-estilo="suave-emil"] .bono-detalle-hero .bono-detalle-hero__cta:hover {
  border: 1px solid #3FBF53;
  border-radius: 10px;
  background: #3FBF53;
  color: #fff;
  transition: transform 160ms var(--se-out);
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .bono-detalle-hero:hover .bono-detalle-hero__cta {
    border-color: #36a948;
    background: #36a948;
  }
}

html[data-estilo="suave-emil"] body.node--type-bonus .titulo-pagina h1 {
  color: #131313;
}

/* ---------------------------------------------------------------------
 * 13. Reseña de casa (node--casa-de-apuestas).
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .logo-puntuacion .bookie {
  border: 1px solid var(--se-linea) !important;
  background: #fff;
  box-shadow: var(--se-sombra);
}

html[data-estilo="suave-emil"] .logo-puntuacion .valoraciones .rating,
html[data-estilo="suave-emil"] .logo-puntuacion .valoraciones .rating .type {
  color: #333;
}

html[data-estilo="suave-emil"] .logo-puntuacion .valoraciones .rating span {
  color: #131313;
}

html[data-estilo="suave-emil"] body.layout-one-sidebar.node--type-casa-de-apuestas .logo-puntuacion .valoraciones .link-aff a.btn.btn-success.btn-lg,
html[data-estilo="suave-emil"] body.layout-one-sidebar.node--type-casa-de-apuestas .logo-puntuacion .valoraciones .link-aff div.btn.btn-success.btn-lg {
  border-color: #3FBF53;
}

/* Reseña en página de bono: caja clara en lugar del resplandor azul. */
html[data-estilo="suave-emil"] body.node--type-bonus .logo-puntuacion {
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  background: #fff;
  box-shadow: var(--se-sombra);
}

html[data-estilo="suave-emil"] body.node--type-bonus .logo-puntuacion .bookie {
  border: 0 !important;
  border-radius: 0;
  background: var(--se-tinte);
  box-shadow: none;
}

html[data-estilo="suave-emil"] body.node--type-bonus .bookie-fixed {
  border: 1px solid var(--se-linea);
  background: #fff;
}

/* Bloque «Seguridad, licencias…» (azul con fondo dibujado): tinte claro. */
html[data-estilo="suave-emil"] .bg-black-webapuestas,
html[data-estilo="suave-emil"] .bg-blue-webapuestas {
  border: 1px solid var(--se-borde);
  border-radius: var(--se-radio) !important;
  background: var(--se-tinte) !important;
  color: #131313;
}

html[data-estilo="suave-emil"] .bg-black-webapuestas h2,
html[data-estilo="suave-emil"] .bg-black-webapuestas h3,
html[data-estilo="suave-emil"] .bg-black-webapuestas p,
html[data-estilo="suave-emil"] .bg-blue-webapuestas h2,
html[data-estilo="suave-emil"] .bg-blue-webapuestas p {
  color: #131313 !important;
}

html[data-estilo="suave-emil"] .bg-black-webapuestas p,
html[data-estilo="suave-emil"] .bg-blue-webapuestas p {
  color: #333 !important;
}

html[data-estilo="suave-emil"] .bg-black-webapuestas a,
html[data-estilo="suave-emil"] .bg-blue-webapuestas a {
  color: #037693 !important;
}

/* Pros y contras. */
html[data-estilo="suave-emil"] .wa-puntos-box {
  height: 100%;
  padding: 16px 18px 10px;
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-puntos-box__label {
  border: 1px solid var(--se-borde);
  border-radius: 999px;
  background: var(--se-tinte);
  color: #037693;
  font-size: 14px;
  font-weight: 600;
}

html[data-estilo="suave-emil"] .wa-puntos-pro ul li,
html[data-estilo="suave-emil"] .wa-puntos-con ul li {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-puntos-pro ul li::before {
  color: #3FBF53;
}

html[data-estilo="suave-emil"] .wa-puntos-con ul li::before {
  color: #BBBBBB;
}

/* Testimonios (opinión de la casa sobre webapuestas): sin degradado. */
html[data-estilo="suave-emil"] .testimonial-card {
  border: 1px solid var(--se-borde);
  border-radius: var(--se-radio);
  background: var(--se-tinte);
  box-shadow: none;
  color: #131313;
}

html[data-estilo="suave-emil"] .testimonial-card__source {
  color: #131313;
}

html[data-estilo="suave-emil"] .testimonial-card__text,
html[data-estilo="suave-emil"] .testimonial-card__text p {
  color: #333;
}

html[data-estilo="suave-emil"] .testimonial-card__logo {
  border: 1px solid var(--se-linea);
  background: #fff;
}

/* CTA fijo móvil de la reseña (gumgum): sin destello infinito. */
html[data-estilo="suave-emil"] .destello {
  animation: none;
  box-shadow: 0 -2px 12px rgba(19, 19, 19, .08);
}

@media (max-width: 768px) {
  html[data-estilo="suave-emil"] .gumgum {
    border: 0 !important;
    border-top: 1px solid var(--se-linea) !important;
    background: #fff;
    box-shadow: 0 -2px 12px rgba(19, 19, 19, .08);
  }
}

/* Ranking antiguo (portada, «bookmaker-card»). */
html[data-estilo="suave-emil"] .bookmaker-card {
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  background: #fff;
  box-shadow: var(--se-sombra);
  transition: none;
}

html[data-estilo="suave-emil"] .bookmaker-card:hover {
  transform: none;
}

html[data-estilo="suave-emil"] .bookmaker-card .bookmaker-logo {
  border: 1px solid var(--se-linea);
  background: #fff;
}

html[data-estilo="suave-emil"] .ranking-number {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #037693;
  font-weight: 600;
}

html[data-estilo="suave-emil"] body main .bonus-info,
html[data-estilo="suave-emil"] body .casa-apuestas__header .bonus-info,
html[data-estilo="suave-emil"] body .sidebar .bonus-info {
  border: 1px solid var(--se-borde) !important;
  border-radius: 10px;
  background: var(--se-tinte);
  box-shadow: none;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .bonus-amount {
  color: #131313;
}

html[data-estilo="suave-emil"] .bonus-type,
html[data-estilo="suave-emil"] body .sidebar .bonus-type {
  color: #037693;
}

html[data-estilo="suave-emil"] body .sidebar .bonus-info:hover {
  background: var(--se-tinte);
}

html[data-estilo="suave-emil"] body .sidebar .bonus-info:hover .bonus-amount {
  color: #131313;
}

html[data-estilo="suave-emil"] body .sidebar .bonus-info:hover span.bonus-type {
  color: #037693;
}

html[data-estilo="suave-emil"] body main .bonus-info:active {
  transform: scale(.97);
}

html[data-estilo="suave-emil"] body .casa-apuestas__header .bookmaker-logo,
html[data-estilo="suave-emil"] body .casa-apuestas__header .field--name-field-descripcion-breve {
  border: 1px solid var(--se-linea) !important;
  border-radius: var(--se-radio);
  box-shadow: none;
}

html[data-estilo="suave-emil"] .exclusivo {
  border-radius: 6px;
  background: #131313;
  box-shadow: none;
  color: #fff;
}

html[data-estilo="suave-emil"] .spoiler-nuevo,
html[data-estilo="suave-emil"] .spoiler-exclusivo,
html[data-estilo="suave-emil"] .spoiler-hot {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #037693;
}

/* ---------------------------------------------------------------------
 * 14. Lateral (Top 10, anclas).
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .sidebar-title {
  color: #131313;
}

html[data-estilo="suave-emil"] .logo-casa-de-apuestas {
  border: 1px solid var(--se-linea);
  border-radius: 10px !important;
  background: #fff;
  box-shadow: none !important;
}

html[data-estilo="suave-emil"] .logo-casa-de-apuestas:hover {
  background: #fff;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .logo-casa-de-apuestas:hover,
  html[data-estilo="suave-emil"] body .sidebar .bonus-info:hover {
    border-color: #049EC5 !important;
  }
}

html[data-estilo="suave-emil"] body .menu-anclas-lateral {
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
}

html[data-estilo="suave-emil"] .casa-apuestas__leyenda,
html[data-estilo="suave-emil"] .leyenda-item {
  color: #333;
}

/* ---------------------------------------------------------------------
 * 15. Pronósticos y partidos (módulo webapuestas_beticious_sync).
 *     Cabeceras con degradado -> tinte claro, textos oscuros.
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .wbs-partido__h1 {
  color: #131313;
  font-weight: 700;
}

html[data-estilo="suave-emil"] .wbs-partido__header,
html[data-estilo="suave-emil"] .wbs-pronostico-big .pronos-header,
html[data-estilo="suave-emil"] .wbs-listing-card__header,
html[data-estilo="suave-emil"] .wbs-prono-card__teams {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte);
  box-shadow: none;
  color: #131313;
}

html[data-estilo="suave-emil"] .wbs-partido__header,
html[data-estilo="suave-emil"] .wbs-pronostico-big .pronos-header {
  border-radius: var(--se-radio);
}

html[data-estilo="suave-emil"] .wbs-listing-card__header,
html[data-estilo="suave-emil"] .wbs-prono-card__teams {
  border-width: 0 0 1px;
}

html[data-estilo="suave-emil"] .wbs-partido .chip,
html[data-estilo="suave-emil"] .wbs-pronostico-big .chip,
html[data-estilo="suave-emil"] .wbs-partido .chip:hover,
html[data-estilo="suave-emil"] .wbs-pronostico-big .chip:hover {
  border: 1px solid var(--se-borde);
  background: #fff;
  color: #037693;
}

html[data-estilo="suave-emil"] .wbs-partido .chip-live::before,
html[data-estilo="suave-emil"] .wbs-pronostico-big .chip-live::before {
  background: #3FBF53;
  box-shadow: 0 0 0 3px rgba(63, 191, 83, .25);
}

html[data-estilo="suave-emil"] .wbs-partido .team,
html[data-estilo="suave-emil"] .wbs-pronostico-big .team,
html[data-estilo="suave-emil"] .wbs-partido .team:hover,
html[data-estilo="suave-emil"] .wbs-pronostico-big .team:hover,
html[data-estilo="suave-emil"] .wbs-listing-card__top,
html[data-estilo="suave-emil"] .wbs-listing-card__top:hover,
html[data-estilo="suave-emil"] .wbs-prono-card__name {
  color: #131313;
}

html[data-estilo="suave-emil"] .wbs-partido .team-logo,
html[data-estilo="suave-emil"] .wbs-pronostico-big .team-logo,
html[data-estilo="suave-emil"] .wbs-listing-card__logo,
html[data-estilo="suave-emil"] .wbs-prono-card__logo {
  background: #fff;
  box-shadow: 0 0 0 1px var(--se-borde);
}

html[data-estilo="suave-emil"] .wbs-listing-card__time strong {
  background: #fff;
  color: #037693;
}

html[data-estilo="suave-emil"] .wbs-listing-card__vs {
  background: #fff;
  box-shadow: 0 0 0 1px var(--se-borde);
  color: #037693;
}

html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2 {
  border: 1px solid var(--se-linea);
  background: #fff;
  box-shadow: none;
}

html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__pill {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #131313;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__pill:hover {
  border-color: var(--se-borde);
  background: var(--se-tinte);
  box-shadow: none;
  color: #131313;
  transform: none;
}

html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__pill:active {
  transform: scale(.97);
}

html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__tag {
  background: #037693;
  color: #fff;
}

html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__casa {
  border: 1px solid var(--se-linea);
  box-shadow: none;
}

html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__pill.is-empty {
  background: #fff;
}

html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__legal {
  color: #333;
}

html[data-estilo="suave-emil"] .wbs-partido__body h2,
html[data-estilo="suave-emil"] .wbs-pronostico-big .pronos-body h2 {
  color: #131313;
  font-weight: 700;
}

html[data-estilo="suave-emil"] .wbs-partido .pronos {
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  background: #fff;
  box-shadow: var(--se-sombra);
  transition: none;
}

html[data-estilo="suave-emil"] .wbs-partido .pronos:hover {
  box-shadow: var(--se-sombra);
  transform: none;
}

html[data-estilo="suave-emil"] .wbs-partido .field_pronostico {
  color: #131313;
}

html[data-estilo="suave-emil"] .wbs-partido .field_razonamiento,
html[data-estilo="suave-emil"] .wbs-partido .field_base_razonamiento,
html[data-estilo="suave-emil"] .wbs-pronostico-big .field_razonamiento,
html[data-estilo="suave-emil"] .wbs-pronostico-big .field_base_razonamiento {
  color: #333;
}

html[data-estilo="suave-emil"] .wbs-partido .cuota-btn,
html[data-estilo="suave-emil"] .wbs-pronostico-big .cuota-btn {
  border: 1.5px solid var(--se-borde);
  background: var(--se-tinte);
  box-shadow: none;
  color: #131313;
}

html[data-estilo="suave-emil"] .wbs-partido .item-pronostico:hover .cuota-btn,
html[data-estilo="suave-emil"] .wbs-pronostico-big .item-pronostico:hover .cuota-btn {
  box-shadow: none;
}

/* CTA de afiliado del pronóstico: el verde de la web con texto blanco. */
html[data-estilo="suave-emil"] .wbs-partido .btn-visitar,
html[data-estilo="suave-emil"] .wbs-pronostico-big .btn-visitar,
html[data-estilo="suave-emil"] .wbs-partido .cta-button,
html[data-estilo="suave-emil"] .wbs-pronostico-big .cta-button,
html[data-estilo="suave-emil"] .wbs-listing-card__cta,
html[data-estilo="suave-emil"] .wbs-prono-card__cta,
html[data-estilo="suave-emil"] .wbs-partido .btn-visitar:hover,
html[data-estilo="suave-emil"] .wbs-listing-card__cta:hover,
html[data-estilo="suave-emil"] :is(.wbs-listing-card__bottom[data-lk], .wbs-listing-card__cta-section[data-lk]):hover .wbs-listing-card__cta,
html[data-estilo="suave-emil"] .wbs-prono-card__footer[data-lk]:hover .wbs-prono-card__cta {
  border: 1px solid #3FBF53;
  background-color: #3FBF53;
  box-shadow: none;
  color: #fff;
  transform: none;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .wbs-listing-card__cta-play,
html[data-estilo="suave-emil"] .btn-visitar__play,
html[data-estilo="suave-emil"] .wbs-prono-card__play {
  background: rgba(255, 255, 255, .25);
  animation: none;
}

html[data-estilo="suave-emil"] .wbs-listing-card:hover .wbs-listing-card__cta-play {
  animation: none;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .wbs-partido .item-pronostico[data-lk]:hover .btn-visitar,
  html[data-estilo="suave-emil"] .wbs-partido .btn-visitar:hover,
  html[data-estilo="suave-emil"] :is(.wbs-listing-card__bottom[data-lk], .wbs-listing-card__cta-section[data-lk]):hover .wbs-listing-card__cta,
  html[data-estilo="suave-emil"] .wbs-listing-card__cta:hover,
  html[data-estilo="suave-emil"] .wbs-prono-card__footer[data-lk]:hover .wbs-prono-card__cta {
    border-color: #36a948;
    background-color: #36a948;
  }

  html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__pill:hover {
    border-color: #049EC5;
  }
}

html[data-estilo="suave-emil"] .wbs-partido .btn-visitar:active,
html[data-estilo="suave-emil"] .wbs-listing-card__cta:active,
html[data-estilo="suave-emil"] .wbs-prono-card__cta:active {
  transform: scale(.97);
}

html[data-estilo="suave-emil"] .wbs-listing-card,
html[data-estilo="suave-emil"] .wbs-prono-card {
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  box-shadow: var(--se-sombra);
}

html[data-estilo="suave-emil"] .wbs-prono-card:hover {
  border-color: var(--se-borde);
  box-shadow: var(--se-sombra);
  transform: none;
}

html[data-estilo="suave-emil"] .partido-clasificacion,
html[data-estilo="suave-emil"] .partido-alineacion,
html[data-estilo="suave-emil"] .partido-h2h {
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
}

html[data-estilo="suave-emil"] .partido-clasificacion h2,
html[data-estilo="suave-emil"] .partido-alineacion h2 {
  border-bottom: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #131313;
}

html[data-estilo="suave-emil"] .partido-clasificacion__source {
  color: #333;
}

html[data-estilo="suave-emil"] .wbs-filter-tab.is-active {
  background: #037693;
  color: #fff;
}

/* ---------------------------------------------------------------------
 * 16. Banner [destacado] (enlace interno, no afiliado: sin verde).
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .wa-dest {
  --eq-ink: #131313;
  --eq-muted: #333;
  --eq-line: #E9E9E9;
  --eq-brand: #049EC5;
  --eq-brand-ink: #037693;
}

html[data-estilo="suave-emil"] .wa-dest a.wa-dest__link {
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  background: #fff;
  box-shadow: var(--se-sombra);
  color: #131313;
  transition: none;
}

html[data-estilo="suave-emil"] .wa-dest .wa-dest__media {
  border: 1px solid var(--se-borde);
  border-radius: 10px;
  background: var(--se-tinte);
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-dest .wa-dest__etiqueta {
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-dest .wa-dest__titulo {
  font-family: Poppins, sans-serif;
  font-weight: 600;
}

html[data-estilo="suave-emil"] .wa-dest .wa-dest__texto {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-dest .wa-dest__boton {
  border: 1.5px solid var(--se-borde);
  border-radius: 10px;
  background: #fff;
  color: #037693;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .wa-dest .wa-dest__boton svg {
  transition: transform 160ms var(--se-out);
}

/* Marca: el bloque entero con el tinte azul y botón azul oscuro. */
html[data-estilo="suave-emil"] .wa-dest--marca a.wa-dest__link {
  border-color: var(--se-borde);
  background: var(--se-tinte);
  box-shadow: none;
}

html[data-estilo="suave-emil"] .wa-dest--marca .wa-dest__media {
  border-color: #049EC5;
  background: #049EC5;
  color: #fff;
}

html[data-estilo="suave-emil"] .wa-dest--marca .wa-dest__boton {
  border-color: #037693;
  background: #037693;
  color: #fff;
}

/* Oscuro: sin navy, el negro de la web y el acento cian. */
html[data-estilo="suave-emil"] .wa-dest--oscuro a.wa-dest__link {
  border-color: #131313;
  background: #131313;
  box-shadow: none;
  color: #fff;
}

html[data-estilo="suave-emil"] .wa-dest--oscuro .wa-dest__media {
  border-color: rgba(255, 255, 255, .16);
  background: rgba(255, 255, 255, .08);
  color: #04C4F6;
}

html[data-estilo="suave-emil"] .wa-dest--oscuro .wa-dest__etiqueta {
  color: #04C4F6;
}

html[data-estilo="suave-emil"] .wa-dest--oscuro .wa-dest__texto {
  color: #E9E9E9;
}

html[data-estilo="suave-emil"] .wa-dest--oscuro .wa-dest__boton {
  border-color: #04C4F6;
  background: #04C4F6;
  color: #131313;
}

/* Línea: blanco, sin sombra, solo el borde. */
html[data-estilo="suave-emil"] .wa-dest--linea a.wa-dest__link {
  box-shadow: none;
}

html[data-estilo="suave-emil"] .wa-dest--linea .wa-dest__media {
  border-color: var(--se-linea);
  background: #fff;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .wa-dest a.wa-dest__link:hover {
    border-color: var(--se-borde);
    background: #fff;
  }

  html[data-estilo="suave-emil"] .wa-dest--marca a.wa-dest__link:hover {
    border-color: #049EC5;
    background: var(--se-tinte2);
  }

  html[data-estilo="suave-emil"] .wa-dest--oscuro a.wa-dest__link:hover {
    border-color: #333;
    background: #131313;
  }

  html[data-estilo="suave-emil"] .wa-dest--linea a.wa-dest__link:hover {
    border-color: #049EC5;
  }

  html[data-estilo="suave-emil"] .wa-dest__link:hover .wa-dest__boton svg {
    transform: translateX(3px);
    transition-duration: 220ms;
  }
}

html[data-estilo="suave-emil"] .wa-dest a.wa-dest__link:focus-visible {
  outline: 2px solid #037693;
  outline-offset: 2px;
}

html[data-estilo="suave-emil"] .wa-dest__link:active .wa-dest__boton {
  transform: scale(.97);
}

/* ---------------------------------------------------------------------
 * 17. Pie. El bloque de texto (sub-footer) pasa a tinte claro; el pie se
 *     queda en el negro de la web porque los sellos (Autoprohibición,
 *     Juega con responsabilidad) son blancos y no se leerían en claro.
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] .site-footer__sub-footer {
  border-top: 1px solid var(--se-borde);
  background: var(--se-tinte);
}

html[data-estilo="suave-emil"] .site-footer__sub-footer h2,
html[data-estilo="suave-emil"] .site-footer__sub-footer h3,
html[data-estilo="suave-emil"] .site-footer__sub-footer .h2 {
  color: #131313 !important;
}

html[data-estilo="suave-emil"] .site-footer__sub-footer p,
html[data-estilo="suave-emil"] .site-footer__sub-footer li {
  color: #333 !important;
}

html[data-estilo="suave-emil"] .site-footer__sub-footer a {
  color: #037693 !important;
}

html[data-estilo="suave-emil"] footer.site-footer {
  background: #131313;
}

html[data-estilo="suave-emil"] footer.site-footer div.h2,
html[data-estilo="suave-emil"] footer.site-footer .h2,
html[data-estilo="suave-emil"] footer.site-footer h2 {
  color: #fff !important;
  font-family: Poppins, sans-serif;
}

html[data-estilo="suave-emil"] footer.site-footer a,
html[data-estilo="suave-emil"] footer.site-footer .nav-link {
  color: #E9E9E9 !important;
}

html[data-estilo="suave-emil"] footer.site-footer p,
html[data-estilo="suave-emil"] footer.site-footer li {
  color: #BBBBBB;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] footer.site-footer a:hover,
  html[data-estilo="suave-emil"] footer.site-footer .nav-link:hover {
    color: #04C4F6 !important;
  }
}

html[data-estilo="suave-emil"] footer.site-footer a:focus-visible {
  outline-color: #04C4F6;
}

html[data-estilo="suave-emil"] .site-footer__top,
html[data-estilo="suave-emil"] .site-footer__bottom {
  border-color: rgba(255, 255, 255, .1) !important;
}

/* ---------------------------------------------------------------------
 * 18. Formularios y encuestas.
 * ------------------------------------------------------------------- */
html[data-estilo="suave-emil"] main input[type="text"],
html[data-estilo="suave-emil"] main input[type="email"],
html[data-estilo="suave-emil"] main input[type="search"],
html[data-estilo="suave-emil"] main input[type="number"],
html[data-estilo="suave-emil"] main select,
html[data-estilo="suave-emil"] main textarea,
html[data-estilo="suave-emil"] main .form-control,
html[data-estilo="suave-emil"] main .form-select {
  border: 1px solid #BBBBBB;
  border-radius: 10px;
  background-color: #fff;
  color: #131313;
}

html[data-estilo="suave-emil"] main input:focus-visible,
html[data-estilo="suave-emil"] main select:focus-visible,
html[data-estilo="suave-emil"] main textarea:focus-visible,
html[data-estilo="suave-emil"] main .form-control:focus,
html[data-estilo="suave-emil"] main .form-select:focus {
  border-color: #037693;
  box-shadow: 0 0 0 3px rgba(4, 158, 197, .18);
  outline: 0;
}

html[data-estilo="suave-emil"] main input[type="checkbox"],
html[data-estilo="suave-emil"] main input[type="radio"] {
  accent-color: #037693;
}

html[data-estilo="suave-emil"] .sycsl-encuesta {
  border: 1px solid var(--se-linea);
  border-radius: var(--se-radio);
  background: #fff;
  box-shadow: var(--se-sombra);
}

/* ---------------------------------------------------------------------
 * 19. Movimiento reducido: sin escalas ni desplazamientos; los cambios
 *     de color siguen siendo instantáneos.
 * ------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  html[data-estilo="suave-emil"] .offcanvas.wa-nav,
  html[data-estilo="suave-emil"] .wa-nav__panel {
    transition-duration: 1ms !important;
  }

  html[data-estilo="suave-emil"] .btn:active,
  html[data-estilo="suave-emil"] body .btn-success:active,
  html[data-estilo="suave-emil"] body .cta-button:active,
  html[data-estilo="suave-emil"] body .cta-boton:active,
  html[data-estilo="suave-emil"] .blog-card:active,
  html[data-estilo="suave-emil"] .bono-boxes .bono-card:active,
  html[data-estilo="suave-emil"] .bono-detalle-hero:active,
  html[data-estilo="suave-emil"] body main .bonus-info:active,
  html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__pill:active,
  html[data-estilo="suave-emil"] .wbs-partido .btn-visitar:active,
  html[data-estilo="suave-emil"] .wbs-listing-card__cta:active,
  html[data-estilo="suave-emil"] .wa-dest__link:active .wa-dest__boton,
  html[data-estilo="suave-emil"] .wa-nav-toggle:active,
  html[data-estilo="suave-emil"] .wa-nav__close:active,
  html[data-estilo="suave-emil"] .wa-nav__reco:active,
  html[data-estilo="suave-emil"] .wa-bottombar__item:active i,
  html[data-estilo="suave-emil"] .toc-burbuja:active {
    transform: none !important;
  }

  html[data-estilo="suave-emil"] .wa-nav__item:hover .wa-nav__chevron,
  html[data-estilo="suave-emil"] .wa-dest__link:hover .wa-dest__boton svg {
    transform: none !important;
  }
}

/* =====================================================================
 * 20. ESTRUCTURAS NUEVAS de reseña (?estructura=a…e) y de bono (a…d)
 *     (19-oct-2026, segunda pasada). Base: css/estructuras-resena.css y
 *     css/estructuras-bono.css; aquí solo la piel «suave-emil»: blanco o
 *     tinte azul, bordes finos, sin franjas gruesas, sin bloques negros ni
 *     degradados; el verde queda solo para el CTA de afiliado.
 *     Ojo: .wa-est__nota, __check, __pros y __bono significan cosas
 *     distintas en reseña y en bono; por eso se separan con
 *     .wa-est--resena / .wa-est--bono.
 * ===================================================================== */

/* ---------- 20.1 Común ---------- */
html[data-estilo="suave-emil"] .wa-est {
  --wa-verde-osc: #36a948;
  --wa-fondo: rgba(4, 158, 197, .06);
  --wa-fondo-suave: rgba(4, 158, 197, .06);
  --wa-rojo: #333;
  --wa-gris: #BBBBBB;
  --wa-sombra: 0 2px 10px rgba(19, 19, 19, .05);
  --wa-radio: 12px;
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est a:focus-visible,
html[data-estilo="suave-emil"] .wa-est [tabindex]:focus-visible,
html[data-estilo="suave-emil"] .wa-est summary:focus-visible,
html[data-estilo="suave-emil"] .wa-est button:focus-visible,
html[data-estilo="suave-emil"] .wa-est input:focus-visible,
html[data-estilo="suave-emil"] .wa-est .wa-est__cta:focus-visible {
  outline: 2px solid #037693;
  outline-offset: 2px;
}

html[data-estilo="suave-emil"] .wa-est a {
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-est__actualizado,
html[data-estilo="suave-emil"] .wa-est__legal,
html[data-estilo="suave-emil"] .wa-est__aviso,
html[data-estilo="suave-emil"] .wa-est__fuente,
html[data-estilo="suave-emil"] .wa-est__capturas-fecha,
html[data-estilo="suave-emil"] .wa-est__metodo-intro {
  color: #333;
}

/* CTA de afiliado: verde plano, texto blanco en negrita, sin sombra. */
html[data-estilo="suave-emil"] .wa-est .wa-est__cta {
  border: 1px solid #3FBF53;
  border-radius: 10px;
  background: #3FBF53;
  box-shadow: none;
  color: #fff;
  font-weight: 700;
  transition: transform 160ms var(--se-out);
}

/* Secundario (p. ej. «Visitar Betway»): contorno verde, texto negro. */
html[data-estilo="suave-emil"] .wa-est .wa-est__cta--sec {
  border: 1.5px solid #3FBF53;
  background: #fff;
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__cta:active {
  transform: scale(.97);
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .wa-est .wa-est__cta:hover {
    border-color: #36a948;
    background: #36a948;
  }

  html[data-estilo="suave-emil"] .wa-est .wa-est__cta--sec:hover {
    border-color: #3FBF53;
    background: rgba(63, 191, 83, .08);
  }
}

/* Cabecera: tarjeta blanca, borde fino, sombra casi nula. */
html[data-estilo="suave-emil"] .wa-est .wa-est__hero {
  border: 1px solid #E9E9E9;
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--se-sombra);
}

html[data-estilo="suave-emil"] .wa-est .wa-est__hero--plano {
  border: 0;
  background: none;
  box-shadow: none;
}

/* Logo de la casa sobre blanco (en negro, logos oscuros como Betway no se veían). */
html[data-estilo="suave-emil"] .wa-est--resena .wa-est__hero-logo,
html[data-estilo="suave-emil"] .wa-est__otra-logo {
  border: 1px solid #E9E9E9;
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-est__sellos {
  border-top-color: #E9E9E9;
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est__sello {
  border-color: var(--se-borde);
  background: var(--se-tinte);
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-est__sello--ok {
  border-color: rgba(63, 191, 83, .35);
  background: rgba(63, 191, 83, .08);
  color: #131313;
}

/* Respuesta primero: tinte con un trazo azul fino a la izquierda. */
html[data-estilo="suave-emil"] .wa-est .wa-est__resumen {
  border: 1px solid var(--se-borde);
  border-left: 3px solid #049EC5;
  border-radius: 12px;
  background: var(--se-tinte);
}

html[data-estilo="suave-emil"] .wa-est__resumen .wa-est__h2 {
  color: #037693;
}

/* Ficha de datos. */
html[data-estilo="suave-emil"] .wa-est .wa-est__dato {
  border: 1px solid #E9E9E9;
  border-radius: 10px;
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__dato dt {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__dato dd {
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__dato--licencia dd {
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__dato--destacado {
  border-color: var(--se-borde);
  background: var(--se-tinte);
}

html[data-estilo="suave-emil"] .wa-est .wa-est__dato--destacado dd {
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__codigo {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-est__pagos-mini img,
html[data-estilo="suave-emil"] .wa-est__pagos-logos li,
html[data-estilo="suave-emil"] .wa-est__captura img {
  border-color: #E9E9E9;
}

/* Barras: azul liso (sin degradado azul→verde). */
html[data-estilo="suave-emil"] .wa-est__barra {
  background: #E9E9E9;
}

html[data-estilo="suave-emil"] .wa-est__barra > span {
  background: #049EC5;
}

/* Tabla comparativa y tablas propias. */
html[data-estilo="suave-emil"] .wa-est__tabla-scroll {
  border-color: #E9E9E9;
  border-radius: 12px;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__tabla th,
html[data-estilo="suave-emil"] .wa-est .wa-est__tabla td {
  border-bottom-color: #E9E9E9;
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__tabla tbody th {
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__tabla--compara thead th {
  background: var(--se-tinte);
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__tabla--compara thead th.is-esta {
  background: #037693;
  color: #fff;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__tabla--compara td.is-esta {
  background: var(--se-tinte2);
  color: #131313;
}

/* Autor, firmas y otras casas. */
html[data-estilo="suave-emil"] .wa-est .wa-est__autor,
html[data-estilo="suave-emil"] .wa-est__firma,
html[data-estilo="suave-emil"] .wa-est__otra,
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__otros {
  border: 1px solid #E9E9E9;
  border-radius: 12px;
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-est__autor-verif {
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-est__firma-ini {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-est__firma-rol,
html[data-estilo="suave-emil"] .wa-est__firma-grande .wa-est__firma-bio {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est__otra-bono {
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est__otra-nota strong {
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__otro {
  border-bottom-color: #E9E9E9;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__otro-importe {
  color: #131313;
}

/* Texto editorial dentro de la estructura. */
html[data-estilo="suave-emil"] .wa-est .wa-est__texto table {
  border-color: #E9E9E9;
  border-radius: 12px;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__texto table thead th,
html[data-estilo="suave-emil"] .wa-est .wa-est__texto table tr:first-child th {
  border-bottom: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__texto table tbody tr:nth-child(even) {
  background: rgba(4, 158, 197, .03);
}

/* Las tablas propias de las estructuras mantienen su colapso de bordes
 * (la regla general de este estilo usa «separate» para redondear). */
html[data-estilo="suave-emil"] .wa-est table {
  border-collapse: collapse;
}

/* ---------- 20.2 Reseña (a…e) ---------- */

/* Nota: de bloque azul oscuro a ficha clara con el número en negro. */
html[data-estilo="suave-emil"] .wa-est--resena .wa-est__nota {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est--resena .wa-est__nota-num small {
  color: #333;
  opacity: 1;
}

html[data-estilo="suave-emil"] .wa-est--resena .wa-est__nota-txt {
  color: #037693;
  opacity: 1;
}

html[data-estilo="suave-emil"] .wa-est--resena .wa-est__nota-val small,
html[data-estilo="suave-emil"] .wa-est--resena .wa-est__nota-coment {
  color: #333;
}

/* Anillos (D): trazo azul sobre gris claro. */
html[data-estilo="suave-emil"] .wa-est__anillo {
  background: conic-gradient(#049EC5 calc(var(--p) * 1%), #E9E9E9 0);
}

html[data-estilo="suave-emil"] .wa-est__anillo > span {
  color: #131313;
}

/* Pros / contras: caja con tinte verde suave y caja blanca. */
html[data-estilo="suave-emil"] .wa-est--resena .wa-est__pros {
  border-color: rgba(63, 191, 83, .3);
  background: rgba(63, 191, 83, .06);
}

html[data-estilo="suave-emil"] .wa-est--resena .wa-est__contras {
  border-color: #E9E9E9;
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-est__pros li::before {
  background: #3FBF53;
}

html[data-estilo="suave-emil"] .wa-est__contras li::before {
  background: #333;
}

html[data-estilo="suave-emil"] .wa-est__veredicto-otro-tit {
  color: #131313;
}

/* Bonos de la reseña: sin franja verde superior. */
html[data-estilo="suave-emil"] .wa-est--resena .wa-est__bono {
  border: 1px solid #E9E9E9;
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--se-sombra);
}

html[data-estilo="suave-emil"] .wa-est--resena .wa-est__bono-q {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est--resena .wa-est__bono-tipo {
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-est__bono-cond > div,
html[data-estilo="suave-emil"] .wa-est__pagos-datos > div {
  background: var(--se-tinte);
}

html[data-estilo="suave-emil"] .wa-est__bono-cond dt,
html[data-estilo="suave-emil"] .wa-est__pagos-datos dt,
html[data-estilo="suave-emil"] .wa-est__pagos-logos li {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est__bono-como {
  border-color: #E9E9E9;
  border-radius: 10px;
}

html[data-estilo="suave-emil"] .wa-est__bono-como summary {
  color: #037693;
}

/* Características (check sí / no). */
html[data-estilo="suave-emil"] .wa-est__checks li {
  border-color: #E9E9E9;
}

html[data-estilo="suave-emil"] .wa-est__checks .is-si .wa-est__check {
  background: #3FBF53;
}

html[data-estilo="suave-emil"] .wa-est__checks .is-no {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est__checks .is-no .wa-est__check {
  background: #BBBBBB;
}

/* Seguridad / confiable: de bloque negro a tinte. */
html[data-estilo="suave-emil"] .wa-est__confiable {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est__confiable .wa-est__h2 {
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est__confiable a {
  color: #037693;
}

/* C · cuaderno de pruebas: sin franja gruesa arriba ni a la izquierda. */
html[data-estilo="suave-emil"] .wa-est--resena-c .wa-est__hero {
  border-top: 1px solid #E9E9E9;
}

html[data-estilo="suave-emil"] .wa-est--resena-c .wa-est__dato {
  border-left: 1px solid #E9E9E9;
}

html[data-estilo="suave-emil"] .wa-est__verif-final {
  border-color: rgba(63, 191, 83, .35);
  background: rgba(63, 191, 83, .08);
  color: #131313;
}

/* D · barra de anclas: fichas con tinte; el color cambia al instante. */
html[data-estilo="suave-emil"] .wa-est__anclas {
  border-bottom-color: #E9E9E9;
}

html[data-estilo="suave-emil"] .wa-est__anclas a,
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__indice a {
  border: 1px solid #E9E9E9;
  background: #fff;
  color: #131313;
  transition: none;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .wa-est__anclas a:hover,
  html[data-estilo="suave-emil"] .wa-est--bono .wa-est__indice a:hover {
    border-color: var(--se-borde);
    background: var(--se-tinte);
    color: #037693;
  }
}

html[data-estilo="suave-emil"] .wa-est__lateral-card {
  border-color: #E9E9E9;
  border-radius: 12px;
  box-shadow: var(--se-sombra);
}

html[data-estilo="suave-emil"] .wa-est__lateral-bono span {
  color: #333;
}

/* E · revista: portada clara (tinte + foto muy tenue), texto oscuro. */
html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__hero {
  border: 1px solid var(--se-borde);
  background: linear-gradient(var(--se-tinte), var(--se-tinte)), #fff;
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__portada-img {
  opacity: .1;
}

html[data-estilo="suave-emil"] body .wa-est--resena-e h1.wa-est__h1 {
  color: #131313 !important;
}

html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__hero-bono,
html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__hero-bono strong {
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__hero .wa-est__legal {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__nota {
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__hero-logo {
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__sellos {
  border-top-color: var(--se-borde);
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__sellos a {
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__hero .meta-confianza,
html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__hero .meta-confianza__txt,
html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__hero .meta-confianza__item > i {
  color: #333 !important;
}

html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__hero .meta-confianza__tiempo i {
  color: #049EC5 !important;
}

html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__hero .meta-confianza__item > i.meta-confianza__check {
  color: #3FBF53 !important;
}

html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__hero .meta-confianza__link,
html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__hero .meta-confianza__name {
  color: #037693 !important;
}

html[data-estilo="suave-emil"] .wa-est__cita {
  border-left: 3px solid #049EC5;
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est__cita figcaption {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__pros,
html[data-estilo="suave-emil"] .wa-est--resena-e .wa-est__contras {
  border-left-width: 3px;
}

/* ---------- 20.3 Bono (a…d) ---------- */

/* Cabecera plana (sin degradado blanco→azul). */
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__hero {
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__importe-valor {
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__importe-tipo {
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__verificado {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__verificado-ico {
  background: #3FBF53;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__hero-img img {
  border-radius: 10px;
}

/* Pasos: tarjetas blancas con número en azul oscuro. */
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__pasos-lista > li,
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__pasos-txt ol > li {
  border-color: #E9E9E9;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__pasos-lista > li::before,
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__pasos-txt ol > li::before {
  background: #037693;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__pasos-lista strong:first-child {
  color: #131313;
}

/* C · progreso: azul en lugar de verde (el verde es solo del CTA). */
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__pasos--progreso .wa-est__pasos-lista > li {
  border: 0;
  background: transparent;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__pasos--progreso .wa-est__pasos-lista > li::before {
  background: #037693;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__pasos--progreso .wa-est__pasos-lista > li::after {
  background: #E9E9E9;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__progreso {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__progreso-barra span {
  background: #049EC5;
}

/* Caja CTA intermedia: de negro a tinte. */
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__bono {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__bono-txt strong {
  color: #131313;
}

/* Desplegable de condiciones: la flecha gira con curva propia. */
html[data-estilo="suave-emil"] .wa-est__tyc-details > summary::after {
  border-color: #037693;
  transition: transform 200ms var(--se-out);
}

/* B · calculadora. */
html[data-estilo="suave-emil"] .wa-est__calc {
  border: 1px solid var(--se-borde);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--se-sombra);
}

html[data-estilo="suave-emil"] .wa-est__calc-campo label,
html[data-estilo="suave-emil"] .wa-est__calc-aviso,
html[data-estilo="suave-emil"] .wa-est__calc-tabla caption {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__calc-input {
  border: 1px solid #BBBBBB;
  border-radius: 10px;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__calc-input:focus-visible {
  border-color: #037693;
  box-shadow: 0 0 0 3px rgba(4, 158, 197, .18);
  outline: 0;
}

html[data-estilo="suave-emil"] .wa-est__calc-op {
  color: #049EC5;
}

html[data-estilo="suave-emil"] .wa-est__calc-res {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte);
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est__calc-res-label {
  color: #333;
  opacity: 1;
}

html[data-estilo="suave-emil"] .wa-est__calc-res-valor {
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__calc-tabla th,
html[data-estilo="suave-emil"] .wa-est .wa-est__calc-tabla td {
  border-bottom-color: #E9E9E9;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__calc-tabla thead th {
  background: var(--se-tinte);
  color: #131313;
}

/* C · checklist y trampas: blanco con borde fino. */
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__check,
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__trampas {
  border: 1px solid #E9E9E9;
  border-radius: 12px;
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__check-lista li {
  border: 1px solid #E9E9E9;
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__check-lista li::before {
  background: #3FBF53;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__check-cta p,
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__trampa-t {
  color: #131313;
}

/* D · nota en círculo y desglose. */
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__nota {
  border: 1px solid #E9E9E9;
  border-radius: 12px;
  box-shadow: var(--se-sombra);
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__nota-circulo {
  --nota-color: #049EC5;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__nota--medio .wa-est__nota-circulo {
  --nota-color: #037693;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__nota--bajo .wa-est__nota-circulo {
  --nota-color: #BBBBBB;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__nota-max,
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__nota-metodo {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__notas li {
  border-bottom: 1px solid #E9E9E9;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__notas--resta .wa-est__notas-efecto {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est--bono .wa-est__notas--neutro .wa-est__notas-efecto {
  color: #037693;
}

/* D · comparativa: filas blancas; cabecera con tinte; «esta casa» en azul. */
html[data-estilo="suave-emil"] .wa-est .wa-est__comp-tabla tr {
  border-color: #E9E9E9;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__comp-tabla td[data-label]::before {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__comp-propio {
  border-color: #049EC5 !important;
  background: var(--se-tinte) !important;
}

html[data-estilo="suave-emil"] .wa-est .wa-est__comp-este {
  display: inline-block;
  background: #037693;
  white-space: nowrap;
}

@media (min-width: 768px) {
  html[data-estilo="suave-emil"] .wa-est .wa-est__comp-tabla thead th {
    border-bottom: 1px solid var(--se-borde);
    background: var(--se-tinte);
    color: #131313;
  }

  /* La celda de la casa era «display:flex» también en escritorio y se
   * descolgaba de su fila (fallo de la base); aquí vuelve a ser celda. */
  html[data-estilo="suave-emil"] .wa-est .wa-est__comp-tabla th[scope="row"] {
    display: table-cell;
  }

  html[data-estilo="suave-emil"] .wa-est .wa-est__comp-tabla th[scope="row"] img {
    display: inline-block;
    margin-right: .5rem;
    vertical-align: middle;
  }
}

/* ---------- 20.4 Movimiento reducido ---------- */
@media (prefers-reduced-motion: reduce) {
  html[data-estilo="suave-emil"] .wa-est .wa-est__cta:active {
    transform: none !important;
  }
}

/* =====================================================================
 * LOGO (pendiente de aprobación de Fernando)
 * Mismo dibujo de logo.svg con el texto blanco pasado a #131313 para la
 * cabecera blanca (las tres bolas siguen en #049EC5). Es un cambio de
 * marca: si no se aprueba, borrar este bloque y la cabecera volvería a
 * necesitar fondo oscuro.
 * ===================================================================== */
html[data-estilo="suave-emil"] header#header .navbar-brand img.logo,
html[data-estilo="suave-emil"] .wa-nav__header img {
  /* Texto blanco -> #131313; las bolas azules se conservan. */
  content: url("data:image/svg+xml,%3Csvg width='156' height='24' viewBox='0 0 156 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Ccircle cx='13' cy='6' r='6' fill='%23049EC5'/%3E %3Ccircle cx='6' cy='18' r='6' fill='%23049EC5'/%3E %3Ccircle cx='20' cy='18' r='6' fill='%23049EC5'/%3E %3Cpath d='M48.84 6.704L46.072 18H43.288L41.176 9.808L39.048 18H36.28L33.512 6.704H35.96L37.688 15.456L39.928 6.704H42.408L44.664 15.456L46.392 6.704H48.84ZM58.7194 13.232C58.7194 13.456 58.6927 13.712 58.6394 14H52.1434C52.1754 14.7893 52.3887 15.3707 52.7834 15.744C53.178 16.1173 53.6687 16.304 54.2554 16.304C54.778 16.304 55.21 16.176 55.5514 15.92C55.9034 15.664 56.1274 15.3173 56.2234 14.88H58.6074C58.49 15.4987 58.2394 16.0533 57.8554 16.544C57.4714 17.0347 56.9754 17.4187 56.3674 17.696C55.77 17.9733 55.1034 18.112 54.3674 18.112C53.5034 18.112 52.7354 17.9307 52.0634 17.568C51.3914 17.1947 50.8687 16.6667 50.4954 15.984C50.122 15.3013 49.9354 14.496 49.9354 13.568C49.9354 12.64 50.122 11.8347 50.4954 11.152C50.8687 10.4587 51.3914 9.93067 52.0634 9.568C52.7354 9.20533 53.5034 9.024 54.3674 9.024C55.242 9.024 56.0047 9.20533 56.6554 9.568C57.3167 9.93067 57.8234 10.432 58.1754 11.072C58.538 11.7013 58.7194 12.4213 58.7194 13.232ZM56.4474 13.008C56.4794 12.2827 56.2874 11.7333 55.8714 11.36C55.466 10.9867 54.9647 10.8 54.3674 10.8C53.7594 10.8 53.2474 10.9867 52.8314 11.36C52.4154 11.7333 52.186 12.2827 52.1434 13.008H56.4474ZM65.6169 9.024C66.3635 9.024 67.0355 9.20533 67.6329 9.568C68.2302 9.93067 68.6942 10.4587 69.0249 11.152C69.3662 11.8347 69.5369 12.64 69.5369 13.568C69.5369 14.496 69.3662 15.3067 69.0249 16C68.6942 16.6827 68.2302 17.2053 67.6329 17.568C67.0355 17.9307 66.3635 18.112 65.6169 18.112C64.8702 18.112 64.2302 17.936 63.6969 17.584C63.1742 17.2213 62.8009 16.7413 62.5769 16.144V18H60.3209V6.16H62.5769V10.976C62.8009 10.3787 63.1742 9.904 63.6969 9.552C64.2302 9.2 64.8702 9.024 65.6169 9.024ZM64.9129 10.992C64.2302 10.992 63.6649 11.2267 63.2169 11.696C62.7795 12.1547 62.5609 12.7787 62.5609 13.568C62.5609 14.3467 62.7795 14.9707 63.2169 15.44C63.6649 15.8987 64.2302 16.128 64.9129 16.128C65.6169 16.128 66.1822 15.904 66.6089 15.456C67.0355 14.9973 67.2489 14.368 67.2489 13.568C67.2489 12.768 67.0355 12.1387 66.6089 11.68C66.1822 11.2213 65.6169 10.992 64.9129 10.992ZM78.0134 15.728H73.4854L72.6854 18H70.3014L74.4614 6.832H77.0374L81.1814 18H78.7974L78.0134 15.728ZM77.4054 14.016L75.7414 9.248L74.0774 14.016H77.4054ZM87.695 9.024C88.4417 9.024 89.1137 9.20533 89.711 9.568C90.3083 9.93067 90.7723 10.4587 91.103 11.152C91.4443 11.8347 91.615 12.64 91.615 13.568C91.615 14.496 91.4443 15.3067 91.103 16C90.7723 16.6827 90.3083 17.2053 89.711 17.568C89.1137 17.9307 88.4417 18.112 87.695 18.112C86.9483 18.112 86.3083 17.936 85.775 17.584C85.2523 17.2213 84.879 16.7413 84.655 16.144V22.224H82.399V9.136H84.655V10.976C84.879 10.3787 85.2523 9.904 85.775 9.552C86.3083 9.2 86.9483 9.024 87.695 9.024ZM86.991 10.992C86.3083 10.992 85.743 11.2267 85.295 11.696C84.8577 12.1547 84.639 12.7787 84.639 13.568C84.639 14.3467 84.8577 14.9707 85.295 15.44C85.743 15.8987 86.3083 16.128 86.991 16.128C87.695 16.128 88.2603 15.904 88.687 15.456C89.1137 14.9973 89.327 14.368 89.327 13.568C89.327 12.768 89.1137 12.1387 88.687 11.68C88.2603 11.2213 87.695 10.992 86.991 10.992ZM101.692 9.136V18H99.4355V16.208C99.2008 16.8053 98.8115 17.2747 98.2675 17.616C97.7342 17.9467 97.1155 18.112 96.4115 18.112C95.3875 18.112 94.5715 17.776 93.9635 17.104C93.3555 16.432 93.0515 15.4933 93.0515 14.288V9.136H95.2915V14.032C95.2915 14.736 95.4728 15.2853 95.8355 15.68C96.1982 16.064 96.6888 16.256 97.3075 16.256C97.9582 16.256 98.4755 16.048 98.8595 15.632C99.2435 15.216 99.4355 14.6187 99.4355 13.84V9.136H101.692ZM112.079 13.232C112.079 13.456 112.052 13.712 111.999 14H105.503C105.535 14.7893 105.748 15.3707 106.143 15.744C106.537 16.1173 107.028 16.304 107.615 16.304C108.137 16.304 108.569 16.176 108.911 15.92C109.263 15.664 109.487 15.3173 109.583 14.88H111.967C111.849 15.4987 111.599 16.0533 111.215 16.544C110.831 17.0347 110.335 17.4187 109.727 17.696C109.129 17.9733 108.463 18.112 107.727 18.112C106.863 18.112 106.095 17.9307 105.423 17.568C104.751 17.1947 104.228 16.6667 103.855 15.984C103.481 15.3013 103.295 14.496 103.295 13.568C103.295 12.64 103.481 11.8347 103.855 11.152C104.228 10.4587 104.751 9.93067 105.423 9.568C106.095 9.20533 106.863 9.024 107.727 9.024C108.601 9.024 109.364 9.20533 110.015 9.568C110.676 9.93067 111.183 10.432 111.535 11.072C111.897 11.7013 112.079 12.4213 112.079 13.232ZM109.807 13.008C109.839 12.2827 109.647 11.7333 109.231 11.36C108.825 10.9867 108.324 10.8 107.727 10.8C107.119 10.8 106.607 10.9867 106.191 11.36C105.775 11.7333 105.545 12.2827 105.503 13.008H109.807ZM116.736 9.024C117.814 9.024 118.678 9.296 119.328 9.84C119.979 10.384 120.384 11.1093 120.544 12.016H118.432C118.347 11.5893 118.155 11.248 117.856 10.992C117.558 10.736 117.168 10.608 116.688 10.608C116.304 10.608 116.006 10.6987 115.792 10.88C115.579 11.0613 115.472 11.3067 115.472 11.616C115.472 11.8613 115.558 12.0587 115.728 12.208C115.899 12.3573 116.112 12.4747 116.368 12.56C116.624 12.6453 116.992 12.7467 117.472 12.864C118.144 13.0133 118.688 13.1733 119.104 13.344C119.531 13.504 119.894 13.7653 120.192 14.128C120.502 14.48 120.656 14.96 120.656 15.568C120.656 16.3253 120.358 16.9387 119.76 17.408C119.174 17.8773 118.379 18.112 117.376 18.112C116.224 18.112 115.302 17.856 114.608 17.344C113.915 16.8213 113.494 16.08 113.344 15.12H115.504C115.558 15.5573 115.75 15.904 116.08 16.16C116.411 16.4053 116.843 16.528 117.376 16.528C117.76 16.528 118.054 16.4373 118.256 16.256C118.459 16.064 118.56 15.8187 118.56 15.52C118.56 15.264 118.47 15.056 118.288 14.896C118.118 14.736 117.899 14.6133 117.632 14.528C117.376 14.4427 117.008 14.3413 116.528 14.224C115.867 14.0747 115.328 13.9253 114.912 13.776C114.507 13.616 114.155 13.3653 113.856 13.024C113.568 12.6827 113.424 12.2133 113.424 11.616C113.424 10.848 113.718 10.224 114.304 9.744C114.891 9.264 115.702 9.024 116.736 9.024ZM127.073 16.064V18H125.889C124.897 18 124.134 17.76 123.601 17.28C123.078 16.8 122.817 16 122.817 14.88V11.04H121.585V9.136H122.817V6.944H125.073V9.136H127.057V11.04H125.073V14.912C125.073 15.3387 125.158 15.6373 125.329 15.808C125.499 15.9787 125.787 16.064 126.193 16.064H127.073ZM132.168 9.024C132.915 9.024 133.555 9.2 134.088 9.552C134.621 9.904 135 10.3787 135.224 10.976V9.136H137.464V18H135.224V16.144C135 16.7413 134.621 17.2213 134.088 17.584C133.555 17.936 132.915 18.112 132.168 18.112C131.421 18.112 130.749 17.9307 130.152 17.568C129.555 17.2053 129.085 16.6827 128.744 16C128.413 15.3067 128.248 14.496 128.248 13.568C128.248 12.64 128.413 11.8347 128.744 11.152C129.085 10.4587 129.555 9.93067 130.152 9.568C130.749 9.20533 131.421 9.024 132.168 9.024ZM132.872 10.992C132.168 10.992 131.603 11.2213 131.176 11.68C130.749 12.1387 130.536 12.768 130.536 13.568C130.536 14.368 130.749 14.9973 131.176 15.456C131.603 15.904 132.168 16.128 132.872 16.128C133.555 16.128 134.115 15.8987 134.552 15.44C135 14.9707 135.224 14.3467 135.224 13.568C135.224 12.7787 135 12.1547 134.552 11.696C134.115 11.2267 133.555 10.992 132.872 10.992ZM142.564 9.024C143.642 9.024 144.506 9.296 145.156 9.84C145.807 10.384 146.212 11.1093 146.372 12.016H144.26C144.175 11.5893 143.983 11.248 143.684 10.992C143.386 10.736 142.996 10.608 142.516 10.608C142.132 10.608 141.834 10.6987 141.62 10.88C141.407 11.0613 141.3 11.3067 141.3 11.616C141.3 11.8613 141.386 12.0587 141.556 12.208C141.727 12.3573 141.94 12.4747 142.196 12.56C142.452 12.6453 142.82 12.7467 143.3 12.864C143.972 13.0133 144.516 13.1733 144.932 13.344C145.359 13.504 145.722 13.7653 146.02 14.128C146.33 14.48 146.484 14.96 146.484 15.568C146.484 16.3253 146.186 16.9387 145.588 17.408C145.002 17.8773 144.207 18.112 143.204 18.112C142.052 18.112 141.13 17.856 140.436 17.344C139.743 16.8213 139.322 16.08 139.172 15.12H141.332C141.386 15.5573 141.578 15.904 141.908 16.16C142.239 16.4053 142.671 16.528 143.204 16.528C143.588 16.528 143.882 16.4373 144.084 16.256C144.287 16.064 144.388 15.8187 144.388 15.52C144.388 15.264 144.298 15.056 144.116 14.896C143.946 14.736 143.727 14.6133 143.46 14.528C143.204 14.4427 142.836 14.3413 142.356 14.224C141.695 14.0747 141.156 13.9253 140.74 13.776C140.335 13.616 139.983 13.3653 139.684 13.024C139.396 12.6827 139.252 12.2133 139.252 11.616C139.252 10.848 139.546 10.224 140.132 9.744C140.719 9.264 141.53 9.024 142.564 9.024Z' fill='%23131313'/%3E %3C/svg%3E");
}


/* =====================================================================
 * 21. VERSIÓN FINAL (21-oct-2026). Piezas que llegaron después de este
 *     estilo (estructura F, maqueta nueva, recomendador embebido, chips,
 *     portada ancha, carrusel) vestidas con el mismo lenguaje claro:
 *     blanco o tinte #049EC5 al 6–8 %, borde fino, radio 12 y el CTA
 *     verde como única mancha fuerte. Sin JS, sin fuentes nuevas; los
 *     logos crecen dentro de cajas de ancho y alto fijos (sin CLS).
 * ===================================================================== */

/* ---------- 21.1 Logos más grandes (rankings y widgets) ----------
 * La imagen rellena la caja con object-fit: contain (wa-widgets.css),
 * así que basta con agrandar la caja; ancho y alto fijos = sin saltos. */
html[data-estilo="suave-emil"] .wa--suave-emil .wa-logo {
  padding: 6px 8px;
  border-radius: 10px;
}

html[data-estilo="suave-emil"] .wa--suave-emil .wa-rk-head .wa-logo {
  width: 100px;
  height: 52px;
}

html[data-estilo="suave-emil"] .wa--suave-emil .wa-ficha__marca .wa-logo {
  width: 88px;
  height: 48px;
}

html[data-estilo="suave-emil"] .wa--suave-emil .wa-fila__marca .wa-logo {
  width: 124px;
  height: 64px;
}

html[data-estilo="suave-emil"] .wa--suave-emil .wa-caja__top .wa-logo {
  width: 160px;
  height: 72px;
}

html[data-estilo="suave-emil"] .wa--suave-emil.wa-banner .wa-logo {
  width: 112px;
  height: 58px;
}

html[data-estilo="suave-emil"] .wa--suave-emil .wa-cmp__op .wa-logo {
  width: 108px;
  height: 54px;
}

html[data-estilo="suave-emil"] .wa--suave-emil .wa-lat__marca .wa-logo {
  height: 58px;
  padding: 2px;
}

@media (min-width: 768px) {
  /* Ranking en escritorio: de 96×54 a 136×72 (+40 % de ancho útil). */
  html[data-estilo="suave-emil"] .wa--suave-emil .wa-rk-head .wa-logo {
    width: 136px;
    height: 72px;
    padding: 8px 10px;
  }
}

@media (max-width: 640px) {
  html[data-estilo="suave-emil"] .wa--suave-emil.wa-banner .wa-logo {
    width: 88px;
    height: 48px;
  }
}

/* Recomendador (resultado): el logo que sustituye al nombre, algo mayor. */
html[data-estilo="suave-emil"] .reco-wz__logo {
  height: 28px;
  max-width: 132px;
}

/* ---------- 21.2 Enlace «Análisis de {casa}» bajo el H3 del ranking ----------
 * Enlace interno (nunca dentro de data-lk): secundario y discreto, azul
 * oscuro (5:1 sobre blanco) con subrayado fino en tinte. */
html[data-estilo="suave-emil"] body .wa a.wa-rk-analisis {
  display: inline-block;
  padding: 4px 0;
  margin-top: -2px;
  color: #037693;
  font: 600 13px/1.2 Inter, system-ui, sans-serif;
  text-decoration: underline;
  text-decoration-color: rgba(4, 158, 197, .35);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

html[data-estilo="suave-emil"] body .wa a.wa-rk-analisis::after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 2px 1px 5px;
  vertical-align: middle;
  border-top: 1.5px solid currentColor;
  border-right: 1.5px solid currentColor;
  transform: rotate(45deg);
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] body .wa a.wa-rk-analisis:hover {
    color: #131313;
    text-decoration-color: currentColor;
  }
}

html[data-estilo="suave-emil"] body .wa a.wa-rk-analisis:focus-visible {
  outline: 2px solid #037693;
  outline-offset: 2px;
  border-radius: 4px;
}

/* ---------- 21.3 Chips de intención (.wa-int) ---------- */
html[data-estilo="suave-emil"] .wa-int__titulo {
  color: #333;
}

html[data-estilo="suave-emil"] body .wa-int__lista {
  gap: 8px;
  padding: 2px 2px 8px;
  scrollbar-width: none;
  scroll-snap-type: x proximity;
}

html[data-estilo="suave-emil"] body .wa-int__lista::-webkit-scrollbar {
  display: none;
}

html[data-estilo="suave-emil"] body .wa-int__lista li {
  scroll-snap-align: start;
}

html[data-estilo="suave-emil"] body .wa-int a.wa-int__chip {
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid var(--se-linea);
  border-radius: 999px;
  background: #fff;
  color: #131313 !important;
  text-decoration: none !important;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] body .wa-int a.wa-int__chip svg {
  color: #037693;
}

html[data-estilo="suave-emil"] body .wa-int a.wa-int__chip[aria-current="page"] {
  border-color: var(--se-borde);
  background: var(--se-tinte2);
  color: #037693 !important;
}

html[data-estilo="suave-emil"] body .wa-int a.wa-int__chip:active {
  transform: scale(.97);
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] body .wa-int a.wa-int__chip:hover {
    border-color: var(--se-borde);
    background: var(--se-tinte);
    color: #037693 !important;
  }
}

/* ---------- 21.4 Estructura F (reseña y bono) ----------
 * La F nace del sistema BB (fondo gris, franja negra, paralelogramos).
 * Aquí: sin fondo gris, tarjetas blancas con borde fino y radio 12,
 * franja de confianza en tinte, nota de sector en ficha clara. */
html[data-estilo="suave-emil"] .wa-est--f {
  --f-radio: 12px;
  --f-sombra: 0 2px 10px rgba(19, 19, 19, .05);
  --f-fondo: rgba(4, 158, 197, .06);
  --f-azul-claro: rgba(4, 158, 197, .08);
  --f-rojo: #333;
  --f-suave: #333;
  background: transparent;
  padding: 0;
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__card,
html[data-estilo="suave-emil"] .wa-est--f .wa-est__hero,
html[data-estilo="suave-emil"] .wa-est--f .wa-est__meta,
html[data-estilo="suave-emil"] .wa-est--f .wa-est__lateral-card,
html[data-estilo="suave-emil"] .wa-est--resena-f article > section:not(.wa-est__bonos):not(.wa-est__sector),
html[data-estilo="suave-emil"] .wa-est--resena-f .wa-est__texto,
html[data-estilo="suave-emil"] .wa-est--resena-f #wa-autor > section,
html[data-estilo="suave-emil"] .wa-est--bono-f > section:not(.wa-est__otros):not(.wa-est__rivales),
html[data-estilo="suave-emil"] .wa-est--bono-f > .wa-est__resumen,
html[data-estilo="suave-emil"] .wa-est--bono-f > .wa-est__faq {
  border: 1px solid var(--se-linea);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--se-sombra);
}

/* Las rayas de velocidad de la cabecera no son de este estilo. */
html[data-estilo="suave-emil"] .wa-est--f .wa-est__hero::before {
  display: none;
}

/* CTA: verde con texto blanco; en hover, verde oscuro (no negro). */
html[data-estilo="suave-emil"] .wa-est--f .wa-est__cta {
  border: 1px solid #3FBF53;
  border-radius: 10px;
  background: #3FBF53;
  color: #fff;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__btn-sec {
  border: 1.5px solid var(--se-borde);
  border-radius: 10px;
  background: #fff;
  color: #037693;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__btn-sec:active,
html[data-estilo="suave-emil"] .wa-est--f .wa-est__cta:active {
  transform: scale(.97);
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .wa-est--f .wa-est__cta:hover {
    border-color: #36a948;
    background: #36a948;
    color: #fff;
  }

  html[data-estilo="suave-emil"] .wa-est--f .wa-est__btn-sec:hover {
    border-color: var(--se-borde);
    background: var(--se-tinte2);
    color: #037693;
  }
}

/* Logo de la cabecera, más grande y sobre blanco con borde fino. */
html[data-estilo="suave-emil"] .wa-est--resena-f .wa-est__hero-logo {
  width: 150px;
  border: 1px solid var(--se-linea);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__hero-logo img {
  border-radius: 0;
}

@media (min-width: 768px) {
  html[data-estilo="suave-emil"] .wa-est--resena-f .wa-est__hero-logo {
    width: 200px;
  }
}

html[data-estilo="suave-emil"] .wa-est--bono-f a.wa-est__hero-logo {
  border: 1px solid var(--se-linea);
  border-radius: 12px;
  box-shadow: none;
}

html[data-estilo="suave-emil"] .wa-est--bono-f a.wa-est__hero-logo img {
  height: 48px;
}

@media (min-width: 768px) {
  html[data-estilo="suave-emil"] .wa-est--bono-f a.wa-est__hero-logo img {
    height: 62px;
  }
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__lateral-card .wa-est__hero-logo {
  width: 180px;
}

html[data-estilo="suave-emil"] .wa-est--bono-f .wa-est__tarjeta-logo img {
  height: 36px;
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__otra-logo {
  border: 1px solid var(--se-linea);
  border-radius: 10px;
}

/* En la F la nota es una línea (estrellas + número), no una ficha: sin
   la caja con tinte de las estructuras A–E. */
html[data-estilo="suave-emil"] .wa-est--resena-f .wa-est__nota {
  border: 0;
  background: none;
}

/* Oferta de la cabecera: el importe en negro, la etiqueta en azul oscuro. */
html[data-estilo="suave-emil"] .wa-est--resena-f .wa-est__hero-bono-tipo {
  color: #037693;
  font-weight: 700;
}

html[data-estilo="suave-emil"] .wa-est--bono-f .wa-est__importe-tipo {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte2);
  color: #037693;
}

/* Franja de confianza: de negra a tinte (no lleva CTA). */
html[data-estilo="suave-emil"] .wa-est--f .wa-est__confianza {
  border: 1px solid var(--se-borde);
  border-radius: 12px;
  background: var(--se-tinte);
  color: #131313;
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__confianza-item svg,
html[data-estilo="suave-emil"] .wa-est--f .wa-est__meta-ico,
html[data-estilo="suave-emil"] .wa-est--f .wa-est__bono-ico,
html[data-estilo="suave-emil"] .wa-est--f .wa-est__dato-ico {
  color: #037693;
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__meta dt {
  color: #333;
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__pop-txt {
  background: #131313;
  box-shadow: var(--se-sombra);
}

/* Índice en chips: fondo blanco (antes el gris del envoltorio). */
html[data-estilo="suave-emil"] .wa-est--f .wa-est__indice {
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__chip {
  border-color: var(--se-linea);
  color: #131313;
  transition: transform 160ms var(--se-out);
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .wa-est--f .wa-est__chip:hover {
    border-color: var(--se-borde);
    background: var(--se-tinte);
    color: #037693;
  }
}

/* Resumen, veredicto y citas: tinte con trazo azul fino (no verde). */
html[data-estilo="suave-emil"] .wa-est--resena-f .wa-est__resumen,
html[data-estilo="suave-emil"] .wa-est--bono-f > .wa-est__resumen {
  border-left: 3px solid #049EC5;
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__veredicto-frase,
html[data-estilo="suave-emil"] .wa-est--f .wa-est__cita {
  border-left-width: 3px;
  border-left-color: #049EC5;
}

/* Barras de nota en azul liso; el verde queda para el CTA. */
html[data-estilo="suave-emil"] .wa-est--f .wa-est__barra {
  height: 6px;
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__barra > span {
  background: #049EC5;
}

/* Nota de sector: de paralelogramo negro a ficha clara. */
html[data-estilo="suave-emil"] .wa-est--f .wa-est__sector-nota {
  padding-inline: 10px;
  border: 1px solid var(--se-borde);
  border-radius: 10px;
  background: var(--se-tinte2);
  color: #037693;
  clip-path: none;
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__sector-nota small {
  color: #333;
  opacity: 1;
}

/* Pros / contras: blanco con canto fino (sin rosa ni verde de fondo). */
html[data-estilo="suave-emil"] .wa-est--f .wa-est__pros,
html[data-estilo="suave-emil"] .wa-est--f .wa-est__contras {
  border: 1px solid var(--se-linea);
  border-top: 3px solid #3FBF53;
  background: #fff;
}

html[data-estilo="suave-emil"] .wa-est--f .wa-est__contras {
  border-top-color: #BBBBBB;
}

/* «Puntos clave» del bono: lista suelta dentro de su tarjeta, sin caja. */
html[data-estilo="suave-emil"] .wa-est--bono-f .wa-est__puntos .wa-est__pros {
  border: 0;
  background: transparent;
}

/* Comprobaciones: «sí» en azul oscuro, «no» en gris. */
html[data-estilo="suave-emil"] .wa-est--f .is-si .wa-est__check {
  background: #037693;
}

/* Pasos: número en ficha clara (antes paralelogramo negro). */
html[data-estilo="suave-emil"] .wa-est--f .wa-est__paso::before {
  border: 1px solid var(--se-borde);
  border-radius: 10px;
  background: var(--se-tinte2);
  color: #037693;
  clip-path: none;
}

html[data-estilo="suave-emil"] .wa-est--bono-f .wa-est__dato--destacado {
  border: 1px solid var(--se-borde);
  background: #fff;
}

/* ---------- 21.5 Maqueta nueva: cabecera y tarjeta «Bono destacado» ---------- */
html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-cabecera > .wa-est--f {
  background: transparent;
}

html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-tarjeta.wa-est--f .wa-est__lateral-card .wa-est__hero-logo {
  width: 180px;
}

html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest {
  border: 1px solid var(--se-linea);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--se-sombra);
}

html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest__eyebrow {
  padding: 3px 10px;
  border: 1px solid var(--se-borde);
  border-radius: 999px;
  background: var(--se-tinte2);
  color: #037693;
}

/* Logo más grande dentro de una caja fija (la imagen trae width/height). */
html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest__logo {
  width: 190px;
}

html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest__logo img {
  border: 1px solid var(--se-linea);
  border-radius: 10px;
}

html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest__estrellas {
  color: #E9E9E9;
}

html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest__estrellas::after {
  color: #049EC5;
}

html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest__bono span {
  color: #037693;
}

html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest__cta {
  border: 1px solid #3FBF53;
  border-radius: 10px;
  background: #3FBF53;
  color: #fff;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest__cta:active {
  transform: scale(.97);
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest__cta:hover {
    border-color: #36a948;
    background: #36a948;
  }
}

html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest__resena {
  color: #037693;
  text-decoration-color: rgba(4, 158, 197, .35);
}

html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest :is(a, [role="link"]):focus-visible {
  outline: 2px solid #037693;
}

/* Cabecera compacta en móvil: logo algo mayor (84 → 100). */
@media (max-width: 767.98px) {
  html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-cabecera .wa-est--resena-f .wa-est__hero-logo {
    width: 100px;
  }
}

/* ---------- 21.6 Portada ancha: texto a TODO el ancho ----------
 * 22-oct (tarde, Fernando): la columna de lectura de 920 px dejaba un hueco
 * en blanco a la derecha (la portada no tiene barra lateral). El texto va al
 * mismo ancho que rankings y componentes. Se quitó el max-width: 920px. */

/* ---------- 21.7 Carrusel de la portada (header_slider, .hs) ----------
 * Solo piel: radio 12, sombra suave, etiqueta en píldora clara, «Ir
 * ahora» como secundario del estilo y flechas finas. Ni imágenes ni JS. */
html[data-estilo="suave-emil"] .hs__card {
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(19, 19, 19, .08);
}

html[data-estilo="suave-emil"] .hs__card-eyebrow {
  border: 1px solid rgba(4, 158, 197, .24);
  border-radius: 999px;
  background: #fff;
  color: #037693;
  letter-spacing: .06em;
}

html[data-estilo="suave-emil"] .hs__card-cta {
  border: 1.5px solid var(--se-borde);
  border-radius: 10px;
  background: #fff;
  color: #037693;
  box-shadow: none;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .hs__card:active .hs__card-cta {
  transform: scale(.97);
}

html[data-estilo="suave-emil"] .hs__card:focus-visible {
  outline: 2px solid #037693;
  outline-offset: 2px;
}

@media (min-width: 768px) {
  html[data-estilo="suave-emil"] .hs__carousel {
    border-radius: 12px;
  }

  html[data-estilo="suave-emil"] .hs__card-eyebrow {
    padding: 4px 12px;
    font-size: 10.5px;
  }

  html[data-estilo="suave-emil"] .hs__card-cta {
    padding: 8px 16px;
  }

  html[data-estilo="suave-emil"] .hs__arrow {
    width: 40px;
    height: 40px;
    border: 1px solid var(--se-linea);
    background: #fff;
    color: #037693;
    transition: transform 160ms var(--se-out);
  }

  html[data-estilo="suave-emil"] .hs__arrow:active {
    transform: scale(.94);
  }

  html[data-estilo="suave-emil"] .hs__arrow:focus-visible {
    outline: 2px solid #037693;
    outline-offset: 2px;
  }
}

@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  /* Al pasar por la tarjeta, el secundario se rellena de azul oscuro
     (antes: rosa de otro tema y salto hacia arriba). */
  html[data-estilo="suave-emil"] .hs__card:hover .hs__card-cta {
    border-color: #037693;
    background: #037693;
    color: #fff;
    box-shadow: none;
    transform: none;
  }

  html[data-estilo="suave-emil"] .hs__arrow:hover {
    border-color: var(--se-borde);
    background: var(--se-tinte2);
    color: #037693;
  }
}

@media (max-width: 767.98px) {
  html[data-estilo="suave-emil"] .hs__card {
    box-shadow: 0 2px 10px rgba(19, 19, 19, .12);
  }

  html[data-estilo="suave-emil"] .hs__rail-btn {
    background: #BBBBBB;
  }

  html[data-estilo="suave-emil"] .hs__rail-btn.is-active {
    background: #037693;
  }
}

/* ---------- 21.8 Recomendador embebido ([recomendador], .reco-sc) y modal ---------- */
html[data-estilo="suave-emil"] .reco-sc {
  border: 1px solid var(--se-linea);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--se-sombra);
}

html[data-estilo="suave-emil"] .reco-sc .reco-sc__ic {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte2);
  color: #037693;
}

html[data-estilo="suave-emil"] .reco-sc .reco-sc__titulo span {
  color: #333;
}

html[data-estilo="suave-emil"] .reco-sc .reco-sc__preguntas li::before {
  background: var(--se-tinte2);
  color: #037693;
}

html[data-estilo="suave-emil"] .reco-sc .reco-sc__pie {
  border-top-color: var(--se-linea);
}

html[data-estilo="suave-emil"] .reco-sc .reco-sc__confianza {
  color: #333;
}

html[data-estilo="suave-emil"] .reco-sc .reco-sc__cta {
  border-radius: 10px;
  background: #3FBF53;
  color: #fff;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .reco-sc .reco-sc__cta:focus-visible {
  outline: 2px solid #037693;
  outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .reco-sc .reco-sc__cta:hover {
    background: #36a948;
    color: #fff;
  }
}

/* Modal: cabecera clara en tinte (antes negra con filo verde). */
html[data-estilo="suave-emil"] .reco-wz__box {
  border: 1px solid var(--se-linea);
  border-radius: 16px;
  box-shadow: 0 20px 50px rgba(19, 19, 19, .22);
}

html[data-estilo="suave-emil"] .reco-wz__head {
  border-bottom: 1px solid var(--se-borde);
  background: var(--se-tinte2);
  color: #131313;
}

html[data-estilo="suave-emil"] .reco-wz__ttl span {
  color: #333;
}

html[data-estilo="suave-emil"] .reco-wz__x {
  color: #333;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .reco-wz__x:hover {
    color: #131313;
  }
}

html[data-estilo="suave-emil"] .reco-wz__seg.is-on {
  background: #049EC5;
}

html[data-estilo="suave-emil"] .reco-wz__step {
  color: #333;
}

html[data-estilo="suave-emil"] .reco-wz__opt {
  border: 1px solid var(--se-linea);
  border-radius: 12px;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .reco-wz__opt:active:not(:disabled) {
  transform: scale(.97);
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .reco-wz__opt:hover:not(:disabled) {
    border-color: var(--se-borde);
    background: var(--se-tinte);
    box-shadow: none;
    transform: none;
  }
}

html[data-estilo="suave-emil"] .reco-wz__opt.is-sel {
  border-color: #037693;
  background: var(--se-tinte2);
}

html[data-estilo="suave-emil"] .reco-wz__card {
  border: 1px solid var(--se-linea);
  border-radius: 12px;
}

html[data-estilo="suave-emil"] .reco-wz__card.is-top {
  border-color: var(--se-borde);
  background: var(--se-tinte);
  box-shadow: none;
}

html[data-estilo="suave-emil"] .reco-wz__card.is-top .reco-wz__rank,
html[data-estilo="suave-emil"] .reco-wz__importe,
html[data-estilo="suave-emil"] .reco-wz__resena {
  color: #037693;
}

html[data-estilo="suave-emil"] .reco-wz__cta {
  background: #3FBF53;
  color: #fff;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .reco-wz__cta:hover {
    background: #36a948;
    transform: none;
  }

  html[data-estilo="suave-emil"] .reco-wz__again:hover {
    border-color: var(--se-borde);
    color: #037693;
  }
}

html[data-estilo="suave-emil"] .reco-wz__resena-tag {
  background: var(--se-tinte2);
  color: #037693;
}

html[data-estilo="suave-emil"] .reco-wz__envio {
  border: 1px solid var(--se-borde);
  background: var(--se-tinte);
}

html[data-estilo="suave-emil"] .reco-wz__email {
  border-color: var(--se-linea);
}

html[data-estilo="suave-emil"] .reco-wz__envio-ok {
  background: #037693;
}

html[data-estilo="suave-emil"] .reco-wz__again {
  border: 1px solid var(--se-linea);
  color: #333;
}

/* ---------- 21.9 Banner fijo móvil (.gumgum) con la maqueta nueva ----------
 * Otra pieza (JS) lo lleva arriba al bajar y abajo al subir: la piel
 * funciona en las dos posiciones (línea fina arriba y abajo, sombra
 * simétrica). No se toca position/top/bottom/transform: son del JS. */
@media (max-width: 768px) {
  html[data-estilo="suave-emil"] body.maqueta-nueva .gumgum {
    align-items: center;
    gap: 10px;
    padding: 6px 12px;
    border: 0 !important;
    border-top: 1px solid var(--se-linea) !important;
    border-bottom: 1px solid var(--se-linea) !important;
    background: #fff;
    box-shadow: 0 0 14px rgba(19, 19, 19, .08);
  }

  html[data-estilo="suave-emil"] body.maqueta-nueva .gumgum .logocasa {
    align-items: center;
  }

  html[data-estilo="suave-emil"] body.maqueta-nueva .gumgum .logocasa img {
    width: 140px;
    max-width: 100%;
    max-height: 52px;
  }

  html[data-estilo="suave-emil"] body.maqueta-nueva .gumgum .visitarsitio {
    flex: 1 1 50%;
  }

  html[data-estilo="suave-emil"] body.maqueta-nueva .gumgum .visitarsitio > div,
  html[data-estilo="suave-emil"] body.maqueta-nueva .gumgum .visitarsitio a {
    margin: 0 !important;
    min-height: 46px;
    border-radius: 10px;
  }
}

/* ---------- 21.10 Movimiento reducido (piezas de la versión final) ---------- */
@media (prefers-reduced-motion: reduce) {
  html[data-estilo="suave-emil"] body .wa-int a.wa-int__chip:active,
  html[data-estilo="suave-emil"] .wa-est--f .wa-est__cta:active,
  html[data-estilo="suave-emil"] .wa-est--f .wa-est__btn-sec:active,
  html[data-estilo="suave-emil"] body.maqueta-nueva .wa-maq-dest__cta:active,
  html[data-estilo="suave-emil"] .hs__card:active .hs__card-cta,
  html[data-estilo="suave-emil"] .hs__arrow:active,
  html[data-estilo="suave-emil"] .reco-wz__opt:active:not(:disabled) {
    transform: none !important;
  }
}

/* =====================================================================
 * 22. SEGUNDA PASADA (21-oct-2026): componentes nuevos del módulo
 *     wa_componentes (.wac-…: tarjetas de pronóstico y de bono, banner
 *     con curva, «Otras casas como X»), matiz apuestas/casino en los
 *     rankings y enlace «Análisis» de la ficha y de la compacta.
 *     Los .wac no reciben clases wa--*: se visten aquí directamente.
 * ===================================================================== */

/* ---------- 22.1 Componentes: variables y piezas comunes ---------- */
html[data-estilo="suave-emil"] .wac {
  --wac-navy: #131313;
  --wac-navy2: #037693;
  --wac-cyan: #037693;
  --wac-green: #3FBF53;
  --wac-green-dark: #36a948;
  --wac-ink: #131313;
  --wac-muted: #333;
  --wac-line: #E9E9E9;
  --wac-radius: 12px;
  /* Sector: apuestas = azul de la web; casino = azul oscuro. */
  --wac-acento: #049EC5;
  --wac-tinte: rgba(4, 158, 197, .08);
  --wac-borde: rgba(4, 158, 197, .24);
}

html[data-estilo="suave-emil"] .wac.wac-bonos--casino,
html[data-estilo="suave-emil"] .wac-bono--casino,
html[data-estilo="suave-emil"] .wac-banner.wac--sector-casino {
  --wac-acento: #037693;
  --wac-tinte: rgba(3, 118, 147, .08);
  --wac-borde: rgba(3, 118, 147, .26);
}

html[data-estilo="suave-emil"] .wac__titulo {
  color: #131313;
}

html[data-estilo="suave-emil"] .wac-placa {
  border: 1px solid #E9E9E9;
  box-shadow: none;
}

html[data-estilo="suave-emil"] .wac-btn {
  border-radius: 10px;
  background: #3FBF53;
  color: #fff;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .wac [data-lk]:active .wac-btn,
html[data-estilo="suave-emil"] .wac-banner:active .wac-btn {
  transform: scale(.97);
}

html[data-estilo="suave-emil"] .wac a:focus-visible,
html[data-estilo="suave-emil"] .wac [data-lk]:focus-visible,
html[data-estilo="suave-emil"] .wac button:focus-visible,
html[data-estilo="suave-emil"] .wac-banner:focus-visible {
  outline: 2px solid #037693;
  outline-offset: 2px;
}

/* Tarjetas: sin salto al pasar (no son el CTA); solo el borde en tinte. */
html[data-estilo="suave-emil"] .wac-prono,
html[data-estilo="suave-emil"] .wac-bono,
html[data-estilo="suave-emil"] .wac-banner {
  border: 1px solid #E9E9E9;
  border-radius: 12px;
  box-shadow: var(--se-sombra);
  transition: none;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .wac-prono:hover,
  html[data-estilo="suave-emil"] .wac-bono:hover,
  html[data-estilo="suave-emil"] .wac-banner:hover {
    border-color: var(--wac-borde);
    box-shadow: var(--se-sombra);
    transform: none;
  }

  html[data-estilo="suave-emil"] .wac-bono__cta:hover .wac-btn,
  html[data-estilo="suave-emil"] .wac-banner:hover .wac-btn {
    background: #36a948;
  }
}

/* ---------- 22.2 [pronosticos_tarjetas] ----------
 * Cabecera de navy a tinte con texto oscuro; la franja del deporte pasa
 * a blanca con un punto de color (el deporte se sigue distinguiendo). */
html[data-estilo="suave-emil"] .wac-prono__cab {
  border-bottom: 1px solid var(--se-borde);
  background: var(--se-tinte2);
  color: #131313;
}

html[data-estilo="suave-emil"] .wac-prono__cinta {
  border-radius: 0 0 8px 8px;
  background: #037693;
  color: #fff;
}

html[data-estilo="suave-emil"] .wac-prono__avatar {
  border: 2px solid #fff;
  background: #037693;
  box-shadow: 0 0 0 1px var(--se-borde);
}

html[data-estilo="suave-emil"] .wac-prono__puesto,
html[data-estilo="suave-emil"] .wac-prono__apoyo-txt {
  color: #333;
}

html[data-estilo="suave-emil"] .wac-prono__franja,
html[data-estilo="suave-emil"] .wac-prono__franja--futbol,
html[data-estilo="suave-emil"] .wac-prono__franja--basketball,
html[data-estilo="suave-emil"] .wac-prono__franja--tenis {
  --wac-dep: #049EC5;
  border-bottom: 1px solid #E9E9E9;
  background: #fff;
  color: #037693;
}

html[data-estilo="suave-emil"] .wac-prono__franja--futbol { --wac-dep: #3FBF53; }
html[data-estilo="suave-emil"] .wac-prono__franja--basketball { --wac-dep: #b0470d; }
html[data-estilo="suave-emil"] .wac-prono__franja--tenis { --wac-dep: #8a9a12; }

html[data-estilo="suave-emil"] .wac-prono__franja::before {
  content: "";
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--wac-dep);
}

html[data-estilo="suave-emil"] .wac .wac-prono__titulo {
  color: #131313;
}

html[data-estilo="suave-emil"] .wac .wac-prono__meta {
  color: #333;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .wac-prono:hover .wac-prono__titulo {
    color: #037693;
    text-decoration-color: rgba(4, 158, 197, .5);
  }
}

/* ---------- 22.3 [bonos_tarjetas] y «Otras casas como X» ----------
 * La zona de la ilustración, de degradado navy/morado a tinte del
 * sector; el importe, de franja amarilla a blanco con texto azul. */
html[data-estilo="suave-emil"] .wac-bono__arte,
html[data-estilo="suave-emil"] .wac-bonos--casino .wac-bono__arte,
html[data-estilo="suave-emil"] .wac-bono--casino .wac-bono__arte {
  border-bottom: 1px solid var(--wac-borde);
  background: var(--wac-tinte);
}

html[data-estilo="suave-emil"] .wac-bono__marca {
  width: 132px;
  border: 1px solid #E9E9E9;
  border-radius: 10px;
  box-shadow: var(--se-sombra);
}

/* Logo de la tarjeta más grande (caja fija: sin saltos). */
html[data-estilo="suave-emil"] .wac-bono__marca .wac-placa {
  width: 100%;
  height: 54px;
}

html[data-estilo="suave-emil"] .wac-bono__importe {
  border-top: 1px solid #E9E9E9;
  background: #fff;
  color: #037693;
}

html[data-estilo="suave-emil"] .wac-bono__cinta {
  border-radius: 0 999px 999px 0;
  background: #131313;
  color: #fff;
  letter-spacing: .06em;
}

html[data-estilo="suave-emil"] .wac-bono__cinta--nuevo {
  background: #037693;
}

html[data-estilo="suave-emil"] .wac-bono__franja,
html[data-estilo="suave-emil"] .wac-bonos--casino .wac-bono__franja,
html[data-estilo="suave-emil"] .wac-bono--casino .wac-bono__franja {
  border-bottom: 1px solid #E9E9E9;
  background: #fff;
  color: #131313;
}

html[data-estilo="suave-emil"] .wac-bono__tipo {
  color: #037693;
}

html[data-estilo="suave-emil"] .wac-bono__nota > span[aria-hidden] {
  color: #049EC5;
}

html[data-estilo="suave-emil"] .wac-codigo {
  border: 1px dashed var(--se-borde);
  border-radius: 10px;
  background: var(--se-tinte);
}

html[data-estilo="suave-emil"] .wac-codigo code {
  color: #131313;
}

html[data-estilo="suave-emil"] .wac-codigo__btn {
  min-height: 36px;
  border: 1.5px solid var(--se-borde);
  border-radius: 8px;
  background: #fff;
  color: #037693;
  transition: transform 160ms var(--se-out);
}

html[data-estilo="suave-emil"] .wac-codigo__btn:active {
  transform: scale(.97);
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .wac-codigo__btn:hover {
    background: var(--se-tinte2);
  }
}

html[data-estilo="suave-emil"] .wac .wac-bono__leer {
  color: #037693;
  text-decoration: underline;
  text-decoration-color: rgba(4, 158, 197, .35);
  text-underline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .wac .wac-bono__leer:hover {
    color: #131313;
    text-decoration-color: currentColor;
  }
}

html[data-estilo="suave-emil"] .wac .wac-bono__titulo a {
  text-decoration-color: rgba(4, 158, 197, .35);
}

/* ---------- 22.4 [banner_curva] ----------
 * «blanco» (por defecto): cuerpo en tinte, textos oscuros, CTA verde
 * en su placa blanca. «oscuro»: el negro de la web (no navy). */
html[data-estilo="suave-emil"] .wac-banner {
  --wac-banner-fondo: var(--wac-tinte);
  color: #131313;
}

html[data-estilo="suave-emil"] .wac-banner__logo {
  box-shadow: 1px 0 0 var(--wac-borde);
}

html[data-estilo="suave-emil"] .wac-banner__bono {
  color: #333;
}

html[data-estilo="suave-emil"] .wac-banner__importe {
  color: #131313;
}

html[data-estilo="suave-emil"] .wac-banner__legal {
  color: #333;
}

html[data-estilo="suave-emil"] .wac-banner--blanco .wac-banner__accion {
  border: 1px solid #E9E9E9;
}

html[data-estilo="suave-emil"] .wac-banner--oscuro {
  --wac-banner-fondo: #131313;
  color: #fff;
}

html[data-estilo="suave-emil"] .wac-banner--oscuro .wac-banner__bono {
  color: #E9E9E9;
}

html[data-estilo="suave-emil"] .wac-banner--oscuro .wac-banner__importe {
  color: #3FBF53;
}

html[data-estilo="suave-emil"] .wac-banner--oscuro .wac-banner__legal {
  color: #BBBBBB;
}

html[data-estilo="suave-emil"] .wac-banner--oscuro .wac-btn {
  color: #131313;
}

@media (max-width: 560px) {
  html[data-estilo="suave-emil"] .wac-banner__logo {
    box-shadow: 0 1px 0 var(--wac-borde);
  }
}

/* ---------- 22.5 Rankings: matiz apuestas / casino ----------
 * Sutil y coherente: apuestas en el azul de la web (#049EC5), casino en
 * el azul oscuro (#037693). Cambia el filo superior de la cabecera y de
 * las piezas sueltas, el tinte de los bonos y un icono decorativo en la
 * esquina de la cabecera (balón / ficha). Sin texto nuevo ni HTML. */
html[data-estilo="suave-emil"] .wa--suave-emil.wa--sector-apuestas {
  --s-acento: #049EC5;
}

html[data-estilo="suave-emil"] .wa--suave-emil.wa--sector-casino {
  --s-acento: #037693;
  --s-tinte: rgba(3, 118, 147, .06);
  --s-borde: rgba(3, 118, 147, .26);
}

html[data-estilo="suave-emil"] .wa--suave-emil:is(.wa--sector-apuestas, .wa--sector-casino) :is(.wa-rk-hero, .wa-cmp__hero) {
  position: relative;
  overflow: hidden;
  padding-right: 64px;
  border-top: 3px solid var(--s-acento);
}

html[data-estilo="suave-emil"] .wa--suave-emil:is(.wa--sector-apuestas, .wa--sector-casino) :is(.wa-rk-hero, .wa-cmp__hero)::after {
  content: "";
  position: absolute;
  top: 14px;
  right: 14px;
  width: 36px;
  height: 36px;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: .55;
  pointer-events: none;
}

/* Balón (apuestas). */
html[data-estilo="suave-emil"] .wa--suave-emil.wa--sector-apuestas :is(.wa-rk-hero, .wa-cmp__hero)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23049EC5' stroke-width='1.5' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 7.5l4.3 3.1-1.6 5h-5.4l-1.6-5z'/%3E%3Cpath d='M12 7.5V2.2M16.3 10.6l4.9-1.6M14.7 15.6l3 4.2M9.3 15.6l-3 4.2M7.7 10.6L2.8 9'/%3E%3C/svg%3E");
}

/* Ficha de casino (casino). */
html[data-estilo="suave-emil"] .wa--suave-emil.wa--sector-casino :is(.wa-rk-hero, .wa-cmp__hero)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23037693' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='12' r='5.5'/%3E%3Cpath stroke-width='2.5' d='M12 2v3.5M12 18.5V22M2 12h3.5M18.5 12H22M4.9 4.9l2.5 2.5M16.6 16.6l2.5 2.5M4.9 19.1l2.5-2.5M16.6 7.4l2.5-2.5'/%3E%3C/svg%3E");
}

/* El nº 1 y las piezas sueltas toman el acento del sector. */
html[data-estilo="suave-emil"] .wa--suave-emil.wa--sector-casino .wa-rk-card.is-top {
  border-color: #037693;
}

html[data-estilo="suave-emil"] .wa--suave-emil.wa-fila:is(.wa--sector-apuestas, .wa--sector-casino),
html[data-estilo="suave-emil"] .wa--suave-emil.wa-banner:is(.wa--sector-apuestas, .wa--sector-casino),
html[data-estilo="suave-emil"] .wa--suave-emil:is(.wa--sector-apuestas, .wa--sector-casino) .wa-caja {
  border-top: 3px solid var(--s-acento);
}

/* ---------- 22.6 «Análisis» en la ficha desplegable y en la compacta ----------
 * Enlace interno: secundario discreto, igual que .wa-rk-analisis
 * (azul oscuro, subrayado fino en tinte), sin fondo de botón gris. */
html[data-estilo="suave-emil"] body .wa--suave-emil .wa-ficha__pie a.wa-btn.wa-btn--ghost,
html[data-estilo="suave-emil"] body .wa--suave-emil a.wa-cmp__ficha {
  border: 0;
  background: transparent;
  box-shadow: none;
  color: #037693;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: rgba(4, 158, 197, .35);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] body .wa--suave-emil .wa-ficha__pie a.wa-btn.wa-btn--ghost:hover,
  html[data-estilo="suave-emil"] body .wa--suave-emil a.wa-cmp__ficha:hover {
    background: transparent;
    color: #131313;
    text-decoration-color: currentColor;
  }
}

/* ---------- 22.7 Movimiento reducido ---------- */
@media (prefers-reduced-motion: reduce) {
  html[data-estilo="suave-emil"] .wac [data-lk]:active .wac-btn,
  html[data-estilo="suave-emil"] .wac-banner:active .wac-btn,
  html[data-estilo="suave-emil"] .wac-codigo__btn:active {
    transform: none !important;
  }
}

/* ---------- 22.8 Ficha del partido: cuotas 1X2 con logos legibles ----------
 * Menos hueco bajo las cuotas (el tema reservaba 50 px para una curva que
 * ya no existe) y logos de casa más grandes. En móvil cada cuota pasa a
 * dos líneas (signo + cuota arriba, logo debajo) para que el logo se lea. */
html[data-estilo="suave-emil"] .wbs-partido__header {
  padding-bottom: 24px;
}

html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__casa {
  height: 30px;
}

html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__casa img {
  max-height: 20px;
  max-width: 76px;
}

@media (max-width: 768px) {
  html[data-estilo="suave-emil"] .wbs-partido__header {
    padding-bottom: 16px !important;
  }

  html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__pill {
    flex-wrap: wrap !important;
    justify-content: center;
    padding: 6px !important;
    row-gap: 6px !important;
  }

  html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__casa {
    flex: 1 1 100% !important;
    justify-content: center;
    height: 26px !important;
    margin-left: 0 !important;
  }

  html[data-estilo="suave-emil"] .wbs-partido .partido-cuotas-1x2__casa img {
    max-height: 16px !important;
    max-width: 72px !important;
  }
}

/* ---------- 26 · Listados unificados (26-oct-2026) ----------
 * Un solo criterio en toda la web para los listados:
 * - «Lo mejor» / ventajas / Puntos clave: solo icono ✓ verde (sin caja).
 * - «Lo peor» / desventajas: solo icono ✕ en rojo suave (sin caja).
 *   En las tarjetas del ranking, la fila de desventaja en rojo muy claro.
 * - Pasos del bono: número visible (ficha clara, número azul).
 * - Listas del texto: viñeta y número en azul y el mismo espaciado.
 * Los iconos son máscaras SVG (trazo fino, como los iconos de la V3):
 * el color sale de background-color, no dependen de la fuente ni de emojis.
 */
html[data-estilo="suave-emil"] {
  --se-ok: #23862F;
  --se-ok-fondo: rgba(63, 191, 83, .08);
  --se-no: #C0453B;
  --se-no-fondo: rgba(192, 69, 59, .07);
  --se-ico-ok: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
  --se-ico-no: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7L7 17'/%3E%3C/svg%3E");
}

/* Icono común (ventajas y desventajas de reseñas, bonos, rankings y textos). */
html[data-estilo="suave-emil"] :is(.wa-est__pros, .wa-est__contras) li::before,
html[data-estilo="suave-emil"] :is(.pros-list, .cons-list) > li::before,
html[data-estilo="suave-emil"] .wa-pc li::before {
  content: "" !important;
  position: absolute;
  left: 0;
  top: .2em;
  width: 1.05em;
  height: 1.05em;
  border: 0 !important;
  border-radius: 0 !important;
  clip-path: none !important;
  -webkit-mask: var(--se-ico-ok) center / contain no-repeat;
  mask: var(--se-ico-ok) center / contain no-repeat;
  background: var(--se-ok) !important;
}

html[data-estilo="suave-emil"] .wa-est__contras li::before,
html[data-estilo="suave-emil"] .cons-list > li::before,
html[data-estilo="suave-emil"] .wa-pc .is-contra::before {
  -webkit-mask-image: var(--se-ico-no);
  mask-image: var(--se-ico-no);
  background: var(--se-no) !important;
}

html[data-estilo="suave-emil"] :is(.wa-est__pros, .wa-est__contras) li,
html[data-estilo="suave-emil"] :is(.pros-list, .cons-list) > li {
  position: relative;
  padding-left: 1.6em;
  list-style: none;
}

html[data-estilo="suave-emil"] :is(.pros-list, .cons-list) {
  margin: 0 0 1rem;
  padding: 0;
  list-style: none;
  display: grid;
  gap: .45rem;
}

/* Ranking (análisis desplegable): fila con icono a la izquierda. */
html[data-estilo="suave-emil"] .wa-pc li {
  position: relative;
  padding-left: 32px;
}

html[data-estilo="suave-emil"] .wa-pc li::before {
  left: 10px;
  top: calc(6px + .2em);
}

html[data-estilo="suave-emil"] .wa-pc .is-pro {
  background: var(--se-ok-fondo);
}

html[data-estilo="suave-emil"] .wa-pc .is-contra {
  background: var(--se-no-fondo);
}

/* Pasos del bono: el número se veía azul sobre azul. */
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__pasos-lista > li::before,
html[data-estilo="suave-emil"] .wa-est--bono .wa-est__pasos-txt ol > li::before {
  border: 1px solid var(--se-borde);
  background: #E6F5F9;
  color: #037693;
}

/* Listas del texto (sin clase propia): viñeta y número en azul. */
html[data-estilo="suave-emil"] :is(.text-formatted, .field--name-body) :is(ul, ol):not([class]) {
  margin: 0 0 1.1em;
  padding-left: 1.4em;
}

html[data-estilo="suave-emil"] :is(.text-formatted, .field--name-body) :is(ul, ol):not([class]) > li {
  margin: 0 0 .45em;
  padding-left: .25em;
}

html[data-estilo="suave-emil"] :is(.text-formatted, .field--name-body) ul:not([class]) > li::marker {
  color: #049EC5;
  font-size: 1.1em;
}

html[data-estilo="suave-emil"] :is(.text-formatted, .field--name-body) ol:not([class]) > li::marker {
  color: #037693;
  font-weight: 700;
}

/* ---------- 27 · Mismo hueco entre migas y primer bloque (26-oct-2026) ----------
 * #main-wrapper lleva 30px arriba en escritorio (style.css). En las páginas
 * con bloque de título (listados, artículos) no se nota porque el H1 va antes;
 * en el resto (bono, partido, blog, autor, ligas) el primer bloque quedaba
 * a 44-54px de las migas, frente a los 14px de la reseña. Todas como la reseña:
 * 14px en escritorio y 10px en móvil. Reseña y bono: lo pone su cabecera.
 */
html[data-estilo="suave-emil"] body:not(:has(#block-webapuestas-titulodelapagina)) #main-wrapper {
  padding-top: 10px;
}

html[data-estilo="suave-emil"] body:not(:has(#block-webapuestas-titulodelapagina)):is(.node--type-casa-de-apuestas, .node--type-bonus) #main-wrapper {
  padding-top: 0;
}

html[data-estilo="suave-emil"] body.node--type-partido .wbs-partido {
  padding-top: 0;
}

@media (min-width: 992px) {
  html[data-estilo="suave-emil"] body:not(:has(#block-webapuestas-titulodelapagina)) #main-wrapper {
    padding-top: 14px;
  }

  html[data-estilo="suave-emil"] body:not(:has(#block-webapuestas-titulodelapagina)):is(.node--type-casa-de-apuestas, .node--type-bonus) #main-wrapper {
    padding-top: 0;
  }
}

/* ---------- 28 · Retoques del Ensayo final (26-oct-2026) ---------- */

/* Menú del móvil: su cabecera, igual que la de la web (negra, logo blanco).
 * La V3 la había dejado blanca con el logo oscuro (bloque «LOGO»). */
html[data-estilo="suave-emil"] .offcanvas.wa-nav .wa-nav__header {
  border-bottom: 2px solid #049EC5;
  background: #131313;
}

html[data-estilo="suave-emil"] .offcanvas.wa-nav .wa-nav__header img {
  content: normal;
}

html[data-estilo="suave-emil"] .offcanvas.wa-nav .wa-nav__close {
  color: #fff;
}

/* Pronósticos: cada partido se distingue mejor (borde azulado y sombra). */
html[data-estilo="suave-emil"] .wbs-listing__grid article.wbs-listing-card {
  border: 1px solid rgba(4, 158, 197, .22);
  box-shadow: 0 4px 14px rgba(19, 19, 19, .07);
}

/* Rankings: «+18 · Nuevos usuarios · Aplican T&C» legible (era 10,5px gris claro). */
html[data-estilo="suave-emil"] :is(.wa-rk-card, .wa-cmp, .wa-fila) .wa-legal {
  color: #4A4A4A;
  font-size: 12px;
  line-height: 1.4;
}

/* Botón secundario (abre el recomendador): aspecto de enlace, no de botón. */
html[data-estilo="suave-emil"] .wa-est--f .wa-est__btn-sec,
html[data-estilo="suave-emil"] .wa-est--f .wa-est__btn-sec:hover,
html[data-estilo="suave-emil"] .wa-est--f .wa-est__btn-sec:active {
  display: block;
  width: 100%;
  min-height: 44px;
  margin-top: 4px;
  padding: 10px 8px;
  border: 0;
  background: transparent;
  color: #037693;
  font: 600 14px/1.3 Inter, system-ui, sans-serif;
  text-align: center;
  text-decoration: underline;
  text-decoration-color: rgba(3, 118, 147, .35);
  text-underline-offset: 3px;
  box-shadow: none;
  transform: none;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] .wa-est--f .wa-est__btn-sec:hover {
    text-decoration-color: currentColor;
  }
}

/* /bonos en móvil: foto más baja para que quepan 2 bonos por pantalla. */
@media (max-width: 600px) {
  html[data-estilo="suave-emil"] .wa-imgs article.wa-img .wa-img__visual {
    height: 120px;
    min-height: 0;
    aspect-ratio: auto;
  }

  html[data-estilo="suave-emil"] .wa-imgs article.wa-img .wa-img__visual img {
    height: 100%;
    object-fit: cover;
  }
}

/* Ficha del ranking, «Bonos para nuevos clientes»: los bonos que haya se
 * reparten toda la fila (auto-fit; con auto-fill quedaba un hueco en blanco).
 * En móvil, uno debajo de otro (a dos por fila no caben las condiciones). */
html[data-estilo="suave-emil"] .wa-bonos .wa-bonos__lista {
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}

/* ---------- 29 · Texto de los pronósticos como el cuerpo (26-oct-2026) ----------
 * El análisis del partido va en .partido-preview-ia (no en .node__content ni
 * .field--name-body), así que no recibía los estilos de texto de la V3:
 * h2 de 20px sin la barra, listas en Poppins sin interlineado, viñeta negra.
 * Mismos valores que el cuerpo de las páginas. El TOC (listas con clase) no
 * se toca. */
html[data-estilo="suave-emil"] body .wbs-partido .partido-preview-ia h2 {
  margin: 30px 0 12px;
  color: #131313;
  font: 600 25px/1.2 Poppins, sans-serif;
  letter-spacing: -.015em;
}

html[data-estilo="suave-emil"] body .wbs-partido .partido-preview-ia h2::before {
  content: "";
  display: block;
  width: 40px;
  height: 3px;
  margin-bottom: 14px;
  border-radius: 2px;
  background: #049EC5;
}

html[data-estilo="suave-emil"] body .wbs-partido .partido-preview-ia h3 {
  margin: 22px 0 10px;
  color: #131313;
  font: 700 18px/1.2 Poppins, sans-serif;
  letter-spacing: -.01em;
}

html[data-estilo="suave-emil"] body .wbs-partido .partido-preview-ia p {
  margin: 0 0 16px;
  color: #131313;
  font: 400 15px/1.7 Inter, system-ui, sans-serif;
}

html[data-estilo="suave-emil"] body .wbs-partido .partido-preview-ia :is(ul, ol):not([class]) {
  margin: 0 0 1.1em;
  padding-left: 1.4em;
}

html[data-estilo="suave-emil"] body .wbs-partido .partido-preview-ia :is(ul, ol):not([class]) > li {
  margin: 0 0 .45em;
  padding-left: .25em;
  color: #131313;
  font: 400 15px/1.7 Inter, system-ui, sans-serif;
}

html[data-estilo="suave-emil"] body .wbs-partido .partido-preview-ia ul:not([class]) > li::marker {
  color: #049EC5;
  font-size: 1.1em;
}

html[data-estilo="suave-emil"] body .wbs-partido .partido-preview-ia ol:not([class]) > li::marker {
  color: #037693;
  font-weight: 700;
}

html[data-estilo="suave-emil"] body .wbs-partido .partido-preview-ia :is(p, li) a:not([class]) {
  color: #037693;
  text-decoration: underline;
  text-decoration-color: rgba(3, 118, 147, .35);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
  html[data-estilo="suave-emil"] body .wbs-partido .partido-preview-ia :is(p, li) a:not([class]):hover {
    text-decoration-color: #037693;
  }
}

@media (max-width: 767.98px) {
  html[data-estilo="suave-emil"] body .wbs-partido .partido-preview-ia :is(p, :is(ul, ol):not([class]) > li) {
    font-size: 16px;
  }

  html[data-estilo="suave-emil"] body .wbs-partido .partido-preview-ia h2 {
    font-size: 22px;
  }
}