/* ==========================================================================
   MyT Global Recruitment — Animations & Keyframes
   Premium Dark Agency style — CSS-first, JS only toggles .is-visible
   ========================================================================== */

/* ── KEYFRAMES ──────────────────────────────────────────────────────────── */

/* Orbs flutuantes no hero */
@keyframes orbFloat1 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33%       { transform: translate(30px, -40px) scale(1.05); }
  66%       { transform: translate(-20px, 20px) scale(0.95); }
}

@keyframes orbFloat2 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33%       { transform: translate(-40px, 30px) scale(1.08); }
  66%       { transform: translate(20px, -20px) scale(0.92); }
}

@keyframes orbFloat3 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50%       { transform: translate(15px, 25px) scale(1.03); }
}

/* Float suave para hero card */
@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-12px); }
}

/* Shimmer nos botões CTA */
@keyframes shimmer {
  0%   { transform: translateX(-100%) skewX(-15deg); }
  100% { transform: translateX(250%) skewX(-15deg); }
}

/* Pulse glow para CTA principal */
@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 20px rgba(249,115,22,0.4), 0 4px 15px rgba(249,115,22,0.3); }
  50%       { box-shadow: 0 0 40px rgba(249,115,22,0.7), 0 8px 25px rgba(249,115,22,0.5); }
}

/* WhatsApp pulse */
@keyframes waPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(37,211,102,0.5); }
  50%       { box-shadow: 0 0 0 12px rgba(37,211,102,0); }
}

/* Spin para loading spinner */
@keyframes spin {
  to { transform: rotate(360deg); }
}

/* Gradient text shimmer */
@keyframes gradientShift {
  0%   { background-position: 0% center; }
  100% { background-position: 200% center; }
}

/* Fade-in-up de entrada de página */
@keyframes fade-in-up {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Slide-in da direita */
@keyframes slide-in-right {
  from { opacity: 0; transform: translateX(32px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* Fade-in simples */
@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── HERO ENTRANCE ANIMATIONS ───────────────────────────────────────────── */

.hero__tag {
  animation: fade-in-up var(--transition-slow) 0.10s both;
}

.hero__headline {
  animation: fade-in-up var(--transition-slow) 0.25s both;
}

.hero__subtitle {
  animation: fade-in-up var(--transition-slow) 0.40s both;
}

.hero__ctas {
  animation: fade-in-up var(--transition-slow) 0.55s both;
}

.hero__social-proof {
  animation: fade-in-up var(--transition-slow) 0.70s both;
}

.hero__float-card {
  animation: float 6s ease-in-out infinite, slide-in-right var(--transition-slow) 0.65s both;
}

/* ── SCROLL-TRIGGERED — .animate-on-scroll ──────────────────────────────── */

.animate-on-scroll {
  opacity: 0;
  transform: translateY(40px);
  transition:
    opacity 0.75s cubic-bezier(0.4, 0, 0.2, 1),
    transform 0.75s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: opacity, transform;
}

.animate-on-scroll.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger delays para .animate-on-scroll */
.stagger-1 { transition-delay: 0.1s; }
.stagger-2 { transition-delay: 0.2s; }
.stagger-3 { transition-delay: 0.3s; }
.stagger-4 { transition-delay: 0.4s; }
.stagger-5 { transition-delay: 0.5s; }

/* ── LEGADO — [data-animate] (mantido para compatibilidade) ─────────────── */

[data-animate] {
  opacity: 0;
  transition:
    opacity var(--transition-slow),
    transform var(--transition-slow);
  will-change: opacity, transform;
}

[data-animate="fade-up"]    { transform: translateY(32px); }
[data-animate="fade-in"]    { transform: none; }
[data-animate="fade-left"]  { transform: translateX(-32px); }
[data-animate="fade-right"] { transform: translateX(32px); }
[data-animate="scale-in"]   { transform: scale(0.9); }

[data-animate].is-visible {
  opacity: 1;
  transform: none;
}

[data-animate-delay="1"] { transition-delay: 100ms; }
[data-animate-delay="2"] { transition-delay: 200ms; }
[data-animate-delay="3"] { transition-delay: 300ms; }
[data-animate-delay="4"] { transition-delay: 400ms; }
[data-animate-delay="5"] { transition-delay: 500ms; }
[data-animate-delay="6"] { transition-delay: 600ms; }

/* ── SPINNER ────────────────────────────────────────────────────────────── */

.spinner {
  display: inline-block;
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
}

/* ── PAGE TRANSITION ────────────────────────────────────────────────────── */

.page-transition {
  animation: fade-in 400ms ease both;
}

/* ── REDUCED MOTION — respeitar preferência do usuário ─────────────────── */

@media (prefers-reduced-motion: reduce) {
  .animate-on-scroll {
    opacity: 1;
    transform: none;
    transition: none;
  }

  [data-animate] {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .hero__tag,
  .hero__headline,
  .hero__subtitle,
  .hero__ctas,
  .hero__social-proof,
  .hero__float-card {
    animation: none;
    opacity: 1;
    transform: none;
  }

  .hero__orb--1,
  .hero__orb--2,
  .hero__orb--3 {
    animation: none;
  }

  #whatsapp-float a {
    animation: none;
  }

  * {
    animation-duration: 0.01ms;
    transition-duration: 0.01ms;
  }
}