/* Base compartilhada das páginas internas (a página inicial tem o próprio CSS inline) */
:root {
  --ink: #13233a;
  --ink-soft: #4b5869;
  --pine: #14365e;
  --brand-blue: #0e76bc;
  --mist: #eef2f7;
  --line: #d8dee7;
  --paper: #ffffff;
  --display: "Bricolage Grotesque", "Arial Narrow", sans-serif;
  --body: "Atkinson Hyperlegible", system-ui, sans-serif;
  --gutter: clamp(16px, 4vw, 40px);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 1.0625rem/1.6 var(--body); }
img { display: block; max-width: 100%; }
a { color: var(--pine); text-underline-offset: 3px; }
a:hover { color: var(--ink); }
:focus-visible { outline: 3px solid var(--brand-blue); outline-offset: 3px; border-radius: 2px; }
.wrap { max-width: 1120px; margin: 0 auto; padding-inline: var(--gutter); }
.top { border-bottom: 1px solid var(--line); }
.top .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 68px; }
.wordmark { display: block; }
.wordmark img { height: 44px; width: auto; }
.top nav { display: flex; gap: clamp(14px, 3vw, 28px); }
.top nav a { color: var(--ink-soft); text-decoration: none; font-size: 0.98rem; }
.top nav a:hover { color: var(--ink); text-decoration: underline; }
footer { border-top: 1px solid var(--line); padding-block: 40px 56px; color: var(--ink-soft); font-size: 0.92rem; }
footer .wrap { display: grid; grid-template-columns: 1fr auto; gap: 16px 40px; }
footer p { margin: 0; }
footer strong { color: var(--ink); }
@media (max-width: 640px) { footer .wrap { grid-template-columns: 1fr; } }