/* Ajustes de encabezado y menú en mobile — Allianzy, ago-2026.
   No se toca el tema: son reglas encima del CSS original. */

@media (max-width: 921px) {

  /* ── Barra superior ──────────────────────────────────────────────
     La fila de arriba sólo tenía las redes: se elimina y los iconos pasan a la
     línea del logo, para no gastar una franja entera de pantalla. */
  #ast-mobile-header .ast-above-header-wrap { display: none !important; }

  #ast-mobile-header .ast-primary-header-bar,
  #ast-mobile-header .site-primary-header-wrap { min-height: 74px; }

  /* El tema le fija 70 px de ancho al logo. Limitarle el alto lo aplastaba, así
     que se controla por ancho y el alto queda libre: proporción intacta. */
  #ast-mobile-header .site-branding img,
  #ast-mobile-header .custom-logo-link img {
    width: 66px !important;
    max-width: 66px !important;
    height: auto !important;
    max-height: none !important;
    display: block;
  }
  #ast-mobile-header .site-branding,
  #ast-mobile-header .ast-site-identity { padding: 0; }
  #ast-mobile-header .site-header-primary-section-left { padding-left: 0; }

  /* Iconos y menú a distancias iguales: cada uno vive en una caja del mismo
     ancho y el dibujo va centrado, así los centros quedan equiespaciados aunque
     los iconos tengan anchos distintos entre sí. */
  #ast-mobile-header .site-header-primary-section-right {
    align-items: center;
    gap: 0 !important;
  }
  #ast-mobile-header .sa-social-inline,
  #ast-mobile-header .sa-social-inline .ast-header-social-wrap { margin: 0 !important; }
  #ast-mobile-header .sa-social-inline .header-social-inner-wrap {
    display: flex;
    align-items: center;
    gap: 0;
  }
  #ast-mobile-header .sa-social-inline .header-social-item {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    margin: 0 !important;
  }
  #ast-mobile-header .sa-social-inline svg { width: 20px; height: 20px; }

  #ast-mobile-header [data-section="section-header-mobile-trigger"] { margin: 0 !important; }
  #ast-mobile-header [data-section="section-header-mobile-trigger"] .ast-button-wrap { margin: 0 !important; }
  #ast-mobile-header [data-section="section-header-mobile-trigger"] .menu-toggle {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* ── Menú desplegado ─────────────────────────────────────────────
     Era blanco sobre blanco y no se veía dónde terminaba. Se le da un borde
     amarillo tenue, una línea de acento arriba, esquinas y sombra. */
  #ast-mobile-header .ast-mobile-header-content {
    background: #fff;
    border: 1px solid rgba(247, 204, 66, .7);
    border-top: 3px solid #F7CC42;
    border-radius: 0 0 12px 12px;
    box-shadow: 0 16px 34px rgba(31, 41, 55, .16);
    padding-bottom: 6px;
    overflow: hidden;
  }

  /* Separadores en amarillo muy suave, y el último ítem sin línea. */
  #ast-mobile-header .ast-mobile-header-content .main-header-menu .menu-item > .menu-link {
    border-bottom-color: rgba(247, 204, 66, .25);
  }
  #ast-mobile-header .ast-mobile-header-content .main-header-menu > .menu-item:last-child > .menu-link {
    border-bottom: 0;
  }

  /* ── Botón Contacto ──────────────────────────────────────────────
     Estaba pegado al último ítem del menú y sin aire alrededor. */
  /* Alineado con el texto del menú: el listado tiene 20 px de margen, así que el
     botón arranca en la misma línea vertical. */
  #ast-mobile-header .ast-header-button-1 {
    display: block;
    padding: 12px 20px 18px;
  }
  #ast-mobile-header .ast-header-button-1 .ast-builder-button-wrap {
    margin: 0 !important;
    width: auto;
  }
  #ast-mobile-header .ast-header-button-1 .ast-custom-button-link {
    display: block;
    margin: 0 !important;
  }
  /* El tema le pone margin-left: 21px al botón: eso lo corría hacia adentro y,
     con el ancho completo, lo hacía salirse por la derecha. */
  #ast-mobile-header .ast-header-button-1 .ast-custom-button {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0 !important;
    text-align: center;
    padding: 11px 18px;
    border-radius: 6px;
  }
  /* El tema duplica el botón con un enlace de texto: en mobile sobra. */
  #ast-mobile-header .ast-header-button-1 .ast-builder-button-wrap > a.menu-link { display: none; }
}

/* ── Hero de la portada en mobile ────────────────────────────────────
   La sección terminaba con 0 de espacio abajo, así que el botón "Acerca de
   Street" quedaba pegado al borde y parecía cortado por la línea que separa
   el hero de la sección siguiente. Se le da aire al pie. */
@media (max-width: 767px) {
  .elementor-15 .elementor-element.elementor-element-272fdde { padding-bottom: 56px !important; }
}
