/* Varias cuadrículas del sitio fijan sus columnas en línea (style="grid-template-
   columns: repeat(N, 1fr)") sin una regla responsiva propia, lo que producía
   desbordamiento horizontal en móvil (ej. la fila de 5 soluciones, la línea de
   tiempo de "Sobre mí"). Estas reglas genéricas las colapsan a una columna en
   pantallas angostas, usando selectores de atributo para alcanzar cualquier
   elemento con ese patrón, sin tocar el marcado de cada página. */
@media (max-width: 900px) {
  [style*="grid-template-columns: repeat(5"],
  [style*="grid-template-columns:repeat(5"],
  [style*="grid-template-columns: repeat(4"],
  [style*="grid-template-columns:repeat(4"] {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 760px) {
  [style*="grid-template-columns: repeat(3"],
  [style*="grid-template-columns:repeat(3"],
  [style*="grid-template-columns: repeat(2"],
  [style*="grid-template-columns:repeat(2"],
  [style*="grid-template-columns: 1fr 1fr;"],
  [style*="grid-template-columns:1fr 1fr;"] {
    grid-template-columns: 1fr !important;
  }
}

/* Cuadrículas del pie de página (con o sin clase .footer-grid): siempre
   apilar en móvil — un pie de 3 columnas nunca cabe cómodo en un teléfono. */
@media (max-width: 760px) {
  footer [style*="display: grid"],
  footer [style*="display:grid"] {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
}