.studio-quality-assurance-page .hero {
height: 800px;
align-items: flex-end;
padding-bottom: 80px;
}
.studio-quality-assurance-page .hero .circles {
width: 2000px;
height: 1072px;
background: url(//redesfiepa.org.br/wp-content/themes/fieparedes_theme/css/img/studios/qa/circle.png);
background-size: 100% 100%;
position: absolute;
top: -270px;
left: 50%;
margin-left: -790px;
}
.studio-quality-assurance-page .hero .bottom {
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.studio-quality-assurance-page .hero .bottom .left {
}
.studio-quality-assurance-page .hero .bottom .left .label {
text-transform: uppercase;
font-size: 14px;
letter-spacing: 2px;
font-weight: 500;
margin-bottom: 30px;
font-family: var(--vietnam);
}
.studio-quality-assurance-page .hero .bottom .left .title {
font-size: 54px;
letter-spacing: -1px;
margin-bottom: 30px;
line-height: 1.2;
font-weight: 500;
font-family: var(--hanken);
}
.studio-quality-assurance-page .hero .bottom .left .title span {
display: block;
}
.studio-quality-assurance-page .hero .bottom .left .description {
line-height: 1.6;
font-weight: 400;
}
.studio-quality-assurance-page .hero .bottom .left .description span {
display: block;
}
.studio-quality-assurance-page .hero .bottom .right {
}
.studio-quality-assurance-page .hero .bottom .right .button {
} .studio-quality-assurance-page .the-studio {
padding: 50px;
color: var(--white);
}
.studio-quality-assurance-page .the-studio .content {
background: var(--black);
border-radius: 15px;
padding: 70px 80px;
max-width: 1280px;
position: relative;
overflow: hidden;
}
.studio-quality-assurance-page .the-studio .content:before {
content: "";
position: absolute;
top: -140px;
left: -650px;
width: 800px;
height: 800px;
background: url(//redesfiepa.org.br/wp-content/themes/fieparedes_theme/css/img/studios/qa/circle2.svg);
background-size: 100% 100%;
}
.studio-quality-assurance-page .the-studio .top {
display: flex;
justify-content: space-between;
position: relative;
z-index: 10;
}
.studio-quality-assurance-page .the-studio .top .left {
text-transform: uppercase;
font-size: 15px;
font-weight: normal;
}
.studio-quality-assurance-page .the-studio .top .right {
}
.studio-quality-assurance-page .the-studio .top .right .title {
font-family: var(--vietnam);
font-size: 22px;
margin-bottom: 20px;
font-weight: 400;
line-height: 1.3;
}
.studio-quality-assurance-page .the-studio .top .right .title span {
display: block;
}
.studio-quality-assurance-page .the-studio .top .right .description {
font-size: 13px;
line-height: 1.5;
}
.studio-quality-assurance-page .the-studio .top .right .description span {
display: block;
}
.studio-quality-assurance-page .the-studio .studio-list {
display: flex;
align-items: flex-end;
padding-top: 80px;
justify-content: flex-end;
position: relative;
height: 420px;
gap: 20px;
}
.studio-quality-assurance-page .the-studio .studio-list li {
width: 25%;
transition: var(--transition);
position: relative;
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content {
background: #232323;
padding: 20px 20px 10px;
border-radius: 15px;
display: flex;
flex-direction: column;
justify-content: space-between;
transition: var(--transition);
position: absolute;
height: 320px;
bottom: 0;
left: 0;
width: 100%;
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content .description {
font-size: 13px;
line-height: 1.6;
transition: var(--transition);
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content .description span {
display: block;
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content .value {
font-size: 92px;
font-weight: 200;
letter-spacing: -2px;
font-family: var(--hanken);
background: linear-gradient(81.57deg, #FFFFFF -4.71%, #00BD5F 85.25%);
background-clip: text;
color: transparent;
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content:hover {
background: radial-gradient(110.31% 88.5% at 70.79% 15.86%, #8DC857 0%, #00BD5F 100%);
height: 350px;
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content:hover .description {
font-weight: 600;
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content:hover .value {
color: var(--white);
} .studio-quality-assurance-page .our-services {
padding: 50px 0;
}
.studio-quality-assurance-page .our-services .content {
max-width: 1100px;
}
.studio-quality-assurance-page .our-services .top {
display: flex;
justify-content: space-between;
position: relative;
z-index: 10;
margin-bottom: 100px;
}
.studio-quality-assurance-page .our-services .top .left {
text-transform: uppercase;
font-size: 15px;
font-weight: normal;
display: flex;
}
.studio-quality-assurance-page .our-services .top .left:before {
content: "";
display: block;
width: 26px;
height: 5px;
background: url(//redesfiepa.org.br/wp-content/themes/fieparedes_theme/css/img/studios/qa/line.svg);
background-size: 100% 100%;
margin-right: 10px;
position: relative;
top: 6px;
}
.studio-quality-assurance-page .our-services .top .right {
}
.studio-quality-assurance-page .our-services .top .right .title {
font-family: var(--vietnam);
font-size: 22px;
margin-bottom: 20px;
font-weight: 400;
line-height: 1.3;
max-width: 500px;
}
.studio-quality-assurance-page .our-services .services-list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding-left: 200px;
align-items: stretch;
}
.studio-quality-assurance-page .our-services .services-list li {
width: 42%;
margin-bottom: 80px;
}
.studio-quality-assurance-page .our-services .services-list li figure {
margin-bottom: 10px;
width: 50px;
}
.studio-quality-assurance-page .our-services .services-list li figure img {
width: 100%;
}
.studio-quality-assurance-page .our-services .services-list li .title {
font-size: 26px;
font-weight: 500;
margin-bottom: 15px;
}
.studio-quality-assurance-page .our-services .services-list li .title span {
display: block;
}
.studio-quality-assurance-page .our-services .services-list li .description {
font-size: 14px;
line-height: 1.5;
color: #525252;
}
.studio-quality-assurance-page .our-services .services-list li.star figure {
width: 45px;
}
.studio-quality-assurance-page .our-services .services-list li.cog figure {
width: 40px;
}
.studio-quality-assurance-page .our-services .services-list li.volt figure {
width: 30px;
}
.studio-quality-assurance-page .our-services .services-list li.gauge figure {
width: 50px;
}
.studio-quality-assurance-page .our-services .services-list li.chart figure {
width: 40px;
}
.studio-quality-assurance-page .our-services .services-list li.lab figure {
width: 40px;
}
.studio-quality-assurance-page .our-services .services-list li.tower figure {
width: 35px;
} .studio-quality-assurance-page .increase-productivity {
padding: 50px;
color: var(--white);
}
.studio-quality-assurance-page .increase-productivity .content {
background: var(--black);
border-radius: 15px;
padding: 70px 80px;
max-width: 1280px;
position: relative;
overflow: hidden;
}
.studio-quality-assurance-page .increase-productivity .content:before {
content: "";
position: absolute;
top: -140px;
left: -650px;
width: 800px;
height: 800px;
}
.studio-quality-assurance-page .increase-productivity .top {
display: flex;
justify-content: space-between;
position: relative;
z-index: 10;
margin-bottom: 100px;
}
.studio-quality-assurance-page .increase-productivity .top .left {
text-transform: uppercase;
font-size: 15px;
font-weight: normal;
display: flex;
}
.studio-quality-assurance-page .increase-productivity .top .left:before {
content: "";
display: block;
width: 26px;
height: 5px;
background: url(//redesfiepa.org.br/wp-content/themes/fieparedes_theme/css/img/studios/qa/line.svg);
background-size: 100% 100%;
margin-right: 10px;
position: relative;
top: 6px;
}
.studio-quality-assurance-page .increase-productivity .top .right {
}
.studio-quality-assurance-page .increase-productivity .top .right .title {
font-family: var(--vietnam);
font-size: 22px;
margin-bottom: 20px;
font-weight: 400;
line-height: 1.3;
}
.studio-quality-assurance-page .increase-productivity .top .right .title span {
display: block;
}
.studio-quality-assurance-page .increase-productivity .top .right .description {
font-size: 13px;
line-height: 1.5;
}
.studio-quality-assurance-page .increase-productivity .top .right .description span {
display: block;
}
.studio-quality-assurance-page .increase-productivity .studio-list {
display: flex;
align-items: flex-end;
justify-content: flex-end;
position: relative;
gap: 20px;
max-width: 960px;
margin: 0 auto;
}
.studio-quality-assurance-page .increase-productivity .studio-list li {
width: 50%;
transition: var(--transition);
position: relative;
}
.studio-quality-assurance-page .increase-productivity .studio-list li .box-content {
background: #232323;
padding: 30px;
border-radius: 15px;
display: flex;
flex-direction: column;
justify-content: flex-end;
transition: var(--transition);
height: 520px;
width: 100%;
}
.studio-quality-assurance-page .increase-productivity .studio-list li .box-content .title {
font-size: 20px;
margin-bottom: 20px;
line-height: 1.3;
}
.studio-quality-assurance-page .increase-productivity .studio-list li .box-content .title span {
display: block;
}
.studio-quality-assurance-page .increase-productivity .studio-list li .box-content .description {
font-size: 14px;
line-height: 1.6;
}
.studio-quality-assurance-page .increase-productivity .studio-list li.ready .box-content {
background: #161616 url(//redesfiepa.org.br/wp-content/themes/fieparedes_theme/css/img/studios/qa/bg1.png);
background-size: 100% auto;
background-position: top center;
background-repeat: no-repeat;
}
.studio-quality-assurance-page .increase-productivity .studio-list li.mobile .box-content {
background: #161616 url(//redesfiepa.org.br/wp-content/themes/fieparedes_theme/css/img/studios/qa/bg2.png);
background-size: 100% auto;
background-position: top center;
background-repeat: no-repeat;
} .studio-quality-assurance-page .success-stories-component {
margin: 60px 0;
}
@media screen and (max-width: 1280px) { .studio-quality-assurance-page .hero .bottom .left .label {
font-size: 13px;
}
.studio-quality-assurance-page .hero .bottom .left .title {
font-size: 46px;
}
.studio-quality-assurance-page .hero .bottom .left .description {
font-size: 16px;
} .studio-quality-assurance-page .the-studio {
padding: 20px;
}
.studio-quality-assurance-page .the-studio .content {
padding: 50px;
}
.studio-quality-assurance-page .the-studio .top .right .title {
font-size: 20px;
}
.studio-quality-assurance-page .the-studio .studio-list {
flex-wrap: wrap;
height: auto;
justify-content: flex-start;
}
.studio-quality-assurance-page .the-studio .studio-list li {
width: calc(50% - 10px);
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content {
position: relative;
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content:hover {
background: #232323;
height: 320px;
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content:hover .description {
font-weight: normal;
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content:hover .value {
color: transparent;
} .studio-quality-assurance-page .our-services .top .right .title {
font-size: 20px;
}
.studio-quality-assurance-page .our-services .services-list li .title {
font-size: 24px;
} .studio-quality-assurance-page .increase-productivity {
padding: 20px;
}
.studio-quality-assurance-page .increase-productivity .content {
padding: 50px;
}
.studio-quality-assurance-page .increase-productivity .top .right .title {
font-size: 20px;
}
}
@media screen and (max-width: 1024px) { .studio-quality-assurance-page .hero {
height: 700px;
}
.studio-quality-assurance-page .hero .bottom .left .label {
font-size: 12px;
}
.studio-quality-assurance-page .hero .bottom .left .title {
font-size: 32px;
}
.studio-quality-assurance-page .hero .bottom .left .title span {
display: inline;
}
.studio-quality-assurance-page .hero .bottom .left .description {
font-size: 15px;
margin-bottom: 20px;
}
.studio-quality-assurance-page .hero .bottom .left .description span {
display: inline;
}
.studio-quality-assurance-page .hero .bottom {
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
} .studio-quality-assurance-page .the-studio .top {
flex-direction: column;
}
.studio-quality-assurance-page .the-studio .content {
padding: 40px 30px;
}
.studio-quality-assurance-page .the-studio .top .left {
margin-bottom: 20px;
}
.studio-quality-assurance-page .the-studio .top .right .title {
font-size: 18px;
max-width: 100%;
}
.studio-quality-assurance-page .the-studio .top .right .title span {
display: inline;
} .studio-quality-assurance-page .our-services .top {
flex-direction: column;
margin-bottom: 50px;
}
.studio-quality-assurance-page .our-services .top .left {
margin-bottom: 20px;
}
.studio-quality-assurance-page .our-services .top .right .title {
font-size: 18px;
}
.studio-quality-assurance-page .our-services .top .right .title span {
display: inline;
}
.studio-quality-assurance-page .our-services .services-list {
padding-left: 0;
}
.studio-quality-assurance-page .our-services .services-list li .title {
font-size: 22px;
} .studio-quality-assurance-page .increase-productivity .top {
flex-direction: column;
margin-bottom: 50px;
}
.studio-quality-assurance-page .increase-productivity .content {
padding: 40px 30px;
}
.studio-quality-assurance-page .increase-productivity .top .left {
margin-bottom: 20px;
}
.studio-quality-assurance-page .increase-productivity .top .right .title {
font-size: 18px;
max-width: 100%;
}
.studio-quality-assurance-page .increase-productivity .top .right .title span {
display: inline;
} .studio-quality-assurance-page .success-stories-component {
margin: 20px 0;
} .studio-quality-assurance-page .trending-posts {
padding: 20px 0;
}
}
@media screen and (max-width: 767px) { .studio-quality-assurance-page .the-studio .studio-list {
padding-top: 40px;
}
.studio-quality-assurance-page .the-studio .studio-list li {
width: 100%;
height: 200px;
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content {
height: 100%;
}
.studio-quality-assurance-page .the-studio .studio-list li .box-content .value {
font-size: 72px;
} .studio-quality-assurance-page .our-services .services-list li {
width: 100%;
margin-bottom: 40px;
}
.studio-quality-assurance-page .our-services .services-list li .title {
font-size: 20px;
}
.studio-quality-assurance-page .our-services .services-list li .title span {
display: inline;
} .studio-quality-assurance-page .increase-productivity .studio-list {
flex-direction: column;
}
.studio-quality-assurance-page .increase-productivity .studio-list li {
width: 100%;
}
.studio-quality-assurance-page .increase-productivity .studio-list li .box-content {
height: 400px;
}
}