.seccionDetalleRadio {
  margin: 20px auto;
  padding: 10px;
  max-width: 1200px;
}

.detalle-seccion {
  margin-bottom: 30px;
}

.detalle-seccion p {
  margin-bottom: 10px;
  line-height: 1.6;
  color: #333; /* Color del texto */
  text-align: justify; /* Justificar texto */
}

.ritmo-description p {
  font-size: 2.5rem; /* Más grande para sección Ritmo */
  font-weight: bold;
  color: #fff; /* Texto blanco */
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.8);
  margin: 5px 0;
}

.detalle-titulo {
  background-color: #333;
  color: #e1d8ea;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 20px;
  text-align: center;
}

.detalle-contenido {
  display: flex;
  align-items: center;
}

.detalle-contenido img {
  
  height: auto;
  border-radius: 10px;
  
  padding: 20px;
}

.detalle-contenido p {
  width: 90%;
  padding: 0px;
  font-size: 1rem;
  line-height: 1.6;
  color: #fff;
}

.ritmo-wrapper {
  position: relative;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Contenedor especial para la sección "Ritmo" */
.ritmo-wrapper img {
  width: 50%;
  border-radius: 10px;
  transition: all 0.3s ease-in-out;
}

.ritmo-description {
  font-size: 2.5rem; /* Tamaño más grande */
  font-weight: bold;
  color: #fff;
  text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.8);
}


.animated-image {
  position: relative;
  transition: box-shadow 0.5s ease, transform 0.3s ease-in-out;
  animation: glow-animation 3s infinite alternate; /* Animación infinita */
}

.animated-image:hover {
  transform: scale(1.05); /* Efecto de zoom al pasar el ratón */
}

/* Animación que cambia el color de brillo */
@keyframes glow-animation {
  0% {
      box-shadow: 0 0 20px 4px var(--glow-color);
  }
  50% {
      box-shadow: 0 0 30px 6px rgba(255, 255, 255, 0.8); /* Luz blanca intermedia */
  }
  100% {
      box-shadow: 0 0 20px 4px var(--glow-color);
  }
}