/* Fondo solo desde debajo del header */
.content-area {
  background-image: url('../img/fondo-pagina.png');
  background-size: cover;
  background-position: center;
  
  background-repeat: no-repeat;
  min-height: 100vh; /* o 100% si tu layout lo requiere */
}

.dark .content-area {
  background-image: none;
  background-color: #121212;
}
/* Banner superior full-width */
.top-banner {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  overflow: hidden;
  line-height: 0;
}

.top-banner img {
  width: 100%;
  height: auto;
  display: block;
}

.top-banner img[usemap] {
  cursor: default;
}
area {
  cursor: pointer;
}

@keyframes pulse {
  0%, 100% { 
    transform: translateY(0) scale(1);
  }
  25% {
    transform: translateY(-8px) scale(1.1);
  }
  50% { 
    transform: translateY(-15px) scale(1.15);
  }
  75% {
    transform: translateY(-8px) scale(1.1);
  }
}

@keyframes pulse-icons {
  0%, 100% { 
    transform: scale(1);
  }
  50% { 
    transform: scale(1.1);
  }
}

.pulse-arrow {
  animation: pulse 2s infinite ease-in-out;
}

.pulse-arrow:hover {
  animation-duration: 0.8s;
}

.pulse-icons .pulse-icon {
  animation: pulse-icons 3s infinite ease-in-out;
}

/* Efecto de onda en los iconos (se activan uno tras otro) */
.pulse-icons .pulse-icon:nth-child(1) {
  animation-delay: 0s;
}
.pulse-icons .pulse-icon:nth-child(2) {
  animation-delay: 0.5s;
}
.pulse-icons .pulse-icon:nth-child(3) {
  animation-delay: 1s;
}
.pulse-icons .pulse-icon:nth-child(4) {
  animation-delay: 1.5s;
}

.pulse-icons:hover .pulse-icon {
  animation-duration: 1s;
}

.text-custom-orange {
  color: #ff6600;
}

.bg-custom-orange {
  background-color: #ff6600;
}

.shine {
  position: relative;
  overflow: hidden;
}
.shine::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.8), transparent);
  animation: shine 2.5s infinite;
}
@keyframes shine {
  0%   { left: -100%; }
  100% { left: 100%; }
}
