/*
  Frase — seção de 80vh só com o título (statement em 3 linhas), fundo
  Neblina. As palavras começam com opacidade baixa e vão sendo
  "preenchidas" até 100% conforme o scroll (scrubbed em frase.js).
*/
.frase {
  min-height: 50vh;
  width: 100%;
  /* Sem background-color própria — o fundo vem do body (ver bg-swap.js). */
  display: flex;
  align-items: flex-end;   /* título na base — perto das imagens da próxima seção */
  padding: var(--sp-16) var(--grid-margin) var(--sp-12);
}

.frase__title {
  margin: 0;
  color: var(--color-dark);
}

/* Cada frase numa linha própria (quebra fixa, uma por span). */
.frase__line {
  display: block;
}
/* Última linha em itálico — peso 400 (RegularItalic), o italic mais leve
   que a PP Writer tem (não há Thin italic), pra não ficar negrito. */
.frase__line--italic {
  font-style: italic;
  font-weight: 400;
}