/* Agência Invictus: site institucional. Sem fonte externa, sem imagem, sem JS. */
:root{
  --papel:#f6f3ee;
  --papel-2:#ece7df;
  --tinta:#16140f;
  --texto:#3b372f;      /* 10,6:1 no papel */
  --suave:#6b6559;      /* 5,3:1 no papel */
  --bronze:#8a5a2b;     /* 5,6:1 no papel: so em texto/linha, nunca fundo de texto */
  --linha:#d9d2c6;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --maxw:1080px;
  --gut:20px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papel);color:var(--texto);font-family:var(--sans);font-size:1.0625rem;line-height:1.7;overflow-wrap:break-word}
a{color:var(--tinta);text-decoration-color:var(--bronze);text-underline-offset:3px}
a:hover{color:var(--bronze)}
h1,h2,h3{font-family:var(--serif);color:var(--tinta);font-weight:400;line-height:1.15;margin:0}
p{margin:0 0 1em}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}
.pular{position:absolute;left:-9999px}
.pular:focus{left:var(--gut);top:8px;background:var(--tinta);color:#fff;padding:8px 12px;z-index:2}

/* ---------- topo ---------- */
.topo{border-bottom:1px solid var(--linha)}
.topo .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 24px;padding-top:18px;padding-bottom:18px}
.logo{display:inline-flex;flex-direction:column;justify-content:center;min-height:44px;line-height:1;text-decoration:none;color:var(--tinta)}
.logo b{font-family:var(--serif);font-weight:400;font-size:1.55rem;letter-spacing:.22em}
.logo small{font-size:.66rem;letter-spacing:.42em;text-transform:uppercase;color:var(--bronze);margin-top:6px}
.menu{display:flex;flex-wrap:wrap;gap:0 4px;margin:0 -10px}
.menu a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;font-size:.92rem;text-decoration:none;color:var(--texto)}
.menu a:hover{color:var(--bronze)}

/* ---------- home ---------- */
.abre{padding:72px 0 64px}
.selo{font-size:.75rem;letter-spacing:.24em;text-transform:uppercase;color:var(--bronze);margin-bottom:20px}
.abre h1{font-size:clamp(2.2rem,7vw,3.9rem);max-width:15em;margin-bottom:24px}
.abre .lede{font-size:1.15rem;max-width:36em;color:var(--texto)}
.secao{padding:64px 0;border-top:1px solid var(--linha)}
.secao h2{font-size:clamp(1.7rem,4.6vw,2.4rem);margin-bottom:24px}
.duas{display:grid;gap:8px 56px}
.duas p{max-width:38em}
.servicos{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:0;counter-reset:s}
.servicos li{position:relative;padding:24px 0 24px 52px;border-top:1px solid var(--linha)}
.servicos li:last-child{border-bottom:1px solid var(--linha)}
.servicos li::before{counter-increment:s;content:counter(s,decimal-leading-zero);position:absolute;left:0;top:26px;font-family:var(--serif);font-size:1.05rem;color:var(--bronze)}
.servicos h3{font-size:1.35rem;margin-bottom:8px}
.servicos p{margin:0;max-width:40em}
.principios{list-style:none;margin:0;padding:0;display:grid;gap:20px}
.principios b{display:block;font-family:var(--serif);font-weight:400;font-size:1.2rem;color:var(--tinta);margin-bottom:4px}
.contato{display:grid;gap:16px;margin:0}
.contato div{padding:18px 0;border-top:1px solid var(--linha)}
.contato dt{font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:var(--suave);margin-bottom:6px}
.contato dd{margin:0;font-size:1.1rem;color:var(--tinta)}
.contato a{display:inline-flex;align-items:center;min-height:44px}
.aviso{font-size:.9rem;color:var(--suave);margin-top:28px;max-width:44em}

/* ---------- paginas legais ---------- */
.legal{padding:56px 0 72px}
.legal .wrap{max-width:780px}
.legal h1{font-size:clamp(2rem,6vw,2.9rem);margin-bottom:12px}
.legal .data{color:var(--suave);font-size:.92rem;margin-bottom:40px}
.legal h2{font-size:1.45rem;margin:40px 0 14px}
.legal ul{padding-left:1.2em;margin:0 0 1em}
.legal li{margin-bottom:.5em}

/* ---------- rodape (identico nas 3 paginas) ---------- */
.rodape{background:var(--tinta);color:#e9e4db;font-size:.92rem;line-height:1.65}
.rodape .wrap{display:grid;gap:28px;padding-top:48px;padding-bottom:40px}
.rodape .logo{color:#fff}
.rodape .logo small{color:#d9b48a}   /* 8,9:1 no fundo escuro */
.rodape a{color:#fff;text-decoration-color:#d9b48a}
.rodape a:hover{color:#d9b48a}
.rodape address{font-style:normal}
.rodape address p{margin:0 0 4px}
.rodape address a{display:inline-flex;align-items:center;min-height:44px}
.rodape .rotulo{color:#b9b2a6}
.rodape nav{display:flex;flex-wrap:wrap;gap:0 18px;margin:10px 0 -12px}
.rodape nav a{display:inline-flex;align-items:center;min-height:44px}
.rodape .fim{border-top:1px solid #3a362e;padding-top:20px;color:#b9b2a6;font-size:.84rem}

@media (min-width:760px){
  :root{--gut:32px}
  .abre{padding:112px 0 96px}
  .secao{padding:96px 0}
  .duas{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}
  .duas h2{margin-bottom:0}
  .principios{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
  .contato{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
  .rodape .wrap{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);align-items:start}
  .rodape .fim{grid-column:1/-1}
}
