/*página*/
@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,400;0,500;0,600;1,400;1,500;1,600&display=swap');
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    outline: none;
    font-family: 'Rubik', sans-serif;
}
body {
    background-color: rgb(213, 212, 212);
}
section,
footer {
    padding:10px 0px 13px 0px;
}
h3 {
    font-size: 40px ;
    font-style: oblique;
}
h4 {
    font-size: 20px;
}
p {
    color: black;
}
.container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 2%;
}
/*fim da página*/
/*botão*/
.btn {
    background-color: #ebdbc5;
    border: 2px solid black;
    color: #000000;
    padding: 5px 15px;    
    border-radius: 10px;    
    cursor: pointer;
    display: inline-block;
    transition: 0.4s;
}
.btn:hover {
    background-color: #e8ca9f;
}
/*fim do botão*/
/*header*/
header {
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}
/*fim do header*/
/*menu*/
nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 20px;
}
nav ul {
    display: flex;
    align-items: center;
}
nav ul a {
    color: black;
    margin: 0 15px;
    text-transform: uppercase;
    font-size: 14px;
    display: block;
}
nav ul a:not(.btn):after {
    content: "";
    background-color: #000000;
    height: 4px;
    width: 0%;
    display: block;
    margin: 0 auto;
    transition: 0.4s;
}
nav ul a:hover::after {
    width: 100%;
}
/*fim menu*/
/*menu mobile*/
nav .menu-icon {
    cursor: pointer;
    font-size: 30px;
    color: #000000;
    display: none;
}
nav .close-icon {
    display: none;
    font-size: 30px;
    color: #000000;
}
/*fim menu mobile*/
/*banner*/
.banner {
    display: flex;
    justify-content: center;
}
.banner .banner-text {
    margin: 150px 0px;
    text-align: center;
    padding: 0 90px;
}
.banner .banner-text h3 {
    color: #000000;
}
.banner .banner-text p {
    font-size: 30px;
    color: #000000;
    font-weight: lighter;
    margin: 18px 0;
}
/*fim banner*/
/*faça mais*/
.faca-mais .container {
    display: flex;
    align-items: center;
}
.faca-mais .faca-mais-text {
    width: 50%;
    padding: 0 40px;
}
.faca-mais .faca-mais-text p {
    margin: 5px 0 10px 0;
    text-align: justify;
}
.faca-mais .faca-mais-img {
    width: 50%;    
}
.faca-mais .faca-mais-img img {
    width: 100%;
}
/*fim faça mais*/
/*comentários*/
.depoimentos h3 {
    text-align: center;
}
.depoimentos h4 {
    text-align: center;
}
.depoimentos p {
    margin-bottom: 10px;
    text-align: center;
}
.cards {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.depoimentos .card-item {
    background-color: #ebdbc5;
    border: 2px solid #000000;
    margin: 15px;
    padding-top: 10px;
    border-radius: 14px;
    text-align: center;
    width: 130px;
    transition: 0.4s;
}
.depoimentos .card-item img {
    width: 100px;
    height: 100px;
    border-radius: 100px;
    display: block;
    margin: 5px auto;
}
.depoimentos .card-item .nome-user {
    font-weight: 600px;
    font-size: 18px;
    color: #472757;
    margin-top: 5px;
}
.depoimentos .card-item .redes img {
    width: 30px;
    height: 30px;    
    float: left;    
    margin-left: 17px;
    margin-right: 15px;
    margin-top: -3px;
}

.depoimentos .card-item:hover {
    background-color: #e8c38f;
    }

/*fim dos comentários*/
/*footer*/
.footer {
    background-color: #ebdbc5;
    text-align: center;
}
.footer i {
    color: black;
    font-size: 25px;
    background-color: white;
    padding: 10px;
    border-radius: 10px;
}
.footer p {
    font-size: 13px;
    margin-top: 15px;
    margin-bottom: 4px;
    color: #000000;
}
/*fim do footer*/
/*desenvolvido o site*/
.dados {
    margin-top: 5px;
    padding-bottom: 5px;
    background-color: black;
    text-align: center;
}
.dados .lei a { 
    float: center;
    color: grey;
    padding-right: 30px;
}
.aloisio {
    background-color: black;
    text-align: center;
}
.fim .aloisio p {
    padding: 8px;
    color: white;
}
/*fim de desenvolvido o site*/
/*pagina sobre*/
.sobre {
    display: flex;
    justify-content: center;
    margin-bottom: 15px;
}
.sobre .sobre-text {
    margin: 15px -60px;
    text-align: center;
    padding: 0 90px;
}
.sobre .sobre-text h3 {
    color: #000000;
}
.sobre .sobre-text p {
    font-size: 18px;
    color: #000000;
    font-weight: lighter;
    margin: 18px -10px;
}
/*fim pagina sobre*/
/*pagina de servicos*/
.servicos {
    display: flex;
    justify-content: center;
}
.servicos .servicos-text {
    margin: 15px -60px;
    text-align: center;
    padding: 0 90px;
}
.servicos .servicos-text h3 {
    color: #000000;
}
.servicos .servicos-text p {
    font-size: 18px;
    color: #000000;
    font-weight: lighter;
    margin: 18px -10px;
}
.servicos .rows-cards {
    display: flex;
    justify-content: center;
    margin-top: 20px;
    flex-wrap: wrap;
}
.servicos .row-card-item {
    background-color: #ebdbc5;
    width: 350px;
    padding: 20px;
    border-radius: 14px;
    margin: 10px;
    transition: 0.3s;
}
.servicos .row-card-item:hover {
    background-color: #e8c38f;
}
.servicos .row-card-item img {
    background-color: black;
    border-radius: 14px;
    width: 180px;
    padding: 2px;
}
.servicos .row-card-item .btn{
    position: absolute;
    margin-left: 25px;
    margin-top: 40px;
}
/*fim da pagina de servicos*/
/*pagina de contato*/
.contato-info{
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
}
.contato-info .left-side{
    width: 50%;
    padding: 30px;
    background: #ebdbc5;
    border-radius: 14px;
    margin-right: 50px;
    height: fit-content;
    border: 2px solid black;
}
.contato-info .left-side div{
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}
.contato-info .left-side div i{
    font-size: 24px;
    margin-right: 20px;    
}
.contato-info .left-side p{
    font-size: 14px;
}
.contato-info .left-side .rua{
    margin-left: 10px;
}
.contato-info .left-side .postal{
    margin-left: 45px;
    margin-top: -10px;
}
.contato-info .left-side .tel{
    margin-left: 5px;
}
.contato-info .left-side .nos{
    margin-left: 45px;
    margin-top: -10px;
}
.contato-info .right-side{
    width: 50%;
}
.contato-info .right-side input{
    display: block;
    width: 100%;
    margin-bottom: 10px;
    height: 47px;
    padding: 15px;
    border-radius: 9px;
    transition: 0.3s;
    border: 2px solid black;
    font-weight: lighter;
}
.contato-info .right-side input:focus,
.contato-info .right-side textarea:focus{
    border-color: #e8c38f;
}
.contato-info .right-side textarea{
    border: 2px solid black;
    border-radius: 9px;
    margin-bottom: 10px;
    padding: 15px;
    width: 100%;
    resize: none;
}
/*fim pagina de contato*/
/*menu mobile*/
@media(max-width: 830px) {    
    .ul {
        position: fixed;
        top: 0;
        left: 0;
        background: #ebdbc5;
        height: 100%;
        width: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        clip-path: circle(0% at 100% 0);
        transition: 0.7s;
    }
    .ul.open {
        clip-path: circle(141.4% at 100% 0);
    }
    .ul a {
        margin: 15px 0;
        font-size: 15px;
    }
    nav .menu-icon {
        display: block;
    }
    nav .close-icon {
        display: block;
        position: absolute;
        top: 46px;
        right: 28px;
    }
    /*fim menu mobile*/
    /*pagina responsiva*/
    .faca-mais .faca-mais-text{
        margin-top: 10px;
        padding: 0 20px;
        order: 1;
    }
    .faca-mais .container{
        flex-direction: column;
    }
    .faca-mais .container .faca-mais-text h3{
        font-size: 30px;
    }
    .faca-mais .faca-mais-text,
    .faca-mais .faca-mais-img{
        width: 100%;
    }
    /*index - banner*/
    .banner .banner-text {
        padding: 0;
        margin: 80px;
    }    
    .banner .banner-text p {
        font-size: 15px;
    }
    /*fim index - banner*/    
    /*index - faça mais*/
    .faca-mais .faca-mais-text {
        margin-top: 10px;
        padding: 0 20px;
        order: 1;
    }
    .faca-mais .container {
        flex-direction: column;
    }
    .faca-mais .faca-mais-text h3 {
        font-size: 25px;
    }
    .faca-mais .faca-mais-text,
    .faca-mais .faca-mais-img {
        width: 100%;
    }
    /*fim index - faça mais*/    
   /*index - depoimentos*/
    .depoimentos .container h3{
        text-align: center;
        font-size: 20px; 
    }
    .depoimentos .container h4{
        font-size: 15px; 
    }
    .cards .card-item img{
        margin: 10px auto;
    }
    /*fim index - depoimentos*/
    /*pagina contato*/
    .contato .contato-info{
        flex-direction: column-reverse;
    }
    .contato-info .left-side,
    .contato-info .right-side{
        width: 100%;
    }
    .contato-info .right-side{
        margin-bottom: 40px;
    }
    /*fim pagina contato*/
}
    /*fim da pgina responsiva index*/