/* Propuesta A — menú fijo y cabecera mínima (sólo teléfono)
 *
 * La cabecera pasa de ~920 px a ~190 px, y el menú queda pegado arriba mientras se baja,
 * así se puede saltar a otra sección desde cualquier punto sin volver arriba.
 *
 * Se esconden la barra de contacto, las redes y los dos banners de promesa; sus mensajes
 * vuelven como una tira de texto de 26 px. El teléfono y el correo siguen en el pie, y el
 * WhatsApp está en cada ficha.
 *
 * Sólo se fija el menú (~50 px) y no el logo: dos barras fijas se comían un cuarto de la
 * pantalla del teléfono. El logo se ve al entrar y vuelve al subir.
 */
@media (max-width: 767px) {

  .header { display: none; }                                   /* barra de contacto */
  .header-bot .header-right { display: none; }                 /* redes: ya están en el pie */
  .header-bot .container > div:not([class]) { display: none; } /* banners de promesa */

  .header-bot { padding: 8px 0; margin: 0; }
  .header-bot .header-left { width: auto; float: none; padding: 0; text-align: center; }
  .header-bot .header-left h1 { margin: 0; }
  .header-bot .header-left img { max-height: 58px; width: auto; }

  /* Sólo el menú queda fijo. */
  .ban-top {
    position: sticky;
    top: 0;
    z-index: 999;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
  }

  /* La tira que reemplaza a los dos banners. */
  .c-promo {
    display: flex;
    justify-content: center;
    gap: 18px;
    background: #fbeff0;
    color: #8a5c5e;
    font-size: 11px;
    letter-spacing: .02em;
    padding: 7px 10px;
    text-align: center;
  }
  .c-promo span { white-space: nowrap; }
}

@media (min-width: 768px) { .c-promo { display: none; } }
