/* Contenedor principal del encabezado */
.mi-encabezado-ai {
  position: relative;
  height: 130px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url('../imagenes/fondo-header.png'); /* Fondo estilo IA */
  background-size: cover;
  background-position: center;
  background-color: rgba(12, 10, 10, 0); /* Capa oscura encima */
  background-blend-mode: overlay;
  overflow: hidden;
  border-bottom: 1px solid #ffffff3f;
}

/* Efecto visual distorsionado / glitch */
.mi-encabezado-ai::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: inherit;
  mix-blend-mode: screen;
  filter: contrast(1.4) brightness(0.9) saturate(1.2);
  animation: distorsion 5s infinite linear alternate;
  opacity: 0.3;
  z-index: 0;
}

/* Animación glitch sutil */
@keyframes distorsion {
  0%   { transform: scale(1) skew(0deg); }
  50%  { transform: scale(1.02) skewX(-1deg); }
  100% { transform: scale(1) skew(0.5deg); }
}

/* Contenedor centrado del logo */
.mi-logo-contenedor-ai {
  position: relative;
  z-index: 1;
  text-align: center;
}

/* Logo flotante y más grande */
.mi-logo-flotante-ai {
  width: 25vw;             /* Más grande: 25% del viewport */
  max-width: 380px;        /* Mayor tamaño en pantallas grandes */
  min-width: 200px;         /* Mejor tamaño mínimo en móviles */
  height: auto;
  animation: flotar-logo 3s ease-in-out infinite;
  filter: drop-shadow(0 0 10px rgba(82, 155, 155, 0.6));
}

/* Animación de flotación */
@keyframes flotar-logo {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-10px);
  }
}