#main-content{
    position: relative;
    z-index: 0;

    overflow: hidden;

    background-color: #5000B8;
}

.iel-jornada-container {
    width: 100%;
    max-width: 1216px;
    margin: 0 auto;
}

#main-content .iel-jornada-header {
    position: relative;
    z-index: 7;

    color: #fff;

    background: rgb(67 1 166 / 50%);
}

#main-content .iel-jornada-header .iel-jornada-container{
    box-sizing: border-box;
    display: grid;

    grid: auto / 4fr 8fr;
    grid-gap: 0;

    justify-content: flex-end;
    justify-content: center;

    padding: 96px;
}

#main-content .iel-jornada-header .iel-jornada-container .iel-jornada-header__column {
    position: relative;    
}

#main-content .iel-jornada-header .iel-jornada-container .iel-jornada-header__column:nth-child(2){
    padding: 0 0 0 64px;
}

.iel-jornada-header__column-line {
    position: absolute;
    top: -4px;
    left: 20px;

    display: flex;

    justify-content: center;

    width: 1px;
    height: 690px;

    background: #fff;
}

.iel-jornada-header__column-line::before,
.iel-jornada-header__column-line::after {
    position: absolute;
    left: -3px;

    width: 9px;
    height: 9px;

    content: '';

    background: #fff;
    border-radius: 50%;
}

.iel-jornada-header__column-line::before {
    top: 0;
}

.iel-jornada-header__column-line::after {bottom: 0;}

#main-content .iel-jornada-header .iel-jornada-container .iel-jornada-header__column h1{
    margin: 0;

    font-size: 52px;
    font-weight: 400;
    line-height: 1.1em;
    letter-spacing: -2.72px;
}

#main-content .iel-jornada-header .iel-jornada-header__column h2{
    margin: 0;

    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.1em;
    letter-spacing: -1.6px;
}

#main-content .iel-jornada-header .iel-jornada-header__column h3 {
    margin: 0;

    font-size: 32px;
    font-weight: 300;
    line-height: 1.2em;
} 

#main-content .iel-jornada-header__text{
    margin: 16px 0;

    font-size: 16px;
    font-weight: 400;
    line-height: 1.8em;
}

#main-content .iel-jornada-header__text p:first-child {
    margin-top: 0
}

#main-content .iel-jornada-header__text p:last-child {
    margin-bottom: 0;
}

.cont-mobile{   
    display: none;
}

@media screen and (width <= 992px) {
    #main-content > .iel-jornada-header {
        width: 100%;
        margin-bottom: 192px;
    }

    #main-content > .iel-jornada-header .iel-jornada-container{
        display: flex;

        flex-wrap: wrap;

        gap: 32px;

        max-width: 100%;
        padding: 20px;
    }

    .iel-jornada-header__column h1,
    .iel-jornada-header__column h2{
        text-align: right;
    }
    
    #main-content > .iel-jornada-header .iel-jornada-container .iel-jornada-header__column h1,
    #main-content > .iel-jornada-header .iel-jornada-container .iel-jornada-header__column h2{
        font-size: 48px;
        font-weight: 700;
    }

    #main-content .iel-jornada-header .iel-jornada-container .iel-jornada-header__column:nth-child(2) {
        padding: 0 32px 0 0;

        text-align: right;
    }
    
    .cont-mobile{   
        display: block;
    }

    .cont-desk{   
        display: none;
    }

    .iel-jornada-header__column-line {
    top: 10px;
    right: 0;
    left: auto;

    height: 100%;
    max-height: 560px;
}

.iel-jornada-header__column-line::before,
.iel-jornada-header__column-line::after {
    left: -2px;

    width: 5px;
    height: 5px;
}


}

.blocos-jornada-iel{
    position: relative;

    /* overflow: hidden; */

    /* top: -50vh; */
}

.blocos-jornada__section{
    position: inherit;

    display: flex;

    align-items: center;

    width: 100%;
}

.blocos-jornada__section:last-child{
    padding: 0 0 200px;
}

.blocos-jornada-iel__conteudo{
    position: relative;
    z-index: 10;
}

.blocos-jornada__container{
    display: grid;

    grid: auto / 7fr 5fr;
    grid-gap: 0;

    justify-content: flex-end;

    width: 100%;
    max-width: 1216px;
    margin: 0 auto;
}

.blocos-jornada__content{
    position: relative;

    display: flex;

    flex-direction: column;

    gap: 20px;

    align-items: flex-start;

    width: 100%;
    height: auto;
    padding: 96px 40px;
}

.column{
    width: 100%;
    height: 100%;
}

.blocos-jornada__bg-section{
    position: absolute;
    top: 0;

    width: 100%;
    height: 100%;
}

.blocos-jornada__bg-section .blocos-jornada__container {
    height: 100%;
}

.blocos-jornada__bg-section .blocos-jornada__container div:nth-child(2){
    position: relative;

    height: 100%;
}

.blocos-jornada__bg-section .blocos-jornada__container div:nth-child(2)::after{
    display: block;

    width: 300%;
    height: 100%;

    content: "";

    background:rgb(67 1 166 / 50%);
}

.blocos-jornada__header-section p{
    margin: 0;

    font-size: 20px;
    color: var(--ref-color-newton-white);
}

.blocos-jornada__header-section h2 {
    margin: 0;

    font-size: 32px;
    font-weight: 700;
    line-height: 1.2em;
}

.section-academia-talentos h2{color: #CFADFF;}
.section-jovem-aprendiz h2{color: #a8d942;}
.section-trainee h2{color: #00D9E8;}
.section-estagio h2{color: #FFD333;}
.section-bolsista-inovacao h2{color: #FFA525;}



.blocos-jornada__header-section {
    padding: 0;
    margin: 0;
}

.blocos-jornada__text {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8em;
    color: #fff;
}

.blocos-jornada__action a {
    position: relative;

    display: inline-flex;

    gap: 4px;

    align-items: center;
    justify-content: center;

    width: fit-content;
    height: var(--ref-size-sizing-48);
    padding: 0 var(--primitivas-spacing-small-xs) 0
        var(--primitivas-spacing-small-sm);
    overflow: hidden;

    font-size: 16px;
    font-weight: 600;
    line-height: 16px;
    color: #7314ff;
    text-decoration: none;
    letter-spacing: 0;

    /* white-space: nowrap; */
    background-color: #fff;
    border-radius: var(--primitivas-border-radius-xs);
}


.section-img {
    position: fixed;
    top: 0;

    width: 100%;
}

.section-img .blocos-jornada__container{
    grid: auto / 4fr 3fr 5fr;
}

.section-img .blocos-jornada__container div:nth-child(2){
    position: relative;

    display: flex;

    height: 100vh;
}

.section-img .blocos-jornada__container div:nth-child(2) span{
    position: absolute;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;

    /* opacity: 0; */
    transition: opacity ease-in-out .2s;
}

.blocos-jornada__imagens-programas{
    position: relative;
}

.blocos-jornada__imagens-programas span{
    position: fixed;
    top: 100%;

    display: block;

    width: 279px;
    height: 498px; margin-top: -249px;

    pointer-events: none;

    opacity: 0;

    transition: opacity ease .5s, top ease 1s;
}



span.img-academia-talentos{
    background: url("https://novo-dev.sistemafiep.org.br/documents/d/iel-parana/img-academia-talentos") no-repeat center center;
}

span.img-jovem-aprendiz{
    background: url("https://novo-dev.sistemafiep.org.br/documents/d/iel-parana/img-jovem-aprendiz") no-repeat center center;
}

span.img-estagio{
    background: url("https://novo-dev.sistemafiep.org.br/documents/d/iel-parana/img-estagio") no-repeat center center;
}

span.img-trainee{
    background: url("https://novo-dev.sistemafiep.org.br/documents/d/iel-parana/img-trainee") no-repeat center center;
}

span.img-bolsista-inovacao{
    background: url("https://novo-dev.sistemafiep.org.br/documents/d/iel-parana/img-bolsista") no-repeat center center;
}




:root {
    --paragraph-regular-400-normal-md-font-family: "Open Sans", helvetica;
    --paragraph-regular-400-normal-md-font-weight: 400;
    --paragraph-regular-400-normal-md-font-size: 16px;
    --paragraph-regular-400-normal-md-letter-spacing: 0px;
    --paragraph-regular-400-normal-md-line-height: 179.99999523162842%;
    --paragraph-regular-400-normal-md-font-style: normal;
    --heading-bold-700-normal-sm-font-family: "Open Sans", helvetica;
    --heading-bold-700-normal-sm-font-weight: 700;
    --heading-bold-700-normal-sm-font-size: 20px;
    --heading-bold-700-normal-sm-letter-spacing: 0px;
    --heading-bold-700-normal-sm-line-height: 120.00000476837158%;
    --heading-bold-700-normal-sm-font-style: normal;
    --heading-bold-700-normal-xl-font-family: "Open Sans", helvetica;
    --heading-bold-700-normal-xl-font-weight: 700;
    --heading-bold-700-normal-xl-font-size: 32px;
    --heading-bold-700-normal-xl-letter-spacing: 0px;
    --heading-bold-700-normal-xl-line-height: 120.00000476837158%;
    --heading-bold-700-normal-xl-font-style: normal;
    --ref-color-newton-white: rgb(255 255 255 / 100%);
    --ref-color-kahlo-purple-600: rgb(115 20 255 / 100%);
    --sys-color-iel-color-secundary-p: var(--ref-color-kahlo-purple-600);
    --primitivas-spacing-small-sm: 20px;
    --primitivas-spacing-small-xs: 16px;
    --primitivas-border-radius-xs: 4px;
    --ref-size-sizing-48: 48px;

    --ref-color-mendes-green-900: rgb(39 120 0 / 100%);
    --ref-color-mendes-green-800: rgb(87 154 0 / 100%);
    --ref-color-mendes-green-700: rgb(110 173 0 / 100%);
    --ref-color-mendes-green-500: rgb(150 210 0 / 100%);
    --ref-color-oswald-yellow-900: rgb(240 164 0 / 100%);
    --ref-color-oswald-yellow-800: rgb(245 175 0 / 100%);
    --ref-color-oswald-yellow-700: rgb(250 192 0 / 100%);
    --ref-color-oswald-yellow-500: rgb(255 211 51 / 100%);
    --ref-color-verne-cyan-900: rgb(0 107 113 / 100%);
    --ref-color-verne-cyan-800: rgb(6 148 164 / 100%);
    --ref-color-verne-cyan-700: rgb(0 162 183 / 100%);
    --ref-color-verne-cyan-500: rgb(0 209 230 / 100%);
    --ref-color-verne-cyan-400: rgb(0 217 232 / 100%);
    --ref-color-tarsila-orange-900: rgb(212 66 30 / 100%);
    --ref-color-tarsila-orange-800: rgb(226 90 20 / 100%);
    --ref-color-tarsila-orange-700: rgb(241 113 11 / 100%);
    --ref-color-tarsila-orange-500: rgb(255 149 0 / 100%);
    --ref-color-tarsila-orange-400: rgb(255 165 37 / 100%);

    --ref-color-alpha-white-900: rgb(255 255 255 / 90%);
    --ref-color-alpha-white-800: rgb(255 255 255 / 80%);
    --ref-color-alpha-white-700: rgb(255 255 255 / 70%);
    --ref-color-alpha-white-500: rgb(255 255 255 / 50%);


    
}

.iel-jornada__block.academia-talentos .cube .face-front  { background-color: var(--ref-color-alpha-white-900);}
.iel-jornada__block.academia-talentos .cube .face-back   { background-color: var(--ref-color-alpha-white-700);} 
.iel-jornada__block.academia-talentos .cube .face-left   { background-color: var(--ref-color-alpha-white-800);}
.iel-jornada__block.academia-talentos .cube .face-right  { background-color: var(--ref-color-alpha-white-900);}
.iel-jornada__block.academia-talentos .cube .face-top    { background-color: var(--ref-color-alpha-white-500);}
.iel-jornada__block.academia-talentos .cube .face-bottom { background-color: var(--ref-color-alpha-white-500);}
.iel-jornada__block.jovem-aprendiz .cube .face-front  { background-color: var(--ref-color-mendes-green-900);}
.iel-jornada__block.jovem-aprendiz .cube .face-back   { background-color: var(--ref-color-mendes-green-700);} 
.iel-jornada__block.jovem-aprendiz .cube .face-left   { background-color: var(--ref-color-mendes-green-800);}
.iel-jornada__block.jovem-aprendiz .cube .face-right  { background-color: var(--ref-color-mendes-green-900);}
.iel-jornada__block.jovem-aprendiz .cube .face-top    { background-color: var(--ref-color-mendes-green-500);}
.iel-jornada__block.jovem-aprendiz .cube .face-bottom { background-color: var(--ref-color-mendes-green-500);}
.iel-jornada__block.estagio .cube .face-front  { background-color: var(--ref-color-oswald-yellow-900);}
.iel-jornada__block.estagio .cube .face-back   { background-color: var(--ref-color-oswald-yellow-700);} 
.iel-jornada__block.estagio .cube .face-left   { background-color: var(--ref-color-oswald-yellow-800);}
.iel-jornada__block.estagio .cube .face-right  { background-color: var(--ref-color-oswald-yellow-900);}
.iel-jornada__block.estagio .cube .face-top    { background-color: var(--ref-color-oswald-yellow-500);}
.iel-jornada__block.estagio .cube .face-bottom { background-color: var(--ref-color-oswald-yellow-500);}
.iel-jornada__block.trainee .cube .face-front  { background-color: var(--ref-color-verne-cyan-900);}
.iel-jornada__block.trainee .cube .face-back   { background-color: var(--ref-color-verne-cyan-700);} 
.iel-jornada__block.trainee .cube .face-left   { background-color: var(--ref-color-verne-cyan-800);}
.iel-jornada__block.trainee .cube .face-right  { background-color: var(--ref-color-verne-cyan-900);}
.iel-jornada__block.trainee .cube .face-top    { background-color: var(--ref-color-verne-cyan-500);}
.iel-jornada__block.trainee .cube .face-bottom { background-color: var(--ref-color-verne-cyan-500);}
.iel-jornada__block.bolsa-inovacao .cube .face-front  { background-color: var(--ref-color-tarsila-orange-900);}
.iel-jornada__block.bolsa-inovacao .cube .face-back   { background-color: var(--ref-color-tarsila-orange-700);} 
.iel-jornada__block.bolsa-inovacao .cube .face-left   { background-color: var(--ref-color-tarsila-orange-800);}
.iel-jornada__block.bolsa-inovacao .cube .face-right  { background-color: var(--ref-color-tarsila-orange-900);}
.iel-jornada__block.bolsa-inovacao .cube .face-top    { background-color: var(--ref-color-tarsila-orange-500);}
.iel-jornada__block.bolsa-inovacao .cube .face-bottom { background-color: var(--ref-color-tarsila-orange-500);}


.iel-jornada__block .cube .face-front  { background-color: #5D00D6;}
.iel-jornada__block .cube .face-back   { background-color: #5000B8;} 
.iel-jornada__block .cube .face-left   { background-color: #6A00F5;}
.iel-jornada__block .cube .face-right  { background-color: #5000B8;}
.iel-jornada__block .cube .face-top    { background-color: #8533FF;}
.iel-jornada__block .cube .face-bottom { background-color: #7314FF;}
















/* estilos da illustracao */
.iel-jornada__ilustracao{
    position: absolute;
    top: 0;
    left: 50%;

    width: 1920px;
    height: 100%;
    margin-left: -960px;
}

.iel-jornada__ilustracao-mobile{
    display: none;
}

@media screen and (width <= 992px) {
    .iel-jornada__ilustracao-mobile{
        position: absolute;
        top: -410px !important;
        left: 50%;

        display: block;

        width: 800px;
        height: 1000px;
        margin-left: -310px;

        background: url("https://novo-dev.sistemafiep.org.br/documents/d/iel-parana/ilustracao") center top no-repeat;
    }

    .iel-jornada__ilustracao{
        display: none;
    }
}

.iel-jornada__scene {
    position: absolute;
    top: 0;
    z-index: 4;

    width: 1920px;
    height: 100%;
    }

.iel-jornada__construcoes {
    position: absolute;
    top: 0;
    z-index: 6;

    width: 1920px;
    height: 100%;
    margin-top: -270px;
    }

.iel-jornada__construcoes img{
    position:absolute;

    opacity: 0;

    transition: all ease 1s;
    transform: translateY(-50px);
 }
.iel-jornada__construcoes img:nth-child(1){ top:0;left:1262px; }
.iel-jornada__construcoes img:nth-child(2){ top:62px;left:513px; }
.iel-jornada__construcoes img:nth-child(3){ top:357px;left:1033px ; }
.iel-jornada__construcoes img:nth-child(4){ top:476px;left:302px; }
.iel-jornada__construcoes img:nth-child(5){ top:601px;left:1275px; }
.iel-jornada__construcoes img:nth-child(6){ top:897px;left:1094px; }
.iel-jornada__construcoes img:nth-child(7){ top:975px;left:1482px; }
.iel-jornada__construcoes img:nth-child(8){ top:1063px;left:245px; }
.iel-jornada__construcoes img:nth-child(9){ top:1174px;left:1270px; }
.iel-jornada__construcoes img:nth-child(10){ top:1455px;left:385px; }
.iel-jornada__construcoes img:nth-child(11){ top:1509px;left:1179px; }
.iel-jornada__construcoes img:nth-child(12){ top:1525px;left:765px; }
.iel-jornada__construcoes img:nth-child(13){ top:1741px;left:581px; }

.iel-jornada__block {
    position: absolute;
    top: 0;
    left: 50%;

    width: 100px;
    height: 100px;
    margin-top: -50px;
    margin-left: -50px;

    transition: all ease .6s;
    perspective: 9999999999rem;
}

.iel-jornada__block .cube {
    position: relative;

    width: 100px;
    height: 100px;

    transition: transform ease 1s;
    transform: rotateX(-35.3deg) rotateY(-45deg);
    transform-style: preserve-3d;
}

.iel-jornada__block .cube .face {
    position: absolute;

    box-sizing: border-box;

    width: 0;
    height: 0;

    border: 1px solid cyan;
    opacity: .6;

    transition: opacity ease-in .2s, height ease 1s, width ease 1s, transform ease 1s;
}


.iel-jornada__block:hover .cube .face {
    background-color: #6500e9; 
}

#shadow{
    position: absolute;
    top: 0;

    margin-top: -290px;
}

#maskShadow polygon{
    opacity: 0;

    transition: all ease 1.3s;
}

/* Cor e posição de cada face */
.iel-jornada__block .cube .face-front  { background-color: #5D00D6; opacity: .8;

 transform: rotateY(0deg) translateZ(50px) scale(0)}

.iel-jornada__block .cube .face-back   { background-color: #5000B8;

 transform: rotateY(180deg) translateZ(50px) scale(0); }

.iel-jornada__block .cube .face-left   { background-color: #6A00F5;

 transform: rotateY(-90deg) translateZ(50px) scale(0); }

.iel-jornada__block .cube .face-right  { background-color: #5000B8;

 transform: rotateY(90deg) translateZ(50px) scale(0); }

.iel-jornada__block .cube .face-top    { background-color: #8533FF;

 transform: rotateX(90deg) translateZ(50px) scale(0) }

.iel-jornada__block .cube .face-bottom { background-color: #7314FF;

 transform: rotateX(-90deg) translateZ(-50px) scale(0); }

/* Ligacoes entre letras */
.iel-jornada__block .cube.ponte {
    position: relative;

    width: 100px;
    height: 30px;

    transition: transform ease 1s;
    transform: rotateX(-35.3deg) rotateY(-45deg);
    transform-style: preserve-3d;
}

.iel-jornada__block.ponte .cube .face{
    position: absolute;

    box-sizing: border-box;

    width: 0;
    height: 0;

    border: 1px solid #4c00af;
    opacity: 0.5;

    /* border-style: outset; */
    transition: opacity ease-in .2s, height ease 1s, width ease 1s, transform ease 1s;
}

.iel-jornada__block.ponte .cube .face-front  { background-color: #6500e9;

 transform: rotateY(0deg) translateZ(50px) scale(0);}

.iel-jornada__block.ponte .cube .face-back   { background-color: #6A00F5;

 transform: rotateY(180deg) translateZ(50px) scale(0); }

.iel-jornada__block.ponte .cube .face-left   { background-color: #5501c4;

 transform: rotateY(-90deg) translateZ(50px) scale(0); }

.iel-jornada__block.ponte .cube .face-right  { background-color: #4c00af;

 transform: rotateY(90deg) translateZ(50px) scale(0); }

.iel-jornada__block.ponte .cube .face-top    { background-color: #6A00F5;

 transform: rotateX(90deg) translateZ(50px) scale(0) }

.iel-jornada__block.ponte .cube .face-bottom { background-color: #6A00F5;

 transform: rotateX(-90deg) translateZ(50px) scale(0); }


svg#grid{
    position: absolute;
    top: -540px;
    z-index: 4;

    width: 1920px;
    height: 2000px;
    margin-top: 243px;
    margin-left: -29px;
    overflow: visible;

    pointer-events: none;

    transform: rotateX(55deg) rotateZ(45deg) scale(.985);
    transform-style: preserve-3d;
}

.grid-item{
    fill:none;
    stroke:none;
    stroke-miterlimit:10;
    stroke-width:1;
}

#base-caminho{
    fill:none;
    stroke:rgb(255 255 255 / 50%);
    stroke-width:80px;
}

.inicioCaminho{
    fill:none;
    stroke:#fff;
    stroke-miterlimit:10;
    stroke-width:80px;

    transition: all ease 1s;
}

#caminho{
    fill:none;
    stroke:#fff;
    stroke-miterlimit:10;
    stroke-width:80px;

    transition: all ease 1s;
    
}

.linha-traco,
#linha-traco{
    fill: none;
    stroke:white;
    stroke-dasharray:12,12;
    stroke-width:2;
}

#caminho-carro{
    fill: none;
    stroke: none;
}

#carroCanvas{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;

    margin-top: -270px;

    opacity: 0;

    transition: opacity ease 1s;
}

.iel-jornada__content-carro{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;

    width: 1920px;
    height: 100%;
}

.mask polygon{
    fill:#fff;

    transition: all ease 1s;
}

.grid-item {
    opacity: 0.6;

    fill: #BDD4EB;
    stroke: #BA91FF;
    stroke-miterlimit: 10;
}




@media only screen and (width <= 992px) {
    .blocos-jornada-iel {
        padding-bottom: 96px
    }

    .blocos-jornada-iel__conteudo {
        display: flex;

        flex-direction: column;

        gap: 96px;

        padding: 0 20px;
    }

    .blocos-jornada__section,
    .blocos-jornada__section:last-child{
        position: relative;

        box-sizing: border-box;

        padding: 64px 20px;
    }

    .blocos-jornada__bg-section {
        left: 0;

        background: linear-gradient(270deg, rgb(80 0 184 / 70%) 0%, rgb(80 0 184 / 70%) 66%, rgb(80 0 184 / 0%) 100%);
    }
    
    .blocos-jornada__container {
        display: block;
    }

    .blocos-jornada__imagens-programas span {
        position: relative;
        top: 0 !important;
        left: 0 !important;

        width: 320px;
        height: 375px;
        margin: 0 auto;

        background-position: center;
        background-size: contain;
        opacity: 1 !important;
    }

    .blocos-jornada__content {
        gap: 32px;

        padding: 32px 0 0;
    }

    .blocos-jornada__header-section p {
        font-size: 16px;
    }

    .blocos-jornada__header-section h2 {
        font-size: 24px;
    }

    .blocos-jornada__action {
        display: flex;

        justify-content: center;

        width: 100%;
    }
}