/* =============================================
   DOPSEN CAFÉ - Estilos Mejorados WhatsApp Hero
   ============================================= */

/* Botón de WhatsApp en Hero - Destacado */
.btn-hero-whatsapp {
    position: relative;
    overflow: hidden;
    font-size: 1rem !important;
    font-weight: 700 !important;
    padding: 1rem 2rem !important;
    box-shadow: 0 8px 25px rgba(37, 211, 102, 0.4) !important;
    animation: pulse-glow 2s infinite !important;
}

.btn-hero-whatsapp::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.3);
    transform: translate(-50%, -50%);
    transition: width 0.6s, height 0.6s;
}

.btn-hero-whatsapp:hover::before {
    width: 300px;
    height: 300px;
}

.btn-hero-whatsapp span {
    position: relative;
    z-index: 1;
}

.btn-hero-whatsapp svg {
    position: relative;
    z-index: 1;
}

/* Animación de pulso para el botón */
@keyframes pulse-glow {

    0%,
    100% {
        box-shadow:
            0 8px 25px rgba(37, 211, 102, 0.4),
            0 0 0 0 rgba(37, 211, 102, 0.4);
    }

    50% {
        box-shadow:
            0 8px 25px rgba(37, 211, 102, 0.6),
            0 0 0 15px rgba(37, 211, 102, 0);
    }
}

/* Responsive para móvil */
@media (max-width: 768px) {
    .hero-btns {
        flex-direction: column;
        width: 100%;
    }

    .btn-hero-whatsapp {
        width: 100%;
        justify-content: center;
        font-size: 1.1rem !important;
        padding: 1.25rem 2rem !important;
    }
}

/* Estados del botón */
.btn-hero-whatsapp:active {
    transform: scale(0.98);
}

.btn-hero-whatsapp:focus {
    outline: none;
    box-shadow:
        0 8px 25px rgba(37, 211, 102, 0.6),
        0 0 0 4px rgba(37, 211, 102, 0.2);
}