* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* ver linhas das divs */
/* * {
  outline: 1px solid red;
} */

html, body {
  height: 100%;
  margin: 0;
  font-family: 'Montserrat', sans-serif;
}

h1, h2, h3 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
}

p {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
}

a {
  color: red;
}

.section a:hover{
  color: rgb(150, 2, 2);
}




/* 300 — light
400 — normal
500 — medium
600 — semi-bold
700 — bold
800 — extra-bold */



/* É o que englobo tudo, para que o conteudo fique esticado até bater no rodpé */
#page {
    display: flex;
    justify-content: start;
    flex-direction: column;
    /* background: #f06363; */
    min-height: 100%; /* ← importante para funcionar em celular também */
}

/* Todas as sections devem ficar aqui dentro */
.conteudo {
  flex: 1; /* 🔥 faz crescer até o rodapé */
  background: #171717;
  padding:20px 0; /* só acima e abaixo */
}



.section{
    display: flex;
    background-color: rgb(230, 230, 230);
    flex-direction: column;
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px;
}