.elementor-100 .elementor-element.elementor-element-6d125f2{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:60px;--margin-bottom:70px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-100 .elementor-element.elementor-element-fa7fcfc{--display:flex;}.elementor-100 .elementor-element.elementor-element-786f277{--display:flex;}.elementor-100 .elementor-element.elementor-element-bbfaba8 .fluentform-widget-wrapper .ff-el-group .ff-btn-submit{background-color:#1a7efb !important;color:#ffffff !important;}@media(min-width:768px){.elementor-100 .elementor-element.elementor-element-6d125f2{--content-width:1300px;}.elementor-100 .elementor-element.elementor-element-fa7fcfc{--width:50%;}.elementor-100 .elementor-element.elementor-element-786f277{--width:50%;}}/* Start custom CSS for fluent-form-widget, class: .elementor-element-bbfaba8 *//* ============================================================
   VESICAE — FLUENT FORM
   LIGHT / CLEAN / QUIET LAB SYSTEM

   Fluent Form ID: #fluentform_1
   Wrapper: .fluentform_wrapper_1

   Elementor Globals:
   Primary:   #2B2927
   Secondary: #8F3E36
   Text:      #4A4742
   Accent:    #B3A28C

   Typography:
   Primary:   Libre Baskerville 700
   Secondary: Manrope 600
   Text:      Manrope 400
   Accent:    Manrope 700
============================================================ */


/* ============================================================
   BOX SIZING
============================================================ */

body .fluentform_wrapper_1,
body .fluentform_wrapper_1 * {
    box-sizing: border-box;
}


/* ============================================================
   MAIN FORM CARD
============================================================ */

body .fluentform_wrapper_1 {

    --ves-primary:
        var(--e-global-color-primary, #2B2927);

    --ves-secondary:
        var(--e-global-color-secondary, #8F3E36);

    --ves-text:
        var(--e-global-color-text, #4A4742);

    --ves-accent:
        var(--e-global-color-accent, #B3A28C);

    --ves-white:
        #FFFFFF;

    --ves-bg:
        #F7F4EF;

    --ves-soft:
        #EFEAE3;

    --ves-border:
        #E2DDD5;

    --ves-border-strong:
        #D2CBC2;

    --ves-muted:
        #8D8881;

    --ves-placeholder:
        #A29C94;

    --ves-red-soft:
        #F4EAE8;


    position: relative;

    isolation: isolate;

    overflow: hidden;

    width: 100%;
    max-width: 720px;

    margin:
        0 auto !important;

    padding:
        clamp(30px, 3.5vw, 42px) !important;

    background:

        radial-gradient(
            circle at 100% 0%,
            rgba(179,162,140,.11),
            transparent 35%
        ),

        linear-gradient(
            180deg,
            #FFFFFF 0%,
            #F7F4EF 100%
        );

    border:
        1px solid var(--ves-border);

    border-radius:
        12px;

    box-shadow:
        0 12px 34px rgba(43,41,39,.055);

    font-family:
        var(
            --e-global-typography-text-font-family,
            "Manrope",
            sans-serif
        );

    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
}


/* ============================================================
   QUIET CARD HOVER
============================================================ */

body .fluentform_wrapper_1:hover {

    transform:
        translateY(-3px);

    border-color:
        rgba(143,62,54,.20);

    box-shadow:
        0 17px 42px rgba(43,41,39,.075);
}


/* ============================================================
   DECORATIVE CIRCLE
============================================================ */

body .fluentform_wrapper_1::after {

    content: "";

    position: absolute;

    z-index: -1;

    width:
        280px;

    height:
        280px;

    top:
        -160px;

    right:
        -140px;

    border:
        1px solid rgba(179,162,140,.17);

    border-radius:
        50%;

    box-shadow:

        0 0 0 36px
        rgba(179,162,140,.022),

        0 0 0 72px
        rgba(179,162,140,.010);

    pointer-events:
        none;
}


/* ============================================================
   SUPPORT EYEBROW
============================================================ */

body .fluentform_wrapper_1::before {

    content:
        "VESICAE SUPPORT";

    position: relative;

    z-index: 2;

    display: inline-flex;

    align-items: center;

    gap:
        9px;

    margin:
        0 0 17px;

    color:
        var(--ves-secondary);

    font-family:
        var(
            --e-global-typography-accent-font-family,
            "Manrope",
            sans-serif
        );

    font-size:
        10px;

    font-weight:
        700;

    line-height:
        1;

    letter-spacing:
        .12em;

    text-transform:
        uppercase;
}


/* ============================================================
   FORM RESET
============================================================ */

body .fluentform_wrapper_1 #fluentform_1 {

    width:
        100%;

    margin:
        0 !important;

    padding:
        0 !important;
}


/* ============================================================
   FORM TITLE
============================================================ */

body .fluentform_wrapper_1 #fluentform_1::before {

    content:
        "Send Vesicae a Message";

    display:
        block;

    margin:
        0 0 18px;

    padding:
        0 0 20px;

    color:
        var(--ves-primary);

    border-bottom:
        1px solid var(--ves-border);

    font-family:
        var(
            --e-global-typography-primary-font-family,
            "Libre Baskerville",
            serif
        );

    font-size:
        clamp(
            30px,
            4vw,
            40px
        );

    font-weight:
        700;

    line-height:
        1.10;

    letter-spacing:
        -.025em;
}


/* ============================================================
   SMALL BRAND LINE UNDER TITLE
============================================================ */

body .fluentform_wrapper_1 #fluentform_1 {

    position: relative;
}


body .fluentform_wrapper_1 #fluentform_1::after {

    content:
        "Vesicae LLC · vesicae.com · Research Use Only";

    display:
        block;

    width:
        100%;

    margin:
        20px 0 0;

    padding:
        15px 4px 0;

    border-top:
        1px solid var(--ves-border);

    color:
        var(--ves-muted);

    font-family:
        var(
            --e-global-typography-accent-font-family,
            "Manrope",
            sans-serif
        );

    font-size:
        9px;

    font-weight:
        600;

    line-height:
        1.55;

    letter-spacing:
        .07em;

    text-align:
        center;

    text-transform:
        uppercase;
}


/* ============================================================
   FIELDSET
============================================================ */

body .fluentform_wrapper_1
#fluentform_1 fieldset {

    display:
        grid !important;

    grid-template-columns:
        minmax(0,1fr) !important;

    gap:
        15px !important;

    width:
        100%;

    min-width:
        0;

    margin:
        0 !important;

    padding:
        0 !important;

    border:
        0 !important;

    outline:
        0 !important;

    background:
        transparent !important;

    box-shadow:
        none !important;
}


/* ============================================================
   INTRO DESCRIPTION
============================================================ */

body .fluentform_wrapper_1
#fluentform_1 fieldset::before {

    content:
        "Questions about research access, lot documentation, COA records, orders, invoices, shipping, tracking, account support, or independent testing arrangements? Send our team a message.";

    display:
        block;

    grid-column:
        1 !important;

    width:
        100%;

    max-width:
        650px;

    margin:
        0 0 11px;

    color:
        var(--ves-text);

    font-family:
        var(
            --e-global-typography-text-font-family,
            "Manrope",
            sans-serif
        );

    font-size:
        14px;

    font-weight:
        400;

    line-height:
        1.72;
}


/* ============================================================
   FORCE FULL WIDTH
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
fieldset > .ff-name-field-wrapper,

body .fluentform_wrapper_1 #fluentform_1
fieldset > .ff-el-group,

body .fluentform_wrapper_1 #fluentform_1
fieldset > .ff-field_container,

body .fluentform_wrapper_1 #fluentform_1
fieldset > div {

    grid-column:
        1 !important;

    width:
        100% !important;

    min-width:
        0 !important;
}


/* ============================================================
   REMOVE FLUENT SPACING
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
.ff-field_container,

body .fluentform_wrapper_1 #fluentform_1
.ff-name-field-wrapper,

body .fluentform_wrapper_1 #fluentform_1
.ff-el-group,

body .fluentform_wrapper_1 #fluentform_1
.ff-t-container,

body .fluentform_wrapper_1 #fluentform_1
.ff-t-cell,

body .fluentform_wrapper_1 #fluentform_1
.ff-el-input--content {

    width:
        100%;

    min-width:
        0;

    margin:
        0 !important;

    padding:
        0 !important;
}


/* ============================================================
   NAME FIELDS VERTICAL
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
.ff-name-field-wrapper
.ff-t-container {

    display:
        grid !important;

    grid-template-columns:
        1fr !important;

    gap:
        15px !important;
}


/* ============================================================
   FORCE ONE COLUMN
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
.ff-t-container {

    grid-template-columns:
        1fr !important;

    flex-direction:
        column !important;
}


/* ============================================================
   HIDE EXTENSION MIRRORS
============================================================ */

body .fluentform_wrapper_1
#fluentform_1 csext-root-mirror {

    display:
        none !important;
}


/* ============================================================
   ACCESSIBLE HIDDEN LABELS
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
.ff-el-input--label,

body .fluentform_wrapper_1 #fluentform_1
legend.ff_screen_reader_title {

    position:
        absolute !important;

    width:
        1px !important;

    height:
        1px !important;

    margin:
        -1px !important;

    padding:
        0 !important;

    overflow:
        hidden !important;

    clip:
        rect(0,0,0,0) !important;

    clip-path:
        inset(50%) !important;

    border:
        0 !important;

    white-space:
        nowrap !important;
}


/* ============================================================
   INPUTS
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
input.ff-el-form-control,

body .fluentform_wrapper_1 #fluentform_1
select.ff-el-form-control,

body .fluentform_wrapper_1 #fluentform_1
textarea.ff-el-form-control {

    display:
        block;

    width:
        100% !important;

    max-width:
        100% !important;

    margin:
        0 !important;

    padding:
        15px 16px !important;

    color:
        var(--ves-primary) !important;

    background:
        rgba(255,255,255,.88) !important;

    border:
        1px solid var(--ves-border) !important;

    border-radius:
        8px !important;

    outline:
        none !important;

    font-family:
        var(
            --e-global-typography-text-font-family,
            "Manrope",
            sans-serif
        ) !important;

    font-size:
        14px !important;

    font-weight:
        400 !important;

    line-height:
        1.5 !important;

    box-shadow:
        0 3px 12px rgba(43,41,39,.018) !important;

    transition:
        border-color .25s ease,
        background-color .25s ease,
        box-shadow .25s ease !important;
}


/* ============================================================
   INPUT HOVER
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
input.ff-el-form-control:hover,

body .fluentform_wrapper_1 #fluentform_1
select.ff-el-form-control:hover,

body .fluentform_wrapper_1 #fluentform_1
textarea.ff-el-form-control:hover {

    background:
        #FFFFFF !important;

    border-color:
        var(--ves-border-strong) !important;
}


/* ============================================================
   PLACEHOLDER
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
input.ff-el-form-control::placeholder,

body .fluentform_wrapper_1 #fluentform_1
textarea.ff-el-form-control::placeholder {

    color:
        var(--ves-placeholder) !important;

    opacity:
        1 !important;
}


/* ============================================================
   FOCUS
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
input.ff-el-form-control:focus,

body .fluentform_wrapper_1 #fluentform_1
select.ff-el-form-control:focus,

body .fluentform_wrapper_1 #fluentform_1
textarea.ff-el-form-control:focus {

    color:
        var(--ves-primary) !important;

    background:
        #FFFFFF !important;

    border-color:
        var(--ves-secondary) !important;

    box-shadow:

        0 0 0 3px
        rgba(143,62,54,.075),

        0 5px 16px
        rgba(43,41,39,.035) !important;
}


/* ============================================================
   TEXTAREA
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
textarea.ff-el-form-control {

    min-height:
        170px !important;

    resize:
        vertical !important;
}


/* ============================================================
   SELECT OPTIONS
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
select.ff-el-form-control option {

    color:
        var(--ves-primary);

    background:
        #FFFFFF;
}


/* ============================================================
   AUTOFILL
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
input:-webkit-autofill,

body .fluentform_wrapper_1 #fluentform_1
input:-webkit-autofill:hover,

body .fluentform_wrapper_1 #fluentform_1
input:-webkit-autofill:focus {

    -webkit-text-fill-color:
        var(--ves-primary) !important;

    caret-color:
        var(--ves-primary) !important;

    -webkit-box-shadow:
        0 0 0 1000px
        #FFFFFF inset !important;

    border-color:
        var(--ves-secondary) !important;
}


/* ============================================================
   CHECKBOX / RADIO
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
input[type="checkbox"],

body .fluentform_wrapper_1 #fluentform_1
input[type="radio"] {

    accent-color:
        var(--ves-secondary) !important;
}


body .fluentform_wrapper_1 #fluentform_1
.ff-el-form-check-label,

body .fluentform_wrapper_1 #fluentform_1
.ff-el-form-check-label span {

    color:
        var(--ves-text) !important;

    font-family:
        var(
            --e-global-typography-text-font-family,
            "Manrope",
            sans-serif
        ) !important;

    font-size:
        13px !important;

    line-height:
        1.65 !important;
}


/* ============================================================
   SUBMIT WRAPPER
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
.ff_submit_btn_wrapper {

    width:
        100%;

    margin:
        2px 0 0 !important;

    padding:
        0 !important;
}


/* ============================================================
   SUBMIT BUTTON
   SAME GLOBAL VESICAE BUTTON SYSTEM
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
button.ff-btn-submit {

    display:
        inline-flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    width:
        100% !important;

    min-height:
        var(--ves-btn-height, 48px) !important;

    margin:
        0 !important;

    padding:
        0
        var(--ves-btn-padding-x, 27px) !important;

    color:
        var(--ves-btn-white, #FFFFFF) !important;

    background:
        var(
            --ves-btn-primary,
            var(--ves-primary)
        ) !important;

    border:
        1px solid
        var(
            --ves-btn-primary,
            var(--ves-primary)
        ) !important;

    border-radius:
        var(--ves-btn-radius, 8px) !important;

    font-family:
        var(
            --ves-btn-font,
            var(
                --e-global-typography-accent-font-family,
                "Manrope",
                sans-serif
            )
        ) !important;

    font-size:
        var(--ves-btn-font-size, 14px) !important;

    font-weight:
        var(--ves-btn-weight, 700) !important;

    line-height:
        1.2 !important;

    letter-spacing:
        .025em !important;

    text-transform:
        none !important;

    cursor:
        pointer !important;

    box-shadow:
        0 7px 18px rgba(43,41,39,.10) !important;

    transition:
        background-color .25s ease,
        border-color .25s ease,
        transform .25s ease,
        box-shadow .25s ease !important;
}


/* ============================================================
   SUBMIT HOVER
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
button.ff-btn-submit:hover {

    color:
        #FFFFFF !important;

    background:
        var(--ves-btn-hover, #8F3E36) !important;

    border-color:
        var(--ves-btn-hover, #8F3E36) !important;

    transform:
        translateY(-2px);

    box-shadow:
        0 10px 24px
        rgba(143,62,54,.16) !important;
}


body .fluentform_wrapper_1 #fluentform_1
button.ff-btn-submit:active {

    transform:
        translateY(0);
}


body .fluentform_wrapper_1 #fluentform_1
button.ff-btn-submit:focus-visible {

    outline:
        3px solid
        rgba(179,162,140,.55) !important;

    outline-offset:
        3px !important;
}


/* ============================================================
   LOADING
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
button.ff-btn-submit.ff-working {

    opacity:
        .68 !important;

    cursor:
        wait !important;

    transform:
        none !important;
}


/* ============================================================
   VALIDATION
============================================================ */

body .fluentform_wrapper_1 #fluentform_1
.ff-el-is-error
input.ff-el-form-control,

body .fluentform_wrapper_1 #fluentform_1
.ff-el-is-error
select.ff-el-form-control,

body .fluentform_wrapper_1 #fluentform_1
.ff-el-is-error
textarea.ff-el-form-control {

    border-color:
        #B34F48 !important;

    box-shadow:
        0 0 0 3px
        rgba(179,79,72,.08) !important;
}


body .fluentform_wrapper_1 #fluentform_1
.text-danger,

body .fluentform_wrapper_1 #fluentform_1
.error {

    display:
        block;

    margin:
        7px 0 0 !important;

    color:
        #A6453F !important;

    font-family:
        var(
            --e-global-typography-text-font-family,
            "Manrope",
            sans-serif
        ) !important;

    font-size:
        12px !important;

    font-weight:
        600 !important;

    line-height:
        1.4 !important;
}


/* ============================================================
   SUCCESS MESSAGE
============================================================ */

body .fluentform_wrapper_1
.ff-message-success {

    margin:
        18px 0 0 !important;

    padding:
        16px 17px !important;

    color:
        var(--ves-text) !important;

    background:
        #FFFFFF !important;

    border:
        1px solid
        var(--ves-border) !important;

    border-left:
        3px solid
        var(--ves-secondary) !important;

    border-radius:
        8px !important;

    font-family:
        var(
            --e-global-typography-text-font-family,
            "Manrope",
            sans-serif
        ) !important;

    font-size:
        13px !important;

    line-height:
        1.65 !important;

    box-shadow:
        0 5px 16px rgba(43,41,39,.025) !important;
}


/* ============================================================
   TABLET
============================================================ */

@media only screen and (max-width:768px) {

    body .fluentform_wrapper_1 {

        padding:
            27px 21px !important;

        border-radius:
            10px;
    }


    body .fluentform_wrapper_1
    #fluentform_1::before {

        font-size:
            29px;

        margin-bottom:
            16px;

        padding-bottom:
            16px;
    }


    body .fluentform_wrapper_1
    #fluentform_1 fieldset::before {

        font-size:
            13.5px;
    }


    body .fluentform_wrapper_1 #fluentform_1
    input.ff-el-form-control,

    body .fluentform_wrapper_1 #fluentform_1
    select.ff-el-form-control,

    body .fluentform_wrapper_1 #fluentform_1
    textarea.ff-el-form-control {

        padding:
            14px 15px !important;
    }


    body .fluentform_wrapper_1 #fluentform_1
    textarea.ff-el-form-control {

        min-height:
            155px !important;
    }

}


/* ============================================================
   MOBILE
============================================================ */

@media only screen and (max-width:480px) {

    body .fluentform_wrapper_1 {

        padding:
            24px 17px !important;

        border-radius:
            9px;
    }


    body .fluentform_wrapper_1::before {

        margin-bottom:
            13px;

        font-size:
            9px;
    }


    body .fluentform_wrapper_1
    #fluentform_1::before {

        font-size:
            26px;
    }


    body .fluentform_wrapper_1
    #fluentform_1 fieldset::before {

        font-size:
            13px;

        line-height:
            1.65;
    }


    body .fluentform_wrapper_1
    #fluentform_1::after {

        font-size:
            8px;
    }

}


/* ============================================================
   REDUCED MOTION
============================================================ */

@media (prefers-reduced-motion: reduce) {

    body .fluentform_wrapper_1,

    body .fluentform_wrapper_1
    input.ff-el-form-control,

    body .fluentform_wrapper_1
    select.ff-el-form-control,

    body .fluentform_wrapper_1
    textarea.ff-el-form-control,

    body .fluentform_wrapper_1
    button.ff-btn-submit {

        transition:
            none !important;

        transform:
            none !important;
    }

}/* End custom CSS */