/* ==========================================================================
   CSS DEFINITIVO - MENTE PRÓSPERA (VERDE, BRANCO E LUXO)
   ========================================================================== */

body { 
  background-color: #000000; /* brand-black */
  color: #ffffff; 
  overflow-x: hidden; 
  -webkit-font-smoothing: antialiased; 
}
html, body { max-width: 100vw; }
html { scroll-behavior: smooth; }

/* --- FAIXA DO TOPO --- */
@keyframes marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.animate-marquee { display: flex; width: max-content; animation: marquee 15s linear infinite; will-change: transform; }

@keyframes gradient-x { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
.animate-gradient-x { animation: gradient-x 4s ease infinite; background-size: 200% auto; }

/* --- EFEITOS DE LUXO --- */
.text-glow-emerald { text-shadow: 0 0 20px rgba(16, 185, 129, 0.4); }
.text-glow-gold { text-shadow: 0 0 20px rgba(244, 187, 132, 0.4); }

.mask-fade-bottom {
  -webkit-mask-image: linear-gradient(to top, transparent 2%, black 30%);
  mask-image: linear-gradient(to top, transparent 2%, black 30%);
}

/* Luz Pulsante Dourada (Para Destaques) */
@keyframes pulse-gold-light {
  0% { text-shadow: 0 0 10px rgba(244, 187, 132, 0.2); }
  100% { text-shadow: 0 0 25px rgba(244, 187, 132, 0.8), 0 0 40px rgba(244, 187, 132, 0.4); }
}
.gold-pulse { color: #f4bb84; animation: pulse-gold-light 2.5s infinite alternate ease-in-out; }

/* Efeito de Luz Contínua no Botão (SHINE) - RESTAURADO */
@keyframes shine {
  0% { transform: translateX(-100%) skewX(-20deg); }
  20% { transform: translateX(200%) skewX(-20deg); }
  100% { transform: translateX(200%) skewX(-20deg); } 
}
.btn-shine {
  position: relative;
  overflow: hidden;
  transform: translateZ(0); 
  -webkit-backface-visibility: hidden;
}
.btn-shine::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.6), transparent);
  animation: shine 3s infinite ease-in-out;
  z-index: 1;
  will-change: transform;
}


/* ==========================================================================
   O MOTOR NATIVO ULTRA LEVE (ZERO TRAVAMENTOS)
   ========================================================================== */
.animate-me {
  opacity: 0;
  transform: translate3d(0, 40px, 0);
  transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), 
              transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  will-change: opacity, transform;
}

.animate-me.is-visible {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) !important;
}

/* ==========================================================================
   BLINDAGEM DO CELULAR
   ========================================================================== */
@media (max-width: 768px) {
  .animate-marquee, .animate-gradient-x { animation-play-state: running !important; }
  
  /* Desliga efeitos pesados de mistura e desfoque no celular */
  .mix-blend-overlay, .mix-blend-screen, .mix-blend-luminosity { mix-blend-mode: normal !important; }
  
  /* As barras invertidas garantem que o CSS entenda os colchetes do Tailwind */
  .blur-\[150px\], .blur-\[120px\] { display: none !important; }
  
  /* Desliga o vidro e respeita a cor do HTML */
  .backdrop-blur-sm, .backdrop-blur-md {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  
  .text-glow-emerald, .text-glow-gold, .gold-pulse { text-shadow: none !important; }
}