/**
 * Motion IBG — vocabulário editorial (compatível com classes wow/animated).
 * Não é o Animate.css completo: sem bounce, tada, jello, hinge, flip 3D.
 * Respeita prefers-reduced-motion.
 */

.animated {
  animation-duration: 0.7s;
  animation-fill-mode: both;
}

.animated.fast {
  animation-duration: 500ms;
}

.animated.slow {
  animation-duration: 1.2s;
}

@keyframes ibgFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes ibgFadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes ibgFadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -28px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes ibgFadeInLeft {
  from {
    opacity: 0;
    transform: translate3d(-28px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes ibgFadeInRight {
  from {
    opacity: 0;
    transform: translate3d(28px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes ibgZoomIn {
  from {
    opacity: 0;
    transform: scale3d(0.96, 0.96, 0.96);
  }
  to {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}

.fadeIn {
  animation-name: ibgFadeIn;
}

.fadeInUp {
  animation-name: ibgFadeInUp;
}

.fadeInDown {
  animation-name: ibgFadeInDown;
}

.fadeInLeft {
  animation-name: ibgFadeInLeft;
}

.fadeInRight {
  animation-name: ibgFadeInRight;
}

.zoomIn {
  animation-name: ibgZoomIn;
}

@media (prefers-reduced-motion: reduce) {
  .animated,
  .fadeIn,
  .fadeInUp,
  .fadeInDown,
  .fadeInLeft,
  .fadeInRight,
  .zoomIn,
  .wow,
  .ibg-cinematic-image,
  .ibg-cinematic-reveal {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
}

/* =========================
   Cinematic fade + reveal (< 1.3s)
   Hero: CSS imediato. Resto: view() quando o browser suportar.
   ========================= */

@keyframes ibgCinematicImage {
  from {
    opacity: 0;
    transform: scale(1.06);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes ibgCinematicReveal {
  from {
    opacity: 0;
    transform: translate3d(0, 22px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.ibg-site .ibg-hero .ibg-hero__media {
  animation: ibgCinematicImage 1.05s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.ibg-site .ibg-hero #ibg-hero-tagline,
.ibg-site .ibg-min-hero.ibg-home-banner .ibg-min-hero__logo {
  animation: ibgCinematicReveal 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.1s both;
}

.ibg-site .ibg-hero #ibg-welcome-title,
.ibg-site .ibg-min-hero.ibg-home-banner .ibg-min-hero__lead {
  animation: ibgCinematicReveal 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.18s both;
}

.ibg-site .ibg-hero #ibg-welcome-lead,
.ibg-site .ibg-hero .ibg-lead {
  animation: ibgCinematicReveal 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.26s both;
}

.ibg-site .ibg-hero .ibg-hero__actions,
.ibg-site .ibg-min-hero.ibg-home-banner .ibg-min-hero__actions {
  animation: ibgCinematicReveal 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.34s both;
}

@media (prefers-reduced-motion: reduce) {
  .ibg-site .ibg-hero .ibg-hero__media,
  .ibg-site .ibg-hero #ibg-hero-tagline,
  .ibg-site .ibg-hero #ibg-welcome-title,
  .ibg-site .ibg-hero #ibg-welcome-lead,
  .ibg-site .ibg-hero .ibg-lead,
  .ibg-site .ibg-hero .ibg-hero__actions,
  .ibg-site .ibg-min-hero.ibg-home-banner .ibg-min-hero__logo,
  .ibg-site .ibg-min-hero.ibg-home-banner .ibg-min-hero__lead,
  .ibg-site .ibg-min-hero.ibg-home-banner .ibg-min-hero__actions {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}
