/* ============================================================
   institucional.css — as três páginas de utilidade do site:
   política de privacidade, trabalhe conosco e a de erro 404.
   Tribo Marketing Médico · 14/09/2026

   Uma folha só para as três porque elas pedem a mesma coisa: texto
   corrido legível e uma lista de links. O cabeçalho de seção, o cartão,
   o botão e o ritmo continuam vindo do sistema — aqui fica só o que o
   sistema não tem, porque nenhuma landing precisou até agora.
   ============================================================ */

/* O topo é curto de propósito, como na /contato: quem chega a estas
   páginas veio ler ou achar um caminho, não ser convencido. */
.inst-topo{padding-bottom:0}
.inst-topo .section-header{margin-bottom:0}

/* ---------- texto corrido ----------

   O reset do site zera a margem de p, ul e li (tribo-base.css). Numa
   landing isso é certo: cada bloco decide o próprio espaçamento. Num
   texto legal de trinta parágrafos vira um paredão sem respiro — e é
   justamente o texto que alguém lê logo antes de entregar telefone e
   e-mail. O ritmo volta aqui, e só aqui. */
.inst-prose{max-width:760px;margin:0 auto;font-size:16.5px;line-height:1.75;color:var(--fg)}
.inst-prose > * + *{margin-top:18px}
/* h2 e h3 com o mesmo desenho: as secoes da politica viraram h2 em 29/09/2026
   (a pagina saltava do h1 para h3), sem mudar a aparencia. */
.inst-prose h2,.inst-prose h3{font-size:20px;margin-top:46px;letter-spacing:-0.015em}
.inst-prose h2:first-child,.inst-prose h3:first-child{margin-top:0}
.inst-prose ul{margin:0;padding-left:22px}
.inst-prose li + li{margin-top:10px}
.inst-prose a{color:var(--sl-olive-text);text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.inst-prose a:hover{color:var(--fg-heading)}
.inst-prose strong{color:var(--fg-heading)}
.inst-meta{font-size:14px;color:var(--fg-muted)}

/* ---------- a lista de vagas ----------

   Título e link, nada mais. A descrição de cada vaga mora no blog, que é
   quem mantém a lista viva; repetir o texto aqui garantiria divergência
   em poucas semanas. */
.inst-vagas{list-style:none;margin:0 auto;padding:0;max-width:820px;display:grid;gap:12px}
.inst-vagas a{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:20px 24px;color:var(--fg-heading);font-weight:600;font-size:16px;transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease)}
.inst-vagas a:hover{border-color:var(--sl-amber-light);box-shadow:var(--sl-shadow-md);transform:translateY(-2px);color:var(--fg-heading)}
.inst-vagas .area{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--sl-olive-text);white-space:nowrap}

/* ---------- os caminhos de volta, na 404 ---------- */
.e404-links{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.e404-links a{display:block;height:100%;background:#fff;border:1px solid var(--border);border-radius:var(--r-xl);padding:24px;transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease)}
.e404-links a:hover{border-color:var(--sl-amber-light);box-shadow:var(--sl-shadow-md);transform:translateY(-3px)}
.e404-links b{display:block;font-size:16px;color:var(--fg-heading);margin-bottom:6px;letter-spacing:-0.01em}
.e404-links span{display:block;font-size:14px;line-height:1.55;color:var(--sl-gray-600)}

/* O endereço pedido, no topo escuro. word-break porque URL quebrada é
   quase sempre longa, e no celular ela estouraria a caixa. */
.e404-url{display:inline-block;margin-top:20px;max-width:100%;padding:8px 14px;border-radius:var(--r-md);background:rgba(245,242,236,.08);border:1px solid rgba(245,242,236,.16);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;line-height:1.5;color:var(--sl-amber-light);word-break:break-all}

@media (max-width:860px){
  .e404-links{grid-template-columns:1fr}
  .inst-vagas a{flex-direction:column;align-items:flex-start;gap:8px}
}