/* Animações suaves para todos os cards */
@keyframes float-slow {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
  }
  
  .animate-float-slow {
    animation: float-slow 6s ease-in-out infinite;
  }
  
  /* Animações que só serão ativadas via JS quando visíveis */
  @keyframes count-up {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
  }
  
  @keyframes rotate-in {
    from { transform: rotateY(90deg) scale(0.8); opacity: 0; }
    to { transform: rotateY(0deg) scale(1); opacity: 1; }
  }
  
  @keyframes typewriter {
    from { width: 0; }
    to { width: 100%; }
  }
  
  @keyframes blink-caret {
    from, to { border-color: transparent; }
    50% { border-color: rgba(34, 211, 238, 0.5); }
  }
  
  @keyframes pulse-wave {
    0% { transform: translateX(-50%) scale(0); opacity: 0.7; }
    100% { transform: translateX(-50%) scale(8); opacity: 0; }
  }
  
  @keyframes gradient-shift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
  }
  
  @keyframes wave-line {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
  }
  
  /* Estilos para as animações ativadas */
  .js-countup.active {
    animation: count-up 1.5s ease-out forwards;
  }
  
  .js-rotate-in.active {
    animation: rotate-in 1s ease-out forwards;
  }
  
  .js-typewriter.active::after {
    content: '|';
    animation: blink-caret 0.75s step-end infinite;
  }
  
  .js-pulse-wave.active {
    animation: pulse-wave 2s ease-out infinite;
  }

  /* Scroll personalizado - azul discreto */
::-webkit-scrollbar {
  width: 12px; /* Largura fina */
}

/* Fundo do scroll */
::-webkit-scrollbar-track {
  background: transparent; /* Sem fundo visível */
}

/* "Pega" do scroll */
::-webkit-scrollbar-thumb {
  background-color: #4a90e2; /* Azul suave */
  border-radius: 10px;        /* Bordas arredondadas */
}

/* Quando passa o mouse por cima */
::-webkit-scrollbar-thumb:hover {
  background-color: #357ABD; /* Azul um pouco mais escuro */
}

/* Firefox */
html {
  scrollbar-width: thin;           /* Scroll fino */
  scrollbar-color: #4a90e2 transparent; /* Cor do "thumb" e fundo */
}

@keyframes slide {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.animate-slide {
  animation: slide 30s linear infinite;
}
.hover\:pause:hover {
  animation-play-state: paused;
}


@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes slideOut {
  from {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  to {
    opacity: 0;
    transform: translateY(20px) scale(0.95);
  }
}

.animate-slide-in {
  animation: slideIn 0.4s ease-out;
}

.animate-slide-out {
  animation: slideOut 0.3s ease-in forwards;
}

.glass-card {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }

  .segment-carousel {
    display: flex;
    gap: 1.5rem;
    padding: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  
  .segment-carousel::-webkit-scrollbar {
    display: none;
  }
  
  .segment-card {
    scroll-snap-align: start;
    flex: 0 0 300px;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
    background: rgba(255,255,255,0.05);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.1);
  }
  
  .segment-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.3);
  }
  
  .segment-image {
    position: relative;
    height: 200px;
  }
  
  .segment-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .segment-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(3,17,42,0.9), transparent);
    padding: 1.5rem;
    color: white;
  }
  
  /* Animações */
  @keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-20px); }
  }
  
  @keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
  }
  
  @keyframes bounceSlow {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
  }
  
  .segment-card {
    background: rgba(255,255,255,0.05);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 0.75rem;
    overflow: hidden;
    transition: all 0.3s ease;
    box-shadow: 0 8px 32px rgba(0,0,0,0.1);
  }
  
  .segment-card:hover {
    border-color: rgba(255,255,255,0.2);
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
  }
  
  .glass-card {
    background: rgba(255,255,255,0.05);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 1rem;
  }