*{margin:0;padding:0;} a, a:hover{text-decoration: none;}
.slick-slider{position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:none}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto}.slick-track:before,.slick-track:after{display:table;content:''}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir='rtl'] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}
html {overflow-x: hidden;} 
body { color: #000;font-family: "kit-rounded", sans-serif; line-height: 1.1;  font-variant-numeric: lining-nums;}
.container {display: block; max-width: 1200px; width: 100%; margin:auto; position: relative; box-sizing: border-box;}
:root {--primaria:#005c7d; --secundaria: #ffab00; --terciaria:#3c4163; --grafite:#2f2f2f;}
@media (max-width: 1200px) {
.container {padding-left: 30px; padding-right: 30px;}
}

.btn {color: #fff; background: var(--primaria); font-family: "kit-rounded", sans-serif; display: block; width: fit-content; font-weight: normal; padding: 0px 50px; cursor: pointer; border:none; height: 40px; line-height: 40px}
.btn-white {color: #000; background: #fafafa;}

/* FLEX DIVS */
.flex {display: flex;}
.flex-between {justify-content: space-between;}
.flex-center {justify-content: center;}
.flex-aling-center {align-items: center;}
.flex-wrap {flex-wrap: wrap;}
@media (max-width: 800px) {
.flex {display: block;}
.flex-mobile {display: flex;}
}

/* MOBILE and DESKTOP */
.desktop {display: block;}
.mobile {display: none !important;}
@media (max-width: 800px) {
.desktop {display: none !important;}
.mobile {display: block !important;}
}

/* HEADER */
.header {background: var(--primaria); padding: 10px 0px}
.header .logo {display: block; margin: auto; width: fit-content;}
.header .logo img {display: block;}
@media (max-width: 800px) {
.header {border-radius: 0px 0px 40px 40px; position: relative; z-index: 2}
}

/* BANNER PRINCIPAL */
.banner img {display: block; width: 100%}
.banner .txt {position: relative; z-index: 2; margin-top: -52px}
.banner h1 {font-size: 8em; color: var(--primaria); font-weight: 700; line-height: 0.9}
.banner p {color: var(--secundaria); display: block; margin-left: 50px; margin-top: -5px; font-size: 1.6em}
.banner .desktop {display: none;}
.banner .container {max-width: 960px}
@media (max-width: 2200px) {
.banner .ultrawide {display: none;}
.banner .desktop {display: block;}
}
@media (max-width: 800px) {
.banner .txt {margin-top: -25px}
.banner img {margin-top: -60px;}
.banner h1 {font-size: 4em; line-height: 1}
}

/* SOBRE */
.sobre {background: var(--secundaria); margin-top: 100px}
.sobre img {display: block; width: 50%}
.sobre .txt {padding-left: 120px;}
.sobre .txt p {display: block; color: #fff; font-size: 2em; font-weight: bold; line-height: 1.2; margin-bottom: 30px}
.sobre .txt p strong {display: block; color: var(--primaria); font-size: 1.4em}
.sobre .txt span {display: block; color: #fff; font-size: 2em; font-weight: bold; width: 250px}
.sobre .txt span big {font-size: 1.4em}
.sobre .txt span small {font-size: 0.5em}
@media (max-width: 2000px) {
.sobre .txt {padding-left: 100px;}
}
@media (max-width: 1650px) {
.sobre img {margin-left: -10%; width: 60%}
.sobre .txt {padding-left:80px;}
}
@media (max-width: 800px) {
.sobre {margin:30px; box-sizing: border-box; border-radius: 30px; padding: 30px; position: relative; z-index: 2; background: url('../img/bg-mobile.png') no-repeat center; background-size: cover;}
.sobre img {display: none;}
.sobre .txt {padding: 0px; text-align: center;}
.sobre .txt p {font-size: 1.5em;}
.sobre .vagas big {display: block;}
.sobre .txt span {margin: auto;}
}

.localizacao {background: var(--primaria); color: var(--secundaria); padding:100px 0px; position: relative; overflow: hidden;}
.localizacao h2 img {display: block; margin-bottom: 15px}
.localizacao h2 span {display: block;}
.localizacao h2 {display: block; margin-bottom: 30px; font-size: 2em}
.localizacao p {display: block; margin-bottom: 10px; color: #fff}
.localizacao strong {display: block; font-size: 1.4em; line-height: 1.4}
.localizacao iframe {display: block; width: 50%; position: absolute; border: none; top: 0px; left: 50%; height: 100%}
.localizacao .dividir {display:block; margin-top: 30px; margin-bottom: 0px; margin-left: -50px;}
@media (max-width: 800px) {
.localizacao {padding-top: 400px; margin-top: -350px; padding-bottom: 50px; border-radius: 0px 0px 40px 40px}
.localizacao {display: flex; flex-wrap: wrap-reverse;}
.localizacao .dividir {width: 100%;margin-left: 0}
.localizacao iframe {display: block; width: 100%; position: relative; top: auto; left: auto; height: 250px; border-radius: 20px; margin-bottom: 50px}
.localizacao strong {font-size: 1em; text-align: center;}
.localizacao h2 {display: flex; align-items: center; font-size: 1.5em; width: fit-content; margin: auto; margin-bottom: 20px}
.localizacao h2 span {display: inline-block; margin-left: 10px}
.localizacao h2 img {margin-bottom: 0px; margin-right: 10px; width: 20px}
.localizacao p {text-align: center;}
}

/* ITENS SOLTOS NO LAYOUT */
.background {display: block; width: 100%; height: 290px; background: #fff url('../img/background.png') no-repeat center top;}
.villa-banner {display: block; width: 100%}
@media (max-width: 800px) {
.background {background: #fff url(../img/background-mobile.png) no-repeat center top; background-size: 100%; margin-top: -50px; height: 250px}
}

/* NÚMEROS */
.numeros {background: url('../img/bg2.png') no-repeat center; background-size: cover; padding: 100px 40px; color: #fff}
.numeros h2 {display: block; width: 100%; text-align: center; font-size: 4.5em; margin-bottom: 40px}
.numeros h2 strong {font-size: 0.8em}
.numeros strong {color: var(--secundaria);}
.numeros .item {padding: 0px 40px;align-items: flex-start; box-sizing: border-box; max-width: 25%}
.numeros .item p {font-size: 1.2em; display: block; max-width: 190px; line-height: 1.2}
.numeros .item strong {display: block; font-size: 1.8em; max-width: 220px; margin-top:5px}
.numeros .item .img {display: block; margin-right: 30px}
.numeros .item .img img {display: block;}
.numeros .item small {display: block; max-width:150px; line-height: 1.4; font-style: italic; margin-top: 20px; position: relative;}
.numeros .item small:after {display: block; width: 60px; height: 2px; background: #fff; position: absolute; top: -10px; left: 0px; content: ''}
@media (max-width: 800px) {
.numeros {padding: 50px 30px; border-radius: 0px 0px 40px 40px}
.numeros h2 {font-size: 2em; margin-bottom: 60px}
.numeros h2 strong {display: block;}
.numeros .item {padding: 0px; margin: auto; width: 100%; justify-content: space-between; margin-top: 50px; align-items: center; max-width: 100%}
.numeros .item .txt {width: calc(50% - 15px);}
.numeros .item-reverso {flex-direction: row-reverse; text-align: right;}
.numeros .item-reverso p, .numeros .item-reverso strong, .numeros .item-reverso small {margin-left: auto;}
.numeros .item img {margin-left: auto;}
.numeros .item-reverso img {margin-right: auto; margin-left: 0}
.numeros .item .img {margin-left: 0px; margin-right: 0px; width: calc(50% - 15px)}
.numeros .item p {font-size: 0.9em}
.numeros .item-reverso small:after {left: auto; right: 0px}
.numeros .item strong {font-size: 1.6em}
}

/* MARCAS */
.marcas {display: block; margin-top: 100px}
.marcas h2 {display: block; font-size: 2em; color: var(--primaria); text-align: center; margin-bottom: 50px; line-height: 1.2}
.marcas h2 strong {display: block; font-size: 1.4em; color: var(--secundaria);}
.marcas .item img {display: block; margin: auto;}
.marcas .item {display: flex; align-items: center; height: 566px; width: 33.3%; background: #000}
@media (max-width: 800px) {
.marcas {display: block; margin-top: 50px}
.marcas h2 {font-size: 1.5em;}
.marcas .item img {height: 50px}
.marcas .item {height: 120px; width: 100%}
}

/* FORMULÁRIO */
.form {margin-top: 100px; padding-bottom: 450px; background: url('../img/background2.png') no-repeat center bottom; background-size: 100%}
.form .img {width: 50%;}
.form .txt {width: 50%; box-sizing: border-box; padding-left: 100px}
.form .txt h2 {text-align: center; color: #008cb2; font-size: 3em; margin-bottom: 30px}
.form .txt h2 strong {display: block; color: var(--secundaria); font-weight: normal; font-size: 0.7em}
.form .input {display: block; border:none; width: 100%; outline: none; font-family: "kit-rounded", sans-serif; font-size: 15px; margin-bottom: 15px; height: 40px; box-sizing: border-box; padding-left: 10px; padding-right: 10px; background:#e8e8e8;}
.form .checkbox {margin-left: 10px; margin-bottom: 20px; margin-top: 25px}
.form .checkbox input {margin-right:15px}
.form .checkbox label {cursor: pointer; color: var(--primaria); line-height: 8px}
.form .slick-app .item img {display: block; width: 100%}
.form .slick-app .slick-dots {display: flex; align-items: center; justify-content: center; margin-top: 10px}
.form .slick-app .slick-dots li {display: block;}
.form .slick-app .slick-dots button {display: block; border-radius: 50px; border: 4px solid #005c7d; transition: 0.5s; background: #005c7d; width: 12px; height: 12px; cursor: pointer; outline: none; font-size: 0px; margin: 0px 5px;}
.form .slick-app .slick-active  button {border: 4px solid #eb8414; background: #fff;}
@media (max-width: 800px) {
.form .txt h2 {font-size: 2em}
.form .txt {padding: 0px; width: 100%}
.form .input {border-radius: 5px}
.form .checkbox label {display: block; line-height: 1.2; font-size: 0.8em}
.form .btn {width: 100%; box-sizing: border-box; border-radius: 5px}
.form {margin-top: 50px; padding-bottom: 150px; background: url('../img/background2-mobile.png') no-repeat center bottom; background-size: 100%}
.form .img {width: calc(100% + 60px); margin-left: -30px; margin-bottom: 50px}
.form .slick-app .item {box-sizing: border-box; padding:15px}
.form .slick-app .item img {border-radius: 20px}

}


.footer {display: block; border-radius: 50px 0px 0px 0px; background: #005c7d; padding: 50px 0px; color: #fff; position: relative; margin-top: -2px}
.footer:after {content: ''; position: absolute; top: 0px; left: 50%; border-radius: 50px 0px 0px 0px; background: #008cb2; width: 100%; height: 100%}
.footer .container {z-index: 2;}
.footer .part1 {width: 50%}
.footer .part1 .logo {display: block; margin-bottom: 30px}
.footer .part1 .instagram span {display: block; color: #fff; margin-left: 15px; padding-left: 15px; border-left: 2px solid #fff}
.footer .part1 .instagram img {display: block;}
.footer .part1 p {display: block; margin-bottom: 20px; line-height: 1.2}
.footer .part1 .maps a {display: block; margin-right: 20px;}
.footer .part1 .maps a {display: block; margin-right: 20px;}
.footer .part2 {width: 50%; box-sizing: border-box; padding-left: 100px}
.footer .part2 a {display: block; color: #fff; margin-bottom: 15px}
.footer .dividir {display:block; margin-top: 30px; margin-bottom: 0px; margin-left: -50px;}
@media (max-width: 800px) {
.footer:after {display: none;}
.footer {border-radius: 50px 50px 0px 0px;}
.footer .part1 .logo {width: 200px; margin:auto; margin-bottom: 50px}
.footer .part2, .footer .part1 {width: 100%; padding-left: 0px}
.footer .part2 a {text-align: center;}
.footer .dividir {width:100%; margin-left: 0px;}
.footer .part2 {margin-top: 30px}
.footer .part1 p {text-align: center; margin-top: 30px}
.footer .maps, .footer .instagram {margin:auto; width: fit-content;}
.footer .maps {margin-bottom: 30px}
.footer .maps a:last-child{margin:0;}
.footer a img {display: block; width: 35px}
}





