.boton-ir-app {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    padding: 14px 28px;
    margin-top: 25px;

    background: linear-gradient(135deg, #8e7dff, #c77dff);
    color: white;

    text-decoration: none;
    font-family: 'Quicksand', sans-serif;
    font-size: 18px;
    font-weight: 700;

    border-radius: 30px;
    border: 2px solid rgba(255, 255, 255, 0.7);

    box-shadow: 0 6px 18px rgba(100, 70, 150, 0.3);

    transition: all 0.3s ease;
}

.boton-ir-app:hover {
    transform: translateY(-4px);
    background: linear-gradient(135deg, #7b68ee, #b76cff);
    box-shadow: 0 10px 25px rgba(100, 70, 150, 0.4);
}

.boton-ir-app:active {
    transform: scale(0.95);
}

.boton-ir-app .icono-app {
    font-size: 22px;
}
/* =========================================
   BOTÓN APP - PÁGINAS DE EMOCIONES
========================================= */

.boton-app-emocion {
    position: fixed;
    top: 30px;
    right: 35px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 13px 25px;

    background: linear-gradient(135deg, #8e7dff, #c77dff);

    color: white;

    text-decoration: none;

    font-family: 'Quicksand', sans-serif;
    font-size: 18px;
    font-weight: 700;

    border-radius: 30px;

    border: 2px solid rgba(255, 255, 255, 0.8);

    box-shadow: 0 6px 18px rgba(70, 40, 120, 0.35);

    z-index: 9999;

    transition: all 0.3s ease;
}

.boton-app-emocion:hover {
    transform: translateY(-3px) scale(1.05);

    background: linear-gradient(135deg, #7b68ee, #b76cff);

    box-shadow: 0 10px 25px rgba(70, 40, 120, 0.45);
}


/* =========================================
   CELULAR
========================================= */

@media (max-width: 600px) {

    .boton-app-emocion {
        top: 20px;
        right: 15px;

        padding: 10px 17px;

        font-size: 15px;
    }

}