body {
      color: white;
      background: black;
      margin: 0px;
}

  header {
      border-bottom: solid 2px rgb(42, 122, 228);
      padding: 20px;
      fonte-size: 32px;
      color: rgb(42, 122, 228);
}

section {
     background: rgb(184,156,213);
     padding-bottom: 80px;
     padding-top: 80px;
     display: flex;
     justify-content: center;
}

.chamada-texto {
    margin-right: 5%;
}
/*variaveis*/
:root {
  --preto: #000;
  --branco: #fff;
  --lilas-claro: #eb76db;
  --azul-médio: #2f4dd1;
  --amarelo:#cfe80d;
}
/*corpo da página*/
body {
 color: var(--branco);/*cor da fonte*/
 background-color: var(--preto);/*cor de fundo*/
 margin: 0px; /* não terá margem padrão*/
}

header {
 border: solid 2px;
 border-color: var(--branco);/*cor da borda*/
 padding: 20px;/*espaçamento interno*/
 font-size: 32px;/*tamanho da fonte*/
 color: var(--amarelo);/*cor da fonte*/
}

.chamada-texto {
  background-color: var(--amarelo);
  color: var(--preto);
  margin-right: 20px;/*margem a direita*/
}

.chamada {
 background: rgb(184, 156, 213);
 padding-bottom: 80px;/*espaçamento inferior*/

 padding-top: 80px;/*espaçamento superior*/
 display: flex;/*alterar a disposição*/
 justify-content: center;/* justificado no centro*/
}

h1 {
 font-size: 1.5rem;
 text-align: center;
 padding-top: 30px;
}

p {
 font-size: 1rem;
 text-align: center;
 padding-top: 0px;
}

img {
 width: 300px;
 height: 200px;
}

.recomendacoes {
 background-color: var(--lilas-claro);
 margin-left: 30px;/*margem a direita*/
 margin-right: 30px;/*margem a direita*/
}
.outras-recomendacoes {
 background-color: var(--amarelo);
 display: flex;
 overflow-x: auto;
 gap: 20px;
 margin-left: 30px;/*margem a direita*/
 margin-right: 30px;/*margem a direita*/

}

h2 {
 margin-left: 30px;
}

/*rodapé*/
footer {
 color: var(--branco);
 text-align: center;
}