/* FineApps Sistemas Ltda. — folha de estilo do site institucional */

:root {
  --tinta:        #14181f;
  --tinta-suave:  #4a5563;
  --tinta-fraca:  #7b8695;
  --papel:        #ffffff;
  --papel-suave:  #f7f8fa;
  --linha:        #e3e7ed;
  --marca:        #1f3864;
  --marca-clara:  #2d5296;
  --destaque:     #f5f9ff;
  --largura:      68rem;
  --largura-texto: 46rem;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif;
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--tinta);
  background: var(--papel);
  font-feature-settings: "kern", "liga";
}

/* ---------- estrutura ---------- */

.envoltorio { max-width: var(--largura); margin: 0 auto; padding: 0 1.5rem; }
.coluna-texto { max-width: var(--largura-texto); }

/* ---------- cabeçalho ---------- */

.cabecalho {
  border-bottom: 1px solid var(--linha);
  background: rgba(255,255,255,.92);
  backdrop-filter: saturate(180%) blur(8px);
  position: sticky; top: 0; z-index: 10;
}
.cabecalho .envoltorio {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1.5rem; min-height: 4.25rem; flex-wrap: wrap;
}
.marca {
  font-weight: 650; font-size: 1.15rem; letter-spacing: -.02em;
  color: var(--marca); text-decoration: none; white-space: nowrap;
}
.marca span { color: var(--tinta-fraca); font-weight: 400; }
.navegacao { display: flex; gap: 1.5rem; flex-wrap: wrap; }
.navegacao a {
  color: var(--tinta-suave); text-decoration: none;
  font-size: .9375rem; padding: .25rem 0;
  border-bottom: 2px solid transparent;
}
.navegacao a:hover { color: var(--marca); border-bottom-color: var(--marca); }
.navegacao a[aria-current="page"] { color: var(--marca); border-bottom-color: var(--marca); }

/* ---------- abertura ---------- */

.abertura { padding: 5rem 0 4rem; border-bottom: 1px solid var(--linha); }
.abertura h1 {
  font-size: clamp(2rem, 5vw, 2.9rem); line-height: 1.15;
  letter-spacing: -.03em; margin: 0 0 1.25rem; font-weight: 680;
}
.abertura .linha-fina {
  font-size: clamp(1.05rem, 2.2vw, 1.25rem);
  color: var(--tinta-suave); margin: 0; max-width: 42rem;
}

/* ---------- seções ---------- */

.secao { padding: 4rem 0; border-bottom: 1px solid var(--linha); }
.secao:last-of-type { border-bottom: 0; }
.secao h2 {
  font-size: 1.5rem; letter-spacing: -.02em; margin: 0 0 1.5rem; font-weight: 650;
}
.secao h3 { font-size: 1.125rem; margin: 2rem 0 .75rem; font-weight: 620; }
.rotulo {
  text-transform: uppercase; letter-spacing: .09em; font-size: .75rem;
  font-weight: 620; color: var(--tinta-fraca); margin: 0 0 .75rem;
}

/* ---------- produtos ---------- */

.produtos { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr)); }
.produto {
  border: 1px solid var(--linha); border-radius: 10px;
  padding: 1.75rem; background: var(--papel-suave);
}
.produto h3 { margin: 0 0 .25rem; font-size: 1.25rem; color: var(--marca); }
.produto .publico {
  font-size: .8125rem; color: var(--tinta-fraca);
  text-transform: uppercase; letter-spacing: .07em; margin: 0 0 1rem;
}
.produto p { margin: 0 0 .75rem; color: var(--tinta-suave); }
.produto p:last-child { margin-bottom: 0; }

/* ---------- documentos ---------- */

.documentos { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); }
.documento {
  display: block; border: 1px solid var(--linha); border-radius: 10px;
  padding: 1.25rem 1.375rem; text-decoration: none; color: inherit;
  transition: border-color .15s, background .15s;
}
.documento:hover { border-color: var(--marca-clara); background: var(--destaque); }
.documento strong { display: block; color: var(--marca); margin-bottom: .25rem; font-weight: 620; }
.documento span { font-size: .9375rem; color: var(--tinta-suave); }

/* ---------- caixa de destaque ---------- */

.caixa {
  background: var(--destaque); border: 1px solid #d3e0f3;
  border-radius: 10px; padding: 1.5rem;
}
.caixa p:first-child { margin-top: 0; }
.caixa p:last-child { margin-bottom: 0; }

/* ---------- documento longo ---------- */

.documento-longo { padding: 3.5rem 0 4rem; }
.documento-longo h1 {
  font-size: clamp(1.75rem, 4vw, 2.25rem); letter-spacing: -.025em;
  margin: 0 0 .5rem; font-weight: 680; line-height: 1.2;
}
.vigencia { color: var(--tinta-fraca); font-size: .9375rem; margin: 0 0 2.5rem; }
.documento-longo h2 {
  font-size: 1.25rem; margin: 2.75rem 0 1rem; font-weight: 650;
  letter-spacing: -.015em; padding-top: 1.5rem; border-top: 1px solid var(--linha);
}
.documento-longo h2:first-of-type { border-top: 0; padding-top: 0; }
.documento-longo h3 { font-size: 1.0625rem; margin: 1.75rem 0 .5rem; font-weight: 620; }
.documento-longo p, .documento-longo li { color: var(--tinta-suave); }
.documento-longo strong { color: var(--tinta); font-weight: 620; }
.documento-longo ul, .documento-longo ol { padding-left: 1.25rem; }
.documento-longo li { margin-bottom: .5rem; }

/* ---------- tabela ---------- */

.tabela-envoltorio { overflow-x: auto; margin: 1.5rem 0; }
table { border-collapse: collapse; width: 100%; font-size: .9375rem; }
th, td {
  text-align: left; padding: .75rem .875rem;
  border-bottom: 1px solid var(--linha); vertical-align: top;
}
th { font-weight: 620; color: var(--tinta); background: var(--papel-suave); white-space: nowrap; }
td { color: var(--tinta-suave); }

/* ---------- rodapé ---------- */

.rodape {
  border-top: 1px solid var(--linha); background: var(--papel-suave);
  padding: 3rem 0 2.5rem; margin-top: 4rem; font-size: .9375rem;
}
.rodape-grade {
  display: grid; gap: 2.5rem;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
}
.rodape h4 {
  font-size: .75rem; text-transform: uppercase; letter-spacing: .09em;
  color: var(--tinta-fraca); margin: 0 0 .875rem; font-weight: 620;
}
.rodape ul { list-style: none; padding: 0; margin: 0; }
.rodape li { margin-bottom: .5rem; }
.rodape a { color: var(--tinta-suave); text-decoration: none; }
.rodape a:hover { color: var(--marca); text-decoration: underline; }
.rodape p { margin: 0 0 .5rem; color: var(--tinta-suave); }
.rodape .aviso-legal {
  margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--linha);
  color: var(--tinta-fraca); font-size: .875rem;
}

/* ---------- utilidades ---------- */

a { color: var(--marca-clara); }
a:hover { color: var(--marca); }
.email { font-weight: 620; white-space: nowrap; }
.pular-para-conteudo {
  position: absolute; left: -9999px; top: 0;
  background: var(--marca); color: #fff; padding: .75rem 1.25rem; z-index: 20;
}
.pular-para-conteudo:focus { left: 0; }

@media (max-width: 34rem) {
  .cabecalho .envoltorio { min-height: auto; padding-top: .875rem; padding-bottom: .875rem; }
  .navegacao { gap: 1rem; }
  .abertura { padding: 3.5rem 0 3rem; }
  .secao { padding: 3rem 0; }
}

@media print {
  .cabecalho, .rodape .rodape-grade, .pular-para-conteudo { display: none; }
  body { font-size: 11pt; color: #000; }
  a { color: #000; text-decoration: underline; }
}