/* =====================================================
   BOTÓN PRINCIPAL
===================================================== */

.btn-principal {
    position: fixed;
    top: 25px;
    left: 25px;

    z-index: 9999;

    display: flex;
    align-items: center;
    gap: 9px;

    padding: 11px 18px;

    border-radius: 12px;

    text-decoration: none;

    color: #ffffff;

    font-size: 14px;
    font-weight: 600;

    background: rgba(7, 30, 61, 0.95);

    border: 1px solid rgba(65, 145, 255, 0.40);

    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.30);

    backdrop-filter: blur(10px);

    transition: all 0.3s ease;
}

.btn-principal i {
    font-size: 16px;
}

.btn-principal:hover {
    transform: translateY(-3px);

    background: #125bb5;

    border-color: #3d91ff;

    box-shadow:
        0 10px 30px rgba(0, 102, 255, 0.40);
}

.btn-principal:active {
    transform: translateY(0);
}


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

@media (max-width: 600px) {

    .btn-principal {
        top: 15px;
        left: 15px;

        padding: 10px 12px;
    }

    .btn-principal span {
        display: none;
    }

    .btn-principal i {
        font-size: 17px;
    }
}