/* Hallmark · pre-emit critique: P5 H5 E4 S5 R5 V4 */
/* Hallmark · genre: editorial · macrostructure: Portrait Ledger · theme: custom graphite/copper · enrichment: client photography · contrast: pass (40–41) · nav: N9 edge-aligned · footer: Ft2 compact legal · slop: pass (42–49) · mobile: pass (34,49–57) */
/* Source Serif 4 — variável, subconjunto latino, SIL OFL 1.1.
   Servida deste repositório: nenhuma requisição a terceiro. */
@font-face{
  font-family:"Source Serif 4";
  src:url("../fonts/source-serif-4-latin.woff2") format("woff2-variations");
  font-weight:300 700;
  font-style:normal;
  font-display:swap;
}

/* Adv. Emerson Luiz Souza da Silva — identidade grafite + cobre */

:root{
  --grafite:var(--color-graphite);
  --carvao:var(--color-coal);
  --carvao-alto:var(--color-coal-high);
  --cobre:var(--color-copper);
  --cobre-texto:var(--color-copper-text);
  --cobre-btn:var(--color-copper-button);
  --cobre-claro:var(--color-copper-light);
  --offwhite:var(--color-paper-soft);
  --papel:var(--color-paper);
  --texto:var(--color-ink);
  --texto-suave:var(--color-ink-soft);
  --linha:var(--color-rule);
  --linha-escura:var(--color-rule-dark);
  --fonte:var(--font-body);

  --max:1180px;
  --gut:clamp(1.25rem,4vw,3rem);
  --sec:clamp(4.5rem,9vw,8rem);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;font-family:var(--fonte)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

html,body{overflow-x:clip}
body{
  margin:0;
  background:var(--papel);
  color:var(--texto);
  font-family:var(--fonte);
  font-size:1.125rem;
  font-variant-numeric:tabular-nums;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,h5{font-weight:600;line-height:1.12;letter-spacing:-.018em;margin:0;text-wrap:balance;overflow-wrap:anywhere;min-width:0}
p{margin:0 0 1.1rem}
a{color:inherit}
img{max-width:100%;height:auto;display:block}
ul{margin:0;padding:0;list-style:none}

:focus-visible{outline:2px solid var(--color-focus);outline-offset:3px;border-radius:2px}

::selection{background:var(--cobre);color:var(--color-white)}
:root{color-scheme:light;accent-color:var(--cobre);scrollbar-color:var(--cobre-texto) var(--offwhite)}
input,textarea,select{caret-color:var(--cobre-texto)}
a:not(.btn):not(.marca):not(.alvo-ligar):not(.alvo-wa){text-underline-offset:.22em;text-decoration-thickness:1px}

.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.sec{padding-block:var(--sec)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
#falar{scroll-margin-top:5.5rem}

.pular{
  position:absolute;left:var(--gut);top:-100px;z-index:100;
  background:var(--cobre);color:var(--color-white);padding:.7rem 1.1rem;font-weight:600;border-radius:var(--radius-control);
}
.pular:focus{top:.75rem}

.titulo{position:relative;padding-top:2rem;margin-bottom:1.9rem}
.titulo::before{content:"";position:absolute;top:0;left:0;width:64px;height:2px;background:var(--cobre-texto)}
.escuro .titulo::before,.dif .titulo::before,.hero .titulo::before{background:var(--cobre)}

.titulo{font-size:clamp(1.9rem,4.2vw,3rem);max-width:22ch}
.intro{font-size:clamp(1.05rem,1.6vw,1.2rem);color:var(--texto-suave);max-width:62ch}

/* ---------- cabeçalho ---------- */
.topo{
  position:sticky;top:0;z-index:50;
  background:var(--color-header);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--linha-escura);
  transition:min-height var(--dur-medium) var(--ease-out),box-shadow var(--dur-medium) var(--ease-out);
}
.topo .wrap{display:flex;align-items:center;gap:1.5rem;min-height:74px;transition:min-height var(--dur-medium) var(--ease-out)}
.topo.rolado .wrap{min-height:58px}
.topo.rolado{box-shadow:0 1px 0 var(--cobre-texto)}
.topo.rolado .marca span{opacity:0;transition:opacity var(--dur-short) var(--ease-out)}
.marca{display:flex;align-items:center;gap:.8rem;text-decoration:none;color:var(--offwhite);margin-right:auto}
.marca svg{flex:none}
.marca-selo text{fill:var(--color-paper-soft);font-family:var(--font-display);font-size:23px;font-weight:600;letter-spacing:.1em}
.marca b{font-family:var(--fonte);font-size:1.02rem;font-weight:600;letter-spacing:.01em;display:block}
.marca span{display:block;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--color-dark-copy-muted)}

.nav{display:flex;gap:1.6rem;align-items:center}
.nav a,.btn,.rodape a{white-space:nowrap}
.nav a{color:var(--color-dark-copy-strong);text-decoration:none;font-size:.9rem;font-weight:500;padding-block:.4rem;border-bottom:1px solid transparent;transition:color var(--dur-short),border-color var(--dur-short)}
.nav a:hover{color:var(--offwhite);border-color:var(--cobre)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.85rem 1.5rem;border-radius:2px;text-decoration:none;
  font-weight:600;font-size:.95rem;border:1px solid transparent;cursor:pointer;
  transition:background-color var(--dur-short),color var(--dur-short),border-color var(--dur-short),transform var(--dur-short) var(--ease-out);
}
.btn:active{transform:translateY(1px)}
.btn:disabled{cursor:not-allowed;opacity:.68;transform:none}
.btn-cobre{background:var(--color-accent);color:var(--color-accent-ink)}
.btn-cobre:hover{background:var(--cobre-texto)}
.btn-linha{border-color:var(--linha-escura);color:var(--offwhite)}
.btn-linha:hover{border-color:var(--cobre);color:var(--cobre-claro)}
.btn-escuro{background:var(--grafite);color:var(--offwhite)}
.btn-escuro:hover{background:var(--carvao-alto)}

.menu-btn{display:none;background:none;border:1px solid var(--linha-escura);color:var(--offwhite);border-radius:2px;padding:.55rem .8rem;font:inherit;font-size:.85rem;cursor:pointer}

/* ---------- hero ---------- */
.hero{background:var(--grafite);color:var(--offwhite);position:relative;overflow:hidden}
.hero .wrap{position:relative;display:grid;gap:clamp(2.5rem,5vw,4.5rem);align-items:center;padding-block:clamp(3.5rem,7vw,6rem) clamp(4.75rem,9vw,7.75rem)}
@media (min-width:920px){.hero .wrap{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}}

.hero h1{font-size:var(--text-display);letter-spacing:-.025em;overflow-wrap:anywhere;min-width:0}
.hero h1{margin-bottom:1.75rem}
.hero-lide{font-size:1.18rem;line-height:1.6}
.assinatura{
  margin-top:2rem;padding-top:1.1rem;border-top:1px solid var(--linha-escura);
  font-size:1.05rem;font-weight:600;color:var(--offwhite);max-width:none;
}
.assinatura span{display:block;font-weight:400;font-size:.95rem;color:var(--cobre-claro);margin-top:.15rem}
.hero p{color:var(--color-dark-copy);max-width:52ch;font-size:1.08rem}
.hero .acoes{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2.2rem}
.hero .locais{margin-top:2.6rem;padding-top:1.6rem;border-top:1px solid var(--linha-escura);display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;font-size:.88rem;color:var(--color-dark-copy-muted)}
.hero .locais b{color:var(--offwhite);font-weight:600}

.js .hero h1{animation:hero-titulo var(--dur-long) var(--ease-out) both}
.js .hero-lide,.js .assinatura,.js .hero .acoes,.js .hero .locais{animation:hero-texto var(--dur-long) var(--ease-out) both}
.js .hero-lide{animation-delay:80ms}
.js .assinatura{animation-delay:140ms}
.js .hero .acoes{animation-delay:200ms}
.js .hero .locais{animation-delay:260ms}
.js .hero .retrato{animation:hero-retrato 900ms var(--ease-out) 100ms both}
@keyframes hero-titulo{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes hero-texto{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes hero-retrato{from{opacity:.25;clip-path:inset(8% 0 0 0)}to{opacity:1;clip-path:inset(0)}}

.retrato{position:relative}
.retrato img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:grayscale(.25) contrast(1.03);border-radius:2px}
.retrato figcaption{margin-top:.9rem;font-size:.8rem;color:var(--color-dark-copy-muted)}

/* ---------- faixa OAB ---------- */
.oab{background:var(--carvao);color:var(--offwhite);border-block:1px solid var(--linha-escura)}
.oab .wrap{padding-block:2.4rem}
.oab h2{
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;
  color:var(--cobre-claro);margin-bottom:1.2rem;
}
.oab ul{display:flex;flex-wrap:wrap;gap:.5rem 2.4rem;align-items:baseline}
.oab li{display:flex;align-items:baseline;gap:.5rem}
.oab .uf{
  font-size:1.15rem;font-weight:600;color:var(--offwhite);
  letter-spacing:.04em;line-height:1;
}
.oab .num{font-size:1rem;color:var(--color-dark-copy-muted);font-variant-numeric:tabular-nums}
.oab-nota{margin:1.3rem 0 0;font-size:.85rem;color:var(--color-dark-copy-muted)}

/* ---------- sobre ---------- */
.sobre .wrap{display:grid;gap:clamp(2rem,5vw,4rem)}
@media (min-width:900px){.sobre .wrap{grid-template-columns:1fr 1.25fr}}
.credenciais{border-top:1px solid var(--linha);margin-top:2rem}
.credenciais div{border-bottom:1px solid var(--linha);padding:1.1rem 0}
.credenciais dt{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cobre-texto);font-weight:600}
.credenciais dd{margin:.35rem 0 0;font-family:var(--fonte);font-size:1.1rem}

/* ---------- áreas ---------- */
.areas{background:var(--papel)}
.grade-areas{display:grid;gap:1px;background:var(--linha);border:1px solid var(--linha);margin-top:2.5rem}
@media (min-width:700px){.grade-areas{grid-template-columns:1fr 1fr}}
@media (min-width:1060px){.grade-areas{grid-template-columns:repeat(3,1fr)}}
.area{background:var(--papel)}
.area summary{
  display:flex;gap:1rem;align-items:baseline;cursor:pointer;list-style:none;
  padding:1.5rem 1.4rem;font-family:var(--fonte);font-size:1.12rem;font-weight:600;
  transition:background-color .2s;
}
.area summary::-webkit-details-marker{display:none}
.area summary:hover{background:var(--offwhite)}
.area summary::after{content:"+";margin-left:auto;color:var(--cobre-texto);font-family:var(--fonte);font-size:1.3rem;line-height:1;font-weight:400}
.area[open] summary::after{content:"–"}
.area[open] summary{background:var(--offwhite)}
.area .n{font-family:var(--fonte);font-size:.75rem;color:var(--cobre-texto);font-weight:600;font-variant-numeric:tabular-nums;flex:none}
.area p{padding:0 1.4rem 1.6rem;margin:0;color:var(--texto-suave);font-size:.95rem}

/* ---------- serviços ---------- */
.grupos-servicos{
  display:grid;gap:0 clamp(2rem,5vw,4rem);
  margin-top:2.5rem;border-top:1px solid var(--linha);
}
@media (min-width:820px){.grupos-servicos{grid-template-columns:repeat(3,1fr)}}
.grupos-servicos .grupo{padding:1.9rem 0;border-bottom:1px solid var(--linha)}
.grupos-servicos h3{
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cobre-texto);font-weight:600;margin-bottom:1rem;
}
.grupos-servicos li{
  padding:.5rem 0 .5rem 1.6rem;position:relative;font-size:.98rem;line-height:1.5;
}
.grupos-servicos li::before{
  content:"";position:absolute;left:0;top:1.1rem;
  width:8px;height:1px;background:var(--cobre);
}

/* ---------- diferenciais ---------- */
.dif{background:var(--grafite);color:var(--offwhite)}
.dif .titulo{color:var(--offwhite)}
.conducao{
  margin-top:3rem;display:grid;gap:0 clamp(2.5rem,6vw,5rem);
  border-top:1px solid var(--linha-escura);
}
@media (min-width:820px){.conducao{grid-template-columns:1fr 1fr}}
.conducao>div{padding:1.9rem 0;border-bottom:1px solid var(--linha-escura)}
.conducao dt{font-size:1.3rem;font-weight:600;letter-spacing:-.015em;color:var(--offwhite);margin-bottom:.5rem}
.conducao dd{margin:0;color:var(--color-dark-copy-body);font-size:1rem;max-width:46ch}

/* ---------- escritórios ---------- */
.locais{
  display:grid;gap:0 clamp(2rem,5vw,4rem);
  margin-top:2.5rem;border-top:1px solid var(--linha);
}
@media (min-width:820px){.locais{grid-template-columns:repeat(3,1fr)}}
.locais article{padding:2rem 0;border-bottom:1px solid var(--linha)}
.locais h3{font-size:1.4rem;margin-bottom:.9rem}
.locais h3 span{
  display:block;font-size:.82rem;font-weight:400;letter-spacing:.02em;
  color:var(--cobre-texto);margin-top:.25rem;
}
.locais address{font-style:normal;color:var(--texto-suave);font-size:1rem;line-height:1.75}
.locais p{margin:1.1rem 0 0;font-size:.92rem;color:var(--texto-suave)}
.escritorios{background:var(--offwhite)}
.locais article{display:flex;flex-direction:column}
.locais article:first-child h3::after,
.locais article:nth-child(2) h3::after{
  content:"";display:block;width:32px;height:2px;
  background:var(--cobre);margin-top:.8rem;
}

/* ---------- contato ---------- */
.contato{background:var(--offwhite)}
.contato .wrap{display:grid;gap:clamp(1.75rem,4vw,2.75rem);align-items:start}
@media (min-width:940px){.contato .wrap{grid-template-columns:.85fr 1.15fr}}
.contato .titulo{margin-bottom:1rem}
.contato .intro{margin-bottom:0}
.seletor-numeros{margin-top:1.15rem;position:relative}
.svg-sprite{position:absolute;width:0;height:0}
.seletor-numeros h3{
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cobre-texto);font-weight:600;margin-bottom:.45rem;
}
.seletor-numeros ul{border-top:1px solid var(--linha)}
.seletor-numeros li{
  display:grid;grid-template-columns:minmax(0,1fr) auto auto;
  column-gap:.35rem;row-gap:.08rem;align-items:center;
  padding:.5rem 0;border-bottom:1px solid var(--linha);
}
.seletor-numeros .praca{
  grid-column:1/-1;font-size:.75rem;line-height:1.15;color:var(--texto-suave);
}
.seletor-numeros .numero{
  grid-column:1;grid-row:2;font-size:1.05rem;font-weight:600;line-height:1.2;
  font-variant-numeric:tabular-nums;letter-spacing:-.01em;min-width:0;
}
.seletor-numeros a.alvo-ligar,
.seletor-numeros a.alvo-wa{
  grid-row:2;display:inline-flex;align-items:center;justify-content:center;gap:.28rem;
  height:32px;padding:0 .7rem;border-radius:3px;font-size:.75rem;font-weight:600;
  text-decoration:none;line-height:1;white-space:nowrap;
  transition:background-color var(--dur-short),color var(--dur-short),border-color var(--dur-short);
}
.seletor-numeros a.alvo-ligar{grid-column:2}
.seletor-numeros a.alvo-wa{grid-column:3}
.seletor-numeros .ico{flex:none;display:block;width:13px;height:13px}
.seletor-numeros a.alvo-ligar{color:var(--cobre-texto);background:transparent;border:1px solid var(--cobre)}
.seletor-numeros a.alvo-ligar:hover{background:var(--cobre);border-color:var(--cobre);color:#fff}
.seletor-numeros a.alvo-wa{color:#fff;background:#128C7E;border:1px solid #128C7E}
.seletor-numeros a.alvo-wa:hover{background:#075E54;border-color:#075E54;color:#fff}
.seletor-nota{margin:.7rem 0 0;font-size:.88rem;line-height:1.5;color:var(--texto-suave);max-width:46ch}
.seletor-horario,.seletor-email{margin:.35rem 0 0;font-size:.92rem;color:var(--texto-suave)}
.seletor-email a{color:var(--cobre-texto);text-underline-offset:.22em}

.esc-contato{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;margin:0 0 .6rem}
.esc-contato a{
  font-weight:600;color:var(--cobre-texto);text-decoration:none;
  border-bottom:1px solid transparent;padding-block:.3rem;
  transition:border-color var(--dur-short);
}
.esc-contato a:hover{border-color:var(--cobre)}

form{background:var(--color-white);border:1px solid var(--linha);padding:clamp(1.2rem,2.4vw,1.75rem)}
.campo{margin-bottom:.8rem}
.campo label{display:block;font-size:.8rem;font-weight:600;margin-bottom:.28rem}
.campo .opc{color:var(--texto-suave);font-weight:400}
input,select,textarea{
  width:100%;font:inherit;font-size:1rem;color:var(--texto);
  padding:.62rem .8rem;border:1px solid var(--linha);border-radius:2px;background:var(--papel);
  transition:border-color .2s;
}
input:hover,select:hover,textarea:hover{border-color:var(--cobre-texto)}
input:focus,select:focus,textarea:focus{border-color:var(--cobre)}
input:disabled,select:disabled,textarea:disabled{opacity:.55;cursor:not-allowed;background:var(--offwhite)}
textarea{min-height:110px;resize:vertical}
.consent{display:flex;gap:.7rem;align-items:flex-start;font-size:.87rem;color:var(--texto-suave)}
.consent input{width:auto;flex:none;margin-top:.25rem;accent-color:var(--cobre)}
form .btn{width:100%;margin-top:.85rem;padding-block:.9rem}
.aviso-form{font-size:.82rem;color:var(--texto-suave);margin:.7rem 0 0;text-align:center}
.campo-armadilha{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important}
.status-form{min-height:0;margin:.45rem 0 0;font-size:.9rem;font-weight:600;text-align:center}
form[data-state="success"] .status-form{color:var(--color-success)}
form[data-state="error"] .status-form{color:var(--color-error)}
form[data-state="loading"] .status-form{color:var(--texto-suave)}
.erro{display:none;color:var(--color-error);font-size:.82rem;margin:.25rem 0 0}
.campo.invalido .erro{display:block}
.campo.invalido input,.campo.invalido textarea,.campo.invalido select{border-color:var(--color-error)}

/* ---------- rodapé ---------- */
.rodape{background:var(--grafite);color:var(--color-dark-copy-muted);font-size:.9rem}
.rodape .wrap{padding-block:clamp(3rem,6vw,4.5rem)}
.rodape-topo{display:grid;gap:2.5rem;padding-bottom:2.5rem;border-bottom:1px solid var(--linha-escura)}
@media (min-width:820px){.rodape-topo{grid-template-columns:1.4fr 1fr 1fr}}
.rodape h2{color:var(--offwhite);font-size:1.15rem;margin-bottom:.6rem}
.rodape h3{color:var(--offwhite);font-size:.75rem;font-family:var(--fonte);letter-spacing:.16em;text-transform:uppercase;margin-bottom:1rem}
.rodape a{color:var(--color-dark-copy-muted);text-decoration:none}
.rodape a:hover{color:var(--cobre-claro)}
.rodape li{margin-bottom:.55rem}
.oab-lista{color:var(--color-dark-copy-body);line-height:1.9;font-variant-numeric:tabular-nums}
.rodape-fim{padding-top:2rem;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;font-size:.82rem}
.disclaimer{margin-top:1.5rem;font-size:.8rem;line-height:1.7;color:var(--color-dark-copy-muted);max-width:75ch}

/* ---------- página de conteúdo (privacidade) ---------- */
.doc{max-width:74ch}
.doc h2{font-size:clamp(1.4rem,2.6vw,1.8rem);margin:2.8rem 0 1rem}
.doc h3{font-size:1.15rem;margin:1.8rem 0 .6rem}
.doc li{padding-left:1.4rem;position:relative;margin-bottom:.6rem}
.doc li::before{content:"";position:absolute;left:0;top:.75rem;width:8px;height:1px;background:var(--cobre)}
.doc .atualizado{font-size:.85rem;color:var(--texto-suave)}
.doc-voltar{margin-top:3rem}

/* ---------- responsivo ---------- */
@media (max-width:860px){
  .menu-btn{display:block}
  .nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--grafite);border-bottom:1px solid var(--linha-escura);padding:.5rem var(--gut) 1.5rem;
  }
  .nav.aberto{display:flex}
  .nav a{padding:.9rem 0;border-bottom:1px solid var(--linha-escura)}
  .nav .btn{margin-top:1rem;border-bottom:none}
  .topo .wrap{position:relative}
}

@media (max-width:560px){
  .topo .wrap{gap:.75rem}
  .marca svg{width:32px;height:32px}
  .marca b{font-size:.8rem;white-space:nowrap}
  .marca span{font-size:.62rem;letter-spacing:.16em}
  .menu-btn{padding:.5rem .7rem}
}

/* fotografias */
.retrato img{object-position:50% 18%}
.retrato-sobre{margin:0}
.retrato-sobre img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 26%;border-radius:2px;filter:grayscale(.08) contrast(1.02)}
.retrato-sobre figcaption{
  margin-top:1.1rem;padding-left:1.1rem;border-left:1px solid var(--cobre-texto);
  font-size:.92rem;line-height:1.6;color:var(--texto-suave);max-width:34ch;
}

/* revelação ao entrar na tela — vale para qualquer [data-revelar] */
.js .revelar{
  opacity:0;transform:translateY(16px);
  transition:opacity var(--dur-long) var(--ease-out),transform var(--dur-long) var(--ease-out);
}
.js .revelar.visivel{opacity:1;transform:none}

/* o fio de cobre acima do título cresce quando a seção entra */
.titulo::before{transform-origin:left center}
.js .revelar .titulo::before{transform:scaleX(0);transition:transform var(--dur-medium) var(--ease-out) 120ms}
.js .revelar.visivel .titulo::before{transform:scaleX(1)}

.sobre .wrap{align-items:start}
@media (min-width:900px){.sobre .wrap{grid-template-columns:minmax(0,400px) minmax(0,1fr)}}
/* ---------- roda de áreas de atuação ---------- */
.roda-wrap{display:grid;gap:clamp(2rem,4vw,3.5rem);align-items:center;margin-top:3rem}
@media (min-width:940px){.roda-wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}

.roda{position:relative}
.roda-svg{width:100%;max-width:560px;margin-inline:auto;display:block;overflow:visible}
.roda-dica{margin:1.2rem 0 0;text-align:center;font-size:.82rem;color:var(--texto-suave)}

.anel-guia{fill:none;stroke:var(--linha);stroke-width:1}

.setor{cursor:pointer}
/* deslocamento de cada setor ao ativar — antes eram atributos style inline,
   movidos para cá para permitir CSP com style-src 'self' */
#setor-civil{--dx:7.00px;--dy:-12.12px}
#setor-consumo{--dx:14.00px;--dy:0.00px}
#setor-familia{--dx:7.00px;--dy:12.12px}
#setor-trabalho{--dx:-7.00px;--dy:12.12px}
#setor-empresa{--dx:-14.00px;--dy:0.00px}
#setor-publico{--dx:-7.00px;--dy:-12.12px}
.setor .fatia{
  fill:var(--color-white);stroke:var(--linha);stroke-width:1;
  transition:fill var(--dur-medium) var(--ease-out),stroke var(--dur-medium) var(--ease-out);
}
.setor .rotulo-setor{
  font-family:var(--fonte);font-size:20px;fill:var(--texto);
  transition:fill var(--dur-medium) var(--ease-out);pointer-events:none;
}
.setor .cont-setor{
  font-family:var(--fonte);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  fill:var(--texto-suave);transition:fill var(--dur-medium) var(--ease-out);pointer-events:none;
}
.setor{transition:transform var(--dur-medium) var(--ease-out)}
.setor:hover,.setor:focus-visible,.setor.ativo{transform:translate(var(--dx),var(--dy))}
.setor:hover .fatia,.setor:focus-visible .fatia,.setor.ativo .fatia{fill:var(--grafite);stroke:var(--grafite)}
.setor:hover .rotulo-setor,.setor:focus-visible .rotulo-setor,.setor.ativo .rotulo-setor{fill:var(--offwhite)}
.setor:hover .cont-setor,.setor:focus-visible .cont-setor,.setor.ativo .cont-setor{fill:var(--cobre-claro)}
.setor:focus{outline:none}
.setor:focus-visible .fatia{stroke:var(--cobre);stroke-width:2.5}

.miolo{fill:var(--offwhite);stroke:var(--linha);stroke-width:1}
.miolo-num{font-family:var(--fonte);font-size:58px;fill:var(--texto)}
.miolo-txt{font-family:var(--fonte);font-size:12px;letter-spacing:.16em;text-transform:uppercase;fill:var(--cobre-texto)}
.miolo-num,.miolo-txt,.miolo{transition:fill var(--dur-medium) var(--ease-out)}

.paineis{min-height:1px}
.painel-titulo{font-size:1.35rem;font-weight:600;letter-spacing:-.015em;margin-bottom:1.4rem}
.painel-grupo ul{border-top:1px solid var(--linha)}
.painel-grupo li{padding:1.3rem 0;border-bottom:1px solid var(--linha)}
.painel-grupo h4{font-size:1.15rem;font-weight:600;line-height:1.12;letter-spacing:-.018em;margin:0 0 .4rem}
.painel-grupo p{margin:0;color:var(--texto-suave);font-size:.95rem}

/* entrada dos itens do painel */
.js .painel-grupo:not([hidden]) li{animation:sobe .5s var(--ease-out) backwards}
.js .painel-grupo li:nth-child(2){animation-delay:.06s}
.js .painel-grupo li:nth-child(3){animation-delay:.12s}
.js .painel-grupo li:nth-child(4){animation-delay:.18s}
@keyframes sobe{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* desenho da roda ao entrar na tela */
.js .roda-svg .setor{opacity:0}
.js .roda-svg.desenhada .setor{opacity:1;transition:opacity .5s var(--ease-out),transform var(--dur-medium) var(--ease-out)}
.js .roda-svg.desenhada .setor:nth-of-type(2){transition-delay:.05s}
.js .roda-svg.desenhada .setor:nth-of-type(3){transition-delay:.1s}
.js .roda-svg.desenhada .setor:nth-of-type(4){transition-delay:.15s}
.js .roda-svg.desenhada .setor:nth-of-type(5){transition-delay:.2s}
.js .roda-svg.desenhada .setor:nth-of-type(6){transition-delay:.25s}

@media (prefers-reduced-motion:reduce){
  .setor,.js .roda-svg .setor{transition:none;opacity:1}
  .setor:hover,.setor:focus-visible,.setor.ativo{transform:none}
  .btn:active{transform:none}
  .js .painel-grupo:not([hidden]) li{animation:none}
  .js .hero h1,.js .hero-lide,.js .assinatura,.js .hero .acoes,.js .hero .locais,.js .hero .retrato{animation:none}
  .js .revelar,.js .revelar.visivel{opacity:1;transform:none;transition:none}
  .js .revelar .titulo::before,
  .js .revelar.visivel .titulo::before{transform:none;transition:none}
  .topo,.topo .wrap,.topo.rolado .wrap,.topo.rolado .marca span{transition:none}
}

/* ---------- roda em telas pequenas ---------- */
.dica-toque{display:none}
@media (hover:none){
  .dica-mouse{display:none}
  .dica-toque{display:inline}
}
@media (max-width:939px){
  .roda-svg{max-width:min(520px,88vw)}
  .roda-wrap{margin-top:2.5rem}
  .paineis{margin-top:.5rem}
}
@media (max-width:620px){
  .roda-svg{max-width:100%}
  .setor .rotulo-setor{font-size:27px}
  .setor .cont-setor{font-size:14px}
  .miolo-num{font-size:72px}
  .miolo-txt{font-size:15px}
  .anel-guia{display:none}
  .roda-dica{font-size:.88rem}
}

/* ---------- ajustes gerais de mobile ---------- */
@media (max-width:620px){
  body{font-size:1rem}
  .hero .wrap{padding-block:3rem 3.5rem}
  .hero h1{font-size:clamp(2rem,8.5vw,2.6rem)}
  .hero .acoes{gap:.7rem}
  .hero .acoes .btn{flex:1 1 100%}
  .oab ul{gap:.5rem 1.5rem}
  .oab .uf{font-size:1.05rem}
  .oab .num{font-size:.92rem}
  .grupos-servicos{margin-top:1.75rem}
  .grupos-servicos .grupo{padding:1.35rem 0}
  .grupos-servicos li{font-size:.95rem;padding-block:.4rem}
  .dif li{padding:1.6rem 1.3rem}
  .locais article{padding:1.6rem 0}
  form{padding:1.3rem}
  input,select,textarea{font-size:16px} /* evita zoom automático no iOS */
  .seletor-numeros li{grid-template-columns:auto auto 1fr;padding-block:.45rem;column-gap:.3rem}
  .seletor-numeros .numero{grid-column:1/-1;grid-row:2;font-size:.98rem}
  .seletor-numeros a.alvo-ligar,
  .seletor-numeros a.alvo-wa{grid-row:3;height:30px;padding:0 .55rem;font-size:.72rem}
  .seletor-numeros a.alvo-ligar{grid-column:1}
  .seletor-numeros a.alvo-wa{grid-column:2}
  .rodape-fim{flex-direction:column;gap:.6rem}
}

@media (max-width:620px){
  .consent{gap:.85rem;align-items:center}
  .consent input{width:22px;height:22px;margin-top:0}
}

/* ---------- otimizações para celular ---------- */

/* barra de ação fixa: o contato fica sempre a um toque */
.acao-fixa{display:none}
@media (max-width:860px){
  .acao-fixa{
    display:flex;gap:.6rem;
    position:fixed;left:0;right:0;bottom:0;z-index:55;
    padding:.7rem var(--gut) calc(.7rem + env(safe-area-inset-bottom));
    background:var(--color-mobile-bar);
    backdrop-filter:saturate(140%) blur(10px);
    border-top:1px solid var(--linha-escura);
  }
  .acao-fixa .btn{flex:1;padding-block:.9rem;font-size:1rem}
  body{padding-bottom:5.5rem}
  body.nao-encontrada{padding-bottom:0}
}

@media (max-width:620px){
  :root{--sec:3.4rem}

  /* hero mais curto: o retrato sobe e a assinatura vem depois dele */
  .hero .wrap{padding-block:2.25rem 2.75rem;gap:0}
  .hero h1{margin-bottom:1.25rem}
  .hero-lide{font-size:1.02rem;line-height:1.55}
  .hero .wrap>div{display:contents}
  .hero h1{order:1}
  .hero-lide{order:2}
  .retrato{order:3}
  .assinatura{order:4;margin-top:1.5rem}
  .hero .acoes{order:5;margin-top:1.5rem}
  .hero .acoes .btn-linha{display:none} /* já está na barra fixa */
  .hero .locais{order:6;margin-top:1.75rem;padding-top:1.25rem}
  .retrato{margin-top:1.75rem}
  .retrato img{aspect-ratio:1/1;object-position:50% 14%}
  .retrato figcaption{margin-top:.7rem}

  /* listas mais densas */
  .conducao>div{padding:1.35rem 0}
  .conducao dt{font-size:1.15rem}
  .locais article{padding:1.5rem 0}
  .locais h3{font-size:1.25rem;margin-bottom:.7rem}
  .credenciais div{padding:.9rem 0}
  .painel-grupo li{padding:1rem 0}
  .titulo{padding-top:1.5rem;margin-bottom:1.4rem}
  .retrato-sobre figcaption{font-size:.88rem}

  /* alvos do rodapé com altura de toque */
  .rodape li{margin-bottom:0}
  .rodape li a,.rodape li>span{display:inline-block;padding-block:.55rem}
  .rodape-fim a{display:inline-block;padding-block:.4rem}
  .consent input{width:24px;height:24px}

  /* rodapé sem colar na barra fixa */
  .rodape .wrap{padding-block:2.75rem 2rem}
  .rodape-topo{gap:2rem;padding-bottom:2rem}
}

/* ---------- 404 ---------- */
body.nao-encontrada{
  background:var(--grafite);
  color:var(--offwhite);
  min-height:100vh;
  padding-bottom:0;
}
body.nao-encontrada .titulo::before{background:var(--cobre)}
.pagina-404{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(3rem,8vw,6rem) var(--gut);
  max-width:40rem;
}
.pagina-404 .marca{margin:0 0 2.5rem}
.pagina-404 p{color:var(--color-dark-copy);max-width:42ch}
.pagina-404 .acoes{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2rem}
.campo-turnstile{min-height:65px}