/* */
/* banner icon wrp */

#scroll-section-0 .banner-dsc-wrp .banner-icon-wrp svg {
    width: var(--systemSpacing-80);
}

/* */
/* banner title */

.banner-tl-xlg {
    font-size: var(--d1-fontSize);
    color: var(--systemPrimary);
    text-align: center;
}

.banner-tl-lg-first-wrp {
    position: relative;
    top: -5vh;
    z-index: 5000;
    
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--systemSpacing-28);
    justify-content: center;
}

.banner-tl-lg-first-wrp .icon-wrp {
    display: block;
}

.banner-tl-lg-first-wrp .icon-wrp svg {
    width: var(--systemSpacing-120);
}


/* */
/* section title */

.section-tl-md {
    font-size: var(--d3-fontSize);
    color: var(--systemPrimary);
    font-weight: 600;
}


/**/
/* section description */

.section-dsc-md {
    font-size: var(--h5-fontSize);
    font-weight: 400;
    color: var(--systemSecondary);
    line-height: 135%;
}

/**/
/**/

.banner-tl-lg {
    font-size: var(--d2-fontSize);
    color: var(--systemPrimary);
    font-weight: 400;
}

.banner-tl-md {
    font-size: var(--h1-fontSize);
    color: var(--systemPrimary);
    font-weight: 600;
}

.banner-tl-sm {
    font-size: var(--h2-fontSize);
    color: var(--systemPrimary);
    font-weight: 600;
}


/* */
/* banner subtitle*/

.banner-sub-tl-lg {
    font-size: var(--h3-fontSize);
    color: var(--systemSecondary);
    font-weight: 500;
}

.banner-sub-tl-md {
    font-size: var(--h4-fontSize);
    color: var(--systemSecondary);
    font-weight: 500;
}

.banner-sub-tl-sm {
    font-size: var(--h5-fontSize);
    color: var(--systemPrimary);
    margin-bottom: var(--systemSpacing-12);
}


/* */
/* banner description */

.banner-dsc-lg {
    font-size: var(--h1-fontSize);
    color: var(--systemPrimary);
    font-weight: 400;
    line-height: 130%;
}

.banner-dsc-md {
    font-size: var(--h5-fontSize);
    font-weight: 400;
    color: var(--systemSecondary);
    line-height: 135%;
}

.banner-dsc-sm {
    font-size: var(--ph-fontSize);
    color: var(--systemPrimary);
    font-weight: 400;
}


/* */
/* card front and back text */

.card-front-tl, .card-back-tl {
    font-size: var(--h5-fontSize);
    font-weight: 600;
    line-height: 135%;
}

.card-front-subtl, .card-back-subtl {
    font-size: var(--hl-fontSize);
    color: var(--systemSecondary);
    font-weight: 400;
    margin-bottom: var(--systemSpacing-4);
}

.card-back-dsc {
    font-size: var(--hl-fontSize);
    color: var(--systemPrimary);
    font-weight: 400;
    line-height: 150%;
}


/* */
/* card small front and back text */

.card-sm-front-tl, .card-sm-back-tl {
    font-size: var(--h6-fontSize);
    font-weight: 600;
    line-height: 135%;
}

.card-sm-front-dsc, .card-sm-back-dsc {
    display: block;
    font-size: var(--ph-fontSize);
    font-weight: 400;
    line-height: 135%;
    width: 80%;
}


/* */
/* text colour bold and align*/

/* black */

.systemPrimary {
    color: var(--systemPrimary);
}

.systemSecondary {
    color: var(--systemSecondary);
}

.systemTertiary {
    color: var(--systemTertiary);
}

.systemQuaternary {
    color: var(--systemQuaternary);
}

.word-break {
    word-break: keep-all;
}

/* white */

.systemWhite {
    color: var(--systemWhite);
}

.systemWhite-secondary {
    color: var(--systemWhite-secondary);
}


/* */
/* text bold */

.txt-b-600 {
    font-weight: 600;
}

.txt-b-500 {
    font-weight: 500;
}

.txt-b-400 {
    font-weight: 400;
}

.txt-align-c {
    text-align: center;
}


/* */
/* highlight text */

.highlight-dsc-lg {
    font-size: var(--h2-fontSize);
    color: var(--systemPrimary);
    font-weight: 600;
}

.tech-highlight-dsc-md {
    font-size: var(--h6-fontSize);
    color: var(--systemPrimary);
    font-weight: 600;
    line-height: 150%;

    max-width: var(--systemSpacing-1200);
    text-align: center;
}

.highlight-dsc-md {
    font-size: var(--hl-fontSize);
    color: var(--systemSecondary);
    font-weight: 600;
    line-height: 150%;
}

.tech-highlight-dsc-lg {
    margin-bottom: var(--systemSpacing-20);
}


/* */
/* key function */

.key-function-highlight-sub-tl-md {
    display: none;
}

.key-function-list {
    font-size: var(--ph-fontSize);
    font-weight: 600;
    color: var(--systemTertiary);
    cursor: pointer;
    border-bottom: var(--systemSpacing-1) solid var(--systemTertiary);
}

.key-function-list:hover {
    color: var(--systemSecondary);
    border-bottom: var(--systemSpacing-1) solid var(--systemSecondary);
}

.key-function-list.selected {
    color: var(--systemPrimary);
    font-weight: 600;
}

.bento-txt-tl {
    font-size: var(--hl-fontSize);
    color: var(--systemPrimary);
    font-weight: 600;
    line-height: 135%;
    margin-bottom: var(--systemSpacing-8);
}

.bento-txt-md {
    font-size: var(--ph-fontSize);
    color: var(--systemSecondary);
    font-weight: 600;
    line-height: 150%;
}

.polymorph {
    stroke-width: var(--systemSpacing-1);
    stroke: var(--systemTertiary);
}


/* */
/* scroll section 3 banner */


/* */
/* tab-nav */

.tab-nav {
    margin-bottom: var(--systemSpacing-80);
    max-width: 100%;
}

.job-tl {
    font-size: var(--ch-fontSize);
    font-weight: 500;
    text-align: center;
    color: var(--systemSecondary);
}


/* */
/* marquee */

.marquee-ctnr {
    margin-bottom: var(--systemSpacing-180);
}

.marquee-sub-tl {
    font-size: var(--ch-fontSize);
    color: var(--systemTertiary);
    font-weight: 600;
}

.marquee-utterance {
    font-size: var(--h6-fontSize);
    color: var(--systemPrimary);
    font-weight: 600;
    line-height: 135%;
}


/* */
/* marquee text colour */

.marquee-marketer {
    color: #804EFE;
}

.marquee-developer {
    color: #006aff;
}

.marquee-data-scientist {
    color: #4DA3F9;
}

.marquee-financial-analyst {
    color: #F43F55;
}

.marquee-healthcare-professional {
    color: #10A48A;
}

.marquee-educator {
    color: #F97659;
}

.marquee-researcher {
    color: #D03584
}


/* */
/* banner */

.banner-in-tl-md {
    font-size: var(--d2-fontSize);
    color: var(--systemSecondary);
    font-weight: 600;
}

.banner-in-dsc-md {
    font-size: var(--h4-fontSize);
    color: var(--systemSecondary);
    font-weight: 400;
}


/**/
/**/

.outro-banner-txt-wrp .section-tl-md {
    text-align: center;
}

.outro-banner-txt-wrp .section-dsc-md {
    text-align: center;
}

.outro-banner-link {
    font-size: var(--hl-fontSize);
    color: var(--systemWhite);
    background-color: var(--systemPrimary);
    padding: var(--systemSpacing-12) var(--systemSpacing-24);
    border-radius: var(--systemSpacing-200);
}

.outro-banner-link:hover {
    opacity: 90%;
}


/* */
/* */

@media screen and (max-width: 1294px) {
    
    /* */
    /* section title */


    /* */
    /* section description */


    /**/
    /**/

    .banner-tl-lg-first-wrp .icon-wrp svg {
        width: var(--systemSpacing-80);
    }

    .banner-tl-lg {
        font-size: var(--h1-fontSize);
    }

    .banner-sub-tl-sm {
        font-size: var(--h6-fontSize);
        color: var(--systemPrimary);
        margin-bottom: var(--systemSpacing-8);
    }

    .banner-dsc-md {
        font-size: var(--h6-fontSize);
    }

    .banner-tl-lg-first-wrp {
        gap: var(--systemSpacing-16);
    }


    /* */
    /* banner in text */

    /* .banner-in-tl-md {
        font-size: var(--h1-fontSize);
    } */
    
    .banner-in-dsc-md {
        font-size: var(--hl-fontSize);
    }

    /* */
    /* card */

    /* */
    /* card front text */

    .card-front-tl, .card-back-tl {
        font-size: var(--h5-fontSize);
    }
    
    .card-front-subtl, .card-back-subtl {
        font-size: var(--hl-fontSize);
    }

    .card-back-dsc {
        font-size: var(--hl-fontSize);
    }


    /**/
    /**/

    .bento-txt-tl {
        font-size: var(--ph-fontSize);
    }

    .bento-txt-md {
        font-size: var(--p-fontSize);
    }

    .tech-highlight-dsc-md {
        font-size: var(--hl-fontSize);
    }

    .highlight-dsc-md {
        font-size: var(--ph-fontSize);
    }
}


@media screen and (max-width: 960px) {

    .banner-tl-lg {
        font-size: var(--h2-fontSize);
    }

    .banner-sub-tl-sm {
        font-size: var(--hl-fontSize);
        color: var(--systemPrimary);
    }

    .banner-tl-lg-first-wrp .icon-wrp svg {
        width: var(--systemSpacing-80);
    }

    .banner-dsc-lg {
        font-size: var(--h3-fontSize);
    }


    /* */
    /* banner icon wrp */

    #scroll-section-0 .banner-dsc-wrp .banner-icon-wrp svg {
        width: var(--systemSpacing-60);
    }


    /* */
    /* marquee */

    .marquee-ctnr {
        margin-bottom: var(--systemSpacing-120);
    }

    .marquee-utterance {
        font-size: var(--hl-fontSize);
    }


    /* */
    /* card */

    .card-front-tl, .card-back-tl {
        font-size: var(--h6-fontSize);
    }

    .card-front-subtl, .card-back-subtl {
        font-size: var(--p-fontSize);
    }

    .card-back-dsc {
        font-size: var(--p-fontSize);
    }

    .card-sm-front-dsc, .card-sm-back-dsc {
        font-size: var(--p-fontSize);
    }


    /* */
    /* key function */

    .key-function-highlight-sub-tl-md {
        display: block;
        font-size: var(--ph-fontSize);
        color: var(--systemPrimary);
        font-weight: 600;
    }


    /* */
    /* banner in text */

    .banner-in-tl-md {
        font-size: var(--h2-fontSize);
    }


    /* */
    /* */

    .section-tl-md {
        font-size: var(--h2-fontSize);
    }

    .video-banner-txt-wrp .section-dsc-md {
        font-size: var(--hl-fontSize);
    }


    /* */
    /* */

    .outro-banner-link {
        font-size: var(--ph-fontSize);
    }

    .outro-banner-txt-wrp .section-dsc-md {
        font-size: var(--hl-fontSize);
    }
}


@media screen and (max-width: 600px) {

    /* */
    /* section title */

    .section-tl-md {
        font-size: var(--h5-fontSize);
    }


    /* */
    /* section description */

    .section-dsc-md {
        font-size: var(--ph-fontSize);
    }


    /* */
    /* banner title */

    .banner-tl-lg {
        font-size: var(--h3-fontSize);
    }

    .banner-sub-tl-sm {
        font-size: var(--ph-fontSize);
        color: var(--systemPrimary);
        margin-bottom: var(--systemSpacing-4);
    }

    .banner-tl-md {
        font-size: var(--h5-fontSize);
    }

    .banner-dsc-sm {
        font-size: var(--p-fontSize);
    }

    .banner-tl-lg-first-wrp {
        gap: var(--systemSpacing-12);
    }

    .banner-tl-lg-first-wrp .icon-wrp svg {
        width: var(--systemSpacing-60);
    }


    /* */
    /* banner icon wrp */

    #scroll-section-0 .banner-dsc-wrp .banner-icon-wrp svg {
        width: var(--systemSpacing-48);
    }


    /**/
    /* banner dsc */

    .banner-dsc-lg {
        font-size: var(--h5-fontSize);
    }

    .banner-dsc-md {
        font-size: var(--ph-fontSize);
    }


    /* */
    /* marquee tab navigation */

    .marquee-utterance {
        font-size: var(--ph-fontSize);
    }


    /* */
    /* card */

    /* */
    /* card front text */

    .card-front-tl, .card-back-tl {
        font-size: var(--hl-fontSize);
    }

    .card-front-subtl, .card-back-subtl {
        font-size: var(--p-fontSize);
    }


    .card-sm-front-tl, .card-sm-back-tl {
        font-size: var(--hl-fontSize);
    }


    /**/
    /* tech bento */

    .highlight-dsc-lg {
        font-size: var(--h4-fontSize);
        text-align: center;
    }

    .tech-highlight-dsc-md {
        font-size: var(--ph-fontSize);
    }

    .highlight-dsc-md {
        font-size: var(--p-fontSize);
    }

    .bento-txt-tl {
        font-size: var(--p-fontSize);
    }

    .bento-txt-md {
        font-size: var(--p-fontSize);
    }

    .card-sm-front-dsc, .card-sm-back-dsc {
        width: 90%;
    }
    
    
    /* */
    /* banner in text */
    
    .banner-in-tl-md {
        font-size: var(--h3-fontSize);
    }


    /* */
    /* video text */

    .video-banner-txt-wrp .section-tl-md {
        font-size: var(--h6-fontSize);
    }

    .video-banner-txt-wrp .section-dsc-md {
        font-size: var(--ph-fontSize);
    }


    /* */
    /* */

    .outro-banner-txt-wrp .section-dsc-md {
        font-size: var(--ph-fontSize);
    }

    .outro-banner-link {
        font-size: var(--ph-fontSize);
    }
}