/* ==========================================================
   SITUP MOBILE MOTION V6.5
   ========================================================== */

:root {
    --situp65-black: #05131f;
    --situp65-deep: #071d2e;

    --situp65-blue: #318ec1;
    --situp65-blue-mid: #54afe0;
    --situp65-blue-light: #79c8ed;
    --situp65-blue-pale: #bceaff;
}


/* ==========================================================
   PLACARD HEADLINE CORRECTION

   ONLY fix the dark first headline lines.

   Accent spans retain their existing assigned color.
   ========================================================== */

#managed-it
.lane-content
h2,

#government
.lane-content
h2 {

    color:
        #ffffff !important;

    opacity:
        1 !important;

    text-shadow:

        0 2px 8px
        rgba(0,0,0,.42)

        !important;
}


/*
 * Preserve the deliberate emphasized second line.
 *
 * V6.3 currently assigns this separately, so we explicitly
 * prevent the parent's white from swallowing that treatment.
 */

#managed-it
.lane-content
h2
.lane-accent,

#government
.lane-content
h2
.lane-accent {

    color:
        #8ed5a2 !important;
}


/* ==========================================================
   NEW MOBILE SENSOR LAYER
   ========================================================== */

/*
 * Best case:
 * put this canvas inside the existing production background
 * stage, alongside SITUP's established network system.
 */

#situp-production-stage {

    overflow:
        hidden;
}


#situp-production-stage
#situp-mobile-motion-v65 {

    position:
        absolute;

    inset:
        0;


    z-index:
        4;


    width:
        100%;

    height:
        100%;


    pointer-events:
        none;


    opacity:
        .88;
}


/*
 * Fallback if the established production stage is missing.
 */

body
> #situp-mobile-motion-v65 {

    position:
        fixed;

    inset:
        0;


    z-index:
        1;


    width:
        100vw;

    height:
        100vh;


    pointer-events:
        none;


    opacity:
        .86;
}


/* ==========================================================
   MOTION ACTIVATION CONTROL
   ========================================================== */

#situp-motion-control-v65 {

    position:
        fixed;


    left:
        max(
            13px,
            env(safe-area-inset-left)
        );


    bottom:
        max(
            13px,
            env(safe-area-inset-bottom)
        );


    z-index:
        9999;


    display:
        none;

    align-items:
        center;

    gap:
        8px;


    min-height:
        37px;


    padding:
        0 13px;


    border:
        1px solid
        rgba(121,200,237,.50);

    border-radius:
        999px;


    background:

        linear-gradient(
            180deg,
            rgba(255,255,255,.035),
            rgba(255,255,255,.008)
        ),

        rgba(5,19,31,.91);


    color:
        rgba(216,242,253,.94);


    box-shadow:

        0 10px 25px
        rgba(0,0,0,.33),

        inset 0 0 0 1px
        rgba(121,200,237,.045),

        0 0 17px
        rgba(49,142,193,.10);


    backdrop-filter:
        blur(12px)
        saturate(120%);

    -webkit-backdrop-filter:
        blur(12px)
        saturate(120%);


    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif;


    font-size:
        9px;

    font-weight:
        800;

    letter-spacing:
        .09em;


    cursor:
        pointer;


    transition:

        border-color .16s ease,
        color .16s ease,
        opacity .25s ease,
        transform .16s ease;
}


#situp-motion-control-v65.is-visible {

    display:
        inline-flex;
}


#situp-motion-control-v65:hover,
#situp-motion-control-v65:focus-visible {

    border-color:
        var(--situp65-blue-light);


    color:
        #ffffff;


    transform:
        translateY(-1px);
}


#situp-motion-control-v65.is-active {

    border-color:
        rgba(121,200,237,.62);

    color:
        var(--situp65-blue-pale);
}


#situp-motion-control-v65.is-error {

    border-color:
        rgba(215,168,92,.55);

    color:
        #e6c88f;
}


/* ==========================================================
   MOBILE ONLY
   ========================================================== */

@media (min-width: 901px) {

    #situp-mobile-motion-v65,
    #situp-motion-control-v65 {

        display:
            none !important;
    }

}


@media (prefers-reduced-motion: reduce) {

    #situp-mobile-motion-v65,
    #situp-motion-control-v65 {

        display:
            none !important;
    }

}