:root { --color-primary: #110F2B; --color-secondary: #E9561C; --color-thirdy: #F4F4F9; --color-fourthy: #512EAB; --color-fifthy: #E5E5E5; --color-background-header: #110F2B; --color-background: #3A2856; --color-traducao: #1d1b36; --color-text: #333333; --color-white: #ffffff; --color-black: #000000; --font-family: 'Sora', sans-serif; --font-size-base: 16px; } /*Reset*/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline; font-family: var(--font-family); } html { scroll-behavior: smooth; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; overflow-x: hidden; font-family: var(--font-family); } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; } table { border-collapse: collapse; border-spacing: 0; } .reset { clear: both; } .clearfix::after { display: block; clear: both; content: ""; } *, *::after, *::before { margin: 0; padding: 0; box-sizing: border-box; } * { outline: none; } /*Fim Reset*/ /*Estilos Padrão*/ .light { font-weight: 300; } .bold__italic { font-weight: 700; font-style: italic; } .Ebold__italic { font-weight: 800; font-style: italic; } .medium { font-weight: 500; } .bold { font-weight: 700; } .Ebold { font-weight: 800; } b, strong { font-weight: 700; } .container { width: 90%; max-width: 1280px; margin: 0 auto; } button { font-family: var(--font-family); } .traducao { background: var(--color-traducao); color: var(--color-white); box-sizing: border-box; padding: 10px 24px; border-radius: 50px; display: flex; align-items: center; gap: 8px; cursor: pointer; border: none; font-weight: 400; font-size: 14px; line-height: 140%; text-transform: uppercase; transition: .4s ease all; position: relative; margin-left: 24px; } .traducao:before { content: ""; width: 1px; height: 39px; background: var(--color-white); position: absolute; top: 0px; left: -28px; } .traducao i { font-size: 18px; } .traducao.interna { top: 105px; position: absolute; right: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; } #dropdown-idiomas { border: none; background: transparent; color: var(--color-white); } #dropdown-idiomas option { background: var(--color-traducao); color: var(--color-white); } .menu-toggle svg path { fill: #fff; } .menu-toggle svg { width: 40px; } .menu-toggle, .menu-close { font-size: 40px; color: var(--color-white); cursor: pointer; border: none; background: transparent; } .menu-close { font-size: 24px; } #btnTopo { position: fixed; bottom: 95px; right: 30px; background-color: var(--color-primary); color: #fff; border: none; border-radius: 50%; width: 55px; height: 55px; font-size: 22px; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25); opacity: 0; pointer-events: none; transform: translateY(20px); transition: all 0.3s ease; z-index: 9999; } #btnTopo.show { opacity: 1; pointer-events: auto; transform: translateY(0); } #btnTopo:hover { background-color: var(--color-fourthy); transform: scale(1.05); } #btnTopo:focus { outline: 2px solid #fff; outline-offset: 3px; } #btnTopo svg path { fill: #fff; } #btnTopo svg { width: 32px; } .erro-msg { display: none; color: #d9534f; font-size: 0.9rem; margin-top: 4px; } .iti input.iti__tel-input, .iti input.iti__tel-input[type=text], .iti input.iti__tel-input[type=tel] { padding: 8px 8px 4px 8px; } /*Fim Estilos Padrão*/ /*Tipografia*/ small { font-weight: 300; font-size: 14px; line-height: 130%; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 32px; display: block; } small.secondary { color: var(--color-secondary); } small.white { color: var(--color-white); } h2 { font-weight: 300; font-size: 31px; line-height: 130%; color: var(--color-primary); } h2 span { font-weight: 600; font-size: 31px; line-height: 130%; } h2.white { color: var(--color-white); } /*Fim Tipografia*/ /*Botões*/ .btn-outline { width: max-content; box-sizing: border-box; border-radius: 30px; border: solid 1px var(--color-fourthy); padding: 12px 24px; display: flex; justify-content: center; align-items: center; font-weight: 400; font-size: 10px; line-height: 140%; text-decoration: none; color: var(--color-primary); transition: .4s ease all; cursor: pointer; } .btn-outline:hover { background: var(--color-fourthy); color: #FFFFFF; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25); transform: scale(1.1); } .btn-primary { width: max-content; border-radius: 30px; box-sizing: border-box; padding: 10px 32px; background: var(--color-secondary); color: var(--color-white); border: solid 1px var(--color-secondary); cursor: pointer; display: block; transition: .4s ease all; text-decoration: none; } .btn-primary:hover { border: solid 1px var(--color-secondary); background: var(--color-white); color: var(--color-secondary); box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25); transform: scale(1.1); } .btn-secondary { width: max-content; border-radius: 30px; box-sizing: border-box; padding: 10px 32px; background: transparent; color: var(--color-white); border: solid 1px var(--color-secondary); cursor: pointer; display: block; transition: .4s ease all; text-decoration: none; } .btn-secondary:hover { border: solid 1px var(--color-secondary); background: var(--color-secondary); box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25); transform: scale(1.1); } /*Fim Botões*/ /*Header*/ header { width: 100%; background: var(--color-background-header); display: flex; align-items: center; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25); box-sizing: border-box; padding: 54px 0 60px; } header .container{ max-width: 1560px; } .menu-toggle, .menu-close { display: none; } header .header-content { display: flex; justify-content: space-between; align-items: center; } header .nav-menu ul { display: flex; align-items: center; gap: 32px; } header .nav-menu ul li .link-nav { text-decoration: none; color: var(--color-white); font-size: 14px; font-weight: 400; transition: .4s ease all; cursor: pointer; } header .nav-menu ul li .link-nav:hover { color: var(--color-secondary); } header .nav-menu ul li .link-nav:hover .btn-secondary:hover { color: var(--color-white); } header .btn-secondary { padding: 10px 24px; font-size: 14px; font-weight: 400; } /*Fim Header*/ /*Section Banner*/ section.banner { background: var(--color-background-header); } section.banner .content-banner { display: flex; align-items: center; } section.banner .content-banner .text-banner { width: 50%; min-height: 700px; border: solid 1px var(--color-fourthy); border-left: none; box-sizing: border-box; padding: 180px 60px 80px; border-top-right-radius: 500px; border-bottom-right-radius: 500px; } section.banner .content-banner .text-banner .desc-banner { max-width: 610px; margin: 0 auto; } section.banner .content-banner .text-banner .title { font-weight: 300; font-size: 46px; line-height: 130%; color: var(--color-white); } section.banner .content-banner .text-banner .title span { font-weight: 600; } section.banner .content-banner .text-banner p { font-weight: 300; font-size: 16px; line-height: 150%; color: var(--color-white); margin-bottom: 32px; } section.banner .content-banner .img-banner { width: 50%; min-height: 700px; } section.banner .content-banner .img-banner img { max-width: 100%; height: 700px; border-top-left-radius: 500px; border-bottom-left-radius: 500px; object-fit: cover; } section.banner .content-banner .group__btns { display: flex; align-items: center; gap: 16px; } section.banner .content-banner .group__btns a { padding: 16px 32px; } section.banner .desc-banner { max-width: 610px; margin: 0 0 0 auto; } section.banner .group__btns { display: flex; align-items: center; gap: 16px; } /*Fim Section Banner*/ /*Section SobreAM4*/ section.sobre-am4 { background: var(--color-background-header); position: relative; padding: 220px 0 330px; } section.sobre-am4 .content-sobre { display: flex; align-items: center; justify-content: center; gap: 80px; margin-left: -100px; } section.sobre-am4 .content-sobre .title { font-weight: 400; font-size: 30px; line-height: 130%; color: var(--color-white); max-width: 368px; text-align: right; } section.sobre-am4 .content-sobre .subtitle { font-weight: 400; font-size: 46px; line-height: 110%; color: var(--color-white); max-width: 304px; } section.sobre-am4 .content-sobre .subtitle span { color: var(--color-secondary) } /*Fim Section SobreAM4*/ /*Section Sobre*/ section.sobre { background: var(--color-thirdy); position: relative; padding-top: 112px; padding-bottom: 176px; } section.sobre::before { content: ""; position: absolute; top: -120px; left: 0; width: 100%; height: 125px; background: var(--color-thirdy); clip-path: ellipse(54% 100% at 50% 100%); bottom: 0; } section.sobre .content-sobre { display: flex; align-items: center; justify-content: center; } section.sobre .content-sobre .img-sobre { width: 45%; height: 565px; position: relative; } section.sobre .content-sobre .img-sobre img { width: 100%; position: relative; height: 100%; object-fit: cover; object-position: right center; border-top-right-radius: 500px; border-bottom-right-radius: 500px; } section.sobre .content-sobre .text-sobre { width: 55%; min-height: 565px; border: solid 1px var(--color-fourthy); border-right: none; box-sizing: border-box; padding: 130px 190px 98px 190px; border-top-left-radius: 500px; border-bottom-left-radius: 500px; position: relative; } section.sobre .content-sobre .text-sobre:before { content: ""; width: 38px; height: 38px; background: var(--color-secondary); position: absolute; bottom: -10px; right: 78%; border-radius: 50%; z-index: 1; } body.escala-125 section.sobre .content-sobre .text-sobre:before { bottom: 10px; } section.sobre .content-sobre .content-sobre-text { max-width: 406px; } section.sobre .content-sobre .content-sobre-text .title { font-weight: 600; font-size: 31px; line-height: 130%; color: var(--color-primary); margin-bottom: 24px; } section.sobre .content-sobre .content-sobre-text p { font-weight: 300; font-size: 16px; line-height: 150%; color: var(--color-primary); } section.sobre .content-sobre .content-sobre-text p.medium { font-weight: 500; } section.sobre .content-sobre .content-sobre-text p:not(:last-child) { margin-bottom: 24px; } /*Fim Section Sobre*/ /*Section Nosso Propósito*/ section.proposito { background: var(--color-thirdy); position: relative; padding-top: 110px; } section.proposito::before { content: ""; position: absolute; top: -120px; left: 0; width: 100%; height: 125px; background: var(--color-thirdy); clip-path: ellipse(54% 100% at 50% 100%); bottom: 0; } section.proposito .container { display: flex; align-items: center; gap: 90px; justify-content: center; } section.proposito .content-proposito { max-width: 345px; } section.proposito .content-proposito .title { font-weight: 600; font-size: 31px; line-height: 130%; color: var(--color-primary); margin-bottom: 24px; } section.proposito .content-proposito p { font-weight: 300; font-size: 16px; line-height: 150%; color: var(--color-primary); } section.proposito .container-propositos { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px 20px; } section.proposito .container-propositos .item-proposito { box-sizing: border-box; padding: 36px 32px; background: var(--color-white); border-radius: 32px; box-shadow: 8px 8px 24px 0px #00000014; max-width: 305px; min-height: 205px; display: flex; align-items: center; flex-direction: column; justify-content: center; } section.proposito .container-propositos .item-proposito .icons-propositos { display: flex; gap: 24px; color: var(--color-fourthy); font-size: 24px; margin-bottom: 24px; align-self: baseline; } section.proposito .container-propositos .item-proposito .title { font-weight: 400; font-size: 20px; line-height: 130%; color: var(--color-primary); } section.proposito .education-for-all { box-sizing: border-box; padding: 57px 118px; background: var(--color-background); border-radius: 150px; max-width: 1060px; margin: 110px auto 0; top: 0px; position: relative; z-index: 1; } section.proposito .education-for-all .container { width: 100%; display: flex; align-items: center; gap: 108px; } section.proposito .education-for-all .container .img-education img { max-width: 100%; } section.proposito .education-for-all .container .content-education .title { font-weight: 400; font-size: 31px; line-height: 140%; color: var(--color-white); } section.proposito .education-for-all .container .content-education .title span { background: linear-gradient(90deg, #8A38F5 0%, rgba(138, 56, 245, 0) 100%); border-radius: 12px; box-sizing: border-box; padding: 2px 0 4px 12px; } /*Fim Nosso Propósito*/ /*Section Nosso Jeito*/ section.nosso-jeito { background: var(--color-primary); position: relative; padding-top: 232px; } section.nosso-jeito::before { content: ""; position: absolute; top: -120px; left: 0; width: 100%; height: 125px; background: var(--color-primary); clip-path: ellipse(54% 100% at 50% 100%); bottom: 0; } section.nosso-jeito .content-nosso-jeito .title { font-weight: 600; color: var(--color-white); text-align: center; margin-bottom: 24px; } section.nosso-jeito .content-nosso-jeito p { font-weight: 300; font-size: 16px; line-height: 150%; color: var(--color-white); text-align: center; margin: 0 auto 45px; max-width: 1032px; } section.nosso-jeito .container-nosso-jeito { display: grid; gap: 24px; grid-template-columns: repeat(3,1fr); } section.nosso-jeito .item-nosso-jeito { box-sizing: border-box; padding: 48px 48px 80px; background: var(--color-fourthy); border-radius: 32px; } section.nosso-jeito .item-nosso-jeito .title { font-weight: 400; font-size: 24px; line-height: 130%; color: var(--color-white); margin-bottom: 16px; } section.nosso-jeito .item-nosso-jeito p { font-weight: 300; font-size: 16px; line-height: 150%; color: var(--color-white); } section.nosso-jeito .item-nosso-jeito i { font-size: 40px; color: var(--color-white); margin-bottom: 24px; } /*Fim Section Nosso Jeito*/ /*Section Cases de Sucesso*/ section.cases-de-sucesso { background: var(--color-primary); position: relative; display: flex; flex-direction: column; } section.cases-de-sucesso .title { font-weight: 600; font-size: 31px; color: var(--color-white); text-align: center; margin-bottom: 140px; padding-top: 190px; } section.cases-de-sucesso .content-item-case { width: 100%; display: flex; gap: 70px; align-items: center; position: relative; } section.cases-de-sucesso .content-item-case:nth-child(odd):before { content: ''; position: absolute; right: 0; top: -60px; width: 832px; height: 552px; border-top-left-radius: 500px; border-bottom-left-radius: 500px; background: linear-gradient(270deg, rgba(81, 46, 171, 0.15) 0%, #512EAB 100%); } section.cases-de-sucesso .content-item-case:nth-child(even):before { content: ''; position: absolute; left: 0; top: -60px; width: 832px; height: 552px; border-top-right-radius: 500px; border-bottom-right-radius: 500px; background: linear-gradient(90deg, #8A38F5 0%, rgba(81, 46, 171, 0.15) 100%); } section.cases-de-sucesso .content-item-case:not(:last-child) { margin-bottom: 160px; } section.cases-de-sucesso .content-item-case:nth-child(even) { justify-content: flex-start; } section.cases-de-sucesso .content-item-case:nth-child(odd) { justify-content: flex-end; } section.cases-de-sucesso .content-item-case .img-case img { max-width: 100%; } section.cases-de-sucesso .content-item-case .img-case:nth-child(1) { padding-left: 100px; z-index: 1; } section.cases-de-sucesso .content-item-case .img-case:nth-child(2) { padding-right: 100px; z-index: 1; } section.cases-de-sucesso .content-item-case .text-case { max-width: 345px; } section.cases-de-sucesso .content-item-case .text-case img { margin-bottom: 32px; } section.cases-de-sucesso .content-item-case .text-case p { font-weight: 300; font-size: 16px; line-height: 150%; letter-spacing: 0%; color: var(--color-white); margin-bottom: 24px; } section.cases-de-sucesso .content-item-case .text-case a { padding: 16px 32px; font-weight: 400; } section.cases-de-sucesso .content-item-case .text-case a i { margin-left: 10px; } .venha-trabalhar-conosco { position: relative; z-index: 1; background: var(--color-background); max-width: 1060px; margin: 180px auto 0; border-radius: 32px; box-sizing: border-box; padding: 80px 60px; } .venha-trabalhar-conosco .container { width: 100%; display: flex; gap: 60px; } .content-trabalhe-conosco:nth-child(1) { max-width: 380px; } .content-trabalhe-conosco .titleH2 { font-weight: 600; font-size: 31px; margin-bottom: 24px; } .content-trabalhe-conosco .subtitleH3 { font-weight: 400; font-size: 24px; line-height: 130%; margin-bottom: 24px; color: var(--color-white); } .content-trabalhe-conosco p { font-weight: 300; font-size: 16px; line-height: 150%; color: var(--color-white); } .content-trabalhe-conosco ul { list-style-type: disc; padding-inline-start: 16px; margin-bottom: 32px; } .content-trabalhe-conosco ul li { font-family: Sora; font-weight: 500; font-size: 16px; line-height: 140%; color: var(--color-white) } .content-trabalhe-conosco ul li:not(:last-child) { margin-bottom: 16px; } .content-trabalhe-conosco a { display: inline-block; text-decoration: none; padding: 16px 32px; } /*Fim Section Cases de Sucesso*/ /*Section Carreiras*/ section#carreiras { background: var(--color-primary); padding-top: 80px; margin-top: -1px; } /*Fim Section Carreiras*/ /*Section Contato*/ section.contato { width: 100%; display: flex; flex-wrap: wrap; background: var(--color-thirdy); position: relative; padding-top: 280px; margin-top: -80px; } section.contato::before { content: ""; position: absolute; top: -120px; left: 0; width: 100%; height: 125px; /* altura da curva */ background: #f6f6fb; clip-path: ellipse(54% 100% at 50% 100%); bottom: 0; } section.contato .content-contato { width: 70%; background: var(--color-white); border-top-right-radius: 500px; border-bottom-right-radius: 500px; padding: 110px 0 155px 190px; position: relative; } section.contato .header-content { max-width: 522px; margin-bottom: 48px; } section.contato .header-content h2{ font-size: 30px; } section.contato .header-content h2 span{ font-size: 31px; } section.contato .form-contato { max-width: 522px; } section.contato .form-contato .form-group:not(:last-child) { margin-bottom: 40px; } section.contato .form-contato label { font-weight: 400; font-size: 16px; line-height: 130%; color: var(--color-black); display: block; margin-bottom: 8px; } section.contato .form-contato input, section.contato .form-contato textarea { font-family: var(--font-family); width: 100%; box-sizing: border-box; padding: 8px; font-size: 16px; line-height: 130%; color: var(--color-primary); border: none; border-bottom: 2px solid var(--color-background); } section.contato .form-contato textarea { resize: none; } section.contato .form-contato p { font-size: 14px; line-height: 150%; margin-bottom: 40px; } section.contato .form-contato a { color: var(--color-primary); } section.contato .form-contato .btn-primary { padding: 16px 32px; } section.contato .container-flex { width: 100%; display: flex; align-items: center; } section.contato .info-contato { width: 40%; padding: 0 60px; } section.contato .outros-contatos { width: 40%; background: var(--color-background); padding: 134px 40px 134px 200px; box-sizing: border-box; border-top-left-radius: 500px; border-bottom-left-radius: 500px; position: absolute; top: 60%; transform: translateY(-50%); right: 0; } section.contato .outros-contatos:before { content: ""; width: 38px; height: 38px; background: var(--color-secondary); position: absolute; top: 25%; left: 24px; transform: translateY(-50%); border-radius: 50%; z-index: 1; } section.contato .outros-contatos .telefone, section.contato .outros-contatos .whatsapp, section.contato .outros-contatos .email, section.contato .outros-contatos .endereco { display: flex; gap: 24px; align-items: center; } section.contato .outros-contatos .item-contato small { font-size: 12px; text-transform: initial; margin-bottom: 4px; } section.contato .outros-contatos .item-contato a { color: var(--color-white); font-weight: 500; font-size: 16px; line-height: 140%; text-decoration: none; } section.contato .outros-contatos li:not(:last-child) { margin-bottom: 20px; } section.contato .outros-contatos li i { font-size: 24px; color: var(--color-white); } section.contato .localizacao { margin-top: 32px; } section.contato .localizacao li { display: flex; gap: 24px; } section.contato .localizacao p { font-weight: 500; font-size: 16px; line-height: 140%; color: var(--color-white); } section.contato .content-outros-contatos { min-width: 300px; } /*Fim Section Contato*/ /*Footer*/ footer { background: var(--color-thirdy); box-sizing: border-box; padding: 105px 0 87px; } .content-footer { width: 100%; display: flex; justify-content: space-between; align-items: center; } .content-footer:nth-child(1) { margin-bottom: 32px; padding-bottom: 32px; border-bottom: solid 1px #d2d1d6; } .content-footer p{ font-size: 14px; line-height: 130%; font-weight: 300; color: var(--color-primary); } .content-footer a { font-size: 14px; line-height: 130%; font-weight: 600; color: var(--color-primary); text-decoration: none; } .logo-footer img { max-width: 200px; } .group-btns { display: flex; gap: 16px; } /*Fim Footer*/ /*Modais*/ .modal { /*position: fixed;*/ /*top: -100%;*/ left: 0; background: #fff; width: 100%; height: 100vh; z-index: 1; transition: .4s ease all; /*display: none;*/ } .modal.active { top: 0; display: block; } .header-modal, .content-modal { max-width: 850px; margin: 0 auto; padding-bottom: 100px; } .header-modal { padding-top: 105px; margin-bottom: 80px; padding-bottom: 38px; position: relative; } .header-modal:before { content: ''; position: absolute; width: 100%; height: 1px; background: #F4F4F9; bottom: 0; left: 0; } .header-modal h2 { text-align: center; font-weight: 600; font-size: 32px; line-height: 130%; color: var(--color-primary); } /*.content-modal { height: 500px; overflow: auto; } */ .content-modal .item-modal:not(:last-child) { margin-bottom: 40px; padding-bottom: 40px; border-bottom: solid 1px #F4F4F9; } .content-modal .item-modal h3 { font-weight: 700; font-size: 24px; line-height: 150%; margin-bottom: 24px; } .content-modal .item-modal p { font-weight: 400; font-size: 16px; line-height: 150%; } .content-modal .item-modal p:not(:last-child){ margin-bottom: 24px; } .content-modal .item-modal a { font-weight: 600; color: var(--color-primary); } .btn-modal-voltar { position: absolute; top: 105px; font-weight: 400; font-size: 14px; line-height: 140%; letter-spacing: 0%; text-decoration: none; color: var(--color-primary); box-sizing: border-box; padding: 10px 24px 10px 38px; border: solid 1px var(--color-fourthy); border-top-right-radius: 20px; border-bottom-right-radius: 20px; border-left: none; display: flex; align-items: center; gap: 8px; transition: .4s ease all; background: transparent; cursor: pointer; z-index: 1; } .btn-modal-voltar:hover { background: var(--color-fourthy); color: var(--color-white); } .telefone-form { position: relative; z-index: 1; } .traducao { cursor: pointer; user-select: none; } .traducao i { pointer-events: none; } #dropdown-idiomas { cursor: pointer; }