/* =============================================================
   Odontomédic · CSS propio del sitio
   Solo lo que ni los Ajustes del sitio de Elementor ni el
   Personalizador de Astra saben hacer. Colores y fuentes salen
   siempre de las variables globales (--ast-global-color-N y
   --e-global-*), nunca escritos a mano.
   Vive en el tema hijo Odontomédic (Astra) y lo carga su functions.php,
   el último, para ganar al CSS de Astra y de Elementor.
   ============================================================= */

/* ── Suavizado de fuentes como en la maqueta ──
   Astra pone «antialiased» en el body y en Mac el texto sale más fino que
   en el diseño aprobado. La maqueta usa el del sistema. */
html body { -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; }

/* ── Contenedor del cromo · 1440 de máximo con 80 dentro (.contenedor) ── */
@media (min-width: 922px) {
  .site-header .ast-container,
  .site-footer .ast-container {
    max-width: 1440px;
    padding-left: 80px;
    padding-right: 80px;
  }
}

/* ── 1-v5 · Barra superior: tres datos centrados en caja alta ── */
.barra-datos {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 32px;
  font-family: 'Source Sans 3', sans-serif;
  font-weight: 300;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ast-global-color-4);
}
.barra-datos a { color: inherit; text-decoration: none; }
/* Móvil y tablet (24/09): dirección abreviada y horario en una línea, en
   minúscula para que quepa; el teléfono ya es el icono de la cabecera */
.barra-datos .solo-movil { display: none; }
@media (max-width: 921px) {
  .barra-datos { gap: 10px; font-size: 12px; letter-spacing: .02em; text-transform: none; white-space: nowrap; }
  .barra-datos .solo-escritorio { display: none; }
  .barra-datos .solo-movil { display: inline; }
}
/* El separador es un filete vertical, no un punto: en caja alta se perdía */
.barra-datos .sep {
  width: 1px;
  height: 12px;
  background: var(--ast-global-color-8);
  opacity: .45;
}

/* ── 2-v5 · Logo con el descriptor debajo ── */
.site-header .site-branding.ast-site-identity {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 0;
}
.site-header .ast-site-title-wrap .site-description {
  margin: 0;
  font-family: 'Source Sans 3', sans-serif;
  font-weight: 300;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ast-global-color-3);
}
/* En móvil el descriptor no puede ser más ancho que el logo (24/09) */
@media (max-width: 767px) {
  .site-header .ast-site-title-wrap .site-description { font-size: 10px; letter-spacing: .16em; }
}
/* La hamburguesa marca el foco solo con teclado: al tocarla con el dedo Astra
   le ponía un borde punteado alrededor (24/09) */
.ast-header-break-point .menu-toggle:focus:not(:focus-visible) { outline: 0; border-color: transparent; }

/* ── Menú: la página actual se marca con el filete de oro, no con color ── */
.ast-builder-menu-1 .main-header-menu { gap: 32px; }
.ast-builder-menu-1 .main-header-menu > .menu-item > .menu-link {
  padding: 0 0 7px;
  border-bottom: 2px solid transparent;
}
.ast-builder-menu-1 .main-header-menu > .current-menu-item > .menu-link {
  border-bottom-color: var(--ast-global-color-7);
}
/* El menú se centra en el hueco entre logo y botones, no en la página
   (en la maqueta: .menu { margin-inline: auto } dentro de una fila flex) */
@media (min-width: 922px) {
  .site-primary-header-wrap .ast-builder-grid-row { display: flex; align-items: center; }
  .site-primary-header-wrap .site-header-primary-section-center { flex: 1; justify-content: center; }
}

/* Botones de cabecera: una línea, 46 px de alto, 12 px entre ellos */
.site-header .site-header-primary-section-right { gap: 12px; }
.site-header .site-header-primary-section-right > .ast-builder-layout-element { margin: 0; padding: 0; }
.site-header .ast-builder-button-wrap .ast-custom-button {
  white-space: nowrap;
  box-sizing: border-box;
  min-height: 46px;
  display: flex;
  align-items: center;
  transition: transform 120ms ease-out, border-color 120ms ease-out, filter 120ms ease-out;
}
/* Relleno de la maqueta (12 × 26). Astra escribe el suyo con este mismo
   selector de atributo; se iguala la especificidad con .site-header delante */
.site-header [data-section*="section-hb-button-"] .ast-builder-button-wrap .ast-custom-button {
  padding: 12px 26px;
}
/* «Llamar ahora» es el secundario: contorno de filete, sin relleno */
.site-header .ast-header-button-1 .ast-custom-button {
  background: transparent;
  border: 1px solid var(--ast-global-color-6);
}
.site-header .ast-header-button-1 .ast-custom-button:hover { border-color: var(--ast-global-color-0); transform: translateY(-1px); }
.site-header .ast-header-button-2 .ast-custom-button:hover { transform: translateY(-1px); }

/* ── Mega menús: panel a lo ancho en navy ── */
.astra-megamenu-li .astra-full-megamenu-wrapper {
  background: var(--ast-global-color-0);
  border-top: 1px solid var(--ast-global-color-8);
  box-shadow: 0 1px 3px rgba(18, 35, 61, .10);
}
.ast-builder-menu-1 .astra-megamenu-li .astra-megamenu {
  max-width: 1440px;
  margin: 0 auto;
  padding: 32px 80px;
  background: transparent;
  border: 0;
  box-shadow: none;
  gap: 32px;
}
/* Enlaces de dentro: blanco, 13 px mayúsculas (heredan el estilo del menú
   principal, no el peso del cuerpo), oro al pasar. Antes salían a 15 px y en
   seminegrita — corregido el 23/09, a petición de Antonio. */
.ast-builder-menu-1 .astra-megamenu .menu-link {
  display: inline-block;
  padding: 0;
  color: var(--ast-global-color-4);
  font-size: 13px;
  line-height: 1.5;
  font-weight: 300;
  letter-spacing: .10em;
  text-transform: uppercase;
  border-bottom: 1px solid transparent;
}
.ast-builder-menu-1 .astra-megamenu .menu-link:hover {
  color: var(--ast-global-color-7);
  border-bottom-color: var(--ast-global-color-7);
}
.ast-builder-menu-1 .astra-megamenu .sub-menu { background: transparent; border: 0; }
.ast-builder-menu-1 .astra-megamenu .sub-menu li + li { margin-top: 10px; }
/* Tratamientos: el título de cada columna es la vertical, en oro y sin enlace, con la
   letra del área de cada profesional del menú de Equipo (Antonio, 14/10: «bastante más
   pequeños», en la línea de Equipo). Antes, 15 px / .26em (23/09).
   Astra pinta en blanco `.ast-desktop .menu-item-52 .menu-item > .menu-link`: de ahí
   la especificidad. Las columnas nuevas son «#» hasta marcar «Desactivar enlace» en
   Astra Pro, y el clic se anula aquí. */
.ast-desktop .ast-builder-menu-1 .mega-tratamientos .astra-megamenu > .menu-item > .menu-link {
  display: block;
  margin-bottom: 6px;
  color: var(--ast-global-color-7);
  font-size: 12px;
  line-height: 1.4;
  font-weight: 300;
  letter-spacing: .18em;
  text-transform: uppercase;
  border: 0;
  pointer-events: none;
  cursor: default;
}
/* Equipo: el área de cada profesional, debajo del nombre */
.astra-megamenu .area {
  display: block;
  font-weight: 300;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ast-global-color-8);
  margin-top: 4px;
}
.astra-megamenu .ast-icon.icon-arrow { display: none; }

/* ── Menú de móvil y tablet (24/09) ──
   Es el desplegable de Astra (Cabecera móvil → tipo Desplegable, «Destino:
   enlace»: el primer toque abre el grupo y el segundo entra) y Astra ya cierra
   un grupo al abrir otro. Aquí solo va lo que su panel no sabe hacer: ocupar la
   pantalla en navy, los grupos de Tratamientos como títulos fijos, las filas y
   la franja fija de abajo (elemento HTML 2 de Astra). Sin JavaScript. */
/* Alto de la cabecera de móvil (64) y tablet (80), el de Astra. La cabecera fija
   de Astra Pro la «encoge» al hacer scroll, pero en móvil le aplicaba el alto de
   escritorio (86) y descuadraba el panel: aquí se queda con su alto */
@media (max-width: 921px) { :root { --cab-movil: 80px; } }
@media (max-width: 767px) { :root { --cab-movil: 64px; } }
@media (max-width: 921px) {
  #ast-mobile-header .ast-primary-header-bar.ast-header-sticked,
  #ast-mobile-header .ast-primary-header-bar.ast-header-sticked .site-primary-header-wrap { min-height: var(--cab-movil); }
  #ast-mobile-header .ast-sticky-shrunk .ast-site-identity { padding: 0; }

  body.ast-main-header-nav-open { overflow: hidden; }
  body.ast-main-header-nav-open .qlwapp__container,
  body.ast-main-header-nav-open #ast-mobile-header .ast-header-social-wrap { display: none; }

  /* Con el menú abierto se va la barra superior: la cabecera mide siempre lo
     mismo esté la página arriba o desplazada, y el panel llena justo el resto */
  body.ast-main-header-nav-open #ast-mobile-header .ast-above-header-wrap { display: none; }
  body.ast-main-header-nav-open #ast-mobile-header .ast-mobile-header-content {
    display: flex;
    flex-direction: column;
    height: calc(100svh - var(--cab-movil));
    max-height: none; /* Astra Pro lo limita al 60vh */
    align-items: stretch;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: var(--ast-global-color-0);
  }
  #ast-mobile-header .ast-mobile-header-content .ast-builder-menu-mobile { flex: 1 0 auto; }
  #ast-mobile-header .main-header-bar-navigation,
  #ast-mobile-header .ast-mobile-header-content .main-navigation { background: transparent; }

  /* Primer nivel: filas de 56 con filete, en caja alta como el menú de escritorio */
  #ast-hf-mobile-menu { padding: 8px 24px 24px; background: transparent; }
  #ast-hf-mobile-menu .menu-item { border: 0; background: transparent; }
  /* z-index: Astra les deja el 99999 de los desplegables de escritorio y pasaban por encima de la franja fija */
  #ast-hf-mobile-menu .sub-menu { z-index: auto; background: transparent; border: 0; box-shadow: none; margin: 0; padding: 0; }
  #ast-hf-mobile-menu > .menu-item { position: relative; border-bottom: 1px solid color-mix(in srgb, var(--ast-global-color-4) 14%, transparent); }
  #ast-hf-mobile-menu .menu-link {
    display: flex;
    align-items: center;
    min-height: 56px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--ast-global-color-4);
    font-family: 'Source Sans 3', sans-serif;
    font-weight: 300;
    font-size: 15px;
    line-height: 1.3;
    letter-spacing: .14em;
    text-transform: uppercase;
  }
  #ast-hf-mobile-menu .menu-link > .ast-icon,
  #ast-hf-mobile-menu .dropdown-menu-toggle { display: none; }
  /* Página actual: en oro y con punto */
  #ast-hf-mobile-menu > .current-menu-item > .menu-link { color: var(--ast-global-color-7); }
  #ast-hf-mobile-menu > .current-menu-item > .menu-link::before {
    content: "";
    width: 6px;
    height: 6px;
    margin-right: 14px;
    border-radius: 50%;
    background: currentColor;
  }
  /* La flecha del grupo, en oro; gira al abrirse */
  #ast-hf-mobile-menu > .menu-item > .ast-menu-toggle {
    position: absolute;
    top: 0;
    right: 0;
    width: 44px;
    height: 56px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    color: var(--ast-global-color-7);
  }
  #ast-hf-mobile-menu > .menu-item > .ast-menu-toggle svg { width: 13px; height: 13px; fill: currentColor; transition: transform 200ms ease-out; }
  #ast-hf-mobile-menu > .ast-submenu-expanded > .ast-menu-toggle svg { transform: rotate(180deg); }
  #ast-hf-mobile-menu > .menu-item > .sub-menu { padding-bottom: 16px; }

  /* Tratamientos: las cuatro columnas del mega menú, como grupos con título en
   oro (Rótulo seminegrita) y sus enlaces siempre a la vista, con filete a la
   izquierda. Astra los pliega por dentro; el !important gana a su estilo en línea */
  #ast-hf-mobile-menu > .menu-item > .sub-menu > .menu-item-has-children > .menu-link {
    min-height: 0;
    padding: 16px 0 8px;
    color: var(--ast-global-color-7);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .18em;
    pointer-events: none;
  }
  #ast-hf-mobile-menu > .menu-item > .sub-menu > .menu-item-has-children > .ast-menu-toggle { display: none; }
  #ast-hf-mobile-menu > .menu-item > .sub-menu > .menu-item-has-children > .sub-menu {
    display: block !important;
    padding-left: 18px;
    border-left: 1px solid color-mix(in srgb, var(--ast-global-color-7) 50%, transparent);
  }
  #ast-hf-mobile-menu .sub-menu .sub-menu .menu-link { min-height: 44px; font-size: 13px; letter-spacing: .10em; }

  /* Equipo: nombre y, debajo, la especialidad, en filas de 56 */
  #ast-hf-mobile-menu > .menu-item > .sub-menu > .menu-item:not(.menu-item-has-children) > .menu-link {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
    font-size: 14px;
    letter-spacing: .06em;
    text-transform: none;
  }
  #ast-hf-mobile-menu .area {
    display: block;
    font-size: 11px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--ast-global-color-8);
  }

  /* La franja fija de abajo: Pedir cita, Llamar y la dirección */
  #ast-mobile-header .ast-mobile-header-content .ast-header-html-2 {
    position: sticky;
    bottom: 0;
    margin-top: auto;
    z-index: 2;
    padding: 16px 24px calc(16px + env(safe-area-inset-bottom));
    background: var(--ast-global-color-1);
  }
  #ast-mobile-header .ast-header-html-2 .ast-header-html,
  #ast-mobile-header .ast-header-html-2 .ast-builder-html-element { width: 100%; }
  .menu-pie-botones { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .menu-pie-botones a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 48px;
    border-radius: 999px;
    font-family: var(--e-global-typography-btncromo-font-family), sans-serif;
    font-size: var(--e-global-typography-btncromo-font-size);
    font-weight: var(--e-global-typography-btncromo-font-weight);
    letter-spacing: var(--e-global-typography-btncromo-letter-spacing);
    text-transform: var(--e-global-typography-btncromo-text-transform);
    text-decoration: none;
  }
  /* Mismo aspecto al pasar, al tocar y con foco: Astra les ponía su color de
     enlace (negro) porque viven dentro de su elemento HTML */
  .menu-pie-botones a { -webkit-tap-highlight-color: transparent; }
  .menu-pie-botones .menu-pie-cita,
  .menu-pie-botones .menu-pie-cita:is(:hover, :focus, :active, :visited) { background: var(--ast-global-color-7); color: var(--ast-global-color-2); }
  .menu-pie-botones .menu-pie-llamar,
  .menu-pie-botones .menu-pie-llamar:is(:hover, :focus, :active, :visited) { border: 1px solid var(--ast-global-color-7); color: var(--ast-global-color-4); }
  .menu-pie-llamar .ico-m { width: 16px; height: 16px; color: var(--ast-global-color-7); }
  .menu-pie-datos { display: block; margin-top: 12px; text-align: center; font-size: 13px; line-height: 1.4; color: var(--ast-global-color-8); }
}

/* ── 19 · Pie de cinco columnas ── */
@media (min-width: 922px) {
  .site-footer .ast-builder-grid-row-container-inner {
    max-width: 1440px;
    margin: 0 auto;
    padding-left: 80px;
    padding-right: 80px;
  }
}
.site-footer .footer-widget-area[data-section] .ast-builder-html-element,
.site-footer .footer-widget-area[data-section] { text-align: left; }
.site-primary-footer-wrap .ast-builder-footer-grid-columns {
  grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr;
  gap: 32px;
}
.site-footer .ast-builder-html-element { color: var(--ast-global-color-4); }
/* En la maqueta el tracking de rótulo lo pisa la regla de titulares de
   Newsreader (.tipo-candidata h3 → −0.015em). Es lo aprobado: se copia. */
.site-footer .pie-titulo {
  margin: 0 0 16px;
  font-family: 'Source Sans 3', sans-serif;
  font-weight: 600;
  font-size: 12px;
  line-height: 1.3;
  letter-spacing: -0.015em;
  text-transform: uppercase;
  color: var(--ast-global-color-8);
}
.site-footer .pie-txt,
.site-footer .dato-icono,
.site-footer .widget_nav_menu li {
  font-size: 15px;
  line-height: 1.5;
}
.site-footer .pie-txt { margin: 16px 0 0; }
.site-footer .reclamos {
  margin: 32px 0 0;
  font-size: 12px;
  line-height: 1.9;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ast-global-color-8);
}
/* WordPress envuelve el logo en un <p>: sin margen, como el .logo de la maqueta */
.ast-footer-html-1 .ast-builder-html-element > p:first-child { margin: 0; }
.site-footer .logo-pie { display: block; line-height: 0; }
.site-footer .logo-pie img { height: 38px; width: auto; display: block; }
.site-footer .dato-icono {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-bottom: 10px;
}
/* Iconos de línea como máscara: Astra borra los <svg> de sus bloques HTML.
   Mismo trazo de 1.5 que en la maqueta; el color lo da currentColor. */
.site-footer .dato-icono .ico {
  width: 20px; height: 20px; flex: none; margin-top: 1px;
  background: currentColor;
  -webkit-mask: var(--ico) center / 20px 20px no-repeat;
          mask: var(--ico) center / 20px 20px no-repeat;
}
.ico-pin   { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); }
.ico-tel   { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.6 10.8a15 15 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.24 11 11 0 0 0 3.5.56 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11 11 0 0 0 .56 3.5 1 1 0 0 1-.25 1z'/%3E%3C/svg%3E"); }
.ico-wa    { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.4 8.4 0 0 1-9 8.4 9 9 0 0 1-3.9-.9L3 20.5l1.5-4.4A8.4 8.4 0 0 1 12 3.1a8.4 8.4 0 0 1 9 8.4z'/%3E%3C/svg%3E"); }
.ico-reloj { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
.site-footer .widget_nav_menu ul { list-style: none; margin: 0; padding: 0; }
.site-footer .widget_nav_menu li { margin: 0 0 8px; }
.site-footer .widget { margin-bottom: 0; }
.site-footer a { color: var(--ast-global-color-4); text-decoration: none; }
.site-footer a:hover { text-decoration: underline; }

/* ── PIE EN MÓVIL (30/09): margen lateral de 24 px como el resto de la página y todo centrado ── */
@media (max-width: 921px) {
  .site-footer .ast-builder-grid-row-container-inner { padding-left: 24px; padding-right: 24px; }
  .site-footer .footer-widget-area[data-section],
  .site-footer .footer-widget-area[data-section] .ast-builder-html-element,
  .site-footer .widget { text-align: center; }
  .site-footer .logo-pie img { margin-inline: auto; }
  .site-footer .dato-icono { justify-content: center; text-align: left; }
  .site-footer .widget_nav_menu ul { text-align: center; }
  .site-below-footer-wrap .site-below-footer-inner-wrap { grid-template-columns: 1fr; margin-top: 48px; text-align: center; row-gap: 12px; }
  .site-below-footer-wrap .ast-footer-copyright, .site-below-footer-wrap .footer-nav-wrap .ast-nav-menu { text-align: center; justify-content: center; }
}

/* Cierre: filete encima, copyright a la izquierda y legales a la derecha */
.site-below-footer-wrap { padding-top: 0; min-height: 0; }
.site-below-footer-wrap .ast-builder-grid-row-container-inner { width: 100%; max-width: 1440px; }
.site-below-footer-wrap .site-below-footer-inner-wrap {
  width: 100%;
  max-width: none;
  font-size: 15px;
  color: var(--ast-global-color-4);
  grid-template-columns: 1fr 1fr;
  margin-top: 80px;
  padding-top: 32px;
  border-top: 1px solid var(--ast-global-color-8);
  line-height: 1.65;
}
.site-below-footer-wrap .ast-footer-copyright,
.site-below-footer-wrap .footer-nav-wrap .menu-link { font-size: 15px; }
.site-below-footer-wrap .footer-nav-wrap .ast-nav-menu { gap: 16px; }
.site-below-footer-wrap .footer-nav-wrap .menu-link { padding: 0; }

/* =============================================================
   COMPONENTES DE PÁGINA (Elementor)
   Clases que se ponen en «Avanzado → Clases CSS» del contenedor o
   del widget. Lo que Elementor no sabe expresar y nada más.
   ============================================================= */

/* El rótulo de sección es un <span> dentro de un <div>: sin esto hereda el
   interlineado del cuerpo (28 px) en vez del suyo (1.4) */
.rotulo .elementor-heading-title { display: block; }

/* Negritas como en la maqueta: allí el <strong> pide «bolder» sobre un 300 y la
   fuente solo se carga en 300 y 600, así que se queda en 300. Se replica tal
   cual; si se quieren negritas visibles, basta con quitar esta regla */
.elementor-widget-text-editor strong { font-weight: bolder; }

/* Los widgets de Elementor no llevan margen propio: separa el gap del contenedor */
.elementor-widget-text-editor p:last-child { margin-bottom: 0; }
/* Medida de lectura de la maqueta: ningún párrafo pasa de 34rem salvo que su
   componente diga otra cosa (p { max-width: var(--medida) }). En px y no en rem:
   Astra pone la raíz a 17 px y la maqueta está medida con 16 (34rem = 544 px) */
.elementor-widget-text-editor p { max-width: 544px; }
.elementor-widget-text-editor[class*="elementor-align-center"] p,
.elementor-widget-text-editor.texto-centrado p { margin-left: auto; margin-right: auto; }

/* ── Icono en círculo con el arco de oro (garantías, razones) ── */
.ico-circulo .elementor-icon-wrapper { line-height: 0; }
.ico-circulo .elementor-icon {
  position: relative;
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 999px;
  background: var(--e-global-color-tinte);
}
.ico-circulo .elementor-icon svg { width: 24px; height: 24px; }
.ico-circulo .elementor-icon::after {
  content: "";
  position: absolute;
  inset: -3px;
  border-radius: 999px;
  border: 2px solid transparent;
  border-top-color: var(--e-global-color-accent);
  border-right-color: var(--e-global-color-accent);
  transform: rotate(-30deg);
}
/* Garantías: el texto a 36 caracteres, centrado */
.texto-garantia p { max-width: 36ch; margin-left: auto; margin-right: auto; }

/* Iconos: todos los de la web son de LÍNEA (trazo 1.5, sin relleno). Elementor
   rellena los SVG con el color del icono mediante un selector por elemento; el
   !important es deliberado y solo toca el relleno: el color sigue siendo el que
   se elija en el widget, porque el trazo es currentColor. */
.elementor-icon svg, .elementor-button-icon svg, .elementor-icon-list-icon svg {
  fill: none !important;
  stroke: currentColor;
}

/* ── Botones ── */
.elementor-button { transition: transform 120ms ease-out, filter 120ms ease-out, background-color 120ms ease-out, border-color 120ms ease-out; }
/* Fondo y texto del primario, escritos aquí a propósito (23/09): un Global
   Widget de Elementor no genera el CSS de sus propios __globals__ en la página
   que lo usa (bug conocido del módulo, comprobado al revisar por qué el botón
   del héroe salía sin relleno) — así que el color no puede depender de eso.
   Siempre por referencia a los globales, nunca un hex suelto. */
.btn-primario .elementor-button { background-color: var(--e-global-color-accent); color: var(--e-global-color-text); }
.btn-primario.texto-blanco .elementor-button { color: var(--e-global-color-blanco); }
.btn-primario .elementor-button:hover { filter: brightness(.92); transform: translateY(-1px); }
.btn-primario .elementor-button-icon svg { width: 1.05em; height: 1.05em; transition: transform 300ms ease-out; }
.btn-primario .elementor-button:hover .elementor-button-icon svg { transform: translateX(4px); }
/* Secundario sobre fondo oscuro: contorno de oro, texto blanco; al pasar se rellena */
.elementor-widget.btn-sec-oscuro .elementor-button {
  background: transparent;
  color: var(--e-global-color-blanco);
  border: 1px solid var(--e-global-color-accent);
}
.elementor-widget.btn-sec-oscuro .elementor-button:hover {
  background: var(--e-global-color-accent);
  color: var(--e-global-color-text);
  transform: translateY(-1px);
}
/* Tamaño de los botones del héroe: 48 de alto, 13 × 24 de relleno. La tipografía
   (Botón cromo: mayúsculas, 600) va aquí por el mismo motivo del comentario de
   arriba — los Global Widget del héroe no la generan solos. */
.btn-heroe .elementor-button {
  min-height: 48px;
  padding: 13px 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--e-global-typography-btncromo-font-family), sans-serif;
  font-size: var(--e-global-typography-btncromo-font-size);
  font-weight: var(--e-global-typography-btncromo-font-weight);
  text-transform: var(--e-global-typography-btncromo-text-transform);
  letter-spacing: var(--e-global-typography-btncromo-letter-spacing);
  line-height: var(--e-global-typography-btncromo-line-height);
}

/* ── 3-v5 · Héroe a sangre ── */
.heroe-sobrio {
  position: relative;
  overflow: hidden;
  min-height: min(790px, calc(100vh - 300px));
  min-height: min(790px, calc(100svh - 300px));
}
/* La foto va detrás de todo, ampliada hacia el monitor de la radiografía */
.heroe-sobrio > .foto-fondo {
  position: absolute;
  inset: 0;
  margin: 0;
  z-index: 0;
}
.heroe-sobrio > .foto-fondo,
.heroe-sobrio > .foto-fondo .elementor-widget-container { height: 100%; }
.heroe-sobrio > .foto-fondo img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: 50% 30%;
  transform: scale(1.75);
  transform-origin: 20% 24%;
  filter: saturate(.9) contrast(1.05);
}
/* Velo vertical de navy hondo a navy y vuelta */
.heroe-sobrio::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(to bottom, rgba(8, 32, 63, .96) 0%, rgba(22, 61, 118, .93) 50%, rgba(8, 32, 63, .96) 100%);
  pointer-events: none;
}
.heroe-sobrio > .heroe-texto { position: relative; z-index: 2; }
/* El relleno vertical va aquí y no en el contenedor: depende del ALTO de la
   ventana, y Elementor no tiene reglas por alto. Mismos cortes que la maqueta */
.heroe-sobrio > .heroe-texto { padding-top: 112px; padding-bottom: 112px; }
@media (max-height: 980px) { .heroe-sobrio > .heroe-texto { padding-top: 48px; padding-bottom: 48px; } }
@media (max-height: 760px) { .heroe-sobrio > .heroe-texto { padding-top: 32px; padding-bottom: 32px; --gap: 16px; --row-gap: 16px; } }
/* Móvil: más aire arriba y abajo (24/09, a petición de Antonio). Va después de
   los cortes por alto para ganarles; en móviles bajos (SE) se queda en 48 */
@media (max-width: 767px) { .heroe-sobrio > .heroe-texto { padding-top: 72px; padding-bottom: 72px; } }
@media (max-width: 767px) and (max-height: 700px) { .heroe-sobrio > .heroe-texto { padding-top: 48px; padding-bottom: 48px; } }
.display-heroe .elementor-heading-title { text-wrap: balance; }
/* La entradilla del héroe va a 42rem (672 px), no a la medida general de 544 */
.entradilla-heroe p { max-width: none; }

/* El H1 con la keyword, en oro y entre dos filetes que llegan al borde de la caja */
.rotulo-regla { width: 100%; }
.rotulo-regla .elementor-heading-title {
  display: flex;
  align-items: center;
  gap: 32px;
  margin: 0;
}
.rotulo-regla .elementor-heading-title::before,
.rotulo-regla .elementor-heading-title::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--e-global-color-accent);
  opacity: .5;
}
/* Móvil (24/09): el H1 va alineado a la izquierda, con un solo filete corto
   delante; el de la derecha no cabe sin partir la keyword en dos líneas */
@media (max-width: 767px) {
  .rotulo-regla .elementor-heading-title { gap: 14px; }
  .rotulo-regla .elementor-heading-title::before { flex: 0 0 28px; }
  .rotulo-regla .elementor-heading-title::after { display: none; }
}
.bloque-accion { width: 100%; }

/* ── Insignia de Google: nota, estrellas y reseñas en una pastilla blanca ── */
.google {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 12px 18px;
  background: var(--e-global-color-blanco);
  border: 1px solid transparent;
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(18, 35, 61, .10);
  color: var(--e-global-color-text);
}
/* Astra subraya los enlaces del contenido (.ast-single-post .entry-content a); la
   maqueta también lo hace en el texto corrido, así que solo se exceptúan los
   componentes: cards y cajas enlazadas, botones, enlaces con flecha, insignias.
   La insignia de Google ya no es un enlace (23/09), pero .google * se deja por
   si algún hijo suyo lo fuera en el futuro. */
.google *,
.ast-single-post .entry-content a.e-con, .ast-single-post .entry-content a.e-con *,
.ast-single-post .entry-content .enlace-flecha a,
.ast-single-post .entry-content a.elementor-button { text-decoration: none; }
.google .marca-nota { display: flex; align-items: center; gap: 8px; }
.google .ico-google { display: block; width: 18px; height: 18px; flex: none; }
.google .nota { font-weight: 600; font-size: 19px; line-height: 1.2; }
.google > span:last-child { display: flex; flex-direction: column; align-items: center; gap: 3px; line-height: 1; }
.google .estrellas { display: flex; gap: 2px; }
.google .estrellas .ico-m { width: 15px; height: 15px; color: var(--e-global-color-accent); }
.google .detalle { font-size: 12px; line-height: 1.5; color: var(--e-global-color-tinta2); }
/* Móvil (24/09): sin pastilla, en una sola fila sobre el navy y justo antes
   de los botones. La G va en un círculo blanco para que se lea sobre oscuro */
@media (max-width: 767px) {
  .google { flex-direction: row; gap: 10px; padding: 0; background: none; box-shadow: none; border: 0; color: var(--e-global-color-blanco); }
  .google .ico-google { width: 28px; height: 28px; padding: 6px; box-sizing: border-box; border-radius: 50%; background: var(--e-global-color-blanco); }
  .google .nota { font-size: 17px; }
  .google > span:last-child { flex-direction: row; align-items: center; gap: 10px; }
  .google .detalle { font-size: 13px; color: var(--e-global-color-blanco); opacity: .8; }
}

/* ── 39 · Marca de agua de la O ── Anillo decorativo que asoma por una esquina.
   marca-o-pie: abajo a la izquierda. Sobre navy va en filete navy al 14 % */
[class*="marca-o"] { position: relative; overflow: hidden; }
[class*="marca-o"] > .e-con-inner { position: relative; z-index: 1; }
.marca-o-pie::after {
  content: "";
  position: absolute;
  bottom: -20%;
  left: -8%;
  width: 640px;
  aspect-ratio: 1;
  border: 112px solid var(--e-global-color-tinte);
  border-radius: 999px;
  pointer-events: none;
  z-index: 0;
}
/* marca-o-arriba: arriba a la derecha. Sobre tinte el anillo es blanco */
.marca-o-arriba::after {
  content: "";
  position: absolute;
  top: -16%;
  right: -6%;
  width: 640px;
  aspect-ratio: 1;
  border: 112px solid var(--e-global-color-blanco);
  border-radius: 999px;
  pointer-events: none;
  z-index: 0;
}
.s03.marca-o-pie::after { border-color: var(--e-global-color-filnavy); opacity: .14; }

/* ── 14-v5 · Portada de equipo: foto 21:9, velo desde abajo y placa navy ── */
/* En la maqueta es una <figure> y conserva los 40 px de margen lateral del
   navegador: la foto aprobada mide 1200, no 1280 */
.e-con.equipo-portada { position: relative; border-radius: 16px; overflow: hidden; --width: calc(100% - 80px); width: calc(100% - 80px); }
.equipo-portada .foto-portada img {
  display: block;
  width: 100%;
  aspect-ratio: 21 / 9;
  object-fit: cover;
  object-position: 50% 32%;
  filter: saturate(.9) contrast(1.05);
}
.equipo-portada::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(8, 32, 63, .92) 0%, rgba(22, 61, 118, .45) 38%, rgba(22, 61, 118, 0) 100%);
  pointer-events: none;
}
.equipo-portada > .placa {
  position: absolute;
  left: 32px;
  bottom: 32px;
  max-width: 480px;
  border-radius: 16px;
  z-index: 1;
}
/* Móvil (24/09): la foto a todo el ancho y en 3:2 para que quepa el equipo
   entero, y la placa interpuesta debajo, montada 48 px sobre el borde de la
   foto sin tapar caras (como la placa de la sede). Sin velo: ya no hay texto
   encima de la foto */
@media (max-width: 767px) {
  .e-con.equipo-portada { --width: 100%; width: 100%; overflow: visible; border-radius: 0; }
  .equipo-portada .foto-portada img { aspect-ratio: 3 / 2; object-position: 50% 30%; border-radius: 16px; }
  .equipo-portada::after { display: none; }
  .equipo-portada > .placa { position: relative; left: auto; bottom: auto; max-width: none; margin: -48px 16px 0; --width: calc(100% - 32px); width: calc(100% - 32px); }
}

/* ── Filete corto de oro (46 × 3), divisor de Elementor ── */
.filete-oro .elementor-divider-separator { border-radius: 6px; }
.filete-oro .elementor-divider { line-height: 0; }

/* ── 6 · Franja de tres cifras: columnas separadas por filete vertical ── */
.franja3 > .e-con { padding: 0 32px; }
.franja3 > .e-con:first-child { padding-left: 0; }
.franja3 > .e-con + .e-con { border-left: 1px solid var(--e-global-color-filete); }
.cifra .elementor-heading-title { display: block; }
.franja3 .elementor-widget-text-editor p { max-width: none; }
@media (max-width: 900px) {
  .franja3 > .e-con { padding: 0; }
  .franja3 > .e-con + .e-con { border-left: 0; border-top: 1px solid var(--e-global-color-filete); padding-top: 16px; margin-top: 16px; }
}

/* ── Párrafos seguidos con su margen natural (17 px entre ellos, como en la maqueta) ── */
.parrafos p { margin: 17px 0; }
.parrafos p:last-child { margin-bottom: 0; }

/* ── La frase-claim centrada: Newsreader 36, a 736 de ancho ── */
.claim p { max-width: none; }

/* ── 40 · Bloque con foto que sobresale ── */
.e-con.destacado-foto {
  position: relative;
  border: 1px solid var(--e-global-color-filete);
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(18, 35, 61, .10);
}
/* La foto rebasa la tarjeta 112 px por arriba y por abajo */
.destacado-foto > .foto-sobresale {
  align-self: stretch;
  margin: -112px 0 -112px 32px;
}
.destacado-foto > .foto-sobresale,
.destacado-foto > .foto-sobresale .elementor-widget-container { height: calc(100% + 224px); }
.destacado-foto > .foto-sobresale .elementor-widget-container { height: 100%; }
.destacado-foto > .foto-sobresale img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 16px;
  filter: saturate(.9) contrast(1.05);
}
/* Galones a dos columnas */
.galones-rejilla .elementor-icon-list-items {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 32px;
}
.galones-rejilla .elementor-icon-list-item { padding: 10px 0; margin: 0 !important; align-items: center; }
.galones-rejilla .elementor-icon-list-icon { width: 20px; }
/* Elementor pone la sangría del texto con padding-inline-start: se usa la misma propiedad */
.e-con .elementor-widget.galones-rejilla .elementor-icon-list-text { padding-inline-start: 16px; }
.galones-rejilla .elementor-icon-list-icon svg { width: 20px; min-width: 20px; height: 20px; flex: none; }
/* Elementor pinta el relleno con el color del icono, no el trazo: el oro va aquí */
.galones-rejilla .elementor-icon-list-icon { color: var(--e-global-color-accent); }
/* Nota con filete de oro a la izquierda */
.matiz {
  padding: 16px 32px;
  border-left: 3px solid var(--e-global-color-accent);
  border-radius: 6px;
  background: var(--e-global-color-tinte);
}
.destacado-foto .matiz { background: var(--e-global-color-blanco); }
.btn-bloque .elementor-button { width: 100%; justify-content: center; min-height: 48px; padding: 12px 26px; }
@media (max-width: 900px) {
  .galones-rejilla .elementor-icon-list-items { grid-template-columns: 1fr; }
  .e-con.destacado-foto { padding: 32px; }
  .destacado-foto > .foto-sobresale { margin: 0; }
  .destacado-foto > .foto-sobresale img { aspect-ratio: 4 / 3; height: auto; }
}

/* ── Enlace con flecha: «VER … →» ── */
.enlace-flecha .elementor-heading-title a { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; color: inherit; }
.enlace-flecha .flecha { display: inline-block; transition: transform 300ms ease-out; }
.enlace-flecha a:hover .flecha { transform: translateX(6px); }
/* Dato que falta: en cursiva y gris, para que se vea que está por confirmar */
.hueco { color: var(--e-global-color-tinta2); font-style: italic; }

/* ── 8 · Caja superpuesta sobre foto ── */
.foto-superpuesta { position: relative; }
/* Las fotos que abren caja de luz van envueltas en un enlace: en bloque, para
   que no deje el hueco de línea debajo de la foto (24/09) */
.foto-43 a, .foto-34 a, .foto-portada a { display: block; }
/* La caja de luz por encima del WhatsApp flotante (Social Chat usa 9999999) */
.elementor-lightbox { z-index: 99999999; }
.foto-43 img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 16px; filter: saturate(.9) contrast(1.05); }
.foto-superpuesta > .caja-navy {
  position: absolute;
  bottom: 0;
  left: -32px;
  width: 84%;
  border-radius: 16px;
}
/* Móvil y tablet (24/09, a petición de Antonio): la caja no se aparta debajo
   de la foto, se interpone montada 32 px sobre su borde (menos que la placa
   del equipo, para que tape poca foto), con 16 px a los lados */
@media (max-width: 900px) {
  .e-con.foto-superpuesta { padding-bottom: 0; }
  .foto-superpuesta > .caja-navy { position: relative; bottom: auto; left: auto; --width: calc(100% - 32px); width: calc(100% - 32px); margin: -32px 16px 0; }
}


/* ── Párrafos pegados al bloque de arriba (sin el margen superior natural) ── */
.parrafos--pegado p:first-child { margin-top: 0; }
/* Un <p> con letra de titular no lleva el tracking de los titulares (.tipo-candidata solo lo aplica a h1-h3) */
.e-con .elementor-widget.sin-tracking .elementor-heading-title { letter-spacing: normal; }
.claim--cursiva p { font-style: italic; max-width: none; }

/* ── 12 · Cabecera del índice: H2 y enlace en línea, filete debajo ── */
.e-con.cab-indice { border-bottom: 1px solid var(--e-global-color-filete); }

/* ── H3 del síntoma con el icono en círculo delante ── */
.titulo-sintoma .elementor-heading-title { display: flex; align-items: center; gap: 16px; }
.ico-circulo-m {
  position: relative;
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 52px;
  height: 52px;
  border-radius: 999px;
  background: var(--e-global-color-tinte);
  color: var(--e-global-color-primary);
}
.ico-circulo-m .ico-m { width: 24px; height: 24px; }
.ico-circulo-m::after {
  content: "";
  position: absolute;
  inset: -3px;
  border-radius: 999px;
  border: 2px solid transparent;
  border-top-color: var(--e-global-color-accent);
  border-right-color: var(--e-global-color-accent);
  transform: rotate(-30deg);
}

/* ── 10-v5 · Card de tratamiento compacta ── */
.e-con.card-trat {
  position: relative;
  aspect-ratio: 4 / 5;
  border-radius: 16px;
  overflow: hidden;
  text-decoration: none;
  justify-content: flex-end;
}
.card-trat > .foto-card { position: absolute; inset: 0; margin: 0; }
.card-trat > .foto-card, .card-trat > .foto-card .elementor-widget-container { height: 100%; }
.card-trat > .foto-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.9) contrast(1.05);
  transition: transform 1200ms ease-out;
}
.card-trat:hover > .foto-card img { transform: scale(1.1); }
.card-trat::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(8, 32, 63, .94) 0%, rgba(22, 61, 118, .7) 45%, rgba(22, 61, 118, .38) 100%);
  pointer-events: none;
}
.card-trat > .titulo-card { position: relative; z-index: 1; padding: 32px 16px; }
.card-trat .titulo-card .elementor-heading-title { display: block; }
.card-trat--apagada { cursor: default; }

/* ── Barra de CTA al cierre de un bloque ── */
/* El degradado nativo de Elementor no toma los colores globales: va aquí, con las variables */
.e-con.cta-barra { border-radius: 16px; background: linear-gradient(120deg, var(--e-global-color-primary) 0%, var(--e-global-color-text) 100%); }
.e-con.cta-barra > .elementor-widget-heading { width: auto; flex: 0 1 auto; max-width: 34ch; }
.e-con.cta-barra > .e-con { --width: auto; width: auto; flex: 0 0 auto; }
/* Tipografía (Botón: sin mayúsculas, 600) por el mismo motivo que .btn-heroe
   arriba — los Global Widget de "Pedir cita" y teléfono no la generan solos. */
.btn-normal .elementor-button {
  min-height: 48px;
  padding: 12px 26px;
  display: inline-flex;
  align-items: center;
  font-family: var(--e-global-typography-accent-font-family), sans-serif;
  font-size: var(--e-global-typography-accent-font-size);
  font-weight: var(--e-global-typography-accent-font-weight);
  line-height: var(--e-global-typography-accent-line-height);
}
.elementor-widget.btn-sec-filete .elementor-button {
  background: transparent;
  color: var(--e-global-color-blanco);
  border: 1px solid var(--e-global-color-filnavy);
}
.elementor-widget.btn-sec-filete .elementor-button:hover {
  background: var(--e-global-color-accent);
  color: var(--e-global-color-text);
  border-color: var(--e-global-color-accent);
}
.btn-sec-filete .elementor-button-icon { color: var(--e-global-color-accent); }
.btn-sec-filete .elementor-button:hover .elementor-button-icon { color: var(--e-global-color-text); }
.btn-sec-filete .elementor-button-icon svg { width: 18px; height: 18px; }
@media (max-width: 900px) {
  .e-con.cta-barra { padding: 32px; }
  .titulo-sintoma .elementor-heading-title { gap: 12px; }
  .ico-circulo-m { width: 42px; height: 42px; }
}


/* ── Tarjeta: fondo blanco, filete y radio 16 ── */
.e-con.tarjeta { border: 1px solid var(--e-global-color-filete); border-radius: 16px; }
.beneficio > .e-con { flex: 1; }
/* Check en círculo de 34 */
.check-circulo { flex: none; }
.check-circulo .elementor-icon-wrapper { line-height: 0; }
.check-circulo .elementor-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: var(--e-global-color-tinte);
}
.check-circulo .elementor-icon svg { width: 16px; height: 16px; }
/* Párrafos seguidos a 10 px */
.parrafos-10 p { margin: 0; }
.parrafos-10 p + p { margin-top: 10px; }
.p-ancho p { max-width: none; }

/* ── Caja de CTA en navy: el botón baja al pie de la caja ── */
.e-con.cta-caja { border-radius: 16px; }
.cta-caja > .btn-al-pie { margin-top: auto; }


/* marca-oro: el anillo en oro; sobre navy, muy apagado (7 %) */
.marca-oro.marca-o-arriba::after, .marca-oro.marca-o-pie::after { border-color: var(--e-global-color-accent); opacity: .22; }
.s09.marca-oro::after, .marca-oro.marca-navy::after { opacity: .07; }

/* ── Tarjeta-bloque: contenedor grande con filete. En navy, transparente ── */
.e-con.tarjeta-bloque { border: 1px solid var(--e-global-color-filete); border-radius: 16px; box-shadow: 0 1px 3px rgba(18, 35, 61, .10); }
.e-con.tarjeta-bloque--navy { border-color: var(--e-global-color-filnavy); box-shadow: none; }

/* ── Razones a dos columnas, separadas por filete vertical ── */
.razones > .razon:nth-child(2n+1) { padding: 0 32px 0 0; }
.razones > .razon:nth-child(2n) { padding: 0 32px; border-left: 1px solid var(--e-global-color-filete); }
.tarjeta-bloque--navy .razones > .razon:nth-child(2n) { border-left-color: var(--e-global-color-filnavy); }
.num .elementor-heading-title { display: block; }
.parrafos-0 p { margin: 0; }
@media (max-width: 900px) {
  .e-con.tarjeta-bloque { padding: 32px; }
  .razones > .razon:nth-child(n) { padding: 0; border-left: 0; }
}


/* ── Card destacada 3:4 con descripción y «Saber más» ── */
.e-con.card-trat--destacada { aspect-ratio: 3 / 4; }
.card-trat > .txt-card { position: relative; z-index: 1; }
.desc-card p { opacity: .75; max-width: none; }
.enlace-flecha--span .elementor-heading-title { display: inline-flex; align-items: center; gap: 8px; }
.card-trat:hover .enlace-flecha .flecha { transform: translateX(6px); }
.marca-o-pie.s10::after { border-color: var(--e-global-color-blanco); }


/* ── Fichas del equipo ── */
.retrato img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 16px; filter: saturate(.9) contrast(1.05); }
.nombre-ficha .elementor-heading-title a { color: var(--e-global-color-primary); }
.e-con .elementor-widget.colegiado .elementor-heading-title { display: block; line-height: 1.65; }
/* Marcador de foto pendiente: recuadro discontinuo con el nombre de lo que falta */
.e-con.marcador { background: var(--e-global-color-tinte); border: 1px dashed var(--e-global-color-filete); border-radius: 16px; }
.e-con.marcador-retrato { aspect-ratio: 3 / 4; }
.marcador .elementor-widget-text-editor { width: 100%; }
.marcador p { max-width: 34ch; margin-left: auto; margin-right: auto; }
/* El enlace suelto bajo un bloque va a 15/1.5, como su párrafo en la maqueta */
.e-con .elementor-widget.enlace-15 .elementor-heading-title { line-height: 1.5; }


/* ── Caja superpuesta en espejo: foto a la izquierda, caja hacia la derecha ── */
.foto-34 img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 16px; filter: saturate(.9) contrast(1.05); }
.foto-superpuesta--izq > .caja-navy { left: auto; right: -32px; }
.credencial { font-size: 12px; line-height: 1.5; letter-spacing: .18em; text-transform: uppercase; color: var(--e-global-color-teja); }

/* ── 25 · Cita a tamaño de titular, en cursiva y a todo el ancho ── */
.e-con.cita { border-left: 4px solid var(--e-global-color-accent); border-radius: 16px; }
.e-con .elementor-widget.cita-ancha-texto .elementor-heading-title { font-style: italic; letter-spacing: normal; }
.cita-autor .elementor-heading-title { display: block; }
.cita-autor .especialidad { color: var(--e-global-color-teja); }
@media (max-width: 900px) {
  .e-con.cita { padding: 32px; }
  .foto-superpuesta--izq > .caja-navy { right: auto; }
}


/* ── Avales: logos centrados, como mucho 160 × 72 ── */
.e-con.aval { min-height: 96px; text-align: center; }
.aval-logo img { max-width: 160px; max-height: 72px; width: auto; height: auto; object-fit: contain; }
.aval-pie p { max-width: 22ch; margin-left: auto; margin-right: auto; }
.e-con.aval--oscuro { border-radius: 16px; }


/* ── Foto de bloque 3:2 ── */
.foto-32 img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 16px; filter: saturate(.9) contrast(1.05); }

/* ── Tarjetas de razones numeradas ── */
.e-con.tarjeta-razon { border-radius: 16px; }
.ico-circulo--blanco .elementor-icon-wrapper { text-align: left; }

/* ── Aviso en línea: icono, texto y botón, con filete de oro ── */
.e-con.aviso-linea { border-left: 3px solid var(--e-global-color-accent); border-radius: 6px; }
.e-con.aviso-linea > .elementor-widget { width: auto; }
.ico-aviso .elementor-icon-wrapper { line-height: 0; }
.ico-aviso .elementor-icon svg { width: 20px; height: 20px; }


/* ── Cinta de antes y después: a sangre y en bucle ── */
.cab-casos .elementor-widget-heading { max-width: 544px; }
.e-con.cinta { overflow: hidden; }
.e-con.pista { width: max-content; flex-wrap: nowrap; animation: desliza 46s linear infinite; }
@keyframes desliza { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .e-con.pista { animation: none; } }
.e-con.pieza { position: relative; width: 360px; flex: none; border-radius: 16px; overflow: hidden; }
.foto-caso img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: saturate(.9) contrast(1.05); }
.pieza > .etiqueta { position: absolute; width: auto; margin: 0; }
.pieza .etiqueta .elementor-heading-title {
  display: block;
  padding: 4px 10px;
  border-radius: 6px;
  background: rgba(22, 61, 118, .72);
}
.pieza--h > .antes { left: 16px; bottom: 16px; }
.pieza--h > .despues { right: 16px; bottom: 16px; }
.pieza--v > .antes { left: 16px; top: 16px; }
.pieza--v > .despues { left: 16px; bottom: 16px; }
@media (max-width: 900px) { .e-con.pieza { width: 240px; } }


/* ── Caja de precio en navy: sobresale 32 px y entra con un fundido ── */
.e-con.precio {
  width: calc(100% + 32px);
  max-width: none;
  border: 1px solid var(--e-global-color-primary);
  border-radius: 16px;
  animation: entra 400ms ease-out both;
}
@keyframes entra { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .e-con.precio { animation: none; } }
.horquilla > .elementor-widget { width: auto; }
.cifra .elementor-heading-title { display: block; }

/* ── Tabla de horquillas sobre navy ── */
.tabla-precios .tabla { width: 100%; border-collapse: collapse; text-align: left; margin: 0; border: 0; }
.tabla-precios .tabla th, .tabla-precios .tabla td {
  padding: 16px;
  border: 0;
  border-bottom: 1px solid var(--e-global-color-filnavy);
  vertical-align: top;
  background: transparent;
}
.tabla-precios .tabla thead th {
  font-weight: 600;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--e-global-color-filnavy);
  border-bottom-color: var(--e-global-color-accent);
}
.tabla-precios .tabla tbody th { font-weight: 600; font-size: 17px; line-height: 1.65; color: var(--e-global-color-blanco); }
.tabla-precios .tabla td { font-size: 15px; line-height: 1.5; color: var(--e-global-color-blanco); }
.tabla-precios .tabla tbody tr:last-child th, .tabla-precios .tabla tbody tr:last-child td { border-bottom: 0; }
.tabla-precios .tabla td:last-child, .tabla-precios .tabla thead th:last-child { text-align: right; }


/* ── Tarjetas de financiación ── */
.e-con.tarjeta-fin { border-radius: 16px; }
.tarjeta-fin .elementor-heading-title { display: block; text-wrap: balance; }
.e-con .elementor-widget.arriba .elementor-heading-title { line-height: 1.4; }
.e-con .elementor-widget.abajo .elementor-heading-title { line-height: 1.5; }


/* ── Botón secundario sobre claro: contorno de filete, sin relleno ── */
.elementor-widget.btn-sec-claro .elementor-button {
  background: transparent;
  color: var(--e-global-color-text);
  border: 1px solid var(--e-global-color-filete);
}
.elementor-widget.btn-sec-claro .elementor-button:hover { border-color: var(--e-global-color-primary); transform: translateY(-1px); }

/* ── Maqueta de Trustindex (se sustituye por el plugin en producción) ── */
.ti-cab { text-align: center; margin-bottom: 32px; }
.ti-titulo { display: block; font-weight: 600; font-size: 12px; line-height: 1.65; letter-spacing: -0.015em; text-transform: uppercase; }
.ti-estrellas { color: var(--e-global-color-accent); letter-spacing: 2px; }
.ti-estrellas--grande { display: block; font-size: 34px; line-height: 1.2; }
.ti-base { display: block; font-size: 15px; line-height: 1.65; color: var(--e-global-color-tinta2); }
.ti-base strong { font-weight: bolder; }
.ti-google { display: block; margin-top: 6px; font-weight: 600; font-size: 15px; line-height: 1.65; color: var(--e-global-color-tinta2); }
.ti-resenas { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.ti-resena { background: var(--e-global-color-blanco); border: 1px solid var(--e-global-color-filete); border-radius: 16px; padding: 32px; }
.ti-autor { display: flex; align-items: center; gap: 10px; }
.ti-avatar { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 999px; background: var(--e-global-color-primary); color: var(--e-global-color-blanco); font-weight: 600; font-size: 15px; }
.ti-nombre { display: block; font-weight: 600; font-size: 15px; line-height: 1.65; color: var(--e-global-color-tinta2); font-style: italic; }
.ti-fecha { display: block; font-size: 15px; line-height: 1.65; color: var(--e-global-color-tinta2); }
.ti-resena > .ti-estrellas { font-size: 17px; line-height: 1.65; }
.maqueta-trustindex p.ti-texto { margin: 16px 0 0; font-size: 15px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.maqueta-trustindex p.ti-leer { margin: 10px 0 0; font-size: 15px; line-height: 1.65; color: var(--e-global-color-tinta2); }
@media (max-width: 900px) { .ti-resenas { grid-template-columns: 1fr 1fr; } }


/* ── Fila de CTA: título y grupo de botones a su tamaño natural ── */
.e-con.fila-cta > .e-con.grupo-btns { --width: auto; width: auto; flex: 0 0 auto; }
.btn-icono-oro .elementor-button-icon { color: var(--e-global-color-accent); }
.btn-icono-oro .elementor-button:hover .elementor-button-icon { color: var(--e-global-color-text); }
.btn-icono-oro .elementor-button-icon svg { width: 18px; height: 18px; }
.btn-icono-navy .elementor-button-icon { color: var(--e-global-color-primary); }
.btn-icono-navy .elementor-button-icon svg { width: 18px; height: 18px; }


/* ── 28 · FAQ: acordeón anidado de Elementor (<details> nativos) con el aspecto de la maqueta ── */
.faq-card .e-n-accordion {
  gap: 0;
  padding: 16px 32px;
  background: var(--e-global-color-blanco);
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(18, 35, 61, .10);
}
.faq-card .e-n-accordion-item { margin: 0; border-top: 1px solid var(--e-global-color-filete); }
.faq-card .e-n-accordion-item:first-child { border-top: 0; }
.faq-card .e-n-accordion-item:last-child { border-bottom: 1px solid var(--e-global-color-filete); }
.e-con .faq-card .e-n-accordion-item-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
}
.faq-card .e-n-accordion-item-title-header { flex: 1; }
.faq-card .e-n-accordion-item-title-text {
  font-family: 'Newsreader', serif;
  font-weight: 400;
  font-size: 22px;
  line-height: 1.3;
  letter-spacing: normal;
  color: var(--e-global-color-text);
}
.faq-card .e-n-accordion-item-title::after {
  content: "+";
  flex: none;
  font-family: 'Source Sans 3', sans-serif;
  font-weight: 300;
  font-size: 22px;
  line-height: 1.3;
  color: var(--e-global-color-primary);
  transition: transform 120ms ease-out;
}
.faq-card .e-n-accordion-item[open] > .e-n-accordion-item-title::after { transform: rotate(45deg); }
.faq-card .e-n-accordion-item-title-icon { display: none; }
.faq-card .e-n-accordion-item > .e-con { padding: 0 0 16px; border: 0; }
.faq-card .respuesta p { margin: 15px 0 0; }


/* ── Enlace con flecha subrayado (salidas de «Cómo llegar») ── */
.enlace-subrayado .elementor-heading-title a { border-bottom: 1px solid currentColor; padding-bottom: 4px; }
.e-con > .elementor-widget.enlace-subrayado { width: auto; }

/* ── Recuadro del mapa (el mapa real solo se carga al hacer clic) ── */
.e-con.fachada { min-height: 320px; text-align: center; border: 1px solid var(--e-global-color-filete); border-radius: 16px; }
.fachada > .elementor-widget { width: auto; }
.ico-simple .elementor-icon-wrapper { line-height: 0; }
.ico-simple .elementor-icon svg { width: 20px; height: 20px; }
.fachada .elementor-widget-text-editor p { margin-left: auto; margin-right: auto; }

/* ── Tarjeta de horario ── */
.lista-horario ul.horario { list-style: none; padding: 0; margin: 0; }
.lista-horario .horario li { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--e-global-color-filete); font-size: 15px; line-height: 1.5; margin: 0; }
.elementor-widget.btn-whatsapp .elementor-button { border: 1px solid var(--e-global-color-wasap); }
.btn-whatsapp .elementor-button:hover { filter: brightness(.94); transform: translateY(-1px); }
.btn-bloque .elementor-button-icon svg { width: 1.05em; height: 1.05em; }
/* Apilados de la tarjeta de horario: a todo el ancho pero con el contenido a la izquierda */
.btn-izq .elementor-button { justify-content: flex-start; }
.btn-izq .elementor-button-content-wrapper { justify-content: flex-start; }

/* ── Icono en círculo de 48 (rutas) ── */
.ico-circulo--48 .elementor-icon { width: 48px; height: 48px; }
.ico-circulo--48 .elementor-icon svg { width: 20px; height: 20px; }

/* ── «Cómo llegar desde»: pastillas enlazadas ── */
.e-con.desde { border-top: 1px solid var(--e-global-color-filete); }
.elementor-widget.pildora .elementor-button {
  padding: 10px 18px;
  background: transparent;
  color: var(--e-global-color-text);
  border: 1px solid var(--e-global-color-filete);
  border-radius: 999px;
}
.elementor-widget.pildora .elementor-button:hover { border-color: var(--e-global-color-primary); transform: translateY(-1px); }
.pildora .elementor-button-text { display: inline-flex; align-items: center; gap: 8px; }
.pildora .flecha { transition: transform 300ms ease-out; }
.pildora .elementor-button:hover .flecha { transform: translateX(6px); }


/* ── Sección en degradado navy (160°, de navy a tinta) ── */
.e-con.fondo-degradado { background: linear-gradient(160deg, var(--e-global-color-primary) 0%, var(--e-global-color-text) 100%); }
.filete-linea .elementor-divider-separator { width: 100%; }
.datos-contacto .elementor-icon-list-item { margin: 0 0 10px !important; padding: 0 !important; align-items: flex-start; }
.datos-contacto .elementor-icon-list-icon { color: var(--e-global-color-blanco); width: 20px; }
.datos-contacto .elementor-icon-list-icon svg { width: 20px; min-width: 20px; height: 20px; }
.e-con .elementor-widget.datos-contacto .elementor-icon-list-text { padding-inline-start: 10px; }

/* ── Formulario de cita (Elementor Pro) con el aspecto de la maqueta ── */
.e-con.tarjeta-form { border: 1px solid var(--e-global-color-filete); border-radius: 16px; }
.formulario-cita .elementor-field-group > label { font-size: 15px; font-weight: 600; line-height: 1.65; padding: 0; }
/* Sin el borde que el kit pone a los campos: en esta tarjeta la maqueta no lo lleva */
.formulario-cita .elementor-field-group .elementor-field-textual,
.formulario-cita .elementor-field-group .elementor-select-wrapper select {
  min-height: 48px;
  padding: 12px 14px;
  border: 0;
  border-radius: 6px;
  background: var(--e-global-color-tinte);
  font-family: 'Source Sans 3', sans-serif;
  font-weight: 400;
  font-size: 17px;
  color: var(--e-global-color-text);
}
.formulario-cita textarea.elementor-field-textual { min-height: 120px; resize: vertical; }
.formulario-cita .legal { margin: 15px 0; font-size: 15px; line-height: 1.5; color: var(--e-global-color-tinta2); max-width: none; }
.formulario-cita .elementor-field-type-acceptance { font-size: 15px; line-height: 1.5; color: var(--e-global-color-tinta2); }
.formulario-cita .elementor-field-type-acceptance label { font-weight: 300; font-size: 15px; }
.formulario-cita .elementor-field-type-acceptance input { margin: 3px 10px 3px 4px; }
.formulario-cita .elementor-button { min-height: 48px; padding: 12px 26px; box-sizing: border-box; }
.formulario-cita .elementor-button:hover { filter: brightness(.92); transform: translateY(-1px); }
/* OJO, replicado tal cual: en la maqueta estos dos enlaces salen en blanco sobre la
   tarjeta blanca (.f-navy a). Pendiente de decisión de Antonio */
.legal-pie p { margin: 0; }
.legal-pie a { color: var(--e-global-color-blanco); }


/* ── Card de entrada del blog ── */
.e-con.post { border: 1px solid var(--e-global-color-filete); border-radius: 16px; overflow: hidden; text-decoration: none; transition: border-color 120ms ease-out; }
.e-con.post:hover { border-color: var(--e-global-color-primary); }
.e-con.cabecera-foto { position: relative; }
.foto-post img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; filter: saturate(.9) contrast(1.05); }
.cabecera-foto > .sello { position: absolute; inset: 0 0 auto 0; background: linear-gradient(to bottom, rgba(22, 61, 118, .72) 0%, rgba(22, 61, 118, 0) 100%); }
.sello > .elementor-widget { width: auto; }
.logo-sello img { width: auto; height: 22px; display: block; }
.etiqueta-post .elementor-heading-title { display: block; padding: 5px 12px; border-radius: 999px; background: var(--e-global-color-blanco); white-space: nowrap; }
.e-con.cuerpo-post { flex: 1; }
.titulo-post .elementor-heading-title { text-wrap: balance; }
.e-con.meta-post { margin-top: auto; border-top: 1px solid var(--e-global-color-accent); }
.enlace-post .elementor-heading-title { border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.e-con.meta-post > .elementor-widget { width: auto; }

/* =============================================================
   LANDINGS DE TRATAMIENTO (29-30/09)
   Relleno, márgenes, anchos, bordes, esquinas, fondos, sombras,
   posiciones y filtros van en los controles de Elementor, para que
   lo que se toque en el editor se vea. Aquí solo queda lo que
   Elementor no sabe hacer.
   ============================================================= */

/* ── Proporción fija de las fotos (el widget Imagen no tiene el control).
   Si en el editor se le pone un alto, gana el alto. ── */
.ratio-43 img, .ratio-34 img, .ratio-45 img { display: block; width: 100%; object-fit: cover; }
.ratio-43 img { aspect-ratio: 4 / 3; }
.ratio-34 img { aspect-ratio: 3 / 4; }
.ratio-45 img { aspect-ratio: 4 / 5; }
/* La foto de la cirujana, más cerrada sobre la cara, como en la maqueta */
.recorte { overflow: hidden; border-radius: 16px; aspect-ratio: 4 / 5; }
.recorte .elementor-widget-container, .recorte img { height: 100%; }
.recorte img { width: 132%; max-width: none; margin-left: -16%; object-fit: cover; object-position: 50% 14%; }

/* ── Insignia de Google en claro (es HTML dentro de un bloque) ── */
.insignia-clara .google-clara { display: inline-flex; align-items: center; gap: 14px; padding: 14px 20px; background: var(--e-global-color-blanco); border: 1px solid var(--e-global-color-filete); border-radius: 16px; box-shadow: 0 1px 3px rgba(18, 35, 61, .10); color: var(--e-global-color-text); }
.google-clara .marca-google { font-weight: 600; font-size: 15px; color: var(--e-global-color-tinta2); }
.google-clara .nota { font-weight: 600; font-size: 40px; line-height: 1; }
.google-clara .estrellas { display: inline-flex; gap: 2px; color: var(--e-global-color-accent); }
.google-clara .estrellas .ico-m { width: 14px; height: 14px; }
.google-clara .detalle { font-size: 15px; line-height: 1.5; color: var(--e-global-color-tinta2); }

/* ── Lámina: la retícula de fondo (el degradado y las esquinas van en el contenedor) ── */
.e-con.lamina::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-size: 24px 24px;
  background-image: linear-gradient(to right, rgba(255, 255, 255, .08) 1px, transparent 1px), linear-gradient(to bottom, rgba(255, 255, 255, .08) 1px, transparent 1px); }
.e-con.lamina > * { position: relative; }
.dibujo-w { width: 100%; }
.dibujo { display: block; width: 100%; height: auto; color: var(--e-global-color-filnavy); }
.dibujo .oro { color: var(--e-global-color-accent); }
.dibujo .guia { opacity: .55; }

/* ── Listas con icono dentro de un Texto (motivos, dolor, la clínica) ── */
.elementor-widget .lista-filas { list-style: none; padding: 0; margin: 32px 0 0; }
.lista-filas li { display: flex; align-items: center; gap: 16px; padding-block: 16px; border-top: 1px solid var(--e-global-color-filete); }
.lista-filas .ico-m { color: var(--e-global-color-primary); }
.lista-filas--cierre li { gap: 32px; }
.lista-filas--cierre li:last-child { border-bottom: 1px solid var(--e-global-color-filete); }

/* ── Ficha mini de la comparativa (lista de datos dentro de un Texto) ── */
.ficha-mini { margin: 0; }
.ficha-mini > div { display: flex; justify-content: space-between; gap: 16px; padding-block: 10px; border-bottom: 1px solid var(--e-global-color-filete); }
.ficha-mini dt { color: var(--e-global-color-tinta2); font-weight: inherit; }
.ficha-mini dd { margin: 0; font-weight: 600; text-align: right; }

/* ── La cifra con letra de titular (no hay global de 40 px en Newsreader) ── */
.cifra-serif .elementor-heading-title { font-family: var(--e-global-typography-primary-font-family), Georgia, serif; font-weight: var(--e-global-typography-primary-font-weight); }

/* ── Titular con el icono delante (HTML dentro del titular) ── */
.titulo-ico .elementor-heading-title { display: flex; align-items: center; gap: 10px; }
.titulo-ico .ico-m { color: var(--e-global-color-accent); }

/* ── Pasos: la bola numerada y el hilo que la une a la siguiente ── */
.pasos > .paso { position: relative; }
.bola .elementor-heading-title { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 32px; border: 1px solid var(--e-global-color-filnavy); border-radius: 999px; }
.pasos > .paso:not(:last-child) .bola::after { content: ""; position: absolute; left: 44px; top: 22px; width: calc(100% - 44px + 32px); height: 1px; background: var(--e-global-color-filnavy); }
.ico-paso { color: var(--e-global-color-accent); }
.ico-paso .ico-m { width: 20px; height: 20px; }

/* ── Cita grande: la especialidad en gris dentro de la firma ── */
.cita-grande-autor .especialidad { color: var(--e-global-color-tinta2); }

/* ── Tablas de cifras dentro de un Texto (precio orientativo y financiación) ── */
.tabla-w table.tabla { width: 100%; border-collapse: collapse; text-align: left; margin: 0; border: 0; }
.tabla-w .tabla th, .tabla-w .tabla td { padding: 16px; border: 0; border-bottom: 1px solid var(--e-global-color-filnavy); vertical-align: top; background: transparent; }
.tabla-w .tabla th:first-child, .tabla-w .tabla td:first-child { padding-left: 0; }
.tabla-w .tabla th:last-child, .tabla-w .tabla td:last-child { padding-right: 0; }
.tabla-w .tabla--cifras th:last-child, .tabla-w .tabla--cifras td:last-child { text-align: right; }
.tabla-w .tabla thead th { font-weight: 600; font-size: 12px; line-height: 1.4; letter-spacing: .18em; text-transform: uppercase; color: var(--e-global-color-filnavy); border-bottom-color: var(--e-global-color-accent); }
.tabla-w .tabla tbody th { font-weight: 600; font-size: 17px; line-height: 1.65; color: var(--e-global-color-blanco); }
.tabla-w .tabla td { color: var(--e-global-color-blanco); }
.tabla-w .tabla tbody tr:last-child th, .tabla-w .tabla tbody tr:last-child td { border-bottom: 0; }
.tabla-w .tabla .val-oro { color: var(--e-global-color-accent); }

/* ── Icono en círculo (HTML): 56 px, y 48 en las rutas ── */
.ico-circulo-html .ico-circulo-m { width: 56px; height: 56px; }
.ruta .ico-circulo-html .ico-circulo-m, .ico-circulo-html.ico-48 .ico-circulo-m { width: 48px; height: 48px; }
.ico-circulo-html.ico-48 .ico-circulo-m .ico-m { width: 20px; height: 20px; }

/* ── Garantía: lo que sí y lo que no (lista dentro de un Texto) ── */
.elementor-widget .si-no { list-style: none; padding: 0; margin: 0; }
.si-no li { display: flex; gap: 16px; padding-block: 32px; }
.si-no li + li { border-top: 1px solid var(--e-global-color-filnavy); }
.si-no .ico-m { color: var(--e-global-color-accent); }
.si-no strong { display: block; margin-bottom: 6px; font-weight: inherit; font-size: 17px; line-height: 1.65; }
.si-no p { margin: 0; color: var(--e-global-color-filnavy); }

/* ── Cuándo no: filas con la etiqueta a la derecha (lista dentro de un Texto) ── */
.elementor-widget .filas { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.filas li { display: flex; align-items: center; gap: 16px; padding: 16px 32px; background: var(--e-global-color-tinte); border-radius: 6px; }
.filas .ico-m { flex: none; }
.filas .chip { margin-left: auto; flex: none; padding: 4px 12px; border-radius: 999px; background: var(--e-global-color-calido); color: var(--e-global-color-text); font-size: 15px; font-weight: 300; }

/* ── Casos antes y después: velo, etiquetas y pie sobre la foto (capas encima de la imagen) ── */
.e-con.caso { position: relative; }
.capa-caso { position: absolute; inset: 0; pointer-events: none; }
.capa-caso .velo-card { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .4) 45%, rgba(0, 0, 0, .05) 100%); }
.capa-caso .etiqueta { position: absolute; padding: 4px 10px; border-radius: 6px; background: rgba(22, 61, 118, .72); font-size: 12px; line-height: 1.4; letter-spacing: .18em; text-transform: uppercase; color: var(--e-global-color-blanco); }
.caso--apilada .antes { left: 16px; top: 16px; }
.caso--apilada .despues { left: 16px; bottom: 64px; }
.caso--partida .antes { left: 16px; bottom: 66px; }  /* 66 y no 46: los pies de dos líneas se montaban sobre las etiquetas (02/11) */
.caso--partida .despues { right: 16px; bottom: 66px; }
.pie-caso { position: absolute; left: 0; right: 0; bottom: 0; padding: 32px 16px 16px; }

/* ── Relacionados: la flecha al pie de la card ── */
.e-con > .enlace-rel { margin-top: auto; padding-top: 16px; }

/* ── Texto SEO a dos columnas y carga inmediata ── */
.parrafos-16 p { margin: 0; }
.parrafos-16 p:first-child { margin-top: 17px; }
.parrafos-16 p + p { margin-top: 17px; }
.galones-una .elementor-icon-list-items { grid-template-columns: 1fr; }

/* ── Botones globales con flecha: la flecha a la derecha, como en la maqueta ── */
.btn-flecha-dcha .elementor-button-content-wrapper { flex-direction: row-reverse; }

/* ── Cirugía oral (30/09): lo que Elementor no sabe hacer ── */
/* Tabla sobre claro (comparativa oral / maxilofacial) */
.tabla-claro table.tabla { width: 100%; border-collapse: collapse; text-align: left; margin: 0; border: 0; }
.tabla-claro .tabla th, .tabla-claro .tabla td { padding: 16px; border: 0; border-bottom: 1px solid var(--e-global-color-filete); vertical-align: top; background: transparent; }
.tabla-claro .tabla thead th { font-weight: 600; font-size: 12px; line-height: 1.4; letter-spacing: .18em; text-transform: uppercase; color: var(--e-global-color-tinta2); border-bottom-color: var(--e-global-color-primary); }
.tabla-claro .tabla tbody th { font-weight: 600; font-size: 17px; line-height: 1.65; color: var(--e-global-color-text); }
.tabla-claro .tabla td { font-size: 15px; line-height: 1.5; color: var(--e-global-color-tinta2); }
.tabla-claro .tabla tbody tr:last-child th, .tabla-claro .tabla tbody tr:last-child td { border-bottom: 0; }
/* Tabla de tres columnas sobre navy: todo a la izquierda, con el aire de 16 px de la maqueta */
.tabla-w .tabla:not(.tabla--cifras) td:last-child, .tabla-w .tabla:not(.tabla--cifras) thead th:last-child { text-align: left; }
.tabla-pad .tabla th:first-child, .tabla-pad .tabla td:first-child { padding-left: 16px; }
.tabla-pad .tabla th:last-child, .tabla-pad .tabla td:last-child { padding-right: 16px; }
.tabla-pad .tabla thead th { border-bottom-color: var(--e-global-color-filnavy); }
/* Filas de estado con explicación debajo (riesgos) */
.filas--detalle li { align-items: flex-start; }
.filas--detalle .ico-m { margin-top: 3px; }
.filas--detalle .txt strong { display: block; font-weight: inherit; }
.filas--detalle .txt p { margin: 4px 0 0; font-weight: 300; max-width: none; font-size: 15px; line-height: 1.5; color: var(--e-global-color-tinta2); }
.filas--detalle .chip { margin-top: 2px; }
/* Línea de proceso sobre claro: bolas navy centradas y el hilo detrás */
.paso-claro { position: relative; }
.pasos-claro > .paso-claro:not(:last-child) .bola-claro::after { content: ""; position: absolute; top: 24px; left: calc(50% + 24px); width: calc(100% - 32px); height: 1px; background: var(--e-global-color-filnavy); }
.paso-claro .bola-claro .elementor-heading-title { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid var(--e-global-color-filnavy); border-radius: 999px; background: var(--e-global-color-primary); margin: 0 auto; }
.ico-paso-claro { text-align: center; color: var(--e-global-color-primary); }
/* Iconos en círculo sobre tarjetas tinte y sobre navy */
.tarjeta-tinte .ico-circulo-m { background: var(--e-global-color-blanco); }
.tarjeta-navy .ico-circulo-m { background: transparent; color: var(--e-global-color-blanco); }

/* ── Móvil: solo lo que va dentro de HTML o listas ── */
@media (max-width: 767px) {
  .insignia-clara .google-clara { flex-wrap: wrap; gap: 6px 12px; padding: 12px 16px; }
  .google-clara .nota { font-size: 30px; }
  .google-clara .detalle { flex-basis: 100%; }
  .e-con.paso { display: grid; grid-template-columns: 44px 1fr; column-gap: 16px; align-content: start; }
  .e-con.paso > .elementor-element { grid-column: 2; }
  .e-con.paso > .bola { grid-column: 1; grid-row: 1 / span 4; }
  .bola .elementor-heading-title { margin-bottom: 0; }
  .pasos > .paso:not(:last-child) .bola::after, .ico-paso { display: none; }
  .filas li { flex-wrap: wrap; }
  .filas .chip { margin-left: 0; }
  .si-no li { padding-block: 24px; }
  /* Cirugía oral: sin hilo entre pasos apilados; tabla de tres columnas dentro de la tarjeta */
  .pasos-claro > .paso-claro:not(:last-child) .bola-claro::after { display: none; }
  .tabla-3 table.tabla { min-width: 0; table-layout: fixed; }
  .tabla-3 .tabla th, .tabla-3 .tabla td { padding: 12px 8px; }
  .tabla-3 .tabla th:first-child, .tabla-3 .tabla td:first-child, .tabla-pad .tabla th:first-child, .tabla-pad .tabla td:first-child { padding-left: 0; }
  .tabla-3 .tabla th:last-child, .tabla-3 .tabla td:last-child, .tabla-pad .tabla th:last-child, .tabla-pad .tabla td:last-child { padding-right: 0; }
  .tabla-3 .tabla thead th { letter-spacing: .1em; }
}

/* ── Ortodoncia (30/09): lo que Elementor no sabe hacer ── */
/* Tabla de una columna con filas de 40 px (la lista de precio orientativo) */
.tabla-compacta .tabla th, .tabla-compacta .tabla td { padding-block: 8px; }
/* Hueco del widget de Trustindex mientras no se pega su shortcode */
.trustindex-hueco { min-height: 0; }

/* Línea de proceso centrada: en móvil los pasos se apilan y el hilo entre bolas sobra */
@media (max-width: 767px) { .pasos-sin-hilo-movil .bola-claro::after { display: none; } }

/* ── Equipo y contacto (30/09): lo que Elementor no sabe hacer ── */
/* Colegio y sociedades de la ficha: lista de enlaces con icono dentro de un Texto */
.elementor-widget-text-editor ul.perfiles-w { list-style: none; margin: 0; padding: 0; }
.perfiles-w li { margin: 0 0 5px; font-weight: 600; }
.perfiles-w li:last-child { margin-bottom: 0; }
.perfiles-w li > a, .perfiles-w li > span { display: inline-flex; align-items: center; gap: 10px; color: var(--e-global-color-primary); }
.perfiles-w li > a { text-decoration: none; }

/* >>> ICONOS POR MÁSCARA (bloque generado, no editar a mano) */
.ico-m { display: inline-block; width: 20px; height: 20px; flex: none; background: currentColor; -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
.ico-m-alerta { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 9v4M12 17h.01%22/%3E%3Cpath d=%22M10.3 3.9 2.6 17a2 2 0 0 0 1.7 3h15.4a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z%22/%3E%3C/svg%3E"); }
.ico-m-ampolla { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3v6M9 3h6%22/%3E%3Cpath d=%22M8 9h8l-1 10a2 2 0 0 1-6 0z%22/%3E%3C/svg%3E"); }
.ico-m-anestesia { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M17 3l4 4M19 5l-9 9-3 1 1-3 9-9zM7 15l-3 5 5-3%22/%3E%3C/svg%3E"); }
.ico-m-aparcar { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%224%22 y=%224%22 width=%2216%22 height=%2216%22 rx=%223%22/%3E%3Cpath d=%22M10 16V8h3a3 3 0 0 1 0 6h-3%22/%3E%3C/svg%3E"); }
.ico-m-arcada { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 16c0-6 4-10 9-10s9 4 9 10%22/%3E%3Ccircle cx=%226%22 cy=%2215%22 r=%221.4%22/%3E%3Ccircle cx=%229%22 cy=%2210%22 r=%221.4%22/%3E%3Ccircle cx=%2215%22 cy=%2210%22 r=%221.4%22/%3E%3Ccircle cx=%2218%22 cy=%2215%22 r=%221.4%22/%3E%3C/svg%3E"); }
.ico-m-ausencia { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%229%22 width=%227%22 height=%227%22 rx=%222%22/%3E%3Crect x=%2214%22 y=%229%22 width=%227%22 height=%227%22 rx=%222%22/%3E%3C/svg%3E"); }
.ico-m-autobus { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%224.5%22 y=%223.5%22 width=%2215%22 height=%2212.5%22 rx=%222.5%22/%3E%3Cpath d=%22M4.5 10h15%22/%3E%3Cpath d=%22M8 13.2h.01M16 13.2h.01%22/%3E%3Cpath d=%22M7.5 16v2M16.5 16v2%22/%3E%3C/svg%3E"); }
.ico-m-aviso { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M18 6 6 18M6 6l12 12%22/%3E%3C/svg%3E"); }
.ico-m-balanza { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3v18M5 8h14M7 8l-3 6h6zM17 8l-3 6h6z%22/%3E%3C/svg%3E"); }
.ico-m-boca { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 10c4-4 12-4 16 0-4 6-12 6-16 0z%22/%3E%3Cpath d=%22M8 10h8%22/%3E%3C/svg%3E"); }
.ico-m-calendario { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%225%22 width=%2218%22 height=%2216%22 rx=%222%22/%3E%3Cpath d=%22M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4%22/%3E%3C/svg%3E"); }
.ico-m-caries { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M9 4h6M12 4v5M8 12c0 4 1 8 4 8s4-4 4-8%22/%3E%3Cpath d=%22M8 12a4 4 0 0 1 8 0%22/%3E%3C/svg%3E"); }
.ico-m-check { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 6 9 17l-5-5%22/%3E%3C/svg%3E"); }
.ico-m-coche { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4.5 13 6 8.8A2 2 0 0 1 7.9 7.4h8.2a2 2 0 0 1 1.9 1.4L19.5 13%22/%3E%3Cpath d=%22M4.5 13h15v3.6a1 1 0 0 1-1 1h-1.2a1 1 0 0 1-1-1v-.8H7.7v.8a1 1 0 0 1-1 1H5.5a1 1 0 0 1-1-1z%22/%3E%3Cpath d=%22M7.6 15.1h.01M16.4 15.1h.01%22/%3E%3C/svg%3E"); }
.ico-m-copa { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M7 3h10l-4 8v7M9 21h6M9 18h6%22/%3E%3C/svg%3E"); }
.ico-m-corazon { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 20s-7-4.3-7-9.2A3.9 3.9 0 0 1 12 8a3.9 3.9 0 0 1 7 2.8C19 15.7 12 20 12 20z%22/%3E%3C/svg%3E"); }
.ico-m-corona { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 4c-3 0-5 2-5 5 0 4 1 5 1.6 9 .3 2 2.4 2 2.7 0L12 14l.7 4c.3 2 2.4 2 2.7 0 .6-4 1.6-5 1.6-9 0-3-2-5-5-5z%22/%3E%3C/svg%3E"); }
.ico-m-curva { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 18c4 0 5-9 9-9s5 9 9 9%22/%3E%3C/svg%3E"); }
.ico-m-desplegar { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22m6 9 6 6 6-6%22/%3E%3C/svg%3E"); }
.ico-m-diabetes { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%229%22/%3E%3Cpath d=%22M8 12h8%22/%3E%3C/svg%3E"); }
.ico-m-diana { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%228%22/%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%223.5%22/%3E%3C/svg%3E"); }
.ico-m-diente { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3c-3 0-5 2-5 5 0 4 1 5 1.6 9 .3 2 2.4 2 2.7 0L12 13l.7 4c.3 2 2.4 2 2.7 0 .6-4 1.6-5 1.6-9 0-3-2-5-5-5z%22/%3E%3C/svg%3E"); }
.ico-m-documento { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z%22/%3E%3Cpath d=%22M14 3v5h5M9 13h6M9 17h4%22/%3E%3C/svg%3E"); }
.ico-m-enjuague { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M8 3h8l-1 6H9z%22/%3E%3Cpath d=%22M9 9h6l-1 12H10z%22/%3E%3C/svg%3E"); }
.ico-m-escaner { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%226%22 width=%2218%22 height=%2212%22 rx=%222%22/%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%223%22/%3E%3Cpath d=%22M8 6l1.5-2h5L16 6%22/%3E%3C/svg%3E"); }
.ico-m-escudo { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3 5 6v5.5c0 4.3 3 8.3 7 9.5 4-1.2 7-5.2 7-9.5V6z%22/%3E%3Cpath d=%22m9 12 2 2 4-4%22/%3E%3C/svg%3E"); }
.ico-m-estrella { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22%23000%22%3E%3Cpath d=%22M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z%22/%3E%3C/svg%3E"); }
.ico-m-estudio { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2211%22 cy=%2211%22 r=%227%22/%3E%3Cpath d=%22M20 20l-3.5-3.5M11 8v6M8 11h6%22/%3E%3C/svg%3E"); }
.ico-m-euro { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M18 7a7 7 0 1 0 0 10%22/%3E%3Cpath d=%22M4 11h9M4 14h9%22/%3E%3C/svg%3E"); }
.ico-m-flecha { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M5 12h14M13 6l6 6-6 6%22/%3E%3C/svg%3E"); }
.ico-m-flecha-card { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M9 6l6 6-6 6%22/%3E%3C/svg%3E"); }
.ico-m-frio { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3v18M4.5 7.5l15 9M19.5 7.5l-15 9%22/%3E%3C/svg%3E"); }
.ico-m-gasa { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%224%22 y=%224%22 width=%2216%22 height=%2216%22 rx=%222%22/%3E%3Cpath d=%22M4 9h16M9 4v16%22/%3E%3C/svg%3E"); }
.ico-m-gota { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3c-3 5-5 7.5-5 10a5 5 0 0 0 10 0c0-2.5-2-5-5-10z%22/%3E%3C/svg%3E"); }
.ico-m-higiene { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M9 3h6v5H9z%22/%3E%3Cpath d=%22M10 8h4l-.6 12a1.4 1.4 0 0 1-2.8 0z%22/%3E%3C/svg%3E"); }
.ico-m-hueso { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 15c4-6 12-6 16 0%22/%3E%3Cpath d=%22M12 15v5%22/%3E%3C/svg%3E"); }
.ico-m-lupa { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2211%22 cy=%2211%22 r=%227%22/%3E%3Cpath d=%22M20 20l-3.5-3.5%22/%3E%3C/svg%3E"); }
.ico-m-metro { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%225%22 y=%223%22 width=%2214%22 height=%2213%22 rx=%223%22/%3E%3Cpath d=%22M5 10h14%22/%3E%3Cpath d=%22M8.5 13.2h.01M15.5 13.2h.01%22/%3E%3Cpath d=%22M8 16.5 6 20M16 16.5 18 20%22/%3E%3C/svg%3E"); }
.ico-m-pauta { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%225%22 y=%223%22 width=%2214%22 height=%2218%22 rx=%222%22/%3E%3Cpath d=%22M9 8h6M9 12h6M9 16h3%22/%3E%3C/svg%3E"); }
.ico-m-periodonto { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 15c4-6 12-6 16 0%22/%3E%3Cpath d=%22M12 15v5%22/%3E%3Cpath d=%22M4 20h16%22/%3E%3C/svg%3E"); }
.ico-m-persona { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2212%22 cy=%228%22 r=%224%22/%3E%3Cpath d=%22M4 21c0-4 3.6-6 8-6s8 2 8 6%22/%3E%3C/svg%3E"); }
.ico-m-pilar { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3v6M9 9h6l-1 4h-4z%22/%3E%3Cpath d=%22M10 13h4l-1 8h-2z%22/%3E%3C/svg%3E"); }
.ico-m-razon-cirugia { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3v4M9 7h6l-1 12a2 2 0 0 1-4 0z%22/%3E%3Cpath d=%22M10 11h4M10 14h4%22/%3E%3C/svg%3E"); }
.ico-m-razon-especialidades { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 20V9.5L12 4l8 5.5V20%22/%3E%3Cpath d=%22M9.5 20v-6h5v6%22/%3E%3Cpath d=%22M4 20h16%22/%3E%3C/svg%3E"); }
.ico-m-razon-necesario { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%224.5%22 y=%224%22 width=%2215%22 height=%2217%22 rx=%222%22/%3E%3Cpath d=%22M9 4h6v3H9z%22/%3E%3Cpath d=%22M8.8 13.4l2.2 2.2 4.2-4.2%22/%3E%3C/svg%3E"); }
.ico-m-reloj { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%229%22/%3E%3Cpath d=%22M12 7v5l3 2%22/%3E%3C/svg%3E"); }
.ico-m-reposo { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 18v-4a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v4%22/%3E%3Cpath d=%22M3 18h18M6 12V9a2 2 0 0 1 2-2h3v5%22/%3E%3C/svg%3E"); }
.ico-m-riesgo { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3.5 2.5 20h19z%22/%3E%3Cpath d=%22M12 10v4M12 17h.01%22/%3E%3C/svg%3E"); }
.ico-m-sintoma-diente-ausente { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M8 3c-2 0-3.5 1.8-3.5 4.5C4.5 12 6 21 8 21s1.6-5 4-5 1.6 5 4 5 3.5-9 3.5-13.5C19.5 4.8 18 3 16 3c-1.4 0-2.6.8-4 .8S9.4 3 8 3z%22/%3E%3C/svg%3E"); }
.ico-m-sintoma-dolor { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%229%22/%3E%3Cpath d=%22M12 7.5v5.5M12 16.2h.01%22/%3E%3C/svg%3E"); }
.ico-m-sintoma-encias { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3s6 6.4 6 10a6 6 0 0 1-12 0c0-3.6 6-10 6-10z%22/%3E%3C/svg%3E"); }
.ico-m-sintoma-estetica { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M11 3l1.7 4.4L17 9l-4.3 1.6L11 15l-1.7-4.4L5 9l4.3-1.6z%22/%3E%3Cpath d=%22M17.5 14.5l.9 2.1 2.1.9-2.1.9-.9 2.1-.9-2.1-2.1-.9 2.1-.9z%22/%3E%3C/svg%3E"); }
.ico-m-sintoma-nino { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2212%22 cy=%228%22 r=%223.5%22/%3E%3Cpath d=%22M5 20c0-3.6 3.1-6 7-6s7 2.4 7 6%22/%3E%3C/svg%3E"); }
.ico-m-sintoma-revision { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2211%22 cy=%2211%22 r=%226%22/%3E%3Cpath d=%22M20 20l-4.6-4.6%22/%3E%3C/svg%3E"); }
.ico-m-sutura { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 12h16%22/%3E%3Cpath d=%22M7 9l-2 3 2 3M17 9l2 3-2 3%22/%3E%3Cpath d=%22M9 12v-3M12 12v3M15 12v-3%22/%3E%3C/svg%3E"); }
.ico-m-tabaco { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 16h13v3H3zM18 16h3v3h-3z%22/%3E%3Cpath d=%22M17 6c0 2 2 2 2 4M14 5c0 2.5 2 2.5 2 5%22/%3E%3C/svg%3E"); }
.ico-m-telefono { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6.6 10.8a15 15 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.24 11 11 0 0 0 3.5.56 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11 11 0 0 0 .56 3.5 1 1 0 0 1-.25 1z%22/%3E%3C/svg%3E"); }
.ico-m-tragar { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3v10M8.5 9.5 12 13l3.5-3.5%22/%3E%3Cpath d=%22M6 17c2 2 10 2 12 0%22/%3E%3C/svg%3E"); }
.ico-m-traumatismo { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3l2.5 4.5L19 9l-3.5 3 1 5-4.5-2.5L7.5 17l1-5L5 9l4.5-1.5z%22/%3E%3C/svg%3E"); }
.ico-m-ubicacion { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0z%22/%3E%3Ccircle cx=%2212%22 cy=%2210%22 r=%223%22/%3E%3C/svg%3E"); }
.ico-m-varias-piezas { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6 4c-1.7 0-2.5 1.2-2.5 3 0 2.5.6 3 1 6 .2 1.4 1.6 1.4 1.8 0L7 10l.7 3c.2 1.4 1.6 1.4 1.8 0 .4-3 1-3.5 1-6 0-1.8-.8-3-2.5-3z%22/%3E%3Cpath d=%22M17 4c-1.7 0-2.5 1.2-2.5 3 0 2.5.6 3 1 6 .2 1.4 1.6 1.4 1.8 0L18 10l.7 3c.2 1.4 1.6 1.4 1.8 0 .4-3 1-3.5 1-6 0-1.8-.8-3-2.5-3z%22/%3E%3C/svg%3E"); }
.ico-m-whatsapp { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M21 11.5a8.4 8.4 0 0 1-9 8.4 9 9 0 0 1-3.9-.9L3 20.5l1.5-4.4A8.4 8.4 0 0 1 12 3.1a8.4 8.4 0 0 1 9 8.4z%22/%3E%3C/svg%3E"); }
.ico-m-zona { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22m9 4-5 2v14l5-2 6 2 5-2V4l-5 2z%22/%3E%3Cpath d=%22M9 4v14M15 6v14%22/%3E%3C/svg%3E"); }
.ico-m-birrete { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3 3 7l9 4 9-4-9-4z%22/%3E%3Cpath d=%22M7 9.5V14c0 1.7 2.2 3 5 3s5-1.3 5-3V9.5%22/%3E%3C/svg%3E"); }
.ico-m-sociedad { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M16 20v-1.5a3.5 3.5 0 0 0-3.5-3.5h-5A3.5 3.5 0 0 0 4 18.5V20%22/%3E%3Ccircle cx=%2210%22 cy=%228%22 r=%223.2%22/%3E%3Cpath d=%22M20 20v-1.5a3.5 3.5 0 0 0-2.6-3.4%22/%3E%3Cpath d=%22M15.5 5a3.2 3.2 0 0 1 0 6%22/%3E%3C/svg%3E"); }
/* <<< FIN ICONOS */

/* ── Cabecera: «Llamar ahora» como icono (02/10, Antonio) ─────────────────────────
   Con la barra nueva (Tratamientos, Implantes dentales, Ortodoncia, Odontología general,
   Equipo, La clínica) el botón 1 de Astra con texto no deja sitio. El botón sigue en
   Astra tal cual (enlace tel: y texto para lectores de pantalla); aquí solo se pinta
   como círculo con el teléfono. El texto completo pasa a la franja superior.
   Se deshace borrando este bloque. */
@media (min-width: 922px) {
  #masthead .ast-header-button-1 a.ast-custom-button-link[href^="tel:"] { display: inline-flex; }
  #masthead .ast-header-button-1 .ast-custom-button {
    position: relative; width: 46px !important; height: 46px !important; min-height: 0; padding: 0 !important;
    border-radius: 50% !important; font-size: 0 !important; letter-spacing: 0 !important; color: transparent !important;
  }
  #masthead .ast-header-button-1 .ast-custom-button::before {
    content: ""; position: absolute; inset: 0; margin: auto; width: 18px; height: 18px;
    background: var(--e-global-color-primary, #163D76);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.6 10.8a15 15 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.24 11 11 0 0 0 3.5.56 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11 11 0 0 0 .56 3.5 1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.6 10.8a15 15 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.24 11 11 0 0 0 3.5.56 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11 11 0 0 0 .56 3.5 1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center / contain no-repeat;
  }
}
/* La franja superior dice qué hace el número */
.barra-datos a[href^="tel:"]::before { content: "Llamar ahora · "; }
/* La fila de la cabecera reparte el sitio sobrante al menú (Astra lo deja en tres
   columnas iguales y el menú se partía en dos líneas a 1280) */
@media (min-width: 922px) {
  #ast-desktop-header .site-primary-header-wrap .ast-builder-grid-row { grid-template-columns: auto 1fr auto !important; column-gap: 24px; }
  #ast-desktop-header .site-header-primary-section-center { justify-content: center; }
}
@media (min-width: 922px) and (max-width: 1439px) {
  #ast-desktop-header .main-header-menu { gap: 20px !important; }
}
@media (min-width: 922px) and (max-width: 1365px) {
  #ast-desktop-header .main-header-menu { gap: 14px !important; }
  #ast-desktop-header .site-branding .site-description { display: none; }
}

/* ── Rótulos en navy (Antonio, 09/10, para todo el sitio) ───────────────────────────
   Los rótulos usan el color global «Tinta 2», que comparten muchos textos secundarios y
   por eso no se cambia en el kit. Dentro de un rótulo, «Tinta 2» pasa a ser el navy; los
   rótulos con otro color (oro o claros sobre navy) no se tocan. El tamaño y el peso son
   los de la tipografía global «Rótulo», que se cambia en Ajustes del sitio. */
.rotulo { --e-global-color-tinta2: var(--e-global-color-primary); }

/* ── WhatsApp por encima de la barra fija de móvil (Antonio, 09/10) ─────────────────
   Solo en las páginas que tienen barra fija (clase barra-fija, 73 px de alto). */
@media (max-width: 767px) {
  body:has(.barra-fija) .qlwapp__container { bottom: 73px; }
}

/* ── Móvil: ventana de cita y barra fija (06/11, pruebas 07 a 12 de los formularios) ──
   1. Con una ventana de cita abierta (Elementor la deja con style="display: none;" al
      cerrarla), el botón de WhatsApp se esconde: se montaba sobre el aviso de salud y los botones.
   2. La ventana nunca pasa del alto de la pantalla: si no cabe, se desplaza por dentro.
   3. Con barra fija, el final de la página deja sitio a la barra y no tapa el pie. */
@media (max-width: 767px) {
  body:has(.elementor-popup-modal:not([style*="display: none"])) .qlwapp__container { display: none; }
  .elementor-popup-modal .dialog-widget-content { max-height: calc(100dvh - 24px); }
  .elementor-popup-modal .dialog-message { max-height: calc(100dvh - 24px); overflow-y: auto; }
  body:has(.barra-fija) { padding-bottom: 73px; }
}
/* Texto centrado en los dos botones de la barra fija: el control de alineación del contenido del botón no se aplicaba */
.barra-fija .elementor-button { justify-content: center; }

/* ── Héroe de pilar en navy (Antonio, 10/10, v3 de estética dental) ─────────────────
   El azul es el del héroe de la home (el velo de .heroe-sobrio::after, de navy hondo a
   navy y vuelta), aquí como fondo porque la foto va a la derecha y no detrás del texto.
   La foto se funde con una máscara hacia la izquierda (escritorio) o hacia abajo (móvil),
   para que su borde tome el tono del velo a cada altura. Elementor no tiene degradados de
   tres paradas ni máscaras con degradado; todo lo demás va en sus controles. */
.heroe-pilar {
  position: relative;
  overflow: hidden;
  background-image: linear-gradient(to bottom, rgba(8, 32, 63, .96) 0%, rgba(22, 61, 118, .93) 50%, rgba(8, 32, 63, .96) 100%);
}
.heroe-pilar > .foto-fundida {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 55%;
  margin: 0;
  z-index: 0;
}
.heroe-pilar > .foto-fundida,
.heroe-pilar > .foto-fundida .elementor-widget-container { height: 100%; }
.heroe-pilar > .foto-fundida img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 38%);
  mask-image: linear-gradient(to right, transparent 0, #000 38%);
}
.heroe-pilar > .foto-fundida-movil img {
  -webkit-mask-image: linear-gradient(to bottom, #000 40%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 40%, transparent 100%);
}
.heroe-pilar > .e-con { position: relative; z-index: 1; }

/* «Leer más» de la entradilla en móvil: dos líneas y el resto al tocar, sin JavaScript.
   El texto entero está siempre en el código. */
.heroe-pilar .leer-mas, .heroe-pilar .leer-mas span {
  display: inline-block;
  cursor: pointer;
  font-family: var(--e-global-typography-pie600-font-family), sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: var(--e-global-color-blanco);
  text-decoration: underline;
  text-underline-offset: 4px;
}
.leer-mas__check { position: absolute; width: 1px; height: 1px; opacity: 0; }
.leer-mas:focus-within { outline: 2px solid var(--e-global-color-accent); outline-offset: 2px; }
@media (max-width: 767px) {
  .recorte-movil p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
  .heroe-pilar:has(.leer-mas__check:checked) .recorte-movil p { display: block; -webkit-line-clamp: unset; overflow: visible; }
  .heroe-pilar:has(.leer-mas__check:checked) .leer-mas { display: none; }
}

/* ── La O del fondo sobre navy, en blanco muy tenue (Antonio, 13/10) ──
   Sobre gris sigue blanca, como estaba. Sobre azul el oro no le gusta: pasa a blanco al 6 %.
   Las secciones navy nuevas llevan la clase marca-navy; las publicadas que aún no la llevan, por página. */
.marca-navy[class*="marca-o"]::after,
.page-id-49 .s09.marca-oro::after, .page-id-333 .s09.marca-oro::after,
.page-id-244 .s13.marca-oro::after, .page-id-289 .s09.marca-oro::after, .page-id-289 .s18.marca-oro::after,
.page-id-290 .s06.marca-oro::after, .page-id-436 .s05.marca-oro::after,
.page-id-438 .s06.marca-oro::after, .page-id-490 .s06.marca-oro::after {
  border-color: var(--e-global-color-blanco);
  opacity: .06;
}

/* ── Iconos de odontología general v3 (13/10) ──
   Motivos para pedir cita y fases de la primera visita: cada icono dice lo que pone su tarjeta.
   Mismo formato que el bloque de iconos por máscara; fuente en iconos/ico-*.svg. */
.ico-m-muela-dolor { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M9 5c-2.6 0-4 1.6-4 4 0 3 .9 4 1.4 7.5.3 1.9 2.2 1.9 2.5 0L9.6 13h1.8l.7 3.5c.3 1.9 2.2 1.9 2.5 0 .5-3.5 1.4-4.5 1.4-7.5 0-2.4-1.4-4-4-4-.9 0-1.5.4-2 .4S9.9 5 9 5z%22/%3E%3Cpath d=%22M20 2.5l-2.4 3.8h3l-2.4 3.8%22/%3E%3C/svg%3E"); }
.ico-m-diente-roto { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3c-3 0-5 2-5 5 0 4 1 5 1.6 9 .3 2 2.4 2 2.7 0L12 13l.7 4c.3 2 2.4 2 2.7 0 .6-4 1.6-5 1.6-9 0-3-2-5-5-5z%22/%3E%3Cpath d=%22M13.2 3.1l-1.7 3.2 2 1.5-1.7 3.2%22/%3E%3C/svg%3E"); }
.ico-m-revision-pendiente { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12.5 19H5a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2h11a2 2 0 0 1 2 2v4.5M3 10h15M7.5 3v4M13.5 3v4%22/%3E%3Ccircle cx=%2217.5%22 cy=%2217.5%22 r=%224%22/%3E%3Cpath d=%22M17.5 15.6v2l1.3.9%22/%3E%3C/svg%3E"); }
.ico-m-segunda-opinion { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 21H7a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h7l5 5v3%22/%3E%3Cpath d=%22M14 3v5h5M8.5 12h5M8.5 15.5h2.5%22/%3E%3Ccircle cx=%2216.5%22 cy=%2216.5%22 r=%223%22/%3E%3Cpath d=%22M18.7 18.7L21 21%22/%3E%3C/svg%3E"); }
.ico-m-boca-entera { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 19.5C4 10 7.5 4 12 4s8 6 8 15.5%22/%3E%3Cpath d=%22M8.5 19.5c0-6.2 1.4-9.8 3.5-9.8s3.5 3.6 3.5 9.8%22/%3E%3Cpath d=%22M4.5 14.5l4.2.8M6.4 9.4l3.1 2.3M9.4 5.4l1.5 4.6M14.6 5.4l-1.5 4.6M17.6 9.4l-3.1 2.3M19.5 14.5l-4.2.8%22/%3E%3C/svg%3E"); }
.ico-m-radiografia { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%224%22 y=%223%22 width=%2216%22 height=%2218%22 rx=%222%22/%3E%3Cpath d=%22M12 7c-1.7 0-2.8 1.1-2.8 2.7 0 2.2.6 2.8.9 4.8.15 1 1.3 1 1.45 0L12 12.4l.45 2.1c.15 1 1.3 1 1.45 0 .3-2 .9-2.6.9-4.8C14.8 8.1 13.7 7 12 7z%22/%3E%3Cpath d=%22M7 6h1.5%22/%3E%3C/svg%3E"); }
.ico-m-diagnostico { --ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M5 3.5h14a2 2 0 0 1 2 2v9.5a2 2 0 0 1-2 2h-7.5L7 20.5V17H5a2 2 0 0 1-2-2V5.5a2 2 0 0 1 2-2z%22/%3E%3Cpath d=%22M12 6c-1.6 0-2.6 1-2.6 2.5 0 2 .5 2.6.8 4.4.15.9 1.2.9 1.35 0L12 11.1l.45 1.8c.15.9 1.2.9 1.35 0 .3-1.8.8-2.4.8-4.4C14.6 7 13.6 6 12 6z%22/%3E%3C/svg%3E"); }

/* ── Héroe de pilar con foto clara (Antonio, 13/10, v4 de estética dental) ──
   Con una foto de luz de día el fundido largo de .foto-fundida la apagaba contra el navy. Aquí el fundido es
   más corto y se ve más foto, encuadrada hacia la derecha para que la muestra no se corte cuando el héroe es
   más alto que ancho la foto. En móvil la foto se funde antes de llegar al rótulo, que es dorado y sobre una
   foto clara se leía peor. El resto del héroe es el de la v3. */
.heroe-pilar--claro > .foto-fundida img {
  object-position: 88% 35%;
  -webkit-mask-image: linear-gradient(to right, transparent 0, rgba(0, 0, 0, .55) 12%, #000 26%);
  mask-image: linear-gradient(to right, transparent 0, rgba(0, 0, 0, .55) 12%, #000 26%);
}
.heroe-pilar--claro > .foto-fundida-movil img {
  -webkit-mask-image: linear-gradient(to bottom, #000 35%, transparent 72%);
  mask-image: linear-gradient(to bottom, #000 35%, transparent 72%);
}

/* ── Odontología general v2 (Antonio, 14/10) ──
   «Quién lo trata» en móvil: icono y texto en una línea, sin partirse, y la etiqueta debajo, alineada con el texto.
   La estrella de la cifra «4,8», pequeña y en oro, sentada en la base del número. */
@media (max-width: 767px) {
  .filas-compactas .filas li { flex-wrap: wrap; gap: 6px 12px; padding: 12px 14px; }
  .filas-compactas .filas li > span:not(.chip):not(.ico-m) { flex: 1 0 calc(100% - 32px); white-space: nowrap; }
  .filas-compactas .filas .chip { margin-left: 32px; font-size: 14px; }
}
.estrella-cifra { color: var(--e-global-color-accent); font-size: .5em; margin-left: .15em; vertical-align: baseline; }

/* ── Mapa de Google (Antonio, 14/10) ──
   El recuadro lleva en los controles de Elementor el borde, las esquinas, el alto mínimo y el
   desbordamiento oculto (clase mapa-google). Aquí solo lo que Elementor no sabe hacer: que el
   iframe ocupe el recuadro entero, también cuando la tarjeta de al lado es más alta. */
.e-con.mapa-google > .elementor-widget-html { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; }
.mapa-google .elementor-widget-container { width: 100%; height: 100%; }
.mapa-google iframe { display: block; width: 100%; height: 100%; border: 0; }

/* Tabla ancha (comparativa de prótesis): en móvil se desliza en horizontal en vez de ensanchar la página.
   Estaba desde el 03/10 y se perdió en el commit 5ac6825; devuelta el 14/10. */
.tabla-scroll { overflow-x: auto; }

/* ── Enlaces del pie al pasar el ratón (Antonio, 14/10) ──
   El hover global de enlaces de Astra es el azul marino oscuro y sobre el azul del pie no se veía.
   Pasan a oro con subrayado en oro, como los enlaces del mega menú; sin cambiar el grosor, para que
   el texto no salte. Los ajustes de enlace del pie de Astra no se pueden escribir por Novamira. */
.site-footer a:is(:hover, :focus-visible),
.site-footer .widget_nav_menu .menu-item a:is(:hover, :focus-visible),
.site-footer .footer-nav-wrap .menu-item .menu-link:is(:hover, :focus-visible),
#astra-footer-menu .menu-item:hover > a {
  color: var(--ast-global-color-7);
  text-decoration: underline;
  text-decoration-color: var(--ast-global-color-7);
  text-underline-offset: 4px;
}

/* Aviso bajo los antes y después (03/11): centrado en la página, sin el ancho máximo de los párrafos */
.aviso-casos { padding-inline: 16px; }
.aviso-casos p { max-width: none; margin: 0 auto; }

/* ── Desplegables ordenados y con imagen (Antonio, 09/11) ──
   Mismo panel navy para Tratamientos, Implantes, Ortodoncia, Equipo y La clínica.
   Columna de introducción a la izquierda (mega-intro), listas con título en oro
   (mega-col enlaza a su pilar; mega-lista es solo rótulo), tarjeta con foto
   (mega-tarjeta) y retratos en Equipo (mega-persona). Estructura del menú en
   scripts/menu_desplegables_09_11.py. En móvil, sin introducción, tarjetas ni fotos. */
@media (min-width: 922px) {
  .ast-builder-menu-1 .astra-megamenu-li .astra-megamenu {
    display: grid !important;
    grid-template-columns: minmax(240px, 1.25fr) repeat(3, minmax(0, 1fr));
    column-gap: 56px;
    row-gap: 36px;
    align-items: start;
    padding: 40px 80px 48px;
  }
  .ast-builder-menu-1 .mega-tratamientos .astra-megamenu { grid-template-columns: minmax(240px, 1.25fr) repeat(4, minmax(0, 1fr)); }
  .ast-builder-menu-1 .mega-equipo .astra-megamenu { grid-template-columns: minmax(240px, 1.25fr) repeat(5, minmax(0, 1fr)); column-gap: 32px; }
  .ast-builder-menu-1 .mega-panel .astra-megamenu { grid-template-columns: minmax(240px, 1.25fr) minmax(0, 1fr) minmax(260px, 340px); column-gap: 72px; }
  .ast-builder-menu-1 .astra-megamenu > .menu-item { width: auto !important; margin: 0 !important; padding: 0 !important; border: 0 !important; }
  .ast-builder-menu-1 .mega-tratamientos .astra-megamenu > .mega-intro { grid-row: span 2; }

  /* Introducción */
  .ast-builder-menu-1 .astra-megamenu > .mega-intro { align-self: stretch; padding-right: 40px !important; border-right: 1px solid rgba(255, 255, 255, .14) !important; }
  .ast-desktop .ast-builder-menu-1 .astra-megamenu > .mega-intro > .menu-link,
  .ast-builder-menu-1 .astra-megamenu > .mega-intro > .menu-link {
    display: flex; flex-direction: column; align-items: flex-start; gap: 10px;
    pointer-events: auto; cursor: pointer; border: 0; margin: 0;
    color: var(--ast-global-color-4); text-transform: none; letter-spacing: 0;
  }
  .astra-megamenu .mega-intro .mi-t { font-size: 26px; line-height: 1.2; font-weight: 300; letter-spacing: 0; text-transform: none; color: var(--ast-global-color-4); }
  .astra-megamenu .mega-intro .mi-s { font-size: 12px; line-height: 1.5; letter-spacing: .18em; text-transform: uppercase; color: var(--ast-global-color-7); }
  .astra-megamenu .mi-v { margin-top: 14px; padding-bottom: 4px; font-size: 13px; letter-spacing: .10em; text-transform: uppercase; color: var(--ast-global-color-4); border-bottom: 1px solid var(--ast-global-color-7); }
  .astra-megamenu .mi-v::after { content: " \2192"; }
  .astra-megamenu .mega-intro > .menu-link:hover .mi-v,
  .astra-megamenu .mega-tarjeta > .menu-link:hover .mi-v { color: var(--ast-global-color-7); }

  /* Títulos de columna: en oro; los de Tratamientos llevan a su pilar */
  .ast-desktop .ast-builder-menu-1 .astra-megamenu > .mega-col > .menu-link,
  .ast-desktop .ast-builder-menu-1 .astra-megamenu > .mega-lista > .menu-link {
    display: block; margin: 0 0 14px; padding: 0; border: 0;
    font-size: 12px; line-height: 1.4; font-weight: 400; letter-spacing: .18em; text-transform: uppercase;
    color: var(--ast-global-color-7);
  }
  .ast-desktop .ast-builder-menu-1 .mega-tratamientos .astra-megamenu > .mega-col > .menu-link { pointer-events: auto; cursor: pointer; }
  .ast-desktop .ast-builder-menu-1 .astra-megamenu > .mega-col > .menu-link:hover { color: var(--ast-global-color-4); }
  .ast-desktop .ast-builder-menu-1 .astra-megamenu > .mega-lista > .menu-link { pointer-events: none; cursor: default; }

  /* Enlaces de dentro: una sola línea de lectura, con aire entre filas */
  .ast-builder-menu-1 .astra-megamenu .sub-menu .menu-link { font-size: 13px; line-height: 1.45; letter-spacing: .06em; white-space: normal; }
  .ast-builder-menu-1 .astra-megamenu .sub-menu li + li { margin-top: 12px; }

  /* Tarjeta con foto */
  .ast-builder-menu-1 .astra-megamenu > .mega-tarjeta > .menu-link { display: flex; flex-direction: column; gap: 12px; border: 0; text-transform: none; letter-spacing: 0; }
  .astra-megamenu .mi-img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 12px; }
  .astra-megamenu .mega-tarjeta .mi-t { font-size: 15px; line-height: 1.35; letter-spacing: .06em; text-transform: uppercase; color: var(--ast-global-color-4); }
  .astra-megamenu .mega-tarjeta .mi-v { margin-top: 0; font-size: 12px; }

  /* Equipo: retrato, nombre y especialidad */
  .ast-builder-menu-1 .astra-megamenu > .mega-persona > .menu-link { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; border: 0; }
  .astra-megamenu .mi-foto { display: block; width: 76px; height: 76px; border-radius: 50%; object-fit: cover; object-position: 50% 15%; border: 1px solid rgba(255, 255, 255, .18); }
  .astra-megamenu .mega-persona .mi-n { font-size: 13px; line-height: 1.45; letter-spacing: .06em; text-transform: uppercase; }
  .astra-megamenu .mega-persona > .menu-link:hover .mi-foto { border-color: var(--ast-global-color-7); }
}
@media (max-width: 921px) {
  #ast-hf-mobile-menu .mega-intro,
  #ast-hf-mobile-menu .mega-tarjeta,
  #ast-hf-mobile-menu .mi-foto { display: none !important; }
  #ast-hf-mobile-menu .mega-lista > .menu-link { pointer-events: none; }
}
/* Con Implantes, Ortodoncia y La clínica desplegables (09/11) el menú no cabía en una
   línea a 1440 (801 px de hueco, 824 de menú): hueco fluido, letra algo más junta por
   debajo de 1600 y, por debajo de 1440, sin las flechas (el desplegable sigue igual) */
@media (min-width: 922px) {
  #ast-desktop-header .main-header-menu { gap: clamp(14px, 1.5vw, 32px) !important; }
}
@media (min-width: 922px) and (max-width: 1599px) {
  #ast-desktop-header .main-header-menu > .menu-item > .menu-link { letter-spacing: .07em; }
}
@media (min-width: 922px) and (max-width: 1439px) {
  #ast-desktop-header .main-header-menu { gap: 14px !important; }
  #ast-desktop-header .main-header-menu > .menu-item > .menu-link .dropdown-menu-toggle { display: none; }
}
/* Astra envuelve el título del elemento en .menu-text (inline): se apila ahí */
@media (min-width: 922px) {
  .astra-megamenu .mega-intro > .menu-link .menu-text,
  .astra-megamenu .mega-tarjeta > .menu-link .menu-text,
  .astra-megamenu .mega-persona > .menu-link .menu-text { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
  .astra-megamenu .mega-intro .mi-v { margin-top: 18px; }
  .ast-builder-menu-1 .mega-panel .astra-megamenu { grid-template-columns: minmax(240px, 320px) minmax(0, 1fr) 300px; column-gap: 64px; }
  .astra-megamenu .mega-tarjeta .mi-img { max-width: 300px; aspect-ratio: 16 / 10; }
  .astra-megamenu .mega-persona .area { margin-top: 0; }
}
@media (min-width: 922px) { .astra-megamenu .mi-v { white-space: nowrap; } }
/* Paneles de Implantes, Ortodoncia y La clínica: bloque compacto y centrado (Antonio, 09/11) */
@media (min-width: 922px) {
  .ast-builder-menu-1 .mega-panel .astra-megamenu {
    grid-template-columns: 300px 280px 300px;
    justify-content: center;
    column-gap: 72px;
  }
}
/* Móvil: retrato redondo a la izquierda de cada profesional (Antonio, 09/11) */
@media (max-width: 921px) {
  #ast-hf-mobile-menu .mega-persona .mi-foto {
    display: block !important;
    grid-row: 1 / span 2;
    width: 48px; height: 48px;
    border-radius: 50%;
    object-fit: cover; object-position: 50% 15%;
    border: 1px solid rgba(255, 255, 255, .25);
  }
  #ast-hf-mobile-menu .mega-persona > .menu-link .menu-text {
    display: grid;
    grid-template-columns: 48px 1fr;
    column-gap: 14px;
    align-items: center;
  }
  #ast-hf-mobile-menu .mega-persona .mi-n,
  #ast-hf-mobile-menu .mega-persona .area { grid-column: 2; }
}

/* Banner de cookies de Complianz: texto y enlaces legibles en movil (09/11).
   Color negro, centrado y sin hover estan en el CSS personalizado del propio Complianz. */
body .cmplz-cookiebanner .cmplz-message,
body .cmplz-cookiebanner .cmplz-message p {
  font-size: 12px;
  line-height: 1.5;
}
body .cmplz-cookiebanner .cmplz-links .cmplz-link {
  font-size: 12px;
}
/* La clínica en móvil: tarjeta con la foto de la fachada (Antonio, 09/11). En escritorio sigue la recepción */
@media (min-width: 922px) { .astra-megamenu .mi-movil { display: none; } }
@media (max-width: 921px) {
  #ast-hf-mobile-menu .menu-item-81 .mega-tarjeta { display: block !important; margin: 4px 0 20px; }
  #ast-hf-mobile-menu .menu-item-81 .mega-tarjeta .mi-img { display: none; }
  #ast-hf-mobile-menu .menu-item-81 .mega-tarjeta > .menu-link .menu-text { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
  #ast-hf-mobile-menu .menu-item-81 .mega-tarjeta .mi-movil { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 12px; }
  #ast-hf-mobile-menu .menu-item-81 .mega-tarjeta .mi-t { font-size: 13px; letter-spacing: .10em; text-transform: uppercase; }
  #ast-hf-mobile-menu .menu-item-81 .mega-tarjeta .mi-v { font-size: 12px; letter-spacing: .10em; text-transform: uppercase; color: var(--ast-global-color-7); }
  #ast-hf-mobile-menu .menu-item-81 .mega-tarjeta .mi-v::after { content: " \2192"; }
}
/* Fachada en móvil, en pequeño: miniatura a la izquierda y texto al lado (Antonio, 09/11) */
@media (max-width: 921px) {
  #ast-hf-mobile-menu .menu-item-81 .mega-tarjeta > .menu-link .menu-text {
    display: grid; grid-template-columns: 120px 1fr; column-gap: 16px; row-gap: 6px; align-items: center;
  }
  #ast-hf-mobile-menu .menu-item-81 .mega-tarjeta .mi-movil { grid-row: 1 / span 2; width: 120px; height: 80px; aspect-ratio: auto; border-radius: 10px; }
  #ast-hf-mobile-menu .menu-item-81 .mega-tarjeta .mi-t,
  #ast-hf-mobile-menu .menu-item-81 .mega-tarjeta .mi-v { grid-column: 2; }
}