@keyframes glow {

    0%,
    100% {
        box-shadow: 0 0 5px rgba(13, 148, 136, 0.2), 0 0 20px rgba(13, 148, 136, 0.2);
        border-color: rgba(13, 148, 136, 0.6);
    }

    50% {
        box-shadow: 0 0 15px rgba(13, 148, 136, 0.6), 0 0 30px rgba(13, 148, 136, 0.6);
        border-color: rgba(13, 148, 136, 1);
    }
}

.glow-card {
    animation: glow 2s ease-in-out infinite;
    border-width: 2px;
}

@keyframes highlight {
    0%, 100% {
        color: #0d9488;
        text-shadow: 0 0 5px rgba(13, 148, 136, 0.5), 0 0 10px rgba(13, 148, 136, 0.5);
    }
    50% {
        color: #0f766e;
        text-shadow: 0 0 15px rgba(13, 148, 136, 1), 0 0 30px rgba(13, 148, 136, 1);
    }
}



@keyframes heartbeat {
    0%, 100% {
        transform: scale(1);
        border-color: #0d9488;
    }
    50% {
        transform: scale(1.1);
        border-color: #0f766e;
    }
}



.stat-card {
    @apply relative overflow-hidden rounded-3xl p-6 flex flex-col justify-between transition-all duration-300 hover:shadow-lg;
    backdrop-filter: blur(10px);
  }

  @keyframes floating {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
    100% { transform: translateY(0px); }
}

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

@keyframes pulse-opacity {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

@layer utilities {
    .animate-floating {
        animation: floating 4s infinite ease-in-out;
    }
    .animate-bounce {
        animation: bounce 2s infinite ease-in-out;
    }
    .animate-pulse {
        animation: pulse-opacity 3s infinite ease-in-out;
    }
}