/* ===============================
   UTILITIES
=============================== */

/* Animación de entrada (más rápida y natural) */
.revelar {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity 0.45s ease-out,
    transform 0.45s ease-out;
  will-change: opacity, transform;
}

.revelar.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Hover seguro */
.revelar.visible:hover {
  transform: translateY(0);
}

/* Header (casi inmediato) */
.delay-head {
  transition-delay: 0.05s;
}

/* ===============================
   DESKTOP (rápido y fluido)
=============================== */

/* fila 1 → izquierda a derecha */
.delay-1 { transition-delay: 0.05s; }
.delay-2 { transition-delay: 0.10s; }
.delay-3 { transition-delay: 0.15s; }
.delay-4 { transition-delay: 0.20s; }

/* fila 2 → derecha a izquierda */
.delay-5 { transition-delay: 0.20s; }
.delay-6 { transition-delay: 0.15s; }
.delay-7 { transition-delay: 0.10s; }
.delay-8 { transition-delay: 0.05s; }

/* ===============================
   MOBILE / TABLET (rápido lineal)
=============================== */

@media (max-width: 991.98px) {

  .delay-1 { transition-delay: 0.05s; }
  .delay-2 { transition-delay: 0.10s; }
  .delay-3 { transition-delay: 0.15s; }
  .delay-4 { transition-delay: 0.20s; }
  .delay-5 { transition-delay: 0.25s; }
  .delay-6 { transition-delay: 0.30s; }
  .delay-7 { transition-delay: 0.35s; }
  .delay-8 { transition-delay: 0.40s; }

}

/* ===============================
   VISUALES
=============================== */

.text-destacado {
  color: #e50022;
  font-weight: 600;
}

.püle {
  z-index: -1;
  opacity: 0.5;
  filter: blur(150px);
  background-color: #601ef980;
  border-radius: 200%;
  width: 50rem;
  height: 7.063rem;
  margin: 0 auto;
  position: relative;
  top: 5%;
}

.kollon {
  height: 50px;
  margin-bottom: 20px;
}

#kintun {
  height: 35px;
}

.imagencentro {
  height: 60px;
}
/* Header alignment */

.header-left h2::after {
  margin-left: 0;
  margin-right: 0;
}

.header-center h2::after {
  margin-left: auto;
  margin-right: auto;
}