/* ============ Animações do site ============ */

/* Revelar ao rolar (ativado via JS: .js adicionada ao <html>) */
.js [data-anim] { opacity: 0; transition: opacity .9s cubic-bezier(.2, .7, .2, 1), transform .9s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--d, 0ms); will-change: transform, opacity; }
.js [data-anim="fade-up"] { transform: translateY(50px); }
.js [data-anim="fade-down"] { transform: translateY(-50px); }
.js [data-anim="fade-left"] { transform: translateX(70px); }
.js [data-anim="fade-right"] { transform: translateX(-70px); }
.js [data-anim="zoom-in"] { transform: scale(.82); }
.js [data-anim="flip-up"] { transform: perspective(900px) rotateX(-35deg) translateY(30px); transform-origin: bottom; }
.js [data-anim].in { opacity: 1; transform: none; }

/* Título dividido em palavras */
.split-title .word { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .12em; }
.split-title .word > span { display: inline-block; transform: translateY(110%) rotate(4deg); opacity: 0; animation: wordUp .9s cubic-bezier(.2, .8, .2, 1) forwards; animation-delay: calc(var(--i) * 90ms + 500ms); }

/* Elementos flutuantes / contínuos */
.float-y { animation: floatY 5s ease-in-out infinite; }
.spin-slow { animation: spin 28s linear infinite; }
.tilt { animation: tilt 7s ease-in-out infinite; }
.pulse { animation: pulseBtn 2s infinite; }
.scroll-down { animation: bounce 2s infinite; }
.hero::before { content: ''; position: absolute; inset: 0; background: inherit; animation: heroZoom 18s ease-in-out infinite alternate; }
.hero-orbs span:nth-child(1) { animation: orb 9s ease-in-out infinite; }
.hero-orbs span:nth-child(2) { animation: orb 11s ease-in-out infinite reverse; }
.hero-orbs span:nth-child(3) { animation: orb 7s ease-in-out infinite; }
.hero-orbs span:nth-child(4) { animation: orb 13s ease-in-out infinite reverse; }
.banner-shapes span:nth-child(1) { animation: orb 10s ease-in-out infinite; }
.banner-shapes span:nth-child(2) { animation: orb 8s ease-in-out infinite reverse; }
.banner-shapes span:nth-child(3) { animation: orb 12s ease-in-out infinite; }
.btn::after { content: ''; position: absolute; top: 0; left: -75%; width: 50%; height: 100%; background: linear-gradient(120deg, transparent, rgba(255, 255, 255, .55), transparent); transform: skewX(-25deg); }
.btn:hover::after { animation: shine .8s; }
.badge-since { animation: floatY 4s ease-in-out infinite; }

@keyframes wordUp { to { transform: none; opacity: 1; } }
@keyframes floatY { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-16px); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes tilt { 0%, 100% { transform: rotate(-2deg) translateY(0); } 50% { transform: rotate(2deg) translateY(-10px); } }
@keyframes pulseBtn { 0% { box-shadow: 0 0 0 0 rgba(211, 174, 91, .65); } 70% { box-shadow: 0 0 0 22px rgba(211, 174, 91, 0); } 100% { box-shadow: 0 0 0 0 rgba(211, 174, 91, 0); } }
@keyframes bounce { 0%, 100% { transform: translate(-50%, 0); } 50% { transform: translate(-50%, 12px); } }
@keyframes heroZoom { from { transform: scale(1); } to { transform: scale(1.12); } }
@keyframes orb { 0%, 100% { transform: translate(0, 0) scale(1); } 33% { transform: translate(30px, -40px) scale(1.15); } 66% { transform: translate(-25px, 25px) scale(.9); } }
@keyframes shine { to { left: 130%; } }
@keyframes marquee { to { transform: translateX(-50%); } }
@keyframes tabIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
@keyframes gradientMove { 0%, 100% { background-position: 0 50%; } 50% { background-position: 100% 50%; } }
@keyframes pulseLogo { 0%, 100% { transform: scale(1); opacity: .85; } 50% { transform: scale(1.12); opacity: 1; } }
@keyframes ring { 0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, .6); } 70% { box-shadow: 0 0 0 20px rgba(37, 211, 102, 0); } 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); } }
@keyframes slideUp { from { transform: translate(-50%, 140%); } to { transform: translate(-50%, 0); } }
@keyframes zoomIn { from { transform: scale(.8); opacity: 0; } to { transform: none; opacity: 1; } }


/* Acessibilidade: respeita preferência por menos movimento */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .js [data-anim] { opacity: 1; transform: none; }
}
