@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
  .animate-fade-in {
    animation: fadeIn 0.6s ease-out forwards;
    opacity: 0;
    transform: translateY(20px);
  }

  .animate-float {
    animation: float 3s ease-in-out infinite;
  }

  @keyframes fadeIn {
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  @keyframes float {
    0%, 100% {
      transform: translateY(0);
    }
    50% {
      transform: translateY(-8px);
    }
  }

  /* Custom SVG styles */
  text {
    font-family: 'Montserrat', sans-serif;
  }

  .font-sans {
    font-family: 'Montserrat', sans-serif;
  }

  /* Smooth transitions for mindmap */
  path, rect, text {
    transition: all 0.3s ease;
  }
}