/* === Mobile-only overrides v4_1_fix (solo móvil; desktop intacto) === */
@media (max-width: 1024px) {

  /* 1) HERO: Escudo 2× como en v4_1, sin solaparse con el texto y centrado en su fila */
  header.hero .container.content.grid.grid-2 > div:first-child > div:first-child {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;             /* separación con el título para que no toque letras */
    flex-wrap: nowrap !important;
  }
  header.hero img[alt="Escudo"] {
    transform: none !important;       /* quitar escalado que no altera layout */
    height: 84px !important;          /* -> ~2× respecto a ~42px (ajustable si hace falta) */
    width: auto !important;
    object-fit: contain !important;
  }

  /* (opcional) Quitar líneas/ornamentos extra en el hero que se ven azules */
  header.hero::before,
  header.hero::after {
    content: none !important;
    display: none !important;
  }
  header.hero {
    background-image: none !important;    /* por si las líneas vienen de bg-image */
  }

  /* 2) Logos ministerios: centralizar nombres debajo y evitar superposición */
  .values-row { text-align: center !important; }
  .values-row figure {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }
  .values-row figure img {
    transform: none !important;
    display: block !important;
    margin: 0 auto 8px !important;    /* logo arriba, texto debajo */
    height: auto !important;
    max-width: 100% !important;
  }
  .values-row figure figcaption,
  .values-row figure .small {
    text-align: center !important;
    display: block !important;
    margin-top: 4px !important;
  }

  /* 3) Indicador de avance: igual a build v4 (sin ampliación extra) */
  #proyecto .grid-2 .card:nth-child(2) { font-size: 100% !important; line-height: inherit !important; }
  #proyecto .grid-2 .card:nth-child(2) .progress,
  #proyecto .grid-2 .card:nth-child(2) .progress > div {
    height: 12px !important;
    border-radius: 999px !important;
  }

  /* 4) Arreglo "nada debajo del footer": cancelar min-heights del body y huecos finales */
  html, body { height: auto !important; }
  body { min-height: 0 !important; }
  footer.black-footer { margin-bottom: 0 !important; padding-bottom: 0 !important; }
  body > :last-child { margin-bottom: 0 !important; padding-bottom: 0 !important; }
  /* Si existe cualquier elemento después del footer, ocultarlo en móvil */
  body > footer.black-footer ~ * {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
}