:root {
    --font-family-figtree: 'Figtree', sans-serif;
    --text-rgb-20-29-58: rgba(20, 29, 58, 1);
    --text-white: rgba(255, 255, 255, 1);
}

.text-white {
    color: var(--text-white);
}


/* CSS Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    width: 100%;
    min-height: 100vh;
    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
}

/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.node-2 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    width: 100%;
    height: auto;
}

.text-3 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-20-29-58);
}

.button-background-5 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(20, 29, 58, 1);
    border-radius: 100px;
}

.text-6 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-white);
}

.sign-in-btn-4 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.button-background-8 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(20, 29, 58, 1);
    border-radius: 100px;
}

.text-9 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-white);
}

.learn-more-btn-7 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.text-11 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-20-29-58);
}

.primary-button-10 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 30px 12px 30px;
    flex-grow: 0;
    flex-shrink: 1;
    width: 7.395833333333333%;
    background-color: rgba(255, 255, 255, 1);
    border: 1px solid rgba(20, 29, 58, 1);
    border-radius: 24px;
}

.node-1 {
    @media (max-width: 1440px) {
        .node-1 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .node-1 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    flex-grow: 0;
    flex-shrink: 1;
    width: NaN%;
    background-color: rgba(255, 255, 255, 1);
}


/* CSS Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    width: 100%;
    min-height: 100vh;
    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


.text-rgb-20-29-58 {
    color: var(--text-rgb-20-29-58);
}





/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}












/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}




.text-rgb-51-51-51 {
    color: var(--text-rgb-51-51-51);
}




/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.node-13 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    width: 100%;
    height: auto;
}

.node-14 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(20, 29, 58, 0.5);
}

.sso-form-box-16 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(255, 255, 255, 1);
    border-radius: 8px;
}

.node-17 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    width: 100%;
    height: auto;
}

.text-24 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: left;
    font-family: var(--font-family-figtree);
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-51-51-51);
}

.node-23 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 10px 0px 10px;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.input-field-text-22 {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: auto;
}

.input-field-21 {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    padding: 0px 10px 0px 10px;
    flex-grow: 0;
    flex-shrink: 1;
    width: 100%;
    background-color: rgba(255, 255, 255, 1);
    border: 1px solid rgba(204, 204, 204, 1);
    border-radius: 6px;
}

.input-field-20 {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 3px;
    padding: 0px;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.input-field-wrapper-19 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.node-18 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 40px;
    padding: 0px;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.text-26 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-white);
}

.primary-button-25 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 30px 12px 30px;
    flex-grow: 0;
    flex-shrink: 1;
    width: 85.18518518518519%;
    background-color: rgba(20, 29, 58, 1);
    border-radius: 24px;
}

.text-28 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-20-29-58);
}

.primary-button-27 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 30px 12px 30px;
    flex-grow: 0;
    flex-shrink: 1;
    width: 85.18518518518519%;
    background-color: rgba(255, 255, 255, 1);
    border: 1px solid rgba(20, 29, 58, 1);
    border-radius: 24px;
}

.sso-box-15 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.node-12 {
    @media (max-width: 1440px) {
        .node-12 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .node-12 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    flex-grow: 0;
    flex-shrink: 1;
    width: NaN%;
    background-color: rgba(255, 255, 255, 1);
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}








/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.text-35 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: left;
    font-family: var(--font-family-figtree);
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-51-51-51);
}

.node-34 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 10px 0px 10px;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.input-field-text-33 {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: auto;
}

.input-field-32 {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    padding: 0px 10px 0px 10px;
    flex-grow: 0;
    flex-shrink: 1;
    width: 100%;
    background-color: rgba(255, 255, 255, 1);
    border: 1px solid rgba(204, 204, 204, 1);
    border-radius: 6px;
}

.input-field-31 {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 3px;
    padding: 0px;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.input-field-wrapper-30 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.node-29 {
    @media (max-width: 1440px) {
        .node-29 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .node-29 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 40px;
    padding: 0px;
    width: 100%;
    min-height: 100vh;
    margin: 0 auto;
    max-width: 460px;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}








/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.text-40 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: left;
    font-family: var(--font-family-figtree);
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-51-51-51);
}

.node-39 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 10px 0px 10px;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.input-field-text-38 {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: auto;
}

.input-field-37 {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    padding: 0px 10px 0px 10px;
    flex-grow: 0;
    flex-shrink: 1;
    width: 100%;
    background-color: rgba(255, 255, 255, 1);
    border: 1px solid rgba(204, 204, 204, 1);
    border-radius: 6px;
}

.input-field-36 {
    @media (max-width: 1440px) {
        .input-field-36 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .input-field-36 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 3px;
    padding: 0px;
    width: 100%;
    min-height: 100vh;
    margin: 0 auto;
    max-width: 460px;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}








/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.text-42 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-white);
}

.primary-button-41 {
    @media (max-width: 1440px) {
        .primary-button-41 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .primary-button-41 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 30px 12px 30px;
    width: 100%;
    min-height: 100vh;
    margin: 0 auto;
    max-width: 460px;
    flex-grow: 0;
    flex-shrink: 1;
    width: 85.18518518518519%;
    background-color: rgba(20, 29, 58, 1);
    border-radius: 24px;
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}








/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.text-44 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-20-29-58);
}

.primary-button-43 {
    @media (max-width: 1440px) {
        .primary-button-43 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .primary-button-43 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 30px 12px 30px;
    width: 100%;
    min-height: 100vh;
    margin: 0 auto;
    max-width: 460px;
    flex-grow: 0;
    flex-shrink: 1;
    width: 85.18518518518519%;
    background-color: rgba(255, 255, 255, 1);
    border: 1px solid rgba(20, 29, 58, 1);
    border-radius: 24px;
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}








/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.text-46 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-white);
}

.node-45 {
    @media (max-width: 1440px) {
        .node-45 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .node-45 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 30px 12px 30px;
    width: 100%;
    min-height: 100vh;
    margin: 0 auto;
    max-width: 460px;
    flex-grow: 0;
    flex-shrink: 1;
    width: NaN%;
    background-color: rgba(20, 29, 58, 1);
    border-radius: 24px;
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}








/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.text-48 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-20-29-58);
}

.node-47 {
    @media (max-width: 1440px) {
        .node-47 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .node-47 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 30px 12px 30px;
    width: 100%;
    min-height: 100vh;
    margin: 0 auto;
    max-width: 460px;
    flex-grow: 0;
    flex-shrink: 1;
    width: NaN%;
    background-color: rgba(78, 173, 225, 1);
    border-radius: 24px;
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}








/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.text-50 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-20-29-58);
}

.node-49 {
    @media (max-width: 1440px) {
        .node-49 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .node-49 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 30px 12px 30px;
    width: 100%;
    min-height: 100vh;
    margin: 0 auto;
    max-width: 460px;
    flex-grow: 0;
    flex-shrink: 1;
    width: NaN%;
    background-color: rgba(20, 29, 58, 0);
    border: 1px solid rgba(20, 29, 58, 1);
    border-radius: 24px;
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}








/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.text-52 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-white);
}

.node-51 {
    @media (max-width: 1440px) {
        .node-51 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .node-51 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 30px 12px 30px;
    width: 100%;
    min-height: 100vh;
    margin: 0 auto;
    max-width: 460px;
    flex-grow: 0;
    flex-shrink: 1;
    width: NaN%;
    background-color: rgba(0, 117, 195, 1);
    border-radius: 24px;
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}








/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.button-background-56 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(0, 117, 195, 1);
    border-radius: 100px;
}

.text-57 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-white);
}

.button-container-55 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.btn-sso-normal-54 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(255, 255, 255, 1);
}

.btn-sso-hover-53 {
    @media (max-width: 1440px) {
        .btn-sso-hover-53 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .btn-sso-hover-53 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(255, 255, 255, 1);
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}








/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.text-60 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-20-29-58);
}

.primary-button-59 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 30px 12px 30px;
    flex-grow: 0;
    flex-shrink: 1;
    width: 100%;
    background-color: rgba(255, 255, 255, 1);
    border: 1px solid rgba(20, 29, 58, 1);
    border-radius: 24px;
}

.btn-sso-normal-58 {
    @media (max-width: 1440px) {
        .btn-sso-normal-58 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .btn-sso-normal-58 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(255, 255, 255, 1);
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}








/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.text-62 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-20-29-58);
}

.node-61 {
    @media (max-width: 1440px) {
        .node-61 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .node-61 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(255, 255, 255, 1);
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}





.text-rgb-0-117-195 {
    color: var(--text-rgb-0-117-195);
}




/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.text-64 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    text-decoration: underline;
    text-transform: none;
    color: var(--text-rgb-0-117-195);
}

.node-63 {
    @media (max-width: 1440px) {
        .node-63 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .node-63 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(255, 255, 255, 1);
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}









/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.button-background-67 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(20, 29, 58, 1);
    border-radius: 100px;
}

.text-68 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-white);
}

.button-container-66 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.btn-sign-in-normal-65 {
    @media (max-width: 1440px) {
        .btn-sign-in-normal-65 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .btn-sign-in-normal-65 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(255, 255, 255, 1);
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}









/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.button-background-71 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(78, 173, 225, 1);
    border-radius: 100px;
}

.text-72 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-20-29-58);
}

.button-container-70 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.btn-sign-in-hover-69 {
    @media (max-width: 1440px) {
        .btn-sign-in-hover-69 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .btn-sign-in-hover-69 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(255, 255, 255, 1);
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}









/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.button-background-75 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(20, 29, 58, 1);
    border-radius: 100px;
}

.text-76 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-white);
}

.button-container-74 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.node-73 {
    @media (max-width: 1440px) {
        .node-73 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .node-73 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(255, 255, 255, 1);
}

/* Add font files for Figtree */
@font-face {
    font-family: 'Figtree';
    src: url('fonts/figtree.woff2') format('woff2'), url('fonts/figtree.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}









/* Prototype Links (v5.6.0) */
a.prototype-link {
    text-decoration: none;
    color: inherit;
    display: contents;
}

.button-background-79 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(78, 173, 225, 1);
    border-radius: 100px;
}

.text-80 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    text-align: center;
    font-family: var(--font-family-figtree);
    font-weight: 700;
    font-size: 16px;
    text-decoration: none;
    text-transform: none;
    color: var(--text-rgb-20-29-58);
}

.button-container-78 {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

.btn-learn-more-hover-77 {
    @media (max-width: 1440px) {
        .btn-learn-more-hover-77 {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

    @media (max-width: 768px) {
        .btn-learn-more-hover-77 {
            padding-left: 16px;
            padding-right: 16px;
        }
    }

    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    background-color: rgba(255, 255, 255, 1);
    /* 26-FAMS-1976_myFAMS_SSO_Button_Login - Figma design spec */
}
    .sso-login-btn
{
    display: inline-flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 12px 24px;
    min-width: 98px;
    height: 44px;
    background: #294C7D;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.16), 0px 2px 4px rgba(0, 0, 0, 0.12), 0px 1px 8px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    border: none;
    color: #FFFFFF;
    font-family: Arial, sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.25px;
    text-transform: capitalize;
    cursor: pointer;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.sso-login-btn:hover:not(:disabled) {
    background: #1E3A5F;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2), 0px 4px 8px rgba(0, 0, 0, 0.14);
}

.sso-login-btn:focus {
    outline: 2px solid #294C7D;
    outline-offset: 2px;
}

.sso-login-btn:active:not(:disabled) {
    background: #143A6B;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);
}

.sso-login-btn:disabled {
    background: #9CA3AF;
    cursor: not-allowed;
    box-shadow: none;
}

.sso-cancel-btn {
    display: inline-flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 12px 24px;
    min-width: 98px;
    height: 44px;
    background: transparent;
    border: 1px solid #294C7D;
    border-radius: 4px;
    color: #294C7D;
    font-family: Arial, sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.25px;
    text-transform: capitalize;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
}

    .sso-cancel-btn:hover {
        background: rgba(41, 76, 125, 0.08);
        color: #1E3A5F;
    }

    .sso-cancel-btn:focus {
        outline: 2px solid #294C7D;
        outline-offset: 2px;
    }

.sso-button-group {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    margin-top: 16px;
}

.sso-email-input {
    width: 245px;
    padding: 10px 12px;
    font-family: Arial, sans-serif;
    font-size: 15px;
    line-height: 24px;
    color: black;
    border: 1px solid #D1D5DB;
    border-radius: 4px;
    box-sizing: border-box;
    margin-bottom:30px;
}

    .sso-email-input:focus {
        outline: none;
        border-color: #294C7D;
        box-shadow: 0 0 0 2px rgba(41, 76, 125, 0.2);
    }

    .sso-email-input.input-validation-error {
        border-color: #DC2626;
    }

.sso-form-label {
    font-family: Arial, sans-serif;
    font-size: 15px;
    font-weight: normal;
    line-height: 24px;
    color: #143A6B;
    display: block;
    margin-bottom: 30px;
}

    .sso-form-label em {
        color: #DC2626;
    }

/* ===== SSO Login Page Layout (matches First American design) ===== */
.sso-login-page {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow-y: scroll;
}

.sso-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.sso-bg-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.sso-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(20, 29, 58, 0.5);
    z-index: 1;
}

.sso-login-container {
    position: fixed;
    z-index: 2;
    width: 100%;
    max-width: 450px;
    padding: 24px;
    height:650px;
    top:75px;
}

.sso-login-card {
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15);
    padding: 40px 32px 0px 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}

.sso-logo {
    max-width: 300px;
    height: auto;
    margin-bottom: 8px;
}
.sso-form-group
{
    width:100%;
}

.sso-login-card {
    width: 100%;
    margin-bottom: 8px;
    height:390px;
}

.sso-login-card .sso-form-label {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
    font-weight: 500;
    color: #333333;
}

.sso-login-card .sso-email-input {
    width: 100%;
    padding: 12px 14px;
    font-size: 15px;
    border: 1px solid #cccccc;
    border-radius: 8px;
    box-sizing: border-box;
    margin-bottom:30px;
}
.sso-login-form {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.sso-sign-in-btn {
    width: 100%;
    padding: 12px 24px;
    background-color: rgb(30, 76, 130);
    color: #ffffff;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    font-family: var(--font-family-figtree, 'Figtree', sans-serif);
    margin-bottom: 10px;
}

    .sso-sign-in-btn:hover {
        background: rgb(60, 106, 160);
    }

.sso-login-card .sso-cancel-btn {
    width: 100%;
    padding: 12px 24px;
    background: #ffffff;
    color: #194270;
    border: 1px solid rgba(20, 29, 58, 1);
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    font-family: var(--font-family-figtree, 'Figtree', sans-serif);
}

.sso-login-card .sso-cancel-btn:hover {
    background: rgba(20, 29, 58, 0.08);
}

.sso-login-card .validationSummary {
    width: 100%;
    color: rgb(220, 53, 69);
    font-size: 14px;
    margin-bottom: 8px;
    font-family: Arial, sans-serif;
    font-size: 15px;
    font-weight: normal;
}

.sso-login-card .validationSummary ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.PrivacyPolicy {
    position: absolute;
    height: 24px;
    left: 50px;
    top: 3px;
    width: 100px;
    color: #ffffff;
    cursor: pointer;
    font-family: Arial;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.1px;
    color: white;
    flex: none;
    order: 0;
    flex-grow: 0;
    margin: 0px 40px 0px 15px;
    top:0px;
}
.TermsOfUse {
    position: absolute;
    height: 24px;
    left: 230px;
    color: #ffffff;
    width: 400px;
    top:0px;
    cursor: pointer;
    font-family: Arial;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.1px;
    color: white;
    flex: none;
    order: 1;
    flex-grow: 0;
    margin: 0px 40px 0px 25px;
}
.policy-table {
    top: 450px;
    position: absolute;
    height: 100px;
    left: 0px;
    width: 500px;
}
.Footer {
    position: absolute;
    left: 0px;
    top:30px;
    height: 24px;
    color: #ffffff;
    font-family: Arial;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.1px;
    color: white;
    flex: none;
    order: 1;
    flex-grow: 0;
    width:600px;
}

