/* mobile-fix.css — responsive overrides para inline styles de React */

@media (max-width: 767px) {

  /* Contacto: grid 2 columnas (info + form) → 1 columna */
  [style*="1fr 1.1fr"] {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  /* Form campos Nombre/Teléfono lado a lado → apilar */
  [style*="1fr 1fr"][style*="gap: 16px"],
  [style*="1fr 1fr"][style*="gap:16"] {
    grid-template-columns: 1fr !important;
  }

  /* Card del formulario: menos padding */
  [style*="border-radius: 24px"][style*="padding: 40px"],
  [style*="border-radius:24px"][style*="padding:40px"] {
    padding: 24px !important;
    border-radius: 16px !important;
  }

  /* Footer: 4 columnas → 1 */
  [style*="1.5fr 1fr 1fr 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }

  /* Footer padding */
  footer {
    padding: 48px 20px 28px !important;
  }

  /* Footer barra inferior centrada */
  footer > div:last-child {
    justify-content: center !important;
    text-align: center !important;
  }

  /* Grids genéricos 2 cols rígidos → 1 col */
  [style*="gap: 48px"][style*="1fr 1fr"],
  [style*="gap:48"][style*="1fr 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  [style*="gap: 40px"][style*="1fr 1fr"],
  [style*="gap:40"][style*="1fr 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  /* Grid 3 columnas → 1 */
  [style*="1fr 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 767px) {

  /* Botón "Ver demo en vivo" del header (inyectado por JS): se oculta en móvil
     para que no rompa el nav. El acceso a la demo queda cubierto por el botón
     flotante "Demo en vivo" (demo-float.js) y la franja del hero. */
  header a[href="https://demo.gestionultimate.com/demo"] {
    display: none !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  /* Footer: 4 cols → 2 en tablet */
  [style*="1.5fr 1fr 1fr 1fr"] {
    grid-template-columns: 1fr 1fr !important;
    gap: 32px !important;
  }
}