* { 
  box-sizing: border-box; 
  margin: 0; 
  padding: 0; 
}

body { 
  font-family: sans-serif; 
  line-height: 1.6; 
  max-width: 1200px; /* Aumenté el ancho para 3 columnas */
  margin: auto; 
  padding: 20px; 
}

.header { 
  margin-bottom: 3rem; 
}

.cards-container { 
  column-count: 3; /* Número de columnas */
  column-gap: 2rem; /* Espacio entre columnas */
}

.cards-container-2 { 
  column-count: 1; /* Número de columnas */
  column-gap: 2rem; /* Espacio entre columnas */
}

.card { 
  padding: 1.5rem; 
  border: 2px solid #555; 
  break-inside: avoid; /* Evita que se parta una tarjeta entre columnas */
  margin-bottom: 2rem; /* Espacio vertical entre tarjetas */
  display: inline-block; /* Necesario para columns */
  width: 100%; /* Ocupa el 100% del ancho de la columna */
}

.card h2 { 
  margin-bottom: 1rem; 
}

.card p { 
  margin-bottom: 0.5rem; 
}

.card a { 
  color: #06c; 
  text-decoration: none; 
  display: block;
  margin-bottom: 0.5rem;
}

.card a:hover { 
  text-decoration: underline; 
}

/* Responsive */
@media (max-width: 1024px) {
  .cards-container {
    column-count: 2;
  }
}

@media (max-width: 768px) { 
  .cards-container {
    column-count: 1;
  }
}
