.banner {
    background: linear-gradient(135deg, #0a3d62 0%, #1e90ff 40%, #38cfd9 70%, #b8f1ff 100%);
    background-size: 200% 200%;
    padding: 50px 0 0 0;
    animation: agua 6s ease infinite;
    text-align: center;
}
@keyframes agua {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

.hero {
    background: url('/assets/logo-sin-fondo.png');
    height: 240px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.btn-buy {
  background: white;
  color: #0077b6;
  font-weight: bold;
  padding: 14px 28px;
  border-radius: 40px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.2);
  border: none;
  margin-top: 20%;
}
.price-card,
.zone-card {
    transition: transform 0.2s ease-in-out;
}

.price-card:hover,
.zone-card:hover {
    transform: translateY(-5px);
}

footer {
    background-color: #111;
    color: #ccc;
}

footer a {
    color: #ccc;
    text-decoration: none;
}

footer a:hover {
    color: white;
}

section {
    scroll-margin-top: 100px;
}