/* ===============================
   ANIMAÇÕES DE ENTRADA SUAVE
==================================*/

[data-anime] {
  opacity: 0;
  transform: translateY(3vh);
  transition:
    opacity 1.2s cubic-bezier(0.25, 1, 0.5, 1),
    transform 1.2s cubic-bezier(0.25, 1, 0.5, 1),
    filter 1.2s cubic-bezier(0.25, 1, 0.5, 1);
  will-change: opacity, transform, filter;
}

/* Direções */
.anime-up    { transform: translateY(3vh); }
.anime-down  { transform: translateY(-3vh); }
.anime-left  { transform: translateX(4vw); }
.anime-right { transform: translateX(-4vw); }

/* Efeito zoom */
.anime-zoom  { transform: scale(0.92); }
.anime-start.anime-zoom { transform: scale(1); }

/* Estado final */
.anime-start {
  opacity: var(--final-opacity, 1);
  transform: translate(0, 0) scale(1);
}

/* Easing refinado */
.anime-ease {
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

/* ===============================
   HERO TEXT / LOGO / TITULOS
==================================*/
.animar {
  animation: animar-span 1s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

@keyframes animar-span {
  0% {
    transform: scale(0.5);
    opacity: 0;
  }
  60% {
    transform: scale(1.1);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

#banner h1 {
  opacity: 0;
  animation: animar-texto 1.3s cubic-bezier(0.25, 1, 0.5, 1) forwards;
  animation-delay: 0.6s;
}

@keyframes animar-texto {
  0% {
    opacity: 0;
    transform: translateY(25px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}