/* ==================================================
   NX BUTTON SYSTEM
   SAME SIZE • SAME HEIGHT • MEDIUM PILL
================================================== */


/* ==================================================
   BUTTON BASE
================================================== */

.nx-btn,
.nx-btn-glass,
.nx-btn-primary {

    display:
        inline-flex
        !important;

    align-items:
        center
        !important;

    justify-content:
        center
        !important;

    vertical-align:
        middle
        !important;

    flex:
        0 0 auto
        !important;

    width:
        auto
        !important;

    height:
        2.75rem
        !important;

    min-height:
        2.75rem
        !important;

    max-height:
        2.75rem
        !important;

    min-width:
        0
        !important;

    max-width:
        100%
        !important;

    margin:
        0
        !important;

    padding:
        0 1.375rem
        !important;

    box-sizing:
        border-box
        !important;

    border-radius:
        999px
        !important;

    font-family:
        var(--font-primary)
        !important;

    font-size:
        .8125rem
        !important;

    font-weight:
        var(--weight-semibold)
        !important;

    line-height:
        1
        !important;

    text-decoration:
        none
        !important;

    white-space:
        nowrap
        !important;

    cursor:
        pointer
        !important;

    transition:
        background .3s ease,
        border-color .3s ease,
        color .3s ease,
        transform .3s ease,
        box-shadow .3s ease
        !important;
}


/* ==================================================
   REMOVE ELEMENTOR BUTTON DEFAULTS
================================================== */

.nx-btn.elementor-button,
.nx-btn-glass.elementor-button,
.nx-btn-primary.elementor-button {

    height:
        2.75rem
        !important;

    min-height:
        2.75rem
        !important;

    max-height:
        2.75rem
        !important;

    padding:
        0 1.375rem
        !important;

    margin:
        0
        !important;

    line-height:
        1
        !important;

    box-sizing:
        border-box
        !important;
}


/* ==================================================
   GLASS
================================================== */

.nx-btn-glass {

    border:
        1px solid
        rgba(255,255,255,.14)
        !important;

    background:
        rgba(255,255,255,.07)
        !important;

    color:
        #ffffff
        !important;

    backdrop-filter:
        blur(1.25rem)
        saturate(160%)
        !important;

    -webkit-backdrop-filter:
        blur(1.25rem)
        saturate(160%)
        !important;

    box-shadow:

        inset 0 1px 0
        rgba(255,255,255,.16),

        0 .5rem 1.5rem
        rgba(0,0,0,.14)
        !important;
}


/* ==================================================
   GLASS HOVER
================================================== */

.nx-btn-glass:hover {

    background:
        rgba(255,255,255,.12)
        !important;

    border-color:
        rgba(255,255,255,.25)
        !important;

    color:
        #ffffff
        !important;

    transform:
        translateY(-1px)
        !important;

    box-shadow:

        inset 0 1px 0
        rgba(255,255,255,.22),

        0 .75rem 1.75rem
        rgba(0,0,0,.20)
        !important;
}


/* ==================================================
   GLASS ACTIVE
================================================== */

.nx-btn-glass:active {

    transform:
        translateY(0)
        !important;
}


/* ==================================================
   GLASS FOCUS
================================================== */

.nx-btn-glass:focus-visible {

    outline:
        2px solid
        rgba(255,255,255,.28)
        !important;

    outline-offset:
        3px
        !important;
}


/* ==================================================
   PRIMARY
   CYAN
================================================== */

.nx-btn-primary {

    border:
        1px solid
        #00D9FF
        !important;

    background:
        #00D9FF
        !important;

    color:
        #071114
        !important;

    box-shadow:

        0 .5rem 1.25rem
        rgba(0,217,255,.18)
        !important;
}


/* ==================================================
   PRIMARY HOVER
================================================== */

.nx-btn-primary:hover {

    background:
        #8AF3FF
        !important;

    border-color:
        #8AF3FF
        !important;

    color:
        #071114
        !important;

    transform:
        translateY(-1px)
        !important;

    box-shadow:

        0 .625rem 1.5rem
        rgba(0,217,255,.28)
        !important;
}


/* ==================================================
   PRIMARY ACTIVE
================================================== */

.nx-btn-primary:active {

    transform:
        translateY(0)
        !important;

    box-shadow:

        0 .25rem .75rem
        rgba(0,217,255,.18)
        !important;
}


/* ==================================================
   PRIMARY FOCUS
================================================== */

.nx-btn-primary:focus-visible {

    outline:
        2px solid
        rgba(0,217,255,.45)
        !important;

    outline-offset:
        3px
        !important;
}


/* ==================================================
   BUTTON CONTENT
   NORMALIZE ELEMENTOR INNER SPAN
================================================== */

.nx-btn .elementor-button-content-wrapper,
.nx-btn .elementor-button-text {

    margin:
        0
        !important;

    padding:
        0
        !important;

    line-height:
        1
        !important;

    display:
        inline-flex
        !important;

    align-items:
        center
        !important;
}


/* ==================================================
   MOBILE
   EXACT SAME SIZE
================================================== */

@media (max-width: 767px) {

    .nx-btn,
    .nx-btn-glass,
    .nx-btn-primary,
    .nx-btn.elementor-button,
    .nx-btn-glass.elementor-button,
    .nx-btn-primary.elementor-button {

        display:
            inline-flex
            !important;

        align-items:
            center
            !important;

        justify-content:
            center
            !important;

        flex:
            0 0 auto
            !important;

        width:
            auto
            !important;

        height:
            2.625rem
            !important;

        min-height:
            2.625rem
            !important;

        max-height:
            2.625rem
            !important;

        margin:
            0
            !important;

        padding:
            0 1.125rem
            !important;

        box-sizing:
            border-box
            !important;

        border-radius:
            999px
            !important;

        font-size:
            .75rem
            !important;

        line-height:
            1
            !important;

    }

    .nx-btn .elementor-button-content-wrapper,
    .nx-btn .elementor-button-text {

        margin:
            0
            !important;

        padding:
            0
            !important;

        line-height:
            1
            !important;

    }

}