body{
   overflow-x: hidden;
}

.horizontal-section {
  height: 100vh;
  position: relative;
  overflow: hidden;
}



.carousel-wrapper {
  height: 100%;
  display: flex;
  align-items: center;
}

.carousel {
  display: flex;
  gap: 20px;
  width: max-content;
}

.carousel {
  padding: 0 calc(50vw - 250px); /* mitad de card */
}

.card {
  width: 500px;
  height: 400px;
  background: none;
  border: none;
  flex-shrink: 0;
}

@media (max-width: 400px) {
  .card {
    margin-top:60px;
    width: 400px;
    height: 400px;
    background: none;
    border: none;
    flex-shrink: 0;
  }
}