/* ============================================
   HERO ANIMATIONS — remover este ficheiro e
   hero-animations.js + o <link> e <script>
   no index.php para desativar tudo
   ============================================ */

/* ---- KEYFRAMES ---- */

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(50px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes badgeIn {
  from { opacity: 0; letter-spacing: .6em; filter: blur(4px); }
  to   { opacity: 1; letter-spacing: .2em; filter: blur(0); }
}

/* Glitch forte no texto verde */
@keyframes glitch {
  0%        { text-shadow: none; transform: translate(0) skew(0); clip-path: none; }
  5%        { text-shadow: -6px 0 #ff004f, 6px 0 #00fff9; transform: translate(-3px, 1px) skew(-2deg); }
  10%       { text-shadow: 6px 0 #ff004f, -6px 0 #00fff9; transform: translate(3px, -1px) skew(1deg); }
  15%       { text-shadow: none; transform: translate(0) skew(0); }
  20%       { text-shadow: -4px 0 #ff004f, 4px 0 #00fff9; transform: translate(-2px, 2px); }
  25%       { text-shadow: none; transform: translate(0); }
  85%, 100% { text-shadow: none; transform: translate(0) skew(0); }
}

/* Scan line */
@keyframes scanline {
  0%   { top: -5%; opacity: .8; }
  100% { top: 110%; opacity: 0; }
}

/* Float botão */
@keyframes float {
  0%   { transform: translateY(0); box-shadow: 0 0 0 rgba(200,245,66,0); }
  50%  { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(200,245,66,.3); }
  100% { transform: translateY(0); box-shadow: 0 0 0 rgba(200,245,66,0); }
}

/* Partícula */
@keyframes particle {
  0%   { transform: translateY(0) translateX(0) scale(1); opacity: 1; }
  100% { transform: translateY(-250px) translateX(60px) scale(0); opacity: 0; }
}

/* Pulse do orb de fundo */
@keyframes pulseBg {
  0%   { opacity: .06; transform: scale(1); }
  50%  { opacity: .18; transform: scale(1.25); }
  100% { opacity: .06; transform: scale(1); }
}

/* Segundo orb esquerda */
@keyframes pulseBg2 {
  0%   { opacity: .04; transform: scale(1) rotate(0deg); }
  50%  { opacity: .14; transform: scale(1.4) rotate(10deg); }
  100% { opacity: .04; transform: scale(1) rotate(0deg); }
}

/* ---- HERO BASE ---- */
.hero { overflow: hidden; }

/* ---- BADGE ---- */
.hero-badge {
  animation: badgeIn 1s cubic-bezier(.16,1,.3,1) both;
  animation-delay: .1s;
}

/* ---- TÍTULO ---- */
.hero h1 {
  animation: fadeUp .9s cubic-bezier(.16,1,.3,1) both;
  animation-delay: .3s;
}

/* Glitch no span verde */
.hero h1 span[style*="var(--accent)"] {
  display: inline-block;
  animation: glitch 5s ease-in-out 1.5s infinite;
}

/* ---- SUBTÍTULO ---- */
.hero-sub {
  animation: fadeUp .9s cubic-bezier(.16,1,.3,1) both;
  animation-delay: .5s;
}

/* ---- BOTÃO CTA ---- */
.hero .btn-primary {
  animation: fadeUp .9s cubic-bezier(.16,1,.3,1) both,
             float 2.5s ease-in-out 1.5s infinite;
  animation-delay: .7s, 1.5s;
  position: relative;
  z-index: 2;
}

/* ---- FUNDO ---- */
.hero-bg {
  animation: pulseBg 5s ease-in-out infinite;
  width: 1000px;
  height: 1000px;
}

.hero::before {
  content: '';
  position: absolute;
  bottom: -150px;
  left: -250px;
  width: 700px;
  height: 700px;
  background: radial-gradient(circle, rgba(200,245,66,.07) 0%, transparent 70%);
  pointer-events: none;
  animation: pulseBg2 7s ease-in-out 2s infinite;
  z-index: 0;
}

/* ---- SCAN LINE ---- */
.hero::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent 0%, rgba(200,245,66,.5) 40%, rgba(200,245,66,.8) 50%, rgba(200,245,66,.5) 60%, transparent 100%);
  pointer-events: none;
  animation: scanline 5s linear 1s infinite;
  z-index: 1;
}

/* ---- ORB DO RATO (criado por JS) ---- */
.hero-mouse-orb {
  position: absolute;
  width: 600px;
  height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(200,245,66,.2) 0%, rgba(200,245,66,.05) 40%, transparent 70%);
  pointer-events: none;
  transform: translate(-50%, -50%);
  z-index: 0;
  transition: left .08s linear, top .08s linear;
  filter: blur(2px);
}

/* ---- PARTÍCULAS ---- */
.hero-particles {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 0;
}

.hero-particles span {
  position: absolute;
  border-radius: 50%;
  background: var(--accent);
  animation: particle linear infinite;
  opacity: 0;
  box-shadow: 0 0 10px 2px rgba(200,245,66,.6);
}

.hero-particles span:nth-child(1)  { width:8px;  height:8px;  left:5%;  bottom:10%; animation-duration:2.8s; animation-delay:0s;   }
.hero-particles span:nth-child(2)  { width:5px;  height:5px;  left:15%; bottom:5%;  animation-duration:4s;   animation-delay:.3s;  }
.hero-particles span:nth-child(3)  { width:10px; height:10px; left:28%; bottom:20%; animation-duration:3s;   animation-delay:.7s;  }
.hero-particles span:nth-child(4)  { width:6px;  height:6px;  left:42%; bottom:8%;  animation-duration:3.5s; animation-delay:.1s;  }
.hero-particles span:nth-child(5)  { width:9px;  height:9px;  left:55%; bottom:15%; animation-duration:2.5s; animation-delay:.5s;  }
.hero-particles span:nth-child(6)  { width:5px;  height:5px;  left:68%; bottom:5%;  animation-duration:4.5s; animation-delay:.2s;  }
.hero-particles span:nth-child(7)  { width:12px; height:12px; left:78%; bottom:25%; animation-duration:3.2s; animation-delay:.9s;  }
.hero-particles span:nth-child(8)  { width:6px;  height:6px;  left:88%; bottom:12%; animation-duration:3.8s; animation-delay:.4s;  }
.hero-particles span:nth-child(9)  { width:8px;  height:8px;  left:35%; bottom:3%;  animation-duration:2.2s; animation-delay:.6s;  }
.hero-particles span:nth-child(10) { width:7px;  height:7px;  left:92%; bottom:30%; animation-duration:4.2s; animation-delay:.8s;  }
.hero-particles span:nth-child(11) { width:10px; height:10px; left:10%; bottom:30%; animation-duration:3.6s; animation-delay:1.1s; }
.hero-particles span:nth-child(12) { width:5px;  height:5px;  left:50%; bottom:28%; animation-duration:2.9s; animation-delay:1.3s; }

/* ---- ACESSIBILIDADE ---- */
@media (prefers-reduced-motion: reduce) {
  .hero-badge, .hero h1, .hero-sub, .hero .btn-primary,
  .hero-bg, .hero::before, .hero::after,
  .hero h1 span, .hero-particles span, .hero-mouse-orb {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ============================================
   FIM HERO ANIMATIONS
   ============================================ */