/* CAMBIO DE DISEÑO #4 — compresión del hero.
 *
 * Objetivo rector: al entrar a la web, la preview de la app se deja entrever sin scrollear.
 * El criterio es verificable y se mide en tools/diff/hero-fold.mjs: el badge "Demo en vivo"
 * tiene que caer dentro del viewport inicial.
 *
 * Sólo se tocan ESPACIADOS VERTICALES. Ni tipografía, ni componentes, ni colores, ni el
 * contenido de la sección: el diff seccional interno lo verifica.
 *
 * Los valores del export están pensados para una página que se recorre de arriba abajo sin
 * apuro; el objetivo nuevo es que la demo asome de entrada, y eso pide otro ritmo en el hero.
 * Fuera del hero, el ritmo del contrato queda intacto.
 */

@media (min-width: 768px) {
  /* aire superior de la primera sección */
  [style*="padding: 98px 24px 24px"] {
    padding-top: 74px !important;
  }

  /* bloque del hero: menos corona arriba y menos base abajo */
  [style*="padding: 90px 64px 40px"] {
    padding-top: 51px !important;
    padding-bottom: 4px !important;
    gap: 17px !important;
  }

  /* los CTA traen 80px de aire arriba y abajo: es el mayor ahorro y el que más acerca los
   * botones a la descripción, que es justo lo pedido */
  [style*="padding-top: 80px"][style*="padding-bottom: 80px"] {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }

  /* la banda de logos sube */
  [style*="max-width: 940px"] {
    padding-top: 10px !important;
    padding-bottom: 12px !important;
  }
}