/* =========================================
   1. FONTES (Sempre a primeira linha do CSS!)
   ========================================= */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');

/* =========================================
   2. VARIÁVEIS GLOBAIS (:root)
   ========================================= */
:root {
  /* Layout */
  --max-width: 1200px;

  /* Cores Principais (Verdes) */
  --verde-muito-claro: rgb(24, 201, 89);
  --verde-claro: #15a34aff;
  --verde-claro-hover: #15a34a99;
  --verde-medio: #1e8449ff;
  --verde-medio-hover: #116132;
  --verde-escuro: #014732ff;
  --verde-escuro-hover: #013625ff;
  --verde-escuro-footer: #016633;

  /* Neutros e Escala de Cinza */
  --branco: #ffffff;
  --preto: #000000;
  --cinza-0: #fffdfd;
  --cinza-1: #e9eaeb;
  --cinza-2: #d5d7da;
  --cinza-3: #a4a7ae;
  --cinza-4: #717680;
  --cinza-5: #535862;
  --cinza-6: #414651;
  --cinza-7: #252b37;
  --cinza-8: #182719;
  --cinza-9: #0b0f0c;

  --azul-uea: #007bff;
  --azul-uea-hover: #0069d9;

  /* Alertas e Erros */
  --vermelho-claro-fundo-botao: #fce6ea;
  --vermelho-escuro: #c0002d;
  --vermelho-claro: #e60037;

  /* Avisos e Atenção (Amarelos) */
  --amarelo-aviso: #ffc107;
  --amarelo-aviso-hover: #e0a800;
  --amarelo-aviso-texto: #212529;

  /* Configurações Gerais */
  --secondary-color: #f4f7f4ff;
  --text-color: #2c3e50;
  --background-color: #f5f5f5;
  --font-family: 'Raleway', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  
  --altura-navbar: 80px;
}

* {
  margin: 0;        /* Zera margens padrão do navegador */
  padding: 0;       /* Zera espaçamentos padrão do navegador */
  box-sizing: border-box; /* Fundamental: impede que paddings quebrem larguras */
}

body {
  font-family: var(--font-family);
  background-color: var(--background-color);
  /* color: var(--text-color); */
  

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img {
  max-width: 100%;
  height: auto;
}


a {
  text-decoration: none;
}

h2 {
    max-width: 900px;
    /* margin: 40px auto 16px auto; */
    /* padding: 0 16px; */
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--cinza-7); /* Variável do seu base.css */
}

h2.titulo-pagina
{
  color: var(--cinza-7);
  font-weight: 700;
  font-size: clamp(1.5rem, 2vw, 1.8rem);
}