@font-face {
  font-family: 'LT Flode Nue';
  src: url('../fontes/LTFlodeNeue-Bold-BF65dfe058b1041.otf');
}

@font-face {
  font-family: 'Roboto Regular';
  src: url('../fontes/Roboto-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Bold';
  src: url('../fontes/Roboto-Bold.ttf') format('truetype');
}


h1, h2 {
  font-family: 'LT Flode Nue', sans-serif !important;
  font-weight: 700 !important;
}

h5, p, span, a, li, small  {
  font-family: 'Roboto', sans-serif !important;
  font-weight: 500 !important;
}

h3, h4, .btn-primario, .btn-secundario, footer small a {
  font-family: 'Roboto', sans-serif !important;
  font-weight: 700 !important;
}

h1 {
  font-size: clamp(2rem, 4vw + 1rem, 2.875rem) !important; 
}

h2 {
  font-size: clamp(1.75rem, 3.5vw + 0.5rem, 2.5rem); 
}

h3 {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2rem); 
}

h4 {
  font-size: clamp(1.25rem, 2.5vw + 0.5rem, 1.5rem);
}

h5 {
  font-size: clamp(1rem, 2vw + 0.25rem, 1.125rem);
}

p, span {
  font-size: clamp(0.875rem, 1.2vw + 0.5rem, 1.125rem);
}

small {
  font-size: clamp(0.75rem, 1vw, 0.75rem);
}

/*tags*/
img {
  width: 100%;
}

/* botões */
.btn-primario, .btn-secundario {
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -ms-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}

.btn-primario {
  background-color: #FF4444 ;
  padding: .5rem 3rem;
  color: #fff;
  border-radius: 5px;
  display: inline-block;
}

.btn-primario:hover {
  background-color: #F72929;
}

.btn-secundario {
  background-color: transparent;
  padding: .5rem 3rem;
  color: #fff;
  border: 2px solid #fff;
  border-radius: 5px;
  display: inline-block;
}

.btn-secundario:hover {
  background-color: #fff;
  color: #1D1D35;
}

/* classes */
.text-right {
  text-align: right !important;
}

.flex1 {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.flex2 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.error {
  color: #E33E38;
  border-color: #E33E38;
}

.mb-200 {
  margin-bottom: 200px !important;
}

/* Bootstrap */
.form-check-input:checked {
  background-color: #0016D2 !important;
  border-color: #0016D2 !important;
}

.form-check-input:focus,
.form-control:focus {
  box-shadow: none !important;
}

/* cores */
.beneficios h2,
.beneficios h4,
.planos h2,
.planos h3 {
  color: #1D1D35;
}

.beneficios p,
.planos li {
  color: #7c7c7c;
}

/* menu */ 
.menu {
  padding: 2rem 0;
}

.menu img {
  height: 30px;
  width: auto;
}

/* header */
header {
  background-color: #1D1D35;
}

header h1, header p {
  margin-bottom: 1rem !important;
  color: #fff;
}

header h1{
  max-width: 550px;
  margin-top: 1rem;
}

header p {
  line-height: 1.5rem;
}

.main .col-lg-6:nth-child(1){
  display: flex;
  flex-direction: column;
  align-items: center;
}

.main .row{
  display: flex;
  flex-direction: column-reverse;
  justify-content: center;
  align-items: center;
}

/* Keep park */
.keep-park{
  background: #684FAA;
  color: #fff !important;
  padding: 50px 0;
}

.keep-park .row > div:first-child img{
  width: 300px !important;
}

.keep-park ul li{
  display: flex;
  margin: .6rem 0;
  font-size: 14px;
  font-weight: 700 !important;
}

.keep-park ul li img{
  width: 20px;
  height: 20px;
  margin-right: 12px;
}

/* Benefícios */
.beneficios {
  padding-top: 50px;
}

.beneficios h2 {
  text-align: center;
  margin-bottom: 2rem;
}

.beneficios img {
  height: 150px;
  width: auto;
  margin-right: 1rem;
}

.item-bene {
  display: flex;
  align-items: center;
  margin-bottom: 3rem;
}

/* Funcionalidades */
.funcionalidades {
  background-color: #0FA659;
  color: #fff;
  padding: 50px 0;
}

.funcionalidades h2 {
  text-align: center;
  margin-bottom: 3rem;
}

.funcionalidades h5 {
  text-align: center;
}

.funcionalidades img {
  width: auto;
  height: 100px;
  margin: 2rem auto 1rem;
  display: block;
}

/* Planos */
.planos{
    padding: 50px 0;
}

.planos h2 {
  margin-bottom: 3rem;
}

.planos h2 {
  text-align: center;
  font-size: 32px !important;
  margin-bottom: 1rem;
  color: #684FAA;
}

.planos li {
  line-height: 2;
  font-size: 25px;
  font-weight: 700 !important;
  color: #1D1D35;
}

.plano-basico {
  background: rgba(113, 113, 113, .1);
  padding: 5rem !important;
  border-radius: 30px;
  position: relative;
}

.plano-basico li {
  text-align: left;
}

.plano-basico li::before{
  content:"";
  display: block;
  position: absolute;
  left: 3rem;
  width: 11px;
  height: 23px;
  border-width: 0 5px 5px 0;
  border-style: solid;
  border-color: #ff4444;
  transform-origin: bottom left;
  transform: rotate(45deg);
}

.adicionais {
  position: relative;
}

.adicionais li::before {
  content:"+";
  display: block;
  position: absolute;
  left: -2rem;
  color: #0fa659;
  font-size: 43px;
    font-family: 'LT Flode Nue', sans-serif;
    line-height: 1.5;
}

/* Orçamento */
.orcamento {
  padding: 50px 0;
  background-color: #684FAA;
  color: #fff;
}

.form-orcamento {
  background: rgba(255, 255, 255, .1);
  padding: 5rem;
  border-radius: 30px;
}

.form-orcamento input,
.form-orcamento select {
  margin-bottom: 1rem;
}

.form-orcamento .btn-primario {
  margin: 0 auto;
  display: block;
}

/* Rodapé */
footer {
  background-color: #684FAA;
  color: #fff;
  text-align: center;
  padding: .5rem 0;
}

footer a,
footer a:hover {
  font-weight: 700;
  color: #fff;
}

/* Ondas */
.onda-header img {
  background-image: linear-gradient(to bottom, #1d1d35 97%, #ffffff 10%);
}

.onda-header:nth-of-type(2) img {
  background-image: none !important;
  transform: rotate(180deg) !important;
  position: relative;
  bottom: 1px;
}

.onda-bene img {
  position: relative;
  top: 1px;
}

.onda-reverse img {
  position: relative;
  bottom: 1px;
  background-image: linear-gradient(to bottom, #fff 98%, #0FA659 10%);
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

/* Scroll */
#scroll::-webkit-scrollbar-track {
	border-radius: 10px;
	background-color: #f4f6fa ;
  border: 1px solid #e7e7e7;
}

#scroll::-webkit-scrollbar {
	width: 12px;
	background-color: #f4f6fa ;
  border: 1px solid #e7e7e7;
}

#scroll::-webkit-scrollbar-thumb {
	border-radius: 10px;
	background-color: #E33E38;
}