/* ═════════════ Animations ═════════════ */ @keyframes marquee { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-50%, 0, 0); } } @keyframes marquee-reverse { from { transform: translate3d(-50%, 0, 0); } to { transform: translate3d(0, 0, 0); } } @keyframes halo { 0% { transform: scale(1) rotate(0deg); opacity: 0.55; } 100% { transform: scale(1.08) rotate(12deg); opacity: 0.75; } } /* Levitação do frasco — sobe e desce suavemente */ @keyframes hero-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } } /* Selo editorial girando lentamente */ @keyframes seal-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes pulse-green { 0%, 100% { box-shadow: 0 16px 40px -12px rgba(0,0,0,0.45), 0 0 0 0 rgba(122, 155, 110, 0.5); } 50% { box-shadow: 0 16px 40px -12px rgba(0,0,0,0.45), 0 0 0 14px rgba(122, 155, 110, 0); } } @keyframes fade-up { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } } @keyframes fade-in { from { opacity: 0; } to { opacity: 1; } } /* Reveal on scroll — usa .js-on no para ativar só se JS carregar */ .js-on .reveal { opacity: 0; transform: translateY(24px); transition: opacity 900ms var(--ease-out), transform 900ms var(--ease-out); will-change: opacity, transform; } .js-on .reveal.is-visible { opacity: 1; transform: translateY(0); } .reveal[data-delay="1"].is-visible { transition-delay: 80ms; } .reveal[data-delay="2"].is-visible { transition-delay: 160ms; } .reveal[data-delay="3"].is-visible { transition-delay: 240ms; } .reveal[data-delay="4"].is-visible { transition-delay: 320ms; } .reveal[data-delay="5"].is-visible { transition-delay: 400ms; } .reveal[data-delay="6"].is-visible { transition-delay: 480ms; } /* Counter animation base */ .counter { font-variant-numeric: tabular-nums; display: inline-block; }