body {
  background-color: white;
}

/* Estilos para a seção do relatório */
.relatorio {
  display: flex;            /* Usamos flexbox para centralizar o conteúdo */
  justify-content: center;  /* Alinha o conteúdo no centro horizontalmente */
  align-items: center;      /* Alinha o conteúdo no centro verticalmente */
  flex-direction: column;   /* Organiza o conteúdo em uma coluna */
  padding: 20px;            /* Espaçamento interno */
  min-height: 100vh;        /* Garantir que ocupe pelo menos a altura total da tela */
  text-align: center;       /* Centraliza o texto por padrão para o conteúdo do artigo */
}

/* Estilo do parágrafo dentro da .relatorio */
.relatorio p {
  font-size: 18px;          /* Tamanho da fonte */
  line-height: 1.6;         /* Aumenta o espaçamento entre as linhas para uma leitura mais confortável */
  color: #333;              /* Cor do texto */
  margin: 20px 0;           /* Adiciona um espaçamento vertical no parágrafo */
  padding: 0 15px;          /* Adiciona um pequeno espaçamento horizontal dentro do parágrafo */
  box-sizing: border-box;   /* Garantir que o padding não afete a largura total do parágrafo */
  text-align: center;      /* Justifica o texto dentro do parágrafo */
}

/* Imagem centralizada */
.center {
  display: block;           /* Usamos display block para permitir centralizar com margin */
  margin-left: auto;        /* Alinha à esquerda automaticamente */
  margin-right: auto;       /* Alinha à direita automaticamente */
  max-width: 100%;          /* A imagem vai se ajustar à largura da tela */
  height: auto;             /* A altura é ajustada proporcionalmente */
}

/* Responsividade: ajusta o layout para telas menores */
@media (max-width: 768px) {
  .relatorio p {
      font-size: 16px;       /* Reduz o tamanho da fonte em telas menores */
      margin: 15px 0;        /* Reduz a margem em telas menores */
      padding: 0 10px;       /* Ajusta o padding nas laterais para telas menores */
  }
}

@media (max-width: 480px) {
  .relatorio p {
      font-size: 14px;       /* Reduz ainda mais o tamanho da fonte em telas muito pequenas */
      margin: 10px 0;        /* Diminui ainda mais a margem */
      padding: 0 10px;       /* Ajusta o padding nas laterais */
  }
}