:root{--page-title-display:none;}/* Start custom CSS *//* Imagem de fundo apagada inicialmente */
.item-background {
  opacity: 0.1;
  transition: opacity 0.5s ease-in-out;
}

.titulo {
  transition: transform 0.4s ease-in-out;
  z-index: 3;
}

/* Novo: item-1 sem animação por padrão */
.item-1 {
  transition: transform 0.3s ease-in-out;
}

/* item-2 sem animação por padrão */
.item-2 {
  transition: transform 0.3s ease-in-out;
}


/* Hover ativa a animação de flutuação */
.consoles:hover .item-1 {
  animation: flutuar 0.8s ease-in-out infinite alternate;
}

/* Hover ativa rotação contínua estilo volante */
.consoles:hover .item-2 {
  animation: girar-volante 1s ease-in-out infinite alternate;
}

/* Hover ativa fundo e título */
.consoles:hover .item-background {
  opacity: 1;
}

.consoles:hover .titulo {
  transform: translateY(-20px);
}

/* Keyframes da animação de flutuação */
@keyframes flutuar {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-10px);
  }
}

/* Keyframes: rotação esquerda ↔ direita */
@keyframes girar-volante {
  0% {
    transform: rotate(-10deg); /* esquerda */
  }
  100% {
    transform: rotate(10deg);  /* direita */
  }
}/* End custom CSS */