#cta-meu-fiibo {
order: 5;
}
#beneficios {
order: 6;
}
#corretor {
order: 7;
}
#equipe {
order: 8;
} #banner {
position: relative;
display: flex;
padding-top: 210px;
padding-bottom: 109px;
margin-bottom: 126px;
}
#banner:after {
content: '';
width: 10.3%;
height: 67.5%;
max-width: 196px;
max-height: 600px;
position: absolute;
right: 0;
top: 20%;
background-image: url(//fiibo.com.br/wp-content/themes/saude/bem-estar/fiibo-after-banner.webp);
background-position: right center;
background-size: contain;
background-repeat: no-repeat;
}
#banner .container {
width: 1428px;
max-width: 90%;
margin: 0 auto;
display: flex;
position: relative;
z-index: 2;
justify-content: space-between;
}
#banner .area-vermelha {
width: 72.8%;
height: 100%;
position: absolute;
left: 0;
top: 0;
border-bottom-right-radius: 100px;
background-color: var(--principal);
background-image: url(//fiibo.com.br/wp-content/themes/saude/bem-estar/fiibo-ciranda-banner.png);
background-repeat: no-repeat;
background-size: contain;
background-position: 14%;
}
#banner .container .esq {
width: 51.2%;
}
#banner .container .esq .titulo {
font-size: 55px;
font-weight: 800;
line-height: 69px;
color: #fff;
margin: 0;
margin-bottom: 37px;
}
#banner .container .esq .sub {
color: #fff;
margin: 0;
font-size: 24px;
font-weight: 700;
line-height: 37px;
margin-bottom: 40px;
}
#banner .container .dir {
width: 37.7%;
margin-top: -30px;
}
#banner .container .esq .area-btn {
display: flex;
column-gap: 22px;
align-items: center;
}
#banner .container .esq .texto {
font-size: 24px;
font-weight: 700;
line-height: 37px;
color: #fff;
margin: 0;
margin-bottom: 56px;
}
#banner .container .esq .btn-01 {
text-decoration: none;
border-radius: 37px;
font-size: 18px;
text-align: center;
letter-spacing: 0.04em;
border: 2px solid var(--principal);
color: var(--principal);
font-weight: 700;
display: inline-flex;
flex-direction: row;
padding: 21.5px 75px;
align-items: center;
justify-content: center;
z-index: 1;
}
#banner .container .esq .btn-01 .bg_color {
background-color: #fff;
}
#banner .container .esq .btn-01.btn-effect .round {
background-color: var(--roxo);
}
#banner .container .esq .btn-01:hover {
border-color: var(--roxo);
color: #fff;
transition: .3s;
}
#banner .container .esq .btn-01 svg {
margin: 0 0 0 0.8vw;
width: 2vw;
}
#banner .container .esq .btn-02 {
text-decoration: none;
border-radius: 37px;
font-size: 18px;
text-align: center;
letter-spacing: 0.04em;
border: 2px solid #fff;
color: #fff;
font-weight: 400;
display: inline-flex;
flex-direction: row;
padding: 23px 43px;
align-items: center;
justify-content: center;
z-index: 1;
}
#banner .container .esq .btn-02 .bg_color {
background-color: var(--principal);
}
#banner .container .esq .btn-02.btn-effect .round {
background-color: #fff;
}
#banner .container .esq .btn-02:hover {
border-color: #fff;
transition: .3s;
color: var(--principal);
border: 2px solid #fff;
}
#banner .container .esq .btn-02 svg {
margin: 0 0 0 0.8vw;
width: 2vw;
} #cta-meu-fiibo {
margin-top: 100px;
padding-top: 104px;
margin-bottom: 132px;
background: #7B4BEF;
position: relative;
}
#cta-meu-fiibo .container {
width: 1512px;
max-width: 90%;
margin: 0 auto;
display: flex;
flex-direction: row-reverse;
border-radius: 86px;
align-items: flex-end;
column-gap: 7%;
position: relative;
z-index: 1;
}
#cta-meu-fiibo .container .esq img {
display: block;
position: absolute;
bottom: -60px;
}
#cta-meu-fiibo .container .esq {
width: 39.4%;
position: relative;
}
#cta-meu-fiibo .container .dir {
width: 37.7%;
padding-bottom: 100px;
}
#cta-meu-fiibo .container .dir .titulo {
font-size: 60px;
font-weight: 700;
line-height: 54px;
color: #FED009;
margin: 0;
}
#cta-meu-fiibo .container .dir .sub {
width: 511px;
font-family: "Cal Sans", "sans-serif";
max-width: 100%;
font-size: 28px;
font-weight: 400;
line-height: 38px;
color: #ffffff;
margin: 0;
margin-bottom: 16px;
margin-top: 12px;
}
#cta-meu-fiibo .container .dir .sub b {
font-weight: 800;
color: #FED009;
}
#cta-meu-fiibo .container .dir .garanta {
font-family: "Cal Sans", "sans-serif";
font-size: 20px;
font-weight: 400;
color: #FED009;
margin: 0;
}
#cta-meu-fiibo .container .dir ul li {
font-family: "Cal Sans", "sans-serif";
font-size: 16px;
font-weight: 400;
line-height: 32px;
color: #fff;
display: flex;
align-items: center;
column-gap: 15px;
padding-right: 11px;
}
#cta-meu-fiibo .container .dir ul li span {
font-weight: 400;
color: #FED009;
}
#cta-meu-fiibo .container .dir ul {
padding: 0;
display: flex;
flex-direction: column;
list-style: none;
row-gap: 17px;
margin-bottom: 42px;
}
#cta-meu-fiibo .container .dir ul li .icone {
width: 53px;
height: 53px;
border-radius: 50%;
min-width: 53px;
display: flex;
align-items: center;
justify-content: center;
background-color: #FB3EAF;
}
#cta-meu-fiibo .container .dir ul li p {
margin: 0;
}
#cta-meu-fiibo .container .dir ul li .icone svg {
max-width: 70%;
}
#cta-meu-fiibo .container .dir .btn-conversar {
text-decoration: none;
border-radius: 37px;
font-size: 18px;
text-align: center;
border: 2px solid #fff;
font-family: "Cal Sans", "sans-serif";
color: #fff;
font-weight: 200;
display: inline-flex;
flex-direction: row;
padding: 21px 55px;
align-items: center;
justify-content: center;
z-index: 1;
}
#cta-meu-fiibo .container .dir .btn-conversar .bg_color {
background-color: #FB3EAF;
}
#cta-meu-fiibo .container .dir .btn-conversar.btn-effect .round {
background-color: #FED009;
}
#cta-meu-fiibo .container .dir .btn-conversar:hover {
color: #7B4BEF;
transition: .3s;
} #beneficios {
background-image: url(//fiibo.com.br/wp-content/themes/saude/bem-estar/nossa-solucao/bg-beneficios.webp);
background-position: right center;
background-repeat: no-repeat;
background-size: auto;
margin-bottom: 153px;
}
#beneficios .container {
width: 1512px;
max-width: 90%;
margin: 0 auto;
display: flex;
flex-direction: column;
}
#beneficios .container .box-cards {
width: 907px;
max-width: 100%;
display: flex;
column-gap: 3%;
row-gap: 27px;
flex-wrap: wrap;
margin-bottom: 90px;
}
#beneficios .container>.titulo {
font-size: 41px;
font-weight: 700;
color: var(--principal);
margin: 0;
margin-bottom: 6px;
}
#beneficios .container>p {
font-size: 16px;
font-weight: 700;
color: #5A5A5A;
margin: 0;
margin-bottom: 55px;
}
#beneficios .container .box-cards .card .icone {
margin-bottom: 29px;
}
#beneficios .container .box-cards .card {
width: 48.5%;
height: 313px;
border-radius: 68.35px;
backdrop-filter: blur(14px);
background: #F7F7F7CC;
display: flex;
flex-direction: column;
align-items: center;
transition: .2s all ease-in-out;
border: 2px solid transparent;
padding: 50px 49px 0;
}
#beneficios .container .box-cards .card:hover {
border: 2px solid var(--principal);
background-color: #fff;
}
#beneficios .container .box-cards .card .titulo {
font-size: 32px;
font-weight: 700;
line-height: 41.27px;
text-align: center;
color: var(--principal);
margin: 0;
}
#beneficios .container .box-cards .card .texto {
margin: 0;
font-size: 24px;
font-weight: 500;
line-height: 32px;
text-align: center;
color: #5A5A5A;
}
#beneficios .container .btn-conversar {
text-decoration: none;
border-radius: 37px;
font-size: 18px;
text-align: center;
letter-spacing: 0.04em;
border: 2px solid var(--principal);
color: #fff;
font-weight: 400;
display: inline-flex;
flex-direction: row;
padding: 21px 39px;
align-items: center;
justify-content: center;
margin: 0 auto;
z-index: 1;
}
#beneficios .container .btn-conversar .bg_color {
background-color: var(--principal);
}
#beneficios .container .btn-conversar.btn-effect .round {
background-color: var(--roxo);
}
#beneficios .container .btn-conversar:hover {
border-color: var(--roxo);
transition: .3s;
} #corretor {
position: relative;
background-color: #f7f7f7;
padding-top: 114px;
padding-bottom: 141px;
}
#corretor .container {
width: 1512px;
max-width: 90%;
margin: 0 auto;
position: relative;
}
#corretor .container .traga-corretor {
position: absolute;
top: -119px;
background-image: url(//fiibo.com.br/wp-content/themes/saude/bem-estar/nossa-solucao/ico-traga-corretor.svg);
background-size: contain;
background-position: top;
background-repeat: no-repeat;
display: flex;
flex-direction: column;
align-items: center;
padding-top: 18px;
width: 112px;
height: 145px;
right: 135px;
}
#corretor .container .traga-corretor p {
font-size: 18.67px;
font-weight: 400;
text-align: center;
color: #fff;
margin: 0;
}
#corretor .container .traga-corretor p b {
font-weight: 800;
display: block;
}
#corretor .container>.titulo {
font-size: 41px;
font-weight: 700;
text-align: center;
color: var(--principal);
margin: 0;
margin-bottom: 3px;
}
#corretor .container>p {
font-size: 16px;
font-weight: 700;
line-height: 32px;
text-align: center;
color: #5A5A5A;
margin: 0;
margin-bottom: 46px;
}
#corretor .container .box-cards {
display: flex;
justify-content: center;
flex-wrap: wrap;
row-gap: 16px;
column-gap: 25px;
}
#corretor .container .box-cards .card {
background-color: var(--principal);
width: 358px;
height: 106px;
border-radius: 26.95px;
display: flex;
align-items: center;
column-gap: 14px;
padding: 0 37px;
}
#corretor .container .box-cards .card .titulo {
font-size: 16px;
font-weight: 700;
line-height: 21.56px;
color: #fff;
margin: 0;
}
#corretor .container .box-cards .card img {
display: block;
margin: 0 auto;
text-align: center;
} #equipe {
padding-bottom: 110px;
}
#equipe .container>.titulo {
font-size: 41px;
font-weight: 700;
text-align: center;
color: var(--principal);
padding: 0 5%;
margin: 0 0 20px 0;
}
#equipe .container {
display: flex;
flex-direction: column;
width: 100%;
}
#equipe .container>p {
font-size: 16px;
font-weight: 700;
line-height: 32px;
text-align: center;
color: #5A5A5A;
width: 1234px;
max-width: 90%;
margin: 0 auto;
}
#equipe .container .area-cards {
width: 1244px;
max-width: 90%;
margin: 0 auto;
display: flex;
flex-direction: column;
row-gap: 40px;
}
#equipe .container .area-cards .card {
display: flex;
align-items: center;
column-gap: 67px;
}
#equipe .container .area-cards .card .vermelho {
color: var(--principal);
font-size: 50px;
font-weight: 800;
line-height: 32px;
margin: 0;
margin-bottom: 7px;
}
#equipe .container .area-cards .card .texto {
font-size: 24px;
font-weight: 500;
line-height: 32px;
color: #000;
margin: 0;
}
#equipe .container .area-cards .card .esq {
width: 329px;
min-width: 329px;
height: 139px;
border: 2px solid var(--principal);
display: flex;
border-radius: 40px;
background-color: #fff;
align-items: center;
justify-content: center;
padding: 0 3%;
}
#equipe .container .btn-conversar {
text-decoration: none;
border-radius: 37px;
font-size: 18px;
text-align: center;
letter-spacing: 0.04em;
border: 2px solid var(--principal);
color: #fff;
font-weight: 400;
display: inline-flex;
flex-direction: row;
padding: 21px 39px;
align-items: center;
justify-content: center;
margin: 20px auto 0;
z-index: 1;
}
#equipe .container .btn-conversar .bg_color {
background-color: var(--principal);
}
#equipe .container .btn-conversar.btn-effect .round {
background-color: var(--roxo);
}
#equipe .container .btn-conversar:hover {
border-color: var(--roxo);
transition: .3s;
}
@media screen and (max-width: 1600px) {
#banner .container .esq .titulo {
font-size: 48px;
line-height: 62px;
}
#banner .container .esq .sub {
font-size: 24px;
line-height: 35px;
margin-bottom: 24px;
}
#banner .container .esq .texto {
font-size: 20px;
line-height: 31px;
margin-bottom: 30px;
}
#banner .container .esq .btn-02 {
padding: 17px 27px;
}
#banner .container .esq .btn-01 {
padding: 17px 82px;
}
#banner {
padding-bottom: 40px;
}
#banner .container {
justify-content: normal;
column-gap: 28px;
}
#cta-meu-fiibo .container {
height: 44vw;
align-items: center;
}
#cta-meu-fiibo .container .esq {
position: relative;
top: -17%;
}
#cta-meu-fiibo .container .esq img {
position: unset;
margin-top: 99px;
}
#cta-meu-fiibo {
padding-top: 7vw;
}
#beneficios .container .box-cards .card {
width: 48.5%;
}
#beneficios .container .box-cards .card .titulo {
font-size: 26px;
line-height: 27.27px;
}
#beneficios .container .box-cards .card .texto {
font-size: 18px;
line-height: 23px;
}
#beneficios .container .box-cards .card .icone {
margin-bottom: 0;
width: 50px;
}
#beneficios .container .box-cards .card .icone svg {
max-width: 100%;
}
#beneficios .container .box-cards .card {
height: auto;
padding: 30px;
}
#beneficios {
background-size: 75%;
}
#beneficios .container .box-cards {
width: 50%;
}
#equipe .container .area-cards .card .vermelho {
font-size: 40px;
line-height: 24px;
}
#equipe .container .area-cards .card .texto {
font-size: 20px;
line-height: 25px;
}
}
@media screen and (max-width: 1480px) {
#banner .container .esq .titulo {
font-size: 40px;
line-height: 50px;
margin-bottom: 15px;
}
#banner .container .esq .sub {
font-size: 19px;
line-height: 26px;
margin-bottom: 17px;
}
#banner .container .esq .btn-01 {
padding: 17px 13%;
}
#banner .container .esq .btn-02 {
padding: 17px 4%;
}
#banner .container .esq .btn-01,
#banner .container .esq .btn-02 {
font-size: 16px;
}
#banner {
padding-top: 148px;
padding-bottom: 60px;
}
}
@media screen and (max-width: 1440px) {
#equipe .container .area-cards .card .esq {
width: 300px;
min-width: 300px;
height: 120px;
}
#equipe .container .area-cards .card {
column-gap: 40px;
}
#cta-meu-fiibo .container .dir ul li {
line-height: 27px;
}
}
@media screen and (max-width: 1366px) {
#cta-meu-fiibo .container .dir ul li,
#cta-meu-fiibo .container .dir .sub {
font-size: 14px;
line-height: 22px;
}
#cta-meu-fiibo .container .dir .garanta {
font-size: 18px;
}
#cta-meu-fiibo .container .dir .btn-conversar,
#beneficios .container .btn-conversar,
#equipe .container .btn-conversar {
padding: 12px 23px;
}
#cta-meu-fiibo .container .dir .titulo {
font-size: 46px;
}
#cta-meu-fiibo .container .dir .titulo img {
width: 94px;
}
}
@media screen and (max-width: 1280px) {
#banner .container .esq .area-btn {
column-gap: 5px;
}
#banner .container .esq .btn-01 {
padding: 17px 10%;
}
#banner .container .esq .btn-02 {
padding: 17px 2%;
}
#banner .container .esq {
width: 48%;
}
#beneficios .container .box-cards .card {
padding: 30px;
}
#corretor .container .traga-corretor {
right: 0;
}
}
@media screen and (max-width: 1200px) {
#cta-meu-fiibo .container .dir ul {
margin-bottom: 15px;
}
}
@media screen and (max-width: 1080px) {
#cta-meu-fiibo .container .dir ul {
row-gap: 7px;
}
#cta-meu-fiibo .container .dir ul li .icone {
width: 40px;
height: 40px;
min-width: 40px;
}
#cta-meu-fiibo .container .dir .btn-conversar,
#beneficios .container .btn-conversar,
#equipe .container .btn-conversar {
font-size: 14px;
}
#beneficios {
background-size: 92%;
}
}
@media screen and (max-width: 1024px) {
#banner .container {
flex-direction: column;
}
#banner .container .esq,
#banner .container .dir,
#banner .area-vermelha {
width: 100%;
}
#banner:after {
display: none;
}
#banner {
padding-top: 178px;
}
#banner .container .dir {
margin-top: 40px;
text-align: center;
}
#cta-meu-fiibo {
padding-top: 40px;
margin-top: 60px;
}
#cta-meu-fiibo .container {
height: auto;
flex-direction: column-reverse;
row-gap: 40px;
padding: 60px 30px;
}
#cta-meu-fiibo .container .esq {
position: unset;
}
#cta-meu-fiibo .container .esq img {
margin-top: 0;
}
#cta-meu-fiibo .container .dir {
width: 100%;
padding-bottom: 0;
}
#cta-meu-fiibo .container .dir ul {
margin-bottom: 28px;
padding-left: 0;
}
#cta-meu-fiibo .container .esq {
width: auto;
}
#cta-meu-fiibo .container .dir .garanta {
padding-left: 0;
}
#beneficios {
background-image: none;
padding: 0;
}
#beneficios .container .box-cards {
width: 100%;
margin-bottom: 60px;
}
#beneficios .container .box-cards .card {
min-height: 247px;
background-color: #f7f7f7;
}
#corretor {
padding-top: 170px;
padding-bottom: 60px;
}
#corretor .container .traga-corretor {
top: -175px;
right: 0;
left: 0;
margin: 0 auto;
}
#equipe .container .area-cards .card .texto {
font-size: 16px;
line-height: 20px;
}
}
@media screen and (max-width: 768px) {
#equipe .container .area-cards .card {
row-gap: 20px;
align-items: flex-start;
}
#equipe .container .area-cards .card .esq {
width: 150px;
min-width: 150px;
height: 100px;
border-radius: 20px;
}
#equipe .container .area-cards .card {
column-gap: 20px;
}
#equipe .container .area-cards .card .esq img {
max-width: 75%;
}
#equipe .container .area-cards {
row-gap: 55px;
}
}
@media screen and (max-width: 600px) {
#cta-meu-fiibo .container .esq {
width: 300px;
max-width: 100%;
}
#beneficios .container .box-cards {
flex-direction: column;
align-items: center;
}
#beneficios .container .box-cards .card {
width: 100%;
}
}
@media screen and (max-width: 490px) {
#banner .container .esq .area-btn {
column-gap: 5px;
flex-direction: column;
row-gap: 13px;
}
#banner .container .esq .titulo {
font-size: 36px;
line-height: 41px;
margin-bottom: 28px;
}
#banner .container .esq .sub {
font-size: 18px;
line-height: 25px;
}
#banner .container .esq .texto {
font-size: 16px;
line-height: 28px;
}
#banner .container .esq .btn-01,
#banner .container .esq .btn-02 {
width: 100%;
padding: 17px;
}
#banner {
padding-top: 154px;
}
#corretor .container>.titulo {
font-size: 26px;
}
#beneficios .container .box-cards .card .texto {
font-size: 14px;
}
#beneficios .container .box-cards .card {
min-height: auto;
}
#corretor .container .box-cards .card .titulo {
text-align: center;
}
#corretor .container>p {
font-size: 14px;
line-height: 25px;
}
}
@media screen and (max-width: 400px) {
#equipe .container .area-cards .card .vermelho {
font-size: 30px;
line-height: 20px;
}
#equipe .container .area-cards .card .texto {
font-size: 14px;
line-height: 20px;
}
#equipe .container .area-cards .card .esq {
width: 120px;
min-width: 120px;
height: 80px;
}
} #icones {
order: 2;
}
#icones {
margin-bottom: 116px;
}
#icones .container {
width: 1512px;
max-width: 90%;
margin: 0 auto;
display: flex;
border-radius: 86px;
overflow: hidden;
}
#icones .container .esq {
background-color: #f7f7f7;
width: 1217px;
max-width: 100%;
padding: 53px 62px 60px;
}
#icones .container .dir {
background-color: var(--principal);
width: 295px;
max-width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 0 38px;
row-gap: 35px;
}
#icones .container .dir .box {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
row-gap: 10px;
}
#icones .container .dir .box .icone {
width: 79px;
height: 79px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: #fff;
}
#icones .container .dir .box p {
font-size: 28px;
font-weight: 800;
line-height: 29px;
text-align: center;
color: #fff;
margin: 0;
}
#icones .container .esq>.titulo {
font-size: 41px;
font-weight: 700;
line-height: 54px;
text-align: center;
color: var(--principal);
margin: 0;
margin-bottom: 37px;
}
#icones .container .esq .area-icones {
display: flex;
justify-content: space-between;
align-items: center;
gap: 20px;
}
#icones .container .esq .area-icones .titulos {
display: flex;
flex-direction: column;
row-gap: 48px;
}
#icones .container .esq .area-icones .titulos p {
font-size: 84.97px;
font-weight: 800;
line-height: 45.43px;
text-align: center;
color: var(--principal);
margin: 0;
}
#icones .container .esq .area-icones .titulos p span {
font-size: 34.49px;
font-weight: 800;
line-height: 45.43px;
text-align: center;
color: #000;
display: block;
margin-top: 17px;
}
#icones .container .esq {
width: 100%;
max-width: 1217px;
}
@media only screen and (max-width:1660px) {
#icones .container .esq>.titulo {
font-size: 36px;
margin-bottom: 32px;
}
#icones .container .dir .box p {
font-size: 24px;
}
#icones .container .esq .area-icones .titulos p {
font-size: 76px;
line-height: 45px;
}
#icones .container .esq .area-icones .titulos p span {
font-size: 30px;
line-height: 45px;
}
}
@media only screen and (max-width:1550px) {
#icones .container .esq .area-icones .titulos {
width: 24%;
}
#icones .container .esq img {
width: 74%;
}
}
@media only screen and (max-width:1470px) {
#icones .container .esq .area-icones .titulos p {
font-size: 56px;
line-height: 26px;
}
#icones .container .esq .area-icones .titulos p span {
font-size: 25px;
line-height: 31px;
}
#icones .container .dir .box p {
font-size: 20px;
line-height: 23px;
}
}
@media only screen and (max-width:1300px) {
#icones .container .esq {
padding: 35px 30px 50px;
}
#icones .container .esq>.titulo {
font-size: 28px;
line-height: 36px;
}
#icones .container {
border-radius: 50px;
}
#icones .container .dir .box p {
font-size: 18px;
line-height: 21px;
}
#icones .container .esq .area-icones .titulos p {
font-size: 48px;
line-height: 23px;
}
#icones .container .esq .area-icones .titulos p span {
font-size: 20px;
}
#icones .container .dir {
row-gap: 20px;
}
}
@media only screen and (max-width:1024px) {
#icones {
margin-bottom: 45px;
}
#icones .container {
flex-direction: column;
}
#icones .container .dir {
width: 100%;
max-width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
flex-wrap: wrap;
padding: 30px 0;
gap: 40px;
}
#icones .container .esq .area-icones {
flex-direction: column;
}
#icones .container .esq .area-icones .titulos {
flex-direction: row;
column-gap: 48px;
width: 100%;
justify-content: center;
margin: 0 0 20px 0;
flex-wrap: wrap;
}
#icones .container .esq img {
width: 100%;
max-width: 751px;
}
} #plataforma-fiibo {
order: 3;
margin-bottom: 100px;
}
#plataforma-fiibo .container {
max-width: 1512px;
width: 90%;
margin: 0 auto;
}
#plataforma-fiibo>.titulo {
font-weight: 700;
font-size: 41px;
line-height: 54px;
text-align: center;
color: var(--principal);
padding: 0 5%;
width: 100%;
max-width: 1080px;
margin: 0 auto 47px;
}
#plataforma-fiibo .top,
#plataforma-fiibo .bottom {
display: flex;
flex-direction: row;
align-items: center;
}
#plataforma-fiibo .top .titulo {
font-weight: 700;
font-size: 28px;
line-height: 37px;
color: #000000;
}
#plataforma-fiibo .top .titulo .color {
color: var(--principal);
}
#plataforma-fiibo .top .tags {
display: flex;
flex-direction: row;
justify-content: space-between;
}
#plataforma-fiibo .top .tags .tag {
color: var(--principal);
border: 1px solid var(--principal);
border-radius: 100px;
padding: 16px 35px;
transition: .2s all ease-in-out;
font-weight: 400;
font-size: 20px;
}
#plataforma-fiibo .bottom .titulo {
font-weight: 700;
font-size: 28px;
line-height: 37px;
color: var(--principal);
margin: 0;
}
#plataforma-fiibo .bottom .texto {
font-weight: 700;
font-size: 22px;
line-height: 32px;
color: #5A5A5A;
margin: 10px 0;
}
#plataforma-fiibo .top .esq,
#plataforma-fiibo .bottom .dir {
width: 53%;
}
#plataforma-fiibo .top .esq {
padding: 0 60px 0 0;
margin: -60px 0 0 0;
}
#plataforma-fiibo .top .dir {
position: relative;
}
#plataforma-fiibo .top .dir .tag-off {
background-color: var(--principal);
position: absolute;
width: 102px;
height: 102px;
left: -24px;
top: -13px;
transform: rotate(13.49deg);
color: #fff;
font-size: 24px;
border-radius: 100px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-weight: 800;
text-align: center;
line-height: 30px;
}
#plataforma-fiibo .top .dir .tag-off .block {
font-size: 31px;
}
#plataforma-fiibo .bottom>.dir {
padding: 0 0 0 60px;
margin: 0 0 -50px 0;
}
#plataforma-fiibo .top {
margin-bottom: -70px;
}
#plataforma-fiibo .bottom {
margin-top: -70px;
}
#plataforma-fiibo .top .dir,
#plataforma-fiibo .bottom .esq {
width: 55%;
}
#plataforma-fiibo .bottom .esq .imagem img{
border-radius: 20px;
}
#plataforma-fiibo .bottom {
position: relative;
z-index: 2;
}
#plataforma-fiibo .bottom .dir .box-preco {
display: flex;
flex-direction: row;
align-items: stretch;
}
#plataforma-fiibo .bottom .dir .box-preco .esq {
background-color: var(--principal);
color: #fff;
border-radius: 34px 0px 0px 34px;
display: flex;
flex-direction: column;
align-items: center;
padding: 6px 0;
}
#plataforma-fiibo .bottom .dir .box-preco .dir {
background-color: #F7F7F7;
border-radius: 0px 34px 34px 0px;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
width: 75%;
}
#plataforma-fiibo .bottom .dir .box-preco .dir .texto {
font-weight: 700;
font-size: 80px;
color: var(--principal);
margin: 0;
}
#plataforma-fiibo .bottom .dir .box-preco .esq .titulo-box {
font-weight: 700;
font-size: 22px;
line-height: 32px;
margin: 0;
}
#plataforma-fiibo .bottom .dir .box-preco .esq .valor {
font-size: 22px;
font-weight: 700;
line-height: 32px;
margin: 13px 0 5px 0;
}
#plataforma-fiibo .bottom .dir .box-preco .esq .valor .real {
font-size: 65px;
font-weight: 700;
line-height: 32px;
position: relative;
margin: 0;
}
#plataforma-fiibo .bottom .dir .box-preco .esq .sub-texto {
font-weight: 400;
font-size: 12px;
line-height: 15px;
text-align: center;
margin: 0;
}
#plataforma-fiibo .bottom .dir .box-preco .esq .low {
font-size: 22px;
position: absolute;
top: 0;
right: -14px;
margin: 0;
}
@media only screen and (max-width: 1600px) {
#plataforma-fiibo>.titulo {
font-size: 36px;
line-height: 46px;
}
#plataforma-fiibo .top .tags .tag {
padding: 13px 30px;
font-size: 18px;
}
#plataforma-fiibo .top .dir .tag-off .block {
font-size: 22px;
}
#plataforma-fiibo .top .dir .tag-off {
width: 85px;
height: 85px;
font-size: 18px;
line-height: 23px;
}
#plataforma-fiibo .bottom .texto {
font-size: 18px;
}
#plataforma-fiibo .bottom .dir .box-preco .dir .texto {
font-size: 66px;
}
#plataforma-fiibo .bottom .dir .box-preco .esq .valor .real {
font-size: 56px;
}
#plataforma-fiibo .bottom .dir .box-preco .esq .titulo-box {
font-size: 20px;
}
}
@media only screen and (max-width: 1430px) {
#plataforma-fiibo .top .tags .tag {
padding: 10px 22px;
}
}
@media only screen and (max-width: 1330px) {
#plataforma-fiibo>.titulo {
font-size: 32px;
line-height: 42px;
}
#plataforma-fiibo .top .titulo {
font-size: 24px;
line-height: 32px;
}
#plataforma-fiibo .top .tags .tag {
font-size: 16px;
}
#plataforma-fiibo .bottom .titulo {
font-size: 24px;
line-height: 32px;
}
#plataforma-fiibo .bottom .texto {
font-size: 16px;
}
#plataforma-fiibo .bottom .dir .box-preco .dir .texto {
font-size: 53px;
}
#plataforma-fiibo .bottom .dir .box-preco .esq .titulo-box {
font-size: 16px;
}
#plataforma-fiibo .bottom .dir .box-preco .esq .valor .real {
font-size: 47px;
line-height: 30px;
}
#plataforma-fiibo .bottom .dir .box-preco .esq .valor {
margin: 2px 0 2px 0;
}
#plataforma-fiibo .bottom .dir .box-preco .esq .sub-texto {
font-size: 11px;
}
#plataforma-fiibo .bottom .dir .box-preco .dir {
width: 66%;
}
}
@media only screen and (max-width: 1260px) {
#plataforma-fiibo .bottom {
margin-top: 0;
}
#plataforma-fiibo .top {
margin-bottom: 0;
}
#plataforma-fiibo .bottom>.dir {
margin: 0;
}
#plataforma-fiibo .top .esq {
margin: 0;
}
#plataforma-fiibo .top .tags .tag {
font-size: 14px;
}
}
@media only screen and (max-width: 1150px) {
#plataforma-fiibo .bottom .dir .box-preco .dir .texto {
font-size: 42px;
}
#plataforma-fiibo .bottom .dir .box-preco .esq .valor .real {
font-size: 40px;
}
#plataforma-fiibo .bottom .dir .box-preco .dir {
width: 55%;
}
#plataforma-fiibo .top .tags {
flex-wrap: wrap;
}
#plataforma-fiibo .top .tags {
flex-wrap: wrap;
gap: 10px;
justify-content: center;
}
}
@media only screen and (max-width: 1024px) {
#plataforma-fiibo .top {
flex-direction: column;
margin-bottom: 40px;
}
#plataforma-fiibo .bottom {
flex-direction: column-reverse;
}
#plataforma-fiibo .top .esq,
#plataforma-fiibo .bottom .dir {
width: 100%;
margin-bottom: 30px;
}
#plataforma-fiibo .top .dir,
#plataforma-fiibo .bottom .esq {
width: 90%;
}
#plataforma-fiibo>.titulo {
font-size: 28px;
line-height: 37px;
margin-bottom: 10px;
}
#plataforma-fiibo .top .titulo,
#plataforma-fiibo .bottom .titulo {
font-size: 20px;
line-height: 28px;
text-align: center;
}
#plataforma-fiibo .top .esq {
padding: 0;
}
#plataforma-fiibo .top .dir .tag-off .block {
font-size: 16px;
}
#plataforma-fiibo .top .dir .tag-off {
width: 65px;
height: 65px;
font-size: 14px;
line-height: 16px;
}
#plataforma-fiibo .bottom>.dir {
padding: 0;
}
#plataforma-fiibo .bottom .texto {
font-size: 14px;
text-align: center;
}
#plataforma-fiibo .bottom .dir .box-preco {
flex-direction: column;
}
#plataforma-fiibo .bottom .dir .box-preco .dir {
width: 100%;
border-radius: 0px 0px 34px 34px;
padding: 30px 0;
}
#plataforma-fiibo .bottom .dir .box-preco .esq {
border-radius: 34px 34px 0px 0px;
width: 100%;
}
} #combo {
background-color: #fff;
order: 4;
}
#combo .container_combo {
display: flex;
width: 90%;
max-width: 1511px;
margin: 0 auto;
align-items: center;
padding: 60px 0;
justify-content: space-between;
}
#combo .esq {
width: 45%;
}
#combo .esq .titulo {
font-weight: 800;
font-size: 36px;
line-height: 44px;
color: var(--principal);
width: 100%;
max-width: 631px;
}
#combo .esq .logo_fiibo_combina img {
width: 100%;
max-width: 576px;
}
#combo .esq .tag_preco {
width: 100%;
display: flex;
justify-content: flex-end;
padding: 0 19% 0 0;
}
#combo .esq .tag_preco img {
max-width: 248px;
}
#combo .dir {
width: 49%;
display: flex;
flex-direction: column;
gap: 15px;
}
#combo .dir .box {
display: flex;
align-items: stretch;
gap: 10px;
}
#combo .dir .container_tag {
width: 60px;
height: auto;
display: flex;
justify-content: center;
align-items: center;
}
#combo .dir .tag {
background-color: var(--principal);
color: #fff;
padding: 10px 30px;
font-weight: 700;
font-size: 20px;
line-height: 26px;
text-align: center;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
}
#combo .dir .tag .text {
transform: rotate(-90deg);
white-space: nowrap;
}
#combo .dir .content {
background: #F7F7F7;
border-radius: 24px;
width: 90%;
padding: 16px 40px;
}
#combo .dir .content .text {
color: #000;
font-weight: 500;
font-size: 20px;
line-height: 26px;
margin-bottom: 12px;
}
#combo .dir .content .logos .item {
width: 23%;
height: 67px;
border-radius: 10px;
padding: 15px;
background-color: #fff;
display: flex;
align-items: center;
justify-content: center;
}
#combo .dir .content .logos {
display: flex;
flex-wrap: wrap;
flex-direction: column;
gap: 8px;
}
#combo .dir .content .logos .linha {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: flex-start;
gap: 8px;
}
@media screen and (max-width: 1600px) {
#combo .esq .titulo {
font-size: 31px;
line-height: 41px;
}
#combo .esq .logo_fiibo_combina img {
width: 100%;
max-width: 505px;
}
#combo .esq .tag_preco img {
max-width: 205px;
}
#combo .dir .content .text {
font-size: 18px;
line-height: 24px;
}
}
@media screen and (max-width: 1300px) {
#combo .container_combo {
flex-direction: column;
gap: 50px;
}
#combo .esq {
width: 100%;
max-width: 589px;
}
#combo .esq .tag_preco {
padding: 0;
}
#combo .dir {
width: 100%;
max-width: 738px;
}
}
@media screen and (max-width: 840px) {
#combo .dir .box {
flex-direction: column;
}
#combo .dir .tag .text {
transform: none;
font-size: 18px;
white-space: nowrap;
}
#combo .dir .container_tag {
width: 100%;
}
#combo .dir .content {
width: 100%;
padding: 25px;
}
#combo .dir {
gap: 45px;
}
#combo .esq .tag_preco {
justify-content: center;
}
#combo .esq .logo_fiibo_combina img {
width: 100%;
max-width: 505px;
margin: 0 auto 10px;
display: block;
}
#combo .esq .titulo {
font-size: 31px;
line-height: 38px;
text-align: center;
margin-bottom: 3px;
}
#combo .dir .content .logos {
align-items: center;
}
#combo .dir .content .logos .linha {
justify-content: center;
}
#combo .dir .content .text {
text-align: center;
}
#combo .dir .content .logos .item {
width: 140px;
}
}
#contratar {
height: auto;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
margin: 4vw 0 90px 0;
order: 8;
}
#contratar .top {
padding: 6vw 10vw 0;
padding-top: 0;
display: flex;
width: 100%;
align-items: center;
}
#contratar .top .titulo {
margin: 0 11vw 0 0;
color: var(--principal);
font-size: 2.14vw;
}
#contratar .top .texto {
margin: 0;
font-size: 16px;
line-height: 32px;
letter-spacing: 0.02em;
color: #5a5a5a;
font-weight: 500;
}
#contratar .bottom {
overflow: hidden;
}
#contratar .bottom .swiper-wrapper {
padding: 5vw;
padding-top: 2.7vw;
padding-left: 0;
margin: 0 0 0 -28vw;
}
#contratar .bottom .box {
width: 17vw !important;
margin-right: 1.7vw !important;
height: auto;
display: flex;
position: relative;
background-color: #F7F7F7;
border-radius: 3.5vw;
border: 2px solid #f7f7f7;
padding: 2.7vw;
transition: .5s ease all;
cursor: pointer;
flex-direction: column;
justify-content: space-between;
}
#contratar .bottom .box .icone {
height: 5vw;
}
#contratar .bottom .box .icone svg {
color: var(--principal);
}
#contratar .bottom .box .titulo {
color: var(--principal);
font-size: 1.7vw;
margin: 0 0 1.8vw 0;
font-weight: 700;
}
#contratar .bottom .box .texto {
font-size: .9vw;
font-weight: 500;
color: #525252;
line-height: 1.5vw;
letter-spacing: 0.02em;
margin: 0;
}
#contratar .bottom .box ul {
padding: 0 0 0 19px;
margin: 1.4vw 0;
}
#contratar .bottom .box ul li {
font-size: 1vw;
font-weight: 600;
color: var(--principal);
line-height: 1.5vw;
letter-spacing: 0.02em;
margin: 0 0 .7vw;
}
#contratar .bottom .box .barra {
height: 0.3vw;
background-color: var(--principal);
width: 76%;
position: absolute;
bottom: -1%;
border-radius: 5vw;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#contratar .bottom .box:hover {
-webkit-transform: translateY(-2vw);
-ms-transform: translateY(-2vw);
transform: translateY(-2vw);
-webkit-transition: .3s;
-o-transition: .3s;
box-shadow: 0 20px 50px -5px #54545480, 0 30px 40px -30px #54545480, 0 20px 80px -30px #54545480;
transition: .5s ease all;
border: 2px solid var(--principal);
background-color: #fff;
}
#contratar .bottom .box:hover .barra {
background: rgb(233, 32, 67);
background: -webkit-gradient(linear, left top, right top, from(rgba(233, 32, 67, 1)), to(rgba(91, 66, 194, 1)));
background: -o-linear-gradient(left, rgba(233, 32, 67, 1) 0%, rgba(91, 66, 194, 1) 100%);
background: linear-gradient(90deg, rgba(233, 32, 67, 1) 0%, rgba(91, 66, 194, 1) 100%);
height: 0.5vw;
bottom: -1.5%;
}
#contratar .bottom .btn-conversar {
text-decoration: none;
width: 304px;
border-radius: 37px;
font-size: 18px;
text-align: center;
letter-spacing: 0.04em;
border: 2px solid var(--principal);
color: #fff;
font-weight: 400;
display: block;
padding: 21px 5px;
margin: 60px auto 0;
z-index: 1;
}
#contratar .bottom .btn-conversar .bg_color {
background-color: var(--principal);
}
#contratar .bottom .btn-conversar.btn-effect .round {
background-color: var(--roxo);
}
#contratar .bottom .btn-conversar:hover {
border-color: var(--roxo);
transition: .3s;
}
#contratar .bottom .box .link_box {
font-weight: 500;
color: #525252;
position: relative;
display: block;
width: 100%;
text-decoration: none;
}
#contratar .bottom .box .link_box b {
color: var(--principal);
text-decoration: underline;
}
#contratar .bottom .box .link_box svg {
position: absolute;
right: 0;
top: 5px;
}
@media only screen and (max-width: 1500px) {
#contratar .top {
width: 100%;
gap: 20px;
}
#contratar .top .texto {
font-size: 14px;
line-height: 24px;
}
#contratar .top .titulo {
margin: 0 0 32px 0;
font-size: 38px;
}
#contratar .bottom .box {
min-height: 327px;
}
#contratar .bottom .box .texto {
font-size: 14px;
line-height: 22px;
}
#contratar .bottom .box ul li {
font-size: 16px;
line-height: 20px;
margin: 0 0 10px;
}
#contratar .bottom .box ul {
margin: 25px 0;
}
#contratar .bottom .box .titulo {
font-size: 22px;
margin: 0 0 20px 0;
}
#contratar .bottom .box svg {
width: 40px;
}
#contratar .bottom .box-combos svg {
width: 60px;
}
#contratar .bottom .box .icone {
height: 70px;
}
#contratar .bottom .box .link_box {
font-size: 13px;
}
}
@media only screen and (max-width: 1300px) {
#contratar .bottom .btn-conversar {
font-size: 16px;
padding: 13px 5px;
width: 90%;
max-width: 304px;
}
}
@media only screen and (max-width: 1250px) {
#contratar .bottom .box .titulo {
font-size: 20px;
}
}
@media only screen and (max-width: 1024px) {
#contratar .bottom .box {
width: 30vw !important;
margin-right: 3vw !important;
}
#contratar .bottom .swiper-wrapper {
padding: 60px 6.8vw;
margin: 0 0 0 -30vw;
}
#contratar .bottom .box .barra {
height: 4px;
bottom: -1.3%;
}
#contratar .bottom .box:hover .barra {
height: 6px;
bottom: -2%;
}
#contratar .top {
padding: 65px 10vw 0;
align-items: flex-start;
flex-direction: column;
gap: 0;
}
#contratar .top .titulo {
margin: 0 0 20px 0;
font-size: 32px;
}
#contratar .bottom .box .area-img .img {
height: 8vw;
}
#contratar {
height: auto;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
margin: 30px 0 60px;
}
}
@media only screen and (max-width: 790px) {
#contratar .top {
padding: 0 5%;
margin: 0 auto 0;
width: 80%;
}
}
@media only screen and (max-width: 638px) {
#contratar .bottom .swiper-wrapper {
margin: 0;
padding: 60px 0;
}
#contratar .bottom .box {
-webkit-transform: translateY(-2vw);
-ms-transform: translateY(-2vw);
transform: translateY(-2vw);
-webkit-transition: .3s;
-o-transition: .3s;
box-shadow: 0 20px 50px -5px #54545480, 0 30px 40px -30px #54545480, 0 20px 80px -30px #54545480;
transition: .5s ease all;
box-sizing: border-box;
padding: 30px 25px 0;
width: 70vw !important;
margin-right: 5vw !important;
}
#contratar .bottom .box .titulo {
font-size: 28px;
}
#contratar .bottom .swiper-container {
margin: 0;
padding: 0 0 0 10vw;
}
#contratar .bottom .box .area-img .img {
height: 14vw;
}
#contratar .bottom .box .area-img .img img {
max-width: 58%;
}
#contratar .bottom .box {
padding: 30px 25px 25px;
height: auto;
}
}
@media only screen and (max-width: 600px) {
#contratar .top .titulo {
font-size: 30px;
line-height: 38px;
}
#contratar .bottom .box {
box-shadow: 0 20px 50px -5px #54545440, 0 20px 20px -20px #54545440, 0 20px 20px -20px #54545440;
}
}
@media only screen and (max-width: 342px) {
#contratar .bottom .box .titulo {
font-size: 22px;
}
#contratar .bottom .box .texto {
font-size: 12px;
line-height: 20px;
}
}
@media only screen and (max-width: 1600px) {
#equipe .container>.titulo {
font-size: 36px;
line-height: 46px;
margin: 0 0 14px 0;
}
}
@media only screen and (max-width: 1300px) {
#equipe .container>p {
font-size: 15px;
line-height: 27px;
}
}
@media only screen and (max-width: 1024px) {
#equipe .container>.titulo {
font-size: 28px;
line-height: 37px;
}
#equipe .container>p {
font-size: 14px;
line-height: 25px;
}
}
#equipe .bottom {
position: relative;
margin: 70px 0;
}
#equipe .bottom .square {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
background-color: var(--principal);
border-top-right-radius: 70px;
border-bottom-right-radius: 70px;
height: 933px;
max-width: 505px;
width: 26.5vw;
z-index: 1;
}
#equipe .bottom .area-cards {
position: relative;
z-index: 2;
}
@media only screen and (max-width: 1440px) {
#equipe .bottom .square {
height: 832px;
width: 19vw;
}
}
@media only screen and (max-width: 768px) {
#equipe .bottom .square {
display: none;
}
}
@media only screen and (max-width: 1024px) {
#cta-meu-fiibo .container,
#beneficios .container .box-cards .card {
border-radius: 37px;
}
}