/* Ajustes de layout en móvil.
   Los CSS generados por página fijan anchos de escritorio (width:75%,
   max-width:80%) en los subtítulos de sección y en los contenedores de
   tarjetas/precios, y no los restablecen en móvil: los párrafos quedaban
   encajonados (~250px en un viewport de 375px) con huecos laterales
   desiguales respecto a los títulos. Son los mismos ids en todas las
   plantillas del sitio (home, servicios, localidades, zonas). */
@media (max-width: 767px) {
  #div_block-615-9,
  #div_block-630-9,
  #text_block-529-9,
  #text_block-592-9,
  #text_block-597-9,
  #text_block-601-9,
  #text_block-82-99 {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Barra superior azul: el selector de idiomas hereda el margen del <p>
   que envuelve la variante de escritorio (oculta) y quedaba 8px por
   debajo del centro; el teléfono era texto plano. Se centra el selector
   y el teléfono pasa a píldora con icono, a juego con el chip de idioma. */
@media (max-width: 767px) {
  #_rich_text-102-21 p {
    margin: 0 !important;
  }
  #div_block-99-21,
  #_rich_text-102-21 {
    display: flex !important;
    align-items: center !important;
  }
  #link-15-21 {
    flex-direction: row !important;
    gap: 6px;
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 999px;
    padding: 5px 14px;
    font-weight: 700;
    letter-spacing: 0.5px;
  }
  #link-15-21::before {
    content: '📞';
    font-size: 14px;
    line-height: 1;
  }
}
