@charset "UTF-8";
/* //________________________PRIMEIRO CAPÍTULO_______________________________
// Variáveis
$cor-principal: #fa58b6; //Se cria variável com o dolar $
$cor-secundária: #270082;

@mixin reset {
  //Se cria função arroba
  margin: 0;
  padding: 0;
}

@mixin cor-e-texto($cor-de-fundo, $cor-do-texto) {
  width: 50%;
  background-color: $cor-de-fundo;

  .texto {
    margin-top: 40%;
    text-align: center;
    font-size: 100px;
    color: $cor-do-texto;
  }
}

body {
  @include reset()
    //Chamando a função || Não precisa dos parenteses, se n tiver os parâmetros
;
}

.container {
  height: 100vh;
  display: flex;

  .esquerda {
    @include cor-e-texto($cor-principal, $cor-secundária);
  }

  .direita {
    @include cor-e-texto($cor-secundária, $cor-principal);
  }
}

*/
html,
body {
  font-family: "Roboto", sans-serif;
}

nav {
  text-align: center;
}
nav ul li {
  display: inline-block;
  padding: 1rem;
}
nav ul li a {
  text-transform: uppercase;
  text-decoration: none;
  font-weight: bold;
  color: #1A120B;
}
nav ul li a:hover {
  border-bottom: 2px solid #3C2A21;
}

.banner {
  background: url(../../imagens/banner.jpeg) 27% center no-repeat;
  min-height: 350px;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0.9;
}
.banner .inner-banner {
  padding: 3rem;
  background-color: #E5E5CB;
  border-radius: 1rem;
  opacity: 0.9;
}
.banner .inner-banner h1 {
  font-size: 3rem;
  color: #1A120B;
}
.banner .inner-banner h2 {
  font-size: 1.5rem;
  color: #3C2A21;
}

#servicos {
  margin: 80px;
}
#servicos h4 {
  font-size: 1.2rem;
  color: #3C2A21;
  text-transform: uppercase;
  font-weight: 300;
  text-align: center;
  margin: 1rem;
}
#servicos h3 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 80px;
  font-weight: 300;
}
#servicos .cards {
  display: flex;
  justify-content: space-evenly;
  margin-top: 2rem;
}
#servicos .cards .card {
  width: 360px;
  text-align: center;
}
#servicos .cards .card h5 {
  font-size: 2rem;
  font-weight: 300;
  margin-top: 25px;
  margin-bottom: 20px;
  color: #1A120B;
}
#servicos .cards .card p {
  font-size: 1rem;
  font-weight: 300;
  color: #3C2A21;
  line-height: 1.25rem;
}
#servicos .cards .card .img-container {
  padding-bottom: 2px;
  border-bottom: 6px solid #3C2A21;
}
#servicos .cards .card .img-container img {
  max-width: 100%;
}

#cupom {
  background-color: #E5E5CB;
  padding: 4rem;
  text-align: center;
}
#cupom .texto {
  color: #1A120B;
}
#cupom .texto h2 {
  margin: 2rem;
  font-size: 1.7142857143rem;
  color: #1A120B;
}
#cupom .input {
  margin: 0 auto;
  width: 575px;
  border-radius: 20px;
  border: 4px solid rgba(255, 255, 255, 0.6);
  background-color: white;
}
#cupom .input input {
  border-radius: 20px;
  height: 40px;
  width: 540px;
  border: none;
  outline: none;
  text-align: center;
  font-size: 26px;
}
#cupom .input:hover, #cupom .input:focus-within {
  box-shadow: 1px 1px 8px 1px #1A120B;
  outline: none;
}
#cupom button {
  cursor: pointer;
  text-transform: uppercase;
  margin-top: 0.75rem;
  outline: none;
  height: 40px;
  text-align: center;
  width: 130px;
  color: #1A120B;
  letter-spacing: 1px;
  font-size: 12px;
  font-weight: bold;
  border-radius: 40px;
}
#cupom button:hover {
  color: #E5E5CB;
  background-color: #1A120B;
}

footer {
  text-align: center;
  font-size: 1.5rem;
  border-top: 2px solid #1A120B;
  margin-top: 1rem;
  padding: 1.2rem;
  background: linear-gradient(to right, #1A120B, #3C2A21, #E5E5CB, #E5E5CB);
}
footer i {
  color: red;
}

.sobre {
  margin: 2em;
  font-size: 1.3636363636rem;
  text-align: center;
}
.sobre h3 {
  font-size: 1.5789473684rem;
  font-weight: bold;
  color: #1A120B;
  margin-bottom: 1.5em;
}/*# sourceMappingURL=style.css.map */