/* Tokens e componentes compartilhados entre index.html e as páginas
   internas (privacidade.html, sobre.html). Extraído do <style> de
   index.html — os valores têm de bater com os dois lugares. */

:root{
  --branco:#FFFFFF;
  --nevoa:#F2FAFA;
  --nevoa-2:#E6F5F5;
  --teal:#00B7B7;
  --teal-fundo:#DFF5F5;
  --teal-medio:#009A9E;
  --teal-fundo-2:#C9EDED;
  --dourado:#FFCC33;
  --dourado-fundo:#FFF6DE;
  --dourado-tinta:#A97A00;
  --marinho:#003366;
  --tinta:#0E3346;
  --mute:#4E6C7C;
  --linha:rgba(14,51,70,.12);
  --linha-forte:rgba(14,51,70,.26);
  --profundo:#065C60;
  --profundo-2:#044A4E;

  --display:"Archivo","Arial Narrow",sans-serif;
  --corpo:"Nunito Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;

  --gut:clamp(20px,5vw,64px);
  --maxw:1240px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--branco);color:var(--tinta);
  font-family:var(--corpo);font-size:17px;line-height:1.62;
  font-optical-sizing:auto;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:inherit}
button{font:inherit}
::selection{background:var(--teal);color:#fff}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:2px}

h1,h2,h3{font-family:var(--display);font-weight:600;font-variation-settings:"wdth" 112;
  letter-spacing:-.025em;line-height:1.04;margin:0;text-wrap:balance;color:var(--marinho)}
p{margin:0 0 1em;text-wrap:pretty;overflow-wrap:break-word}
.mono{font-family:var(--mono);font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;font-weight:500}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gut)}

/* ══════════ NAV ══════════ */
header.topo{position:fixed;top:0;left:0;right:0;z-index:150;border-bottom:1px solid var(--linha);
  background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(14px)}
.nav{max-width:var(--maxw);margin:0 auto;padding:13px var(--gut);
  display:flex;align-items:center;justify-content:space-between;gap:20px}
.logo{display:flex;align-items:center;text-decoration:none;height:36px}
.logo img{height:34px;width:auto}
.logo .txt{font-family:var(--display);font-variation-settings:"wdth" 125;font-weight:700;
  font-size:1.32rem;letter-spacing:-.035em;color:var(--teal);position:relative}
.logo .txt::after{content:"";position:absolute;top:-3px;left:5px;width:5px;height:5px;
  border-radius:50%;background:var(--dourado)}
.links{display:flex;gap:26px;align-items:center}
.links a{font-size:.83rem;text-decoration:none;opacity:.75;transition:opacity .25s}
.links a:hover{opacity:1}
@media(max-width:960px){.links a:not(.btn){display:none}}

.btn{display:inline-flex;align-items:center;gap:9px;padding:11px 21px;border-radius:100px;
  background:var(--teal);color:#fff!important;text-decoration:none;font-size:.85rem;font-weight:600;
  border:1px solid var(--teal);cursor:pointer;
  transition:transform .3s var(--ease),box-shadow .3s,background .3s}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,183,183,.36)}

/* ══════════ CONTEÚDO ══════════ */
main.paginal{padding-top:clamp(112px,14vh,150px);padding-bottom:clamp(64px,8vw,100px)}
main.paginal .eyebrow{display:flex;align-items:center;gap:12px;color:var(--teal-medio);margin-bottom:20px}
main.paginal .eyebrow::before{content:"";width:26px;height:1px;background:currentColor;flex:none}
main.paginal h1{font-size:clamp(2rem,4.6vw,3.1rem);margin-bottom:.4em}
main.paginal .lead{font-size:clamp(1rem,1.6vw,1.12rem);color:var(--mute);max-width:62ch;margin-bottom:2.2em}
main.paginal h2{font-size:1.4rem;margin-top:2em;margin-bottom:.6em}
main.paginal p,main.paginal li{color:var(--tinta);max-width:66ch}
main.paginal ul{padding-left:1.2em}
main.paginal li{margin-bottom:.5em}
main.paginal .atualizado{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--mute);margin-bottom:2.4em;display:block}

/* ══════════ RODAPÉ ══════════ */
footer{background:var(--profundo-2);color:rgba(228,246,246,.66);padding-block:clamp(48px,6vw,74px);font-size:.88rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
@media(max-width:840px){.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.foot-grid{grid-template-columns:1fr}}
footer h4{font-family:var(--mono);font-size:.62rem;letter-spacing:.13em;text-transform:uppercase;
  color:rgba(228,246,246,.45);margin:0 0 14px;font-weight:500}
footer ul{list-style:none;padding:0;margin:0;display:grid;gap:9px}
footer a{text-decoration:none;transition:color .25s}
footer a:hover{color:var(--dourado)}
.foot-logo{height:38px;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.foot-logo img{height:100%;width:auto}
.foot-logo .txt{font-family:var(--display);font-variation-settings:"wdth" 125;font-weight:700;
  font-size:1.5rem;color:#fff;letter-spacing:-.035em;position:relative;display:inline-block}
.sociais{display:flex;gap:12px;margin-top:18px}
.sociais a{width:34px;height:34px;border-radius:50%;border:1px solid rgba(228,246,246,.24);
  display:grid;place-items:center;color:rgba(228,246,246,.8)}
.sociais a:hover{border-color:var(--dourado);color:var(--dourado)}
.legal{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;
  margin-top:44px;padding-top:24px;border-top:1px solid rgba(228,246,246,.14);font-size:.78rem}
@media(max-width:640px){.legal{flex-direction:column}}
