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

  /* 1) Más espacio entre top band y hero */
  header.hero { margin-top: 28px !important; }
  .topband { margin-bottom: 12px !important; }

  /* 7) Escudo (logo) más grande en móvil */
  .topband .crest img { height: 40px !important; width: auto !important; }
  header.hero img[alt="Escudo"] { height: 84px !important; width: auto !important; }

  /* 2) Texto 2× en móvil (sin tocar tu escalado por transform) */
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body { font-size: 200% !important; line-height: 1.5; }
  p, li, a, span, figcaption, small, label { font-size: 1em !important; line-height: 1.45; }

  /* 3) Ocultar QR + "Escanéalo" + dirección + eliminar su espacio */
  /* Específico al bloque del HERO */
  header.hero .card:has(img[alt="QR"]) { display: none !important; }
  /* Pequeño separador antes del QR */
  header.hero div[style*="height:12px"] { display: none !important; }

  /* 4) Centrar "Nuestra iglesia alrededor del mundo" con respecto al globo */
  #global .container { text-align: center !important; }
  #global .globo-iglesia { display: block !important; margin: 0 auto !important; }
  #global h2 { text-align: center !important; margin-left: auto !important; margin-right: auto !important; }

  /* 5) 10× más espacio entre indicador y footer (en sección #proyecto) */
  #proyecto .grid-2 > .card:last-child { margin-bottom: 10rem !important; }

  /* 6) Nada por debajo del footer */
  footer.black-footer { margin-bottom: 0 !important; padding-bottom: 0 !important; }
  body > :last-child { margin-bottom: 0 !important; padding-bottom: 0 !important; }
}