/* ==========================================================================
   Animaciones desactivadas en bloques concretos
   ========================================================================== */
#rec2369781591.r_anim {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}
.uc-no-anim-footer.r_anim,
.uc-no-anim-footer .r_anim {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

/* ==========================================================================
   Botones de las tarjetas (sc-card)
   ========================================================================== */
#allrecords a.sc-card__btn--primary,
#allrecords a.sc-card__btn--primary:link,
#allrecords a.sc-card__btn--primary:visited,
#allrecords a.sc-card-b__btn--primary,
#allrecords a.sc-card-b__btn--primary:link,
#allrecords a.sc-card-b__btn--primary:visited {
  background: linear-gradient(135deg, #F4BCAF 0%, #FBD9CD 100%) !important;
  color: #282828 !important;
  border-color: transparent !important;
}
#allrecords a.sc-card__btn--primary:hover,
#allrecords a.sc-card__btn--primary:active,
#allrecords a.sc-card-b__btn--primary:hover,
#allrecords a.sc-card-b__btn--primary:active {
  background: transparent !important;
  color: #282828 !important;
  border-color: #f3b8aa !important;
}
#allrecords a.sc-card__btn--outline,
#allrecords a.sc-card__btn--outline:link,
#allrecords a.sc-card__btn--outline:visited,
#allrecords a.sc-card-b__btn--outline,
#allrecords a.sc-card-b__btn--outline:link,
#allrecords a.sc-card-b__btn--outline:visited {
  color: #282828 !important;
}
#allrecords a.sc-card__btn--outline:hover,
#allrecords a.sc-card__btn--outline:active,
#allrecords a.sc-card-b__btn--outline:hover,
#allrecords a.sc-card-b__btn--outline:active {
  background: #F4BCAF !important;
  color: #ffffff !important;
  border-color: transparent !important;
}

#allrecords .t-contact-method__title {
  font-family: 'Commissioner', sans-serif;
  font-weight: 300;
}

/* ==========================================================================
   Protecciones generales
   ========================================================================== */

/* Protección global de TODO el texto del sitio contra el autoescalado */
#allrecords, #allrecords * {
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

/* Banner: límite estricto de tamaño en pantallas extremadamente estrechas para mantener exactamente 2 líneas */
@media (max-width: 340px) {
  #rec2296307871 .t1241__title {
    font-size: 20px !important;
    line-height: 1.2 !important;
  }
}

/* Protección adicional para las tarjetas */
#allrecords .hp-card,
#allrecords .hp-services__item {
  min-width: 0 !important;
}

/* Protección general contra overflow horizontal */
html, body {
  overflow-x: hidden;
}

/* Cabecera en pantallas extremadamente estrechas (320px con texto "Aumentado"): sin saltos de línea */
@media (max-width: 340px) {
  #allrecords .t-menu-base__imglogo {
    max-width: 68px !important;
    width: 68px !important;
  }

  #allrecords .t-sociallinks__wrapper {
    font-size: 10px !important;
  }

  #allrecords .t-sociallinks__item a {
    width: 22px !important;
    height: 22px !important;
  }

  #allrecords .t-sociallinks__svg {
    width: 22px !important;
    height: 22px !important;
  }
}

/* ==========================================================================
   Colores de las redes sociales
   ========================================================================== */
#allrecords .t-sociallinks__item_maxmessenger svg path {
  fill: #5181F2 !important;
}
#allrecords .t-sociallinks__item_telegram svg path {
  fill: #229ED9 !important;
}
#allrecords .t-sociallinks__item_whatsapp svg path {
  fill: #25D366 !important;
}
#allrecords .t-sociallinks__item_vk svg path {
  fill: #0077FF !important;
}
#allrecords .t-sociallinks__item_ok svg path {
  fill: #EE8208 !important;
}

/* ==========================================================================
   Banner: posición y estilo de las dos ramas decorativas (SVG)
   ========================================================================== */
#rec2288989931 .t1241__container {
  position: relative;
  z-index: 0;
}
#rec2288989931 .t-col_5,
#rec2288989931 .t1241__image {
  position: relative;
  z-index: 2;
}
#rec2288989931 .leaf-branch {
  position: absolute;
  z-index: 1;
  color: #282828;
  opacity: 0.18;
  pointer-events: none;
}
#rec2288989931 .leaf-branch-left {
  left: 0;
  bottom: 0;
  width: 180px;
}
#rec2288989931 .leaf-branch-right {
  right: 0;
  top: 0;
  width: 180px;
  transform: scaleX(-1);
}
@media (max-width: 979px) {
  #rec2288989931 .leaf-branch-left,
  #rec2288989931 .leaf-branch-right {
    width: 120px;
  }
}
@media (max-width: 479px) {
  #rec2288989931 .leaf-branch-right {
    display: none;
  }
  #rec2288989931 .leaf-branch-left {
    width: 80px;
    left: -10px;
    bottom: -10px;
  }
}

/* ==========================================================================
   Menú superior: líneas a ancho completo
   ========================================================================== */
#allrecords .t967__linewrapper {
  overflow: visible;
}
#allrecords .t967__horizontalline {
  position: relative;
  width: 100vw;
  left: 50%;
  margin-left: -50vw;
}

/* ==========================================================================
   Menú desplegable "Servicios" (bloque ME601B)
   ========================================================================== */

/* Escritorio: orden y ancho del panel.
   Con display:flex !important el panel está siempre en la página, por eso
   cuando está cerrado (sin la clase _show) se vuelve invisible y no recibe
   clics ni hover; así no tapa los sliders ni los enlaces que hay debajo */
@media screen and (min-width: 980px) {
  #allrecords .t978__tooltip-menu {
    left: max(20px, calc((100vw - 1200px) / 2)) !important;
    right: auto !important;
    width: min(1200px, calc(100vw - 40px)) !important;
    max-width: min(1200px, calc(100vw - 40px)) !important;
    display: flex !important;
    flex-direction: row !important;
  }
  #allrecords .t978__tooltip-menu:not(.t978__tooltip-menu_show) {
    visibility: hidden !important;
    pointer-events: none !important;
  }
  #allrecords .t978__tooltip-menu .t978__menu {
    order: 1 !important;
    flex-shrink: 0 !important;
  }
  #allrecords .t978__tooltip-menu .t978__innermenu {
    order: 2 !important;
    flex-grow: 1 !important;
  }
}

/* Elimina el scroll nativo duplicado, dejando solo el scroll personalizado */
#allrecords .t978__tooltip-menu .t978__innermenu {
  overflow-y: visible !important;
  max-height: none !important;
}
/* Anula el scroll automático que Tilda añade por su cuenta (inline) en categorías con listas largas,
   para que quede un único scroll (el nuestro, a nivel de .t978__innermenu-list).
   Además estira el fondo gris de la columna derecha hasta ocupar toda la altura del panel (evita franja blanca abajo) */
#allrecords .t978__tooltip-menu .t978__innermenu-wrapper {
  overflow-y: visible !important;
  height: 100% !important;
}
#allrecords .t978__tooltip-menu .t978__innermenu-content {
  height: 100% !important;
}

/* Más espacio vertical entre los elementos de ambas listas */
#allrecords .t978__menu-item,
#allrecords .t978__innermenu-item {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}

/* ==========================================================================
   Tarjetas de la sección de servicios
   ========================================================================== */
#allrecords .t1050__col {
  background-color: #F6EFEA !important;
  border-radius: 16px !important;
  padding: 20px 22px !important;
  border: none !important;
  box-sizing: border-box !important;
}
#allrecords .t1050__container {
  flex-wrap: nowrap !important;
}
@media (max-width: 979px) {
  #allrecords .t1050__col {
    padding: 18px 20px !important;
  }
  #allrecords .t1050__container {
    flex-wrap: wrap !important;
  }
}
@media (max-width: 479px) {
  #allrecords .t1050__col {
    padding: 16px 18px !important;
  }
}

/* ==========================================================================
   Menú móvil (burger, bloque #rec3757123501)
   ========================================================================== */

/* Oculta el bloque inferior de iconos de redes sociales duplicados en el menú desplegable */
#rec3757123501 .t1362__additional .t-sociallinks {
  display: none !important;
}

/* Elimina cualquier espacio por defecto debajo de ambas listas (menú principal y submenú) */
#rec3757123501 .t-menu-base__list,
#rec3757123501 .t-menusub__list {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Espacio único y constante antes del bloque de teléfono/dirección */
#rec3757123501 .t-menu-popover__container.t-menu-popover__container_left {
  padding-top: 16px !important;
  gap: 0 !important;
}

#rec3757123501 .t1362__additional {
  margin-top: 20px !important;
  padding-top: 0 !important;
}

/* Oculta teléfono/dirección/metro cuando hay un submenú abierto (Servicios, Sobre la clínica) */
#rec3757123501 .t-menu-popover__burgermenu__list-wrapper:has(.t-menusub__menu_show) ~ .t1362__additional {
  display: none !important;
}

@media screen and (min-width: 480px) and (min-height: 500px) {
  #rec3757123501 .t-menu-popover__burgermenu__list-wrapper {
    justify-content: flex-start !important;
  }

  #rec3757123501 .t-menu-popover__burgermenu__list-wrapper:has(.t-menusub__menu_show) {
    padding-top: 12px !important;
  }
}

/* Tablet y móvil (hasta 979px): alineación de la lista, espacio del submenú, separador del bloque de contacto
   y contenedor de texto (teléfono/dirección) a bloque para evitar saltos de línea inesperados al colorear texto dentro */
@media screen and (max-width: 979px) {
  #allrecords .t-menu-popover__burgermenu__list-wrapper {
    justify-content: flex-start !important;
  }
  

/* Submenú de segundo nivel (p. ej. "Консультации"): mismo espacio superior de 8px que en el primer nivel.
   El padding del contenedor no se puede cambiar porque Tilda lo fija en línea con !important,
   así que el espacio se aplica como margen superior en la cabecera con la flecha y el título */
@media screen and (max-width: 979px) {
  #allrecords .t-menusub__innermenu-wrapper .t-menusub__innermenu-content .t-menusub__back-header {
    margin-top: 8px !important;
  }
}
  

  #allrecords .t-menusub__innermenu-content_level1 {
    padding-top: 8px !important;
  }

  #rec3757123501 .t1362__additional {
    border-top: 1px solid #e9e9e9 !important;
    padding-top: 16px !important;
    margin-top: 20px !important;
  }

  #allrecords .t-menu-popover__descr {
    display: block !important;
  }
}

/* ==========================================================================
   Formulario con imagen (bloque estándar de Tilda "t823")
   --------------------------------------------------------------------------
   Este CSS va en el CSS personalizado general del sitio (Configuración del
   sitio → Más → CSS personalizado), porque el bloque del constructor no
   tiene un campo de CSS propio.

   Qué hace:
   - Reduce el espacio vertical del bloque y su altura total, que antes
     ocupaba el 100% del viewport.
   - Redondea las dos columnas (imagen y formulario) con radio de 16px.
   - Iguala la altura de la imagen y la del formulario.
   - Aplica el degradado de la marca (#FDFDFD → #F3F3F3) al fondo del
     formulario.
   - Solo afecta a la versión de escritorio (el bloque no se muestra en
     móvil), por eso no hay media queries.

   Los selectores usan la clase .t823 (tipo de bloque) y no el ID #rec...,
   así que funcionan también cuando el formulario se republique en el footer
   con otro ID. Afectan a TODOS los bloques de este tipo en el sitio.
   ========================================================================== */

/* Contenedor: reduce el espacio vertical del bloque */
.t823 .t823__container {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

/* Se anula el layout de tabla para poder redondear ambas columnas */
.t823 .t823__wrapper,
.t823 .t823__wrapper > tbody {
  display: block !important;
  height: auto !important;
  min-height: 0 !important; /* anula la altura que calcula el script de Tilda */
}

/* La fila pasa a flex con separación entre columnas e igual altura */
.t823 .t823__wrapper > tbody > tr {
  display: flex !important;
  align-items: stretch;
  gap: 24px;
}

/* Las celdas dejan de comportarse como celdas de tabla */
.t823 .t823__col {
  display: block !important;
  width: calc(50% - 12px) !important;
  height: auto !important;
  box-sizing: border-box;
}

/* Columna de la imagen: referencia de posición para la imagen de fondo */
.t823 .t823__col_img {
  position: relative;
  min-height: 460px;
  border-radius: 16px !important;
  overflow: hidden;
}

/* Contenedores intermedios: sin posición propia para no romper la referencia */
.t823 .t823__imgblock,
.t823 .t823__imgwrapper {
  position: static !important;
  height: auto !important;
  border-radius: 16px !important; /* anula el radio de 29px del bloque */
}

/* Imagen de fondo: cubre toda la columna, que siempre tiene altura */
.t823 .t823__bgimg {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  border-radius: 16px !important; /* anula el radio de 29px del bloque */
}

/* Columna del formulario: fondo liso y esquinas redondeadas */
.t823 .t823__col_form {
  display: flex !important;
  align-items: center;
  background: #f7f7f7;
  border-radius: 16px;
}

/* Espacio interior reducido del formulario */
.t823 .t823__main-wrapper {
  width: 100%;
  padding: 40px 48px !important;
  box-sizing: border-box;
}

/* Título y texto inferior más compactos */
.t823 .t823__title {
  padding-bottom: 20px !important;
}
.t823 .t823__form-bottom-text {
  margin-top: 12px;
}