.banner {
  width: 90%;
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px;
  cursor: pointer; /* para indicar que se puede hacer clic */
  border-radius: 0px;
  align-content: stretch;

  /* background-color: #0072bb; /* azul Bootstrap */
}

.banner-texto {
  width: 43%;
  display: flex;
  flex-direction: column;
  justify-content: center;
 
}

.banner-imagen {
  width: 50%;
}

.banner-imagen img {
  width: 100%;
  height: 370px;
  border-radius: 12px;
  object-fit: cover;
}
.h2,.p{
    color: rgb(0, 0, 0);
    text-align: center;
}

/* Responsive */
@media (max-width: 768px) {
  .banner {
    flex-direction: column;
    text-align: center;
  }

  .banner-texto,
  .banner-imagen {
    width: 90%;
  }
}