/* Portal do Cliente — folha de estilo única, mobile-first, sem build step.
   Público-alvo: pessoas com pouca familiaridade digital, no celular. */

/* Paleta extraída do logo do escritório (azul-petróleo, bronze, off-white). */
:root {
  --azul-escuro: #34464b;   /* azul-petróleo do logo */
  --azul: #46606a;
  --azul-claro: #e9eeef;
  --bronze: #bb9978;        /* bronze do logo */
  --bronze-escuro: #9c7c5d;
  --bronze-claro: #f1e8dd;
  --verde: #276749;
  --verde-claro: #e6f4ea;
  --vermelho: #9b2c2c;
  --vermelho-claro: #fdecea;
  --cinza-texto: #2d3a3f;
  --cinza-suave: #6e7d82;
  --fundo: #efedeb;         /* off-white do logo */
  --borda: #dcd8d2;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 18px;
  line-height: 1.55;
  color: var(--cinza-texto);
  background: var(--fundo);
  padding-bottom: 96px; /* espaço para a barra de contato fixa */
}

body.tema-admin { padding-bottom: 24px; font-size: 16px; }

/* Cabeçalho */
.topo { background: var(--azul-escuro); color: #fff; padding: 14px 16px; }
.topo-linha {
  display: flex; flex-wrap: wrap; gap: 8px;
  justify-content: space-between; align-items: center;
  max-width: 960px; margin: 0 auto;
}
.marca { font-weight: 700; font-size: 1.05em; display: flex; align-items: center; gap: 10px; min-width: 0; }
.logo-topo { width: 34px; height: 34px; border-radius: 8px; display: block; }
.marca-texto { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.marca-escritorio,
.marca-produto { overflow-wrap: anywhere; }
.marca-produto { color: #e6d6c4; font-size: .88em; font-weight: 650; }
.usuario { font-size: .85em; }
.usuario a { color: #cbd8ea; }

.menu-admin { max-width: 960px; margin: 10px auto 0; display: flex; flex-wrap: wrap; gap: 4px; }
.menu-admin a {
  color: #fff; text-decoration: none; padding: 6px 12px;
  border-radius: 6px; background: rgba(255,255,255,.12); font-size: .9em;
}
.menu-admin a:hover { background: rgba(255,255,255,.25); }

/* Conteúdo */
.conteudo { max-width: 960px; margin: 0 auto; padding: 20px 16px; }
.tema-cliente .conteudo { max-width: 640px; }

h1 { font-size: 1.45em; margin: .4em 0 .6em; color: var(--azul-escuro); }
h2 { font-size: 1.15em; margin: 1.2em 0 .5em; color: var(--azul-escuro); }
a { color: var(--azul); }

.cartao {
  background: #fff; border: 1px solid var(--borda);
  border-radius: 10px; padding: 18px; margin-bottom: 14px;
}
a.cartao { display: block; text-decoration: none; color: inherit; }
a.cartao:hover { border-color: var(--azul); }
.titulo-cartao { margin: 8px 0 4px; }

.selo {
  display: inline-block; font-size: .8em; font-weight: 600;
  padding: 3px 10px; border-radius: 999px;
  background: var(--verde-claro); color: var(--verde);
}
.selo-cinza { background: #edf2f7; color: var(--cinza-suave); }
.selo-alerta { background: var(--bronze-claro); color: var(--bronze-escuro); text-decoration: none; }

/* Mensagens */
.msg-erro {
  background: var(--vermelho-claro); color: var(--vermelho);
  border: 1px solid #f3c4c4; border-radius: 8px; padding: 12px 14px; margin-bottom: 14px;
}
.msg-ok {
  background: var(--verde-claro); color: var(--verde);
  border: 1px solid #bfe3cb; border-radius: 8px; padding: 12px 14px; margin-bottom: 14px;
}

/* Formulários */
label { display: block; font-weight: 600; margin: 14px 0 4px; }
input[type=text], input[type=password], select, textarea {
  width: 100%; padding: 12px; font-size: 1em;
  border: 1px solid var(--borda); border-radius: 8px; background: #fff; color: inherit;
}
input:focus, select:focus, textarea:focus { outline: 2px solid var(--azul); border-color: var(--azul); }
.campo-checkbox { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; margin: 16px 0 4px; }
.campo-checkbox input { width: 22px; height: 22px; flex-shrink: 0; margin-top: 3px; }

.botao {
  display: inline-block; margin-top: 18px; padding: 13px 22px;
  font-size: 1em; font-weight: 700; color: #fff; background: var(--azul);
  border: 0; border-radius: 8px; cursor: pointer; text-decoration: none;
}
.botao:hover { background: var(--azul-escuro); }
.botao-largo { width: 100%; }
.botao-pequeno { padding: 6px 12px; font-size: .85em; margin: 0; font-weight: 600; }
.botao-perigo { background: var(--vermelho); }
.botao-neutro { background: var(--cinza-suave); }

/* Rodapé do cliente */
.disclaimer {
  font-size: .85em; color: var(--cinza-suave);
  margin-top: 28px; border-top: 1px solid var(--borda); padding-top: 12px;
}
.rodape-sigoffice {
  margin: 0 auto;
  padding: 0 16px 86px;
  max-width: 960px;
}
.rodape-sigoffice-admin {
  padding-bottom: 28px;
}
.rodape-sigoffice-miolo {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 14px 16px;
  border-top: 1px solid var(--borda);
  color: var(--cinza-suave);
  text-align: left;
}
.rodape-sigoffice-logo {
  width: 150px;
  max-width: 36vw;
  height: auto;
  display: block;
}
.rodape-sigoffice-texto {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: .84em;
}
.rodape-sigoffice-texto strong {
  color: var(--azul-escuro);
}
.barra-contato {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 10;
  background: var(--azul-escuro); color: #fff; text-align: center;
  padding: 10px 16px; font-size: .92em;
  display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap;
}
.botao-whatsapp {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 42px; padding: 10px 16px;
  border-radius: 8px; text-decoration: none; font-weight: 700;
  background: #25d366; color: #10321d;
}
.botao-whatsapp:hover {
  background: #1fbb59; color: #0f2918;
}

/* Tabelas do admin */
.tabela-envolto { overflow-x: auto; }
table {
  width: 100%; border-collapse: collapse; background: #fff;
  border: 1px solid var(--borda);
}
th, td {
  text-align: left; padding: 9px 10px;
  border-bottom: 1px solid var(--borda); font-size: .92em; vertical-align: middle;
}
th { background: var(--azul-claro); color: var(--azul-escuro); }
tr:last-child td { border-bottom: 0; }
td form { display: inline; }
.acoes { white-space: nowrap; }
.acoes .botao { margin: 2px 2px 2px 0; }

.tabela-detalhes th {
  width: 220px;
}

/* Modal "Inserir IA" (admin) */
dialog#modal-inserir-ia {
  width: min(520px, 92vw);
  border: 1px solid var(--borda);
  border-radius: 10px;
  padding: 0;
  box-shadow: 0 24px 60px rgba(0,0,0,.25);
}
dialog#modal-inserir-ia::backdrop {
  background: rgba(20,26,28,.55);
}
dialog#modal-inserir-ia form {
  padding: 22px;
}
dialog#modal-inserir-ia h2 {
  margin-top: 0;
}
#modal-modelo-custom-envolto {
  margin-top: 4px;
}
#resultado-teste-modal:empty {
  display: none;
}
#resultado-teste-modal {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--borda);
}
#resultado-teste-modal p {
  margin: 6px 0;
  font-size: .92em;
}

.texto-suave { color: var(--cinza-suave); font-size: .88em; }
.mono { font-family: Consolas, monospace; font-size: .95em; }
.oculto { display: none !important; }
.cartao-estreito { max-width: 420px; }
.texto-quebra { word-break: break-all; }
.texto-quebra-grande { word-break: break-all; font-size: 1.1em; }

.topo-formulario-login {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.topo-formulario-login h1 {
  margin-right: auto;
}

.seletor-idioma {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: flex-end;
  gap: 6px;
  margin: 0 0 12px;
  font-size: .84em;
}

.seletor-idioma label {
  width: 100%;
  margin: 0;
  color: var(--cinza-suave);
  font-weight: 700;
}

.seletor-idioma select {
  width: auto;
  min-width: 170px;
  min-height: 38px;
  padding: 7px 10px;
  font-size: 1em;
}

.seletor-idioma button {
  min-height: 38px;
  padding: 7px 11px;
  border: 0;
  border-radius: 8px;
  background: var(--azul);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}

.seletor-idioma-site {
  margin: 0;
  align-items: center;
}

.seletor-idioma-site label {
  width: auto;
  color: #eadcca;
}

.seletor-idioma-site select {
  min-width: 132px;
  min-height: 34px;
  padding: 5px 8px;
}

.seletor-idioma-site button {
  min-height: 34px;
  padding: 5px 9px;
  background: rgba(255,255,255,.16);
  color: #fff;
}

.grid-cadastro-admin,
.grade-filtros-admin,
.grade-ficha-admin {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px 16px;
}

.acoes-cadastro-admin,
.acoes-filtro-admin,
.acoes-ficha-admin {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.acoes-cadastro-admin .botao,
.acoes-filtro-admin .botao,
.acoes-ficha-admin .botao {
  margin-top: 0;
}

.filtro-admin-largo,
.campo-admin-largo {
  grid-column: 1 / -1;
}

.painel-filtros-admin h2 {
  margin-top: 0;
}

.submenu-admin {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 16px;
}

.submenu-admin a {
  color: var(--azul-escuro);
  text-decoration: none;
  background: #fff;
  border: 1px solid var(--borda);
  border-radius: 8px;
  padding: 8px 12px;
  font-weight: 700;
  font-size: .92em;
}

.submenu-admin a:hover {
  border-color: var(--bronze);
  color: var(--bronze-escuro);
}

.grade-modulos-admin {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-bottom: 16px;
}

.cartao-modulo-admin {
  margin-bottom: 0;
}

.modulo-admin-topo {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.modulo-admin-topo h2 {
  margin: 0;
}

.toggle-modulo-admin {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 8px 0 12px;
  font-weight: 700;
}

.grade-automatizadas-admin {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.lista-compacta-admin {
  padding-left: 18px;
  margin: 8px 0 14px;
}

.lista-compacta-admin li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  margin-bottom: 8px;
}

.bloco-comando-admin {
  display: block;
  overflow-x: auto;
  white-space: nowrap;
  background: #f6f7f5;
  border: 1px solid var(--borda);
  padding: 10px 12px;
  border-radius: 6px;
}

.grade-cards-admin,
.grade-duas-colunas-admin,
.grade-status-admin {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.cartao-metrica {
  margin-bottom: 0;
  border-top: 3px solid var(--bronze);
}

.cartao-metrica strong {
  display: block;
  color: var(--azul-escuro);
  font-size: 2em;
  line-height: 1;
}

.cartao-metrica span {
  display: block;
  margin-top: 8px;
  color: var(--cinza-suave);
  font-weight: 700;
}

.preview-peca-admin {
  white-space: pre-wrap;
  overflow: auto;
  max-height: 520px;
  padding: 16px;
  background: #f8fafb;
  border: 1px solid var(--borda);
  border-radius: 8px;
  font-family: Consolas, monospace;
  font-size: .94em;
}

.form-inline-admin {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 4px 0;
}

.form-inline-admin select {
  width: auto;
  min-width: 150px;
}

.form-admin label {
  display: block;
}
.texto-quebra { word-break: break-all; }
.texto-quebra-grande { word-break: break-all; font-size: 1.1em; }
.cartao-aninhado { margin-bottom: 12px; }

.lista-mensagens { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; max-height: 480px; overflow-y: auto; }
.mensagem-item { padding: 10px 14px; border-radius: 10px; max-width: 85%; }
.mensagem-cliente { background: var(--azul-claro); align-self: flex-end; }
.mensagem-admin { background: var(--bronze-claro); align-self: flex-start; }
.mensagem-autor { margin: 0 0 4px; font-size: .82em; font-weight: 600; }
.mensagem-texto { margin: 0; white-space: pre-wrap; }
.linha-selecionada { background: var(--azul-claro); }
.notas-pesquisa { display: flex; gap: 8px; margin-bottom: 6px; }

/* Linha do tempo dos andamentos (DataJud) */
.linha-tempo { list-style: none; margin: 0; padding: 0 0 0 8px; }
.linha-tempo li {
  position: relative; padding: 0 0 18px 24px;
  border-left: 2px solid var(--borda);
}
.linha-tempo li:last-child { border-left-color: transparent; padding-bottom: 4px; }
.linha-tempo li::before {
  content: ''; position: absolute; left: -7px; top: 3px;
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--bronze); border: 2px solid #fff;
}
.lt-data { display: block; font-weight: 700; font-size: .88em; color: var(--azul-escuro); }
.lt-nome { display: block; }
.lt-comp { display: block; color: var(--cinza-suave); font-size: .85em; }

@media (min-width: 760px) {
  .marca-texto {
    flex-direction: row;
    align-items: baseline;
    gap: 6px;
  }

  .marca-produto {
    font-size: 1em;
  }
}

@media (min-width: 860px) {
  body.tema-cliente {
    padding-bottom: 88px;
  }

  body.tema-admin {
    padding-bottom: 0;
  }

  .topo {
    position: sticky;
    top: 0;
    z-index: 30;
    padding: 12px 24px 14px;
    box-shadow: 0 1px 0 rgba(0,0,0,.14);
  }

  .topo-linha,
  .menu-admin {
    max-width: min(1440px, calc(100vw - 64px));
  }

  .topo-linha {
    flex-wrap: nowrap;
    gap: 24px;
  }

  .marca {
    flex: 1 1 auto;
    font-size: 1em;
  }

  .logo-topo {
    width: 40px;
    height: 40px;
  }

  .usuario {
    flex: 0 0 auto;
    margin-left: auto;
    text-align: right;
    white-space: nowrap;
  }

  .menu-admin {
    margin-top: 12px;
    gap: 8px;
  }

  .menu-admin a {
    padding: 9px 14px;
    border-radius: 8px;
  }

  .conteudo {
    max-width: min(1320px, calc(100vw - 64px));
    padding: 28px 32px 46px;
  }

  .tema-cliente .conteudo {
    max-width: min(1180px, calc(100vw - 72px));
  }

  .tema-admin .conteudo {
    max-width: min(1440px, calc(100vw - 64px));
  }

  .pagina-login .conteudo,
  .pagina-login .rodape-sigoffice {
    max-width: min(540px, calc(100vw - 64px));
  }

  .pagina-login .rodape-sigoffice-miolo {
    justify-content: center;
  }

  .pagina-login .botao-largo {
    width: 100%;
  }

  .tema-cliente .texto-intro-painel {
    max-width: 720px;
  }

  .grade-processos-cliente {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr));
    gap: 18px;
    align-items: stretch;
    margin-top: 16px;
  }

  .grade-processos-cliente .cartao {
    display: flex;
    flex-direction: column;
    min-height: 190px;
    margin-bottom: 0;
  }

  .grade-processos-cliente .acao-ver-detalhes {
    width: fit-content;
    margin-top: auto;
  }

  .cartao-sindicato-atalho {
    max-width: min(680px, 100%);
  }

  .grid-cadastro-admin,
  .grade-filtros-admin {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grade-ficha-admin {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .grade-cards-admin {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .grade-modulos-admin {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grade-automatizadas-admin {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grade-duas-colunas-admin {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }

  .grade-status-admin {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  h1 {
    font-size: 1.7em;
  }

  h2 {
    font-size: 1.22em;
  }

  .cartao {
    border-radius: 8px;
    padding: 22px 24px;
  }

  .botao-largo {
    width: auto;
    min-width: 220px;
  }

  .tabela-envolto {
    border: 1px solid var(--borda);
    border-radius: 8px;
    background: #fff;
  }

  .tabela-envolto table {
    border: 0;
  }

  .rodape-sigoffice {
    max-width: min(1320px, calc(100vw - 64px));
    padding-right: 32px;
    padding-left: 32px;
  }

  .rodape-sigoffice-miolo {
    justify-content: center;
  }

  .barra-contato {
    justify-content: flex-end;
    padding: 12px 24px;
  }
}

@media (min-width: 1280px) {
  .tema-cliente .conteudo {
    max-width: min(1240px, calc(100vw - 96px));
  }

  .grade-processos-cliente {
    grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
  }

  .grade-filtros-admin {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .grade-modulos-admin {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* ---------- Página institucional (site público) ---------- */
.botao-bronze { background: var(--bronze); }
.botao-bronze:hover { background: var(--bronze-escuro); }

.site-nav { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; font-size: .9em; }
.site-nav a { color: #e8e4de; text-decoration: none; padding: 4px 0; }
.site-nav a:hover { color: #fff; text-decoration: underline; }
.site-nav .botao { margin: 0; padding: 9px 16px; }

.hero { background: var(--azul-escuro); color: #f4f1ec; padding: 44px 16px 52px; }
.hero-conteudo { max-width: 960px; margin: 0 auto; }
.hero img.logo-hero { width: 84px; height: 84px; border-radius: 16px; margin-bottom: 18px; }
.hero h1 { color: #fff; font-size: 1.7em; margin: 0 0 10px; font-family: Georgia, 'Times New Roman', serif; }
.hero p { max-width: 620px; font-size: 1.05em; color: #dcd6cd; }
.hero .filete { width: 64px; height: 4px; background: var(--bronze); border-radius: 2px; margin: 16px 0 20px; }

.secao { max-width: 960px; margin: 0 auto; padding: 34px 16px 6px; }
.secao h2 {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.35em; margin: 0 0 6px;
}
.secao h2::after { content: ''; display: block; width: 44px; height: 3px; background: var(--bronze); border-radius: 2px; margin-top: 8px; }

.grade { display: grid; grid-template-columns: 1fr; gap: 14px; margin-top: 18px; }
@media (min-width: 700px) { .grade { grid-template-columns: 1fr 1fr; } }

.cartao-area { border-top: 3px solid var(--bronze); }
.cartao-area h3 { margin: 0 0 6px; font-size: 1.02em; color: var(--azul-escuro); }
.cartao-area p { margin: 0; font-size: .92em; color: var(--cinza-suave); }

.lista-publicacoes { padding-left: 18px; }
.lista-publicacoes li { margin-bottom: 6px; }

.selo-oab {
  display: inline-block; background: var(--bronze-claro); color: var(--bronze-escuro);
  font-weight: 600; font-size: .85em; padding: 4px 12px; border-radius: 999px; margin: 0 6px 6px 0;
}

.rodape-site {
  margin-top: 40px; background: var(--azul-escuro); color: #cfc9c0;
  padding: 26px 16px; font-size: .85em; text-align: center;
}
.rodape-site a { color: #e8e4de; }
.rodape-site-sigoffice {
  max-width: 840px;
  margin: 0 auto 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}
.rodape-site-sigoffice-logo {
  width: 150px;
  height: auto;
  display: block;
}
.rodape-site-sigoffice-texto {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.rodape-site-sigoffice-texto strong {
  color: #ffffff;
}

/* ---------- Nova pagina institucional ---------- */
body.site-publico {
  /* Paleta centralizada da página pública, derivada da paleta do logo acima
     (--azul-escuro/--bronze/--fundo). Variáveis próprias para não afetar
     admin/cliente, que continuam usando as variáveis originais. */
  --color-primary: var(--azul-escuro);
  --color-primary-dark: #263539;
  --color-accent: var(--bronze);
  --color-bg: #f6f4f0;
  --color-bg-soft: #ffffff;
  --color-text: var(--cinza-texto);
  --color-muted: var(--cinza-suave);
  --color-border: var(--borda);

  padding-bottom: 0;
  font-size: 17px;
  background: var(--color-bg);
}

.site-pular-conteudo {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  background: #fff;
  color: var(--color-primary);
  padding: 12px 18px;
  border-radius: 0 0 8px 0;
  font-weight: 700;
  text-decoration: none;
}
.site-pular-conteudo:focus {
  left: 0;
}

.site-publico a:focus-visible,
.site-publico button:focus-visible {
  outline: 3px solid var(--color-accent);
  outline-offset: 2px;
}

.site-topo {
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(52, 70, 75, .97);
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.12);
}

.site-topo-linha {
  max-width: 1080px;
  margin: 0 auto;
  padding: 12px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.site-marca {
  display: flex;
  align-items: center;
  gap: 11px;
  color: #fff;
  text-decoration: none;
  font-weight: 760;
  line-height: 1.15;
}

.site-logo {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 9px;
  display: block;
  object-fit: cover;
}

.site-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px 16px;
  flex-wrap: wrap;
  font-size: .92em;
}

.site-nav a {
  color: #eee8df;
  text-decoration: none;
}

.site-nav a:hover { color: #fff; text-decoration: underline; }
.site-nav .site-login { margin: 0; padding: 9px 15px; color: #fff; }

.site-hero {
  min-height: min(620px, calc(100vh - 72px));
  background:
    linear-gradient(90deg, rgba(39,53,58,.98) 0%, rgba(52,70,75,.94) 46%, rgba(52,70,75,.58) 100%),
    url("../img/odoo-bernardo.webp") center right / cover no-repeat,
    #34464b;
  color: #f7f2ea;
  display: flex;
  align-items: center;
  padding: 68px 18px 76px;
}

.site-hero-conteudo {
  max-width: 1080px;
  width: 100%;
  margin: 0 auto;
}

.site-logo-hero {
  width: clamp(72px, 12vw, 118px);
  height: clamp(72px, 12vw, 118px);
  border-radius: 18px;
  display: block;
  object-fit: cover;
  margin-bottom: 22px;
  box-shadow: 0 18px 42px rgba(0,0,0,.18);
}

.site-eyebrow {
  color: var(--bronze-claro);
  font-size: .92em;
  font-weight: 760;
  margin: 0 0 10px;
  text-transform: uppercase;
}

.site-hero h1 {
  max-width: 780px;
  margin: 0;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 6vw, 4.35rem);
  line-height: 1.02;
}

.site-chamada {
  max-width: 680px;
  margin: 22px 0 0;
  color: #e4ddd3;
  font-size: 1.17em;
}

.site-acoes {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.site-acoes .botao { margin-top: 0; }

.botao-claro {
  background: #efe9df;
  color: var(--azul-escuro);
}

.botao-claro:hover {
  background: #fff;
  color: var(--azul-escuro);
}

.site-secao {
  max-width: 1080px;
  margin: 0 auto;
  padding: 46px 18px 8px;
}

.site-secao h2 {
  color: var(--azul-escuro);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.55em;
  margin: 0 0 16px;
}

.site-secao h2::after {
  content: "";
  display: block;
  width: 54px;
  height: 3px;
  margin-top: 10px;
  border-radius: 2px;
  background: var(--bronze);
}

.site-intro,
.site-perfil,
.site-contato {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(260px, .8fr);
  gap: 32px;
  align-items: start;
}

.site-nota,
.site-contato-box {
  border-left: 4px solid var(--bronze);
  background: #fff;
  padding: 18px;
  box-shadow: 0 14px 34px rgba(45,58,63,.08);
}

.site-nota p,
.site-contato-box p {
  margin-bottom: 0;
}

.site-grade {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.site-card {
  background: #fff;
  border: 1px solid var(--borda);
  border-top: 3px solid var(--bronze);
  padding: 18px;
}

.site-card-numero {
  display: block;
  color: var(--bronze-escuro);
  font-weight: 800;
  font-size: .86em;
  margin-bottom: 12px;
}

.site-card h3 {
  margin: 0 0 8px;
  color: var(--azul-escuro);
  font-size: 1.02em;
}

.site-card p {
  margin: 0;
  color: var(--cinza-suave);
  font-size: .93em;
}

.site-lista {
  margin: 0;
  padding: 18px 18px 18px 34px;
  background: var(--azul-claro);
}

.site-lista li { margin-bottom: 8px; }
.site-publicacoes { max-width: 680px; }

.site-contato-box span {
  display: block;
  color: var(--cinza-suave);
  font-size: .9em;
}

.site-contato-box strong {
  display: block;
  margin-top: 4px;
  color: var(--azul-escuro);
}

.site-contato-box strong a {
  color: inherit;
  text-decoration: none;
}
.site-contato-box strong a:hover { text-decoration: underline; }

.site-contato-box .botao-pequeno-topo {
  display: block;
  margin: 14px 0 10px;
  text-align: center;
  padding: 10px 16px;
  font-size: .92em;
}

.site-contato-box .botao-bronze {
  display: block;
  text-align: center;
}

@media (max-width: 820px) {
  .site-topo-linha { align-items: flex-start; flex-direction: column; }
  .site-nav { justify-content: flex-start; }
  .site-hero { min-height: auto; padding-top: 46px; }
  .site-intro,
  .site-perfil,
  .site-contato {
    grid-template-columns: 1fr;
  }
  .site-grade {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 540px) {
  .site-marca span { max-width: 260px; }
  .site-nav { gap: 8px 12px; }
  .site-nav .site-login { width: 100%; text-align: center; }
  .site-grade { grid-template-columns: 1fr; }
  .site-acoes .botao { width: 100%; text-align: center; }
}