@import "reset.css";
body{  font-family: "Archivo", sans-serif; font-weight: 400; color: #1C210A; font-size: 16px; }
.container{ width: 1400px; margin: 0 auto; position: relative; }

.modal-sucesso{ background: #010101; position: fixed; top: 0; right: 0; width: 100%; height: 100%; z-index: 9999; }
.modal-sucesso .box{ overflow: hidden; position: absolute; top: 50%; background: #fff; left: 50%; transform: translate(-50%, -50%); text-align: center;width: 400px; border-radius: 30px; color: #4c0010; padding: 70px 80px; display: flex; align-items: center; justify-content: center; }
.modal-sucesso .box h2{ color: #010101; text-transform: uppercase; font-size: 30px; }
.modal-sucesso .box a{ font-family: "Archivo", sans-serif; font-weight: bold; background: #ffe0a1; color: #010101; font-size: 16px; text-transform: uppercase; position: absolute; right: 0; top: 0; padding: 10px 30px; }

.topo{ background: #010101; width: 100%; height: 750px; position: relative; }
.topo .container{display: flex; justify-content: space-between; align-items: center;  }
.topo .links{ padding: 30px 0; }
.topo .menu{display: flex; justify-content: space-between; align-items: center; }
.topo .menu ul{display: flex; justify-content: center; align-items: center; }
.topo .menu ul li{ margin: 0 30px; }
.topo .menu ul li a{ font-weight: 600; color: #ffe0a1; text-transform: uppercase; font-size: 16px; }
.topo .menu .botao{ background: #ffe0a1; padding: 10px 15px; border-radius: 10px; display: flex; margin-left: 30px; align-items: center; justify-content: center; position: relative; }
.topo .menu .botao span{ font-weight: 600; color: #010101; text-transform: uppercase; font-size: 16px; }
.topo .menu .botao::before{  content: ""; background: url(../img/down.png); width: 22px; height: 23px; display: inline-block; margin-right: 10px; background-size: 22px 23px; }
.topo .banner img{ width: 100%; height: auto; }

.cadastro{ background: #010101; padding: 220px 0 40px 0; }
.cadastro .title{ max-width: 700px; display: flex; justify-content: center; align-items: center; flex-direction: column; text-align: center; margin: 0 auto 50px auto; }
.cadastro .title h1{  color: #ffe0a1; font-size: 40px; text-transform: uppercase; }
.cadastro .form{ max-width: 700px; display: flex; justify-content: center; align-items: center; flex-direction: column; margin: 0 auto 50px auto; }
.cadastro .form input{ background: none; width: 100%; border: none; margin-bottom: 20px; border-radius: 50px; padding: 20px 20px; border: #ffe0a1 solid 2px; color: #ffe0a1;  font-family: 'Archivo'; font-weight: bold; font-size: 18px; }
.cadastro .form input::placeholder { color: #ffe0a1; }
.cadastro .form .radio{ margin: 20px 0 40px 0; display: flex; align-items: center;  }
.cadastro .form .radio span{ color: #ffe0a1; text-transform: uppercase; font-family: 'Archivo'; font-weight: bold; font-size: 16px; line-height: 130%; width: 100%;  }
.cadastro .form .radio input[type="radio"]{ margin: 0 10px 0 0; width: 20px; height: 20px; }
.cadastro .form .radio label{ display: flex; align-items: center; margin: 0 0 0 20px; font-family: 'Archivo'; font-weight: bold; font-size: 16px; color: #ffe0a1; text-transform: uppercase; }
.cadastro .form .check{display: flex; align-items: center; width: 70%; }
.cadastro .form .check input[type="checkbox"]{ margin: 0 10px 0 0; width: 32px; height: 32px; }
.cadastro .form .check span{ color: #ffe0a1; font-family: 'Archivo'; font-weight: bold; font-size: 11px; line-height: 130%; width: 100%;  }
.cadastro .form button{ background: #ffe0a1; border: none; transition: .5s; color: #010101; text-transform: uppercase; font-family: 'Archivo'; font-weight: bold; font-size: 20px; padding: 10px 30px;  }
.cadastro .form .flex{ align-items: start; margin: 20px 0 0 0;  justify-content: space-between; }
.cadastro .form button:hover{ background: #01240F; color: #ffe0a1;  }
.cadastro .politica { background: #ffe0a1; border: #ffe0a1 solid 1px; display: block; text-align: center; margin: 0 0 30px 0;  transition: .5s; color: #01240F; text-transform: uppercase; font-family: "Archivo", sans-serif; font-weight: bold; font-size: 20px; padding: 10px 30px; width: calc(100% - 60px); }
.cadastro .politica:hover{ background: none; color:#ffe0a1; }

.instagram{ background: #ffe0a1; padding: 40px 0 40px 0; }
.instagram .top{ border: #010101 solid 2px; padding: 20px 40px; display: flex; align-items: center; justify-content: space-between; }
.instagram .top .title { display: flex; align-items: center; justify-content: start; }
.instagram .top .title img{ border-radius: 50px; width: 50px; height: 50px; object-fit: cover; margin-right: 18px; }
.instagram .top .title span{  font-weight: bold; font-size: 16px; text-transform: uppercase; }
.instagram .top .elements{ margin-left: 20px; display: flex; justify-content: end; }
.instagram .top .elements img{ max-width: 90%; height: auto;}
.instagram .cont{ border-left: #010101 solid 2px; border-bottom: #010101 solid 2px; border-right: #010101 solid 2px; padding: 20px 40px 0 40px; display: flex; align-items: center; justify-content: space-between; }
.instagram .cont img{ border-radius: 20px; }

.sobre{background: url(../img/bg-sobre.jpg) no-repeat; background-size: cover; padding: 100px 0; min-height: 1200px; }
.sobre .title { margin: 0 0 40px 0;  }
.sobre .title img{ max-width: 80%; height: auto; }
.sobre .text{ width: 50%; }
.sobre .text p{ font-size: 18px; font-weight: 400; margin-bottom: 20px; color: #ffe1a2;  }
.sobre .text ul{ margin-bottom:20px; }
.sobre .text ul li{ font-size: 18px; font-weight: 400; margin-bottom: 8px; color: #ffe1a2;  }

.artista{ position: relative; width: 100%; background: url(../img/bg-artista.jpg) top center no-repeat; background-size: cover; padding:70px 0 330px 0; }
.artista img{ max-width: 80%; height: auto; }
.artista .title{ display: flex; align-items: center; justify-content: center; margin-bottom: 60px; }
.artista .cont{ display: flex; align-items: start; justify-content: center; margin-bottom: 60px; flex-wrap: wrap; }
.artista .cont .item{ width: calc(100% / 4 - 40px); margin: 0 20px; }
.artista .cont p{ text-transform: uppercase; color: #ffe0a1; font-size: 17px; font-weight: 600; margin-bottom: 5px; }
.artista .artes{  max-width: 100%; height: auto; }
.artista .linha-top{ position: absolute; top: 0; left: 0;  max-width: 100%; height: auto; }
.artista .linha-bottom{position: absolute; bottom: 0; left: 0;  max-width: 100%; height: auto; }

.pira{background: url(../img/bg-pira.jpg) top right no-repeat; background-size: cover; padding: 100px 0; min-height: 600px; }
.pira .cont{ width: 50%; }
.pira .cont img{ max-width: 80%; height: auto; margin-bottom: 40px; }
.pira .cont p{ font-size: 18px; font-weight: 400; margin-bottom: 20px; color: #fff;  }

.lista{ background: url(../img/bg-lista.jpg) top right no-repeat; background-size: cover; padding: 120px 0;  }
.lista .item{ display: flex; align-items: center; justify-content: space-between; margin-bottom: 70px;  }
.lista .item .text{ margin-right: 50px; width: 50%; }
.lista .item .text h3{ color: #ffe1a2; text-transform: uppercase; font-weight: 300; font-size: 24px; margin-bottom: 10px; }
.lista .item .text h4{ color: #ffe1a2; font-weight: 600; font-size: 56px; margin-bottom: 25px; }
.lista .item .text p{ color: #ffe1a2; font-weight: 400; font-size: 18px; margin-bottom:10px;  }
.lista .item img{ width: 47%; height: auto; }
.lista .item:nth-child(2) .text{ order: 2; margin-left: 50px; margin-right: 50px; }
.lista .item:nth-child(2) img{ order: 1; }

.rodape{ background: #180802; padding: 50px 0; }
.rodape img{ max-width: 100%; height: auto; }
.rodape .container{ display: flex; align-items: center; justify-content: center; }

/* Responsivos */
/* X-Large devices (large desktops, less than 1400px) */
@media (max-width: 1450.98px) { 
    .container{ width: 1200px; } 
    .topo{ height: 600px; } 
    
   
}

/* Large devices (desktops, less than 1200px) */
 @media (max-width: 1199.98px) {
    .container{ width: 90%; }
    .topo{ height: auto; padding-bottom: 30px; } 
    .instagram{ padding:50px 0; } 
    .artista .cont p{ font-size: 15px; }
    .sobre .text{ width: 60%; }
    .pira .cont{ width: 60%; }
    

}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) { 
    .topo .menu ul{ display: none; }
    .topo .menu .botao{ margin-left: 0; }
    .artista{ padding-bottom: 70px; }
    .artista .cont p{ font-size:14px; }
    .artista .cont .item{ width: calc(100% / 2 - 40px); margin-bottom: 40px; text-align: center; }
    .sobre{ background: #012410; min-height: auto;}
    .sobre .text{ width: 100%; }
    .sobre .text p{ font-size: 18px; }
    .pira{ min-height: auto;}
    .pira .cont{ width: 100%; }
    .pira .cont p{ font-size: 18px; }
    .lista{ padding: 70px 0; }
    .lista .item{ flex-direction: column; }
    .lista .item .text{ order: 2; margin: 50px 0 50px 0; width: 100%;  }
    .lista .item img{ order: 1; width: 100%;  }
    .lista .item .text h3{ font-size: 20px; }
    .lista .item .text h4{ font-size: 40px; }
    .lista .item .text p{ font-size: 18px; }
    .lista{ background: #4f1900; }
    .lista .item:nth-child(2) .text{ margin-left: 0; margin-right: 0; }
    .cadastro{ padding: 40px 0; }
    .cadastro .title{ width: 85%; }
    .cadastro .form{ width: 85%; }
    .cadastro .form input{ width: 93%; }
    

}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) { 
 .instagram .top{ padding: 20px; }
 .instagram .top .title img{ width: 40px; height: 40px; }
 .instagram .top .title span{  font-size: 13px; }
 .instagram .cont{ padding: 20px 20px 0 20px; }
 .modal-sucesso .box{ width: 50%; }
 .modal-sucesso .box h2{ font-size: 20px; }
 .cadastro .form .flex{ flex-direction: column; }
 .cadastro .form .check{ width: 100%; margin-bottom: 40px; }
 .cadastro .form button{ margin: 0 0 0 auto; }
 .cadastro .title h1{ font-size: 30px; }
 .cadastro .form input{ font-size: 15px; }
 .cadastro .form .radio span{ font-size: 13px; }
 .cadastro .form .radio label{ font-size: 13px; }
  
}

/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
    .artista .cont .item{ width: calc(100% / 1 - 40px); }



}