/* === Logo del encabezado: que no salga estirado ===
   El <img id="logo"> lleva width="308" height="84" (los atributos están para
   que el navegador reserve el espacio y no haya salto de layout al cargar).
   Pero el tema impone `.navbar-brand img { max-height: 43px }` en
   css/plugins/nav-menu.css, y el max-height recorta SÓLO el alto: como el
   ancho ya viene especificado por el atributo, no se recalcula. Resultado:
   308x43 en lugar de 308x84, o sea el logo al doble de ancho del que le toca.

   Con `width: auto` los dos ejes vuelven a ser automáticos, el max-height pasa
   a escalar la imagen entera y el logo queda en 158x43, proporcionado. Los
   atributos del HTML se quedan: siguen declarando la relación de aspecto real
   y con eso alcanza para reservar el espacio. */
.navbar-brand img { width: auto; }

/* === Mostrar la imagen en mobile dentro de #garantia (Lo que te ofrece la App) ===
   En desktop los col-lg-6 se igualan en alto por flex; en mobile se apilan y
   el div .bg-img con h-100 colapsa a 0px. Le damos una altura propia. */
@media (max-width: 991px) {
  #garantia .resp-tab-content .bg-img.cover-background {
    min-height: 260px;
  }
}
@media (max-width: 575px) {
  #garantia .resp-tab-content .bg-img.cover-background {
    min-height: 200px;
  }
}

/* === Mensaje de estado del formulario del Boletín (pie) ===
   Los .text-success / .text-danger de Bootstrap quedan demasiado oscuros
   sobre el fondo #232323 del pie, así que usamos versiones aclaradas. */
.boletin-msg.is-ok {
  color: #7bd67d;
}
.boletin-msg.is-error {
  color: #ff9080;
}

/* === Encabezado de nivel 1 fuera de la vista ===
   La home no tenía H1: el titular grande del hero son <div class="tp-caption">
   que maneja Revolution Slider, y además rota entre tres textos distintos, así
   que ninguno sirve como encabezado único del documento. Convertir esos div en
   <h1> implicaba meter mano en el markup del slider, con riesgo visual y tres
   H1 en la misma página.

   Esta es la misma solución que ya usa app (ver .seo-sr en www/assets/css/app.css):
   un H1 correcto para lectores de pantalla y para el árbol del documento, que
   no cambia el diseño. No es cloaking: dice lo mismo que la página muestra. */
.seo-sr {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}