/* ═══════════════════════════════════════════════════════════════════════════
   MENU MOBILE v5 · public/css/drawer.css                          07/09/2026
   ───────────────────────────────────────────────────────────────────────────
   Carregado DEPOIS de gt-chrome.css e gt-chrome-light.css, e por isso vence
   as regras de casca (.agc-drawer, .agc-dr__top, .agc-dr__body) sem duelo de
   especificidade. Todo componente novo usa o prefixo `dm-` de propósito: as
   regras `agc-dr__*` das versões anteriores foram REMOVIDAS dos dois arquivos
   do chrome (correcoes/drawer-v5.php) e nada aqui as herda.

   O mapa de decisões está em MENU-MOBILE.md. As regras que não podem ser
   quebradas:

   ⚠ COR É PREENCHIMENTO, NUNCA TINTA SOBRE O CLARO. As 11 joias de área
     (5,04:1 a 9,36:1 com branco) pintam ladrilhos, filetes e fundos com glifo
     branco em cima. Como texto sobre pergaminho, várias reprovariam.
   ⚠ OURO `#B4915E` SÓ SOBRE MARINHO (5,77:1) ou como fundo de botão com
     tinta marinho (6,58:1). Sobre o claro, o acento é o bronze `#7B5E32`.
   ⚠ WHATSAPP COM TEXTO É `#0F7D70` (5,01:1). `#128C7E` dá 4,14:1 e reprova.
   ⚠ NENHUM TEXTO FICA SOBRE FOTO, e é assim de propósito: o cartão de
     carreira já teve o texto por cima da imagem, com véu calibrado em
     95%/92%/55%/25%, e o `cover` cortava 33% da foto. Hoje a foto é faixa e o
     texto vem abaixo dela. Quem reintroduzir texto sobre imagem precisa medir
     véu de novo (piso: marinho ≥ .86 de alfa sobre o pior pixel).
   ⚠ `cv-square` impõe 4px de raio em tudo. Os ÚNICOS círculos são os pontos
     dos trilhos, e por isso a classe deles contém `__dot` (a lista de
     exceções circulares do base.php). Nenhuma outra classe pode conter
     `badge`, `avatar`, `__dot`, `__node` ou `__beacon`.
   ⚠ `h2` do site nasce quase branco pelo `global_css`; `.dm-t` declara a cor.
   ⚠ `minmax(0,1fr)` nas grades, nunca `1fr` (o mínimo automático vira
     `min-content` e a coluna com o título mais longo empurra a outra).
   ⚠ A barra de seções é `position:sticky` DENTRO de `.agc-dr__body`, que é o
     contêiner de rolagem: nenhum ancestral entre os dois pode ter overflow
     escondido, senão o sticky morre em silêncio (armadilha de /contato).
   ═══════════════════════════════════════════════════════════════════════════ */

/* ⚠ NÃO EXISTE regra de "fechado = invisível" aqui, e foi tentado: o gt-chrome.css
   fecha o drawer com translateX(100%), a 352px do viewport, e as <img loading="lazy">
   eram baixadas em toda página. visibility:hidden e content-visibility:hidden no
   estado fechado NÃO seguraram (medido: 22 imagens, 456 KB). O que segura é a
   marcação: as imagens nascem com data-src e o script do partial dá o src no
   primeiro abrir. Regra de esconder aqui só zeraria os offsets que os trilhos leem. */
.agc-drawer{
  --dm-ink:#101C35;
  --dm-ink-2:#18274A;
  --dm-mut:#5A6478;
  --dm-brz:#7B5E32;
  --dm-gold:#B4915E;
  --dm-gold-l:#D9C29A;
  --dm-line:#E1D9CC;
  --dm-paper:#FFFFFF;
  --dm-linen:#F6F3EE;
  --dm-wa:#0F7D70;
  --dm-ok:#2C6E49;
  --dm-h:var(--ah-h,'Sora','Sora fb'),system-ui,-apple-system,"Segoe UI",sans-serif;
  --dm-pad:16px;

  width:min(392px,94vw);
  background:var(--dm-linen);color:var(--dm-ink);
  border-left:1px solid var(--dm-line);
  box-shadow:-24px 0 60px -30px rgba(16,28,53,.38);
  display:flex;flex-direction:column;
}
.agc-drawer::before{content:none}
.agc-drawer *{box-sizing:border-box}
/* ⚠ RESET COM `:where()`, QUE TEM ESPECIFICIDADE ZERO. `.agc-drawer a{color:inherit}`
     vale (0,1,1) e VENCIA `.dm-wa{color:#fff}` (0,1,0): o botão de WhatsApp
     saía com tinta MARINHO sobre verde, 3,38:1, e os quatro ladrilhos de
     intenção idem (1,81:1). Medido na tela; o CSS parecia certo. Com `:where`
     o reset vale (0,1,0) e qualquer regra de componente escrita depois ganha. */
.agc-drawer :where(a){color:inherit;text-decoration:none}
.agc-drawer :where(button){font-family:inherit;color:inherit}

/* ── topo fixo ── */
.agc-drawer .agc-dr__top{
  flex:none;background:var(--dm-paper);border-bottom:1px solid var(--dm-line);
  padding:12px var(--dm-pad);display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.agc-drawer .agc-dr__top::after{content:none}
.agc-drawer .agc-dr__logo{flex:0 1 auto;min-width:0;display:flex;align-items:center}
.agc-drawer .agc-dr__logo img{height:34px;width:auto;max-width:210px;object-fit:contain;display:block}
.agc-drawer .agc-dr__close{
  width:44px;height:44px;flex:none;display:grid;place-items:center;
  color:var(--dm-ink);background:var(--dm-linen);border:1px solid var(--dm-line);cursor:pointer;
  font-size:15px;border-radius:4px;transition:background .16s,color .16s,border-color .16s;
}
.agc-drawer .agc-dr__close:hover,
.agc-drawer .agc-dr__close:focus-visible{background:var(--dm-ink);border-color:var(--dm-ink);color:var(--dm-linen)}

/* ── corpo rolável: SEM recuo (a barra de seções e o bloco marinho vão de
     borda a borda); cada seção traz o próprio recuo ── */
.agc-drawer .agc-dr__body{
  flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;
  background:var(--dm-linen);padding:0;
  scrollbar-width:thin;scrollbar-color:rgba(123,94,50,.35) transparent;
  overscroll-behavior:contain;scroll-behavior:smooth;
}
.agc-drawer .agc-dr__body::-webkit-scrollbar{width:4px}
.agc-drawer .agc-dr__body::-webkit-scrollbar-thumb{background:rgba(123,94,50,.35)}
@media(prefers-reduced-motion:reduce){.agc-drawer .agc-dr__body{scroll-behavior:auto}}

/* ══ BARRA DE SEÇÕES (grudada) ══════════════════════════════════════════ */
.dm-tabs{
  position:sticky;top:0;z-index:6;
  display:flex;gap:6px;padding:9px var(--dm-pad);
  background:rgba(246,243,238,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--dm-line);
  overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;
}
.dm-tabs::-webkit-scrollbar{display:none}
.dm-tab{
  flex:none;display:inline-flex;align-items:center;gap:6px;
  min-height:38px;padding:0 12px;border-radius:4px;cursor:pointer;
  font-size:12px;font-weight:700;letter-spacing:.01em;white-space:nowrap;
  color:var(--dm-ink);background:var(--dm-paper);border:1px solid var(--dm-line);
  transition:background .15s,color .15s,border-color .15s;
}
.dm-tab i{font-size:11px;color:var(--dm-brz)}
.dm-tab.is-on{background:var(--dm-ink);border-color:var(--dm-ink);color:#FFFFFF}
.dm-tab.is-on i{color:var(--dm-gold-l)}

/* ══ SEÇÃO ═════════════════════════════════════════════════════════════ */
.dm-sec{padding:18px var(--dm-pad) 6px;scroll-margin-top:60px}
.dm-sec + .dm-sec{border-top:1px solid var(--dm-line);margin-top:14px}
.dm-hd{margin:0 0 12px}
.dm-eye{
  display:flex;align-items:center;gap:8px;margin:0 0 6px;
  font-size:10.5px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--dm-brz);
}
.dm-eye__n{
  display:inline-grid;place-items:center;min-width:22px;height:20px;padding:0 6px;
  font-size:10.5px;font-weight:800;letter-spacing:0;color:#FFFFFF;background:var(--dm-ink);border-radius:4px;
}
/* ⚠ `h2` do site nasce em pergaminho pelo global_css: a cor é declarada aqui */
.agc-drawer .dm-t{
  margin:0;font-family:var(--dm-h);font-size:19px;line-height:1.18;font-weight:800;
  letter-spacing:-.012em;color:var(--dm-ink);
}
.dm-sub{margin:6px 0 0;font-size:12.5px;line-height:1.5;color:var(--dm-mut)}

/* botão "ver tudo" no FIM de cada bloco: mesmo desenho em todas as seções */
.dm-more{
  display:flex;align-items:center;justify-content:center;gap:9px;
  min-height:44px;margin:12px 0 4px;padding:0 14px;border-radius:4px;
  font-size:12.5px;font-weight:700;color:var(--dm-ink);
  background:var(--dm-paper);border:1px solid var(--dm-ink);
  transition:background .15s,color .15s;
}
.dm-more i{font-size:11px;color:var(--dm-brz);transition:transform .2s}
.dm-more:active,.dm-more:hover{background:var(--dm-ink);color:#FFFFFF}
.dm-more:hover i{color:var(--dm-gold-l);transform:translateX(3px)}

/* grade de 2 colunas — `minmax(0,1fr)` para a coluna não crescer com o texto */
.dm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}

/* ══ INÍCIO ════════════════════════════════════════════════════════════ */
.dm-hello{margin:2px 0 12px}
.dm-hello__hi{margin:0;font-family:var(--dm-h);font-size:22px;line-height:1.15;font-weight:800;letter-spacing:-.015em;color:var(--dm-ink)}
.dm-hello__hi em{font-style:normal;color:var(--dm-brz)}
.dm-hello__st{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;margin:8px 0 0;font-size:11.5px;color:var(--dm-mut)}
/* marcador de estado: QUADRADO de 8px, por isso não se chama __dot */
.dm-hello__k{width:8px;height:8px;flex:none;border-radius:2px;background:var(--dm-mut)}
.dm-hello__k.is-open{background:var(--dm-ok)}
.dm-hello__st b{font-weight:700;color:var(--dm-ink)}
.dm-hello__st time{color:var(--dm-mut);font-variant-numeric:tabular-nums}

.dm-search{
  width:100%;display:grid;grid-template-columns:34px minmax(0,1fr) 36px;
  align-items:center;gap:8px;padding:6px;min-height:50px;
  background:var(--dm-paper);border:1px solid rgba(16,28,53,.14);border-radius:4px;cursor:pointer;
  text-align:left;box-shadow:0 1px 2px rgba(16,28,53,.06);transition:border-color .18s;
}
.dm-search:hover,.dm-search:focus-visible{border-color:rgba(123,94,50,.55)}
.dm-search__ic{width:34px;height:34px;display:grid;place-items:center;font-size:15px;color:var(--dm-brz)}
.dm-search__tx{min-width:0;font-size:13.5px;font-weight:500;color:var(--dm-mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-search__tx b{font-weight:700;color:var(--dm-ink)}
.dm-search__go{width:36px;height:36px;display:grid;place-items:center;font-size:12px;color:var(--dm-gold-l);background:var(--dm-ink);border-radius:4px}

/* ações rápidas: ligar · mapa · WhatsApp */
.dm-acts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.dm-act{
  display:grid;gap:6px;justify-items:center;padding:12px 6px 11px;border-radius:4px;
  background:linear-gradient(150deg,var(--dm-ink-2),var(--dm-ink) 70%);
  border:1px solid rgba(180,145,94,.3);transition:border-color .18s,transform .18s;
}
.dm-act:hover{border-color:var(--dm-gold);transform:translateY(-2px)}
.dm-act__ic{font-size:17px;line-height:1;color:var(--dm-gold)}
.dm-act__t{font-size:10.5px;font-weight:700;letter-spacing:.04em;color:var(--dm-linen)}
.dm-act--wa{background:linear-gradient(150deg,var(--dm-wa),#0B6659 78%);border-color:rgba(255,255,255,.22)}
.dm-act--wa .dm-act__ic,.dm-act--wa .dm-act__t{color:#FFFFFF}

/* ★ TRABALHE CONOSCO: o primeiro cartão, com a foto real do hero da página */
/* ⚠⚠ A FOTO É UMA FAIXA ULTRAWIDE NO TOPO, E O TEXTO OCUPA 100% ABAIXO DELA.
   Pedido do cliente: "deixe a imagem em ultrawide e o texto 100% pra não
   cortar as advogadas". A causa do corte era geométrica: a foto é 900×300
   (exatamente 3:1) e o cartão media 360×178 (2:1), então o `cover` de fundo
   descartava **33% da largura** — justamente as pessoas das pontas. Com a
   faixa na proporção NATIVA da foto o recorte é ZERO.
   ⚠ E o texto saiu de cima da foto, então o véu de leitura calibrado
     (95%/92%/55%/25%) e o `max-width:68%` SUMIRAM: não existe mais pixel de
     foto atrás de letra nenhuma. Reintroduzir texto sobre a imagem obriga a
     medir véu de novo, que é a regra que este arquivo já registra. */
.dm-hire{
  position:relative;display:flex;flex-direction:column;overflow:hidden;margin-top:14px;
  border-radius:4px;background:var(--dm-ink);
  border:1px solid rgba(180,145,94,.35);
  box-shadow:0 14px 32px -20px rgba(16,28,53,.7);
}
/* a proporção é a do arquivo (900/300); trocar a foto por outra de proporção
   diferente pede trocar este valor, senão o `cover` volta a recortar */
.dm-hire__ph{position:relative;width:100%;aspect-ratio:3/1;overflow:hidden;background:var(--dm-ink-2)}
/* a foto é <img> com data-src (não background-image, que o navegador baixa em
   toda página mesmo com o menu fechado) */
.dm-hire__img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
/* derretimento na base: NÃO é véu de leitura (não há texto aqui), é a costura
   entre a foto e o bloco marinho */
.dm-hire__ph::after{content:"";position:absolute;inset:auto 0 0;height:40%;
  background:linear-gradient(180deg,rgba(16,28,53,0),rgba(16,28,53,.94))}
.dm-hire__in{display:flex;flex-direction:column;gap:6px;padding:14px 16px 16px;
  border-top:2px solid var(--dm-gold)}
/* sobre o marinho SÓLIDO o ouro da marca passa (5,77:1) e é ele que vale aqui;
   o `--dm-gold-l` existia só por causa do véu que não existe mais */
.dm-hire__eye{margin:0;font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--dm-gold)}
.dm-hire__t{margin:0;font-family:var(--dm-h);font-size:22px;line-height:1.1;font-weight:800;letter-spacing:-.015em;color:#FFFFFF}
.dm-hire__t em{font-style:normal;color:var(--dm-gold-l)}
.dm-hire__d{margin:0;font-size:12px;line-height:1.45;color:rgba(246,243,238,.86)}
.dm-hire__btn{
  display:inline-flex;align-items:center;gap:8px;align-self:flex-start;margin-top:6px;
  min-height:36px;padding:0 13px;border-radius:4px;
  font-size:12px;font-weight:800;color:var(--dm-ink);background:var(--dm-gold);
  transition:background .15s,transform .15s;
}
.dm-hire__btn i{font-size:11px}
.dm-hire:hover .dm-hire__btn{background:var(--dm-gold-l);transform:translateX(2px)}
/* O selo volta ao canto da foto, e agora pode: ele tem FUNDO OPACO, então é
   texto sobre caixa marinho (15,3:1), nunca sobre pixel de fotografia. Ele já
   esteve em absoluto antes e cobria a sobrancelha — o que mudou é que a
   sobrancelha não mora mais dentro da imagem. */
.dm-hire__mark{
  position:absolute;left:10px;top:10px;z-index:1;display:inline-flex;align-items:center;gap:6px;
  padding:5px 8px;border-radius:4px;
  font-size:9.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:#FFFFFF;background:var(--dm-ink);border:1px solid rgba(180,145,94,.5);
}
.dm-hire__mark::before{content:"";width:6px;height:6px;border-radius:2px;background:#6FCF97}

/* por onde começar: 4 ladrilhos coloridos que ROLAM o menu até o bloco */
.dm-intent{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.dm-intent__i{
  position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:5px;
  min-height:96px;padding:13px 12px 12px;border-radius:4px;border:0;cursor:pointer;text-align:left;
  color:#FFFFFF;background:var(--k,#2F4673);overflow:hidden;
  transition:transform .18s,box-shadow .18s;
}
.dm-intent__i::after{content:"";position:absolute;right:-26px;bottom:-30px;width:96px;height:96px;border-radius:4px;
  background:rgba(255,255,255,.08);transform:rotate(18deg)}
.dm-intent__i:hover{transform:translateY(-2px);box-shadow:0 12px 26px -16px rgba(16,28,53,.7)}
.dm-intent__ic{font-size:19px;line-height:1;color:#FFFFFF;opacity:.95}
.dm-intent__t{margin-top:auto;font-family:var(--dm-h);font-size:13.5px;line-height:1.2;font-weight:800;letter-spacing:-.005em}
.dm-intent__d{font-size:11px;line-height:1.3;color:rgba(255,255,255,.92)}
.dm-intent__go{position:absolute;right:10px;top:12px;font-size:11px;color:rgba(255,255,255,.8)}

/* ══ SOLUÇÕES: foto + ícone + cor da área ═════════════════════════════ */
.dm-sol{
  position:relative;display:flex;flex-direction:column;justify-content:flex-end;
  aspect-ratio:155/118;overflow:hidden;border-radius:4px;background:var(--dm-ink);
  border-bottom:3px solid var(--k,#2F4673);
}
.dm-sol__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 38%;
  transition:transform .5s cubic-bezier(.16,1,.3,1)}
.dm-sol:hover .dm-sol__img{transform:scale(1.05)}
/* véu de leitura: fraco no topo, marinho quase opaco onde o título mora */
/* ⚠ o título pode ocupar as 3 linhas de baixo (~45% da altura): o véu chega
     a .84 já em 55% para o pior pixel da foto dar ≥ 8:1 sob qualquer linha. */
.dm-sol::before{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(16,28,53,.04) 0%,rgba(16,28,53,.16) 35%,rgba(16,28,53,.84) 55%,rgba(16,28,53,.94) 100%)}
.dm-sol__ic{
  position:absolute;left:10px;top:10px;z-index:2;width:30px;height:30px;display:grid;place-items:center;
  font-size:12.5px;color:#FFFFFF;background:var(--k,#2F4673);border-radius:4px;
  box-shadow:0 4px 10px -4px rgba(0,0,0,.5);
}
.dm-sol__t{
  position:relative;z-index:2;padding:0 10px 10px;
  font-family:var(--dm-h);font-size:12.5px;line-height:1.22;font-weight:700;color:#FFFFFF;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  text-shadow:0 1px 2px rgba(0,0,0,.35);
}

/* ══ CALCULADORAS: as 30 abertas, em 2 colunas ═══════════════════════ */
/* ⚠ Cartão EMPILHADO (ícone em cima do título) media 114px por linha e levava
     as 30 a 1.909px. Ícone AO LADO do texto, como numa lista, dá ~72px: as
     mesmas 30 cabem em ~1.450px sem perder o título em 2 linhas. */
.dm-fe{
  position:relative;display:grid;grid-template-columns:30px minmax(0,1fr);grid-template-rows:auto auto;
  column-gap:9px;row-gap:3px;align-items:start;min-height:70px;padding:10px 9px 9px;
  background:var(--dm-paper);border:1px solid var(--dm-line);border-top:3px solid var(--k,#2F4673);border-radius:4px;
  transition:box-shadow .18s,transform .18s;
}
.dm-fe:hover{transform:translateY(-2px);box-shadow:0 10px 22px -16px rgba(16,28,53,.55)}
.dm-fe:active{background:var(--dm-linen)}
.dm-fe__ic{grid-row:1 / span 2;width:30px;height:30px;display:grid;place-items:center;font-size:13px;color:#FFFFFF;background:var(--k,#2F4673);border-radius:4px}
.dm-fe__t{
  font-size:12.3px;line-height:1.25;font-weight:700;color:var(--dm-ink);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
/* diagnóstico: a palavra entra na etiqueta, na cor da área (todas ≥ 7:1) */
.dm-fe__g b{font-weight:800;color:var(--k,#2F4673)}
/* ⚠ Em caixa alta com .1em de tracking a etiqueta cabia 18 caracteres e
     "Recuperação de Créditos" saía como "RECUPERAÇÃO DE CR…" (medido). Em
     caixa normal e sem tracking cabem ~24: a maioria inteira, o resto com
     reticência honesta. */
/* ⚠ TRÊS linhas, não duas: medido na tela, "Seguros e Responsabilidade Civil"
   precisa de 3 linhas nos 96px da coluna e perdia a última palavra. O mesmo
   vale para "Societário, Fusões e Aquisições" no cartão de dúvidas. Título de
   POST continua em 3 e cortando de propósito: ali o corte é o padrão do
   cartão de notícia, e o título inteiro está na página de destino.
   A etiqueta QUEBRA em vez de cortar: na coluna de 117px ao
   lado do ícone, "Recuperação de Créditos" não cabe inteira numa linha só, e
   "Recuperação de…" não diz nada. As linhas da grade se igualam sozinhas. */
.dm-fe__g{
  font-size:10.5px;line-height:1.25;font-weight:700;letter-spacing:.01em;color:var(--dm-mut);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
/* diagnóstico: o mesmo cartão com o fundo levemente tingido pela cor da área.
   É a página de maior intenção da Central. */
.dm-fe--diag{background:color-mix(in srgb,var(--k,#2F4673) 6%,#FFFFFF)}

/* ══ DOSSIÊS: 2×2 com capa ═════════════════════════════════════════════ */
.dm-do{
  display:flex;flex-direction:column;overflow:hidden;border-radius:4px;
  background:var(--dm-paper);border:1px solid var(--dm-line);
  transition:transform .18s,box-shadow .18s;
}
.dm-do:hover{transform:translateY(-2px);box-shadow:0 10px 22px -16px rgba(16,28,53,.55)}
.dm-do__cap{position:relative;aspect-ratio:440/248;background:var(--k,#2F4673);overflow:hidden}
.dm-do__cap img{width:100%;height:100%;object-fit:cover;display:block}
.dm-do__cap::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--k,#2F4673)}
.dm-do__b{display:flex;flex-direction:column;gap:5px;padding:10px 10px 11px;flex:1}
.dm-do__tag{font-size:9.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#FFFFFF;background:var(--k,#2F4673);padding:3px 7px;align-self:flex-start;border-radius:4px}
.dm-do__t{font-family:var(--dm-h);font-size:12.6px;line-height:1.25;font-weight:700;color:var(--dm-ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dm-do__m{margin-top:auto;font-size:10.5px;color:var(--dm-mut)}
.dm-do__m b{font-weight:800;color:var(--dm-ink)}

/* ══ DÚVIDAS: 11 categorias com contagem e cor ════════════════════════ */
.dm-cats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dm-cat{
  display:flex;align-items:center;gap:9px;min-height:48px;padding:8px 10px;border-radius:4px;
  background:var(--dm-paper);border:1px solid var(--dm-line);border-left:3px solid var(--k,#2F4673);
}
.dm-cat:active{background:var(--dm-linen)}
.dm-cat__t{flex:1;min-width:0;font-size:11.4px;line-height:1.25;font-weight:600;color:var(--dm-ink);overflow-wrap:anywhere;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.dm-cat__n{flex:none;min-width:26px;text-align:center;padding:3px 5px;border-radius:4px;
  font-size:10.5px;font-weight:800;color:var(--dm-ink);background:color-mix(in srgb,var(--k,#2F4673) 12%,#FFFFFF)}

/* ══ TRILHOS (swiper nativo): scroll-snap + pontos + setas ════════════ */
.dm-rail{position:relative;margin:0 calc(var(--dm-pad) * -1)}
.dm-rail__tr{
  display:grid;grid-auto-flow:column;gap:10px;padding:2px var(--dm-pad) 4px;
  overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;
  scroll-snap-type:x mandatory;scroll-padding-inline:var(--dm-pad);-webkit-overflow-scrolling:touch;
}
.dm-rail__tr::-webkit-scrollbar{display:none}
.dm-rail__tr > *{scroll-snap-align:start}
.dm-rail--blog .dm-rail__tr{grid-auto-columns:178px}
.dm-rail--team .dm-rail__tr{grid-auto-columns:150px}
.dm-rail--sede .dm-rail__tr{grid-auto-columns:150px}
.dm-rail__ui{display:flex;align-items:center;gap:8px;padding:8px var(--dm-pad) 0}
/* o CONTÊINER dos pontos não pode conter `__dot` no nome (cv-square o
   arredondaria também); só o ponto se chama assim, e é o único círculo. */
.dm-rail__pts{display:flex;gap:5px;flex:1;align-items:center}
/* ⚠ o único círculo do menu: `__dot` entra na lista circular do cv-square */
.dm-rail__dot{width:6px;height:6px;border-radius:50%;background:rgba(16,28,53,.2);transition:background .2s,transform .2s}
.dm-rail__dot.is-on{background:var(--dm-brz);transform:scale(1.25)}
.dm-rail__ar{
  width:38px;height:38px;display:grid;place-items:center;border-radius:4px;cursor:pointer;
  color:var(--dm-ink);background:var(--dm-paper);border:1px solid var(--dm-line);font-size:12px;
  transition:background .15s,color .15s;
}
.dm-rail__ar:hover{background:var(--dm-ink);color:#FFFFFF;border-color:var(--dm-ink)}
.dm-rail__ar[disabled]{opacity:.35;cursor:default}
.dm-rail__ar[disabled]:hover{background:var(--dm-paper);color:var(--dm-ink);border-color:var(--dm-line)}

/* ══ BLOG ═══════════════════════════════════════════════════════════════ */
.dm-post{display:flex;flex-direction:column;overflow:hidden;border-radius:4px;background:var(--dm-paper);border:1px solid var(--dm-line)}
.dm-post__cap{aspect-ratio:3/2;background:var(--dm-line);overflow:hidden}
.dm-post__cap img{width:100%;height:100%;object-fit:cover;display:block}
.dm-post__t{padding:10px 11px 0;font-size:12.2px;line-height:1.32;font-weight:600;color:var(--dm-ink);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.dm-post__d{padding:7px 11px 11px;margin-top:auto;font-size:10.5px;color:var(--dm-mut)}
.dm-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.dm-tag{
  display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 10px;border-radius:4px;
  font-size:11.5px;font-weight:700;color:var(--k-ink,#101C35);background:var(--k-lt,#E1D9CC);
}
.dm-tag::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--k,#7B5E32)}
.dm-tag b{font-weight:800;opacity:.75}

/* ══ ESCRITÓRIO: o único bloco marinho, de borda a borda ══════════════ */
.dm-sec--dark{
  background:var(--dm-ink);color:var(--dm-linen);padding-bottom:20px;
  /* ⚠ brilho a .12, não .24: no pior ponto do brilho o ouro do texto caía
       para 3,97:1 (medido). A .12 o pior caso fica em 4,8 e o repouso em 5,77. */
  background-image:radial-gradient(420px 220px at 100% 0%,rgba(180,145,94,.12),transparent 62%),
                   radial-gradient(360px 240px at 0% 100%,rgba(180,145,94,.08),transparent 60%);
}
.dm-sec--dark + .dm-sec{border-top:0}
.dm-sec--dark .dm-eye{color:var(--dm-gold)}
.dm-sec--dark .dm-eye__n{background:var(--dm-gold);color:var(--dm-ink)}
.agc-drawer .dm-sec--dark .dm-t{color:#FFFFFF}
.dm-sec--dark .dm-sub{color:rgba(246,243,238,.78)}
.dm-sec--dark .dm-rail__dot{background:rgba(255,255,255,.22)}
.dm-sec--dark .dm-rail__dot.is-on{background:var(--dm-gold)}
.dm-sec--dark .dm-rail__ar{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#FFFFFF}
.dm-sec--dark .dm-rail__ar:hover{background:var(--dm-gold);border-color:var(--dm-gold);color:var(--dm-ink)}
.dm-sec--dark .dm-rail__ar[disabled]:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#FFFFFF}
.dm-sec--dark .dm-more{background:transparent;border-color:rgba(180,145,94,.55);color:#FFFFFF}
.dm-sec--dark .dm-more i{color:var(--dm-gold)}
.dm-sec--dark .dm-more:hover{background:var(--dm-gold);border-color:var(--dm-gold);color:var(--dm-ink)}
.dm-sec--dark .dm-more:hover i{color:var(--dm-ink)}

.dm-adv{display:flex;flex-direction:column;overflow:hidden;border-radius:4px;background:var(--dm-paper);border:1px solid rgba(255,255,255,.14)}
.dm-adv__ph{aspect-ratio:150/150;overflow:hidden;background:var(--dm-line)}
.dm-adv__ph img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.dm-adv__b{display:flex;flex-direction:column;gap:2px;padding:9px 10px 10px}
.dm-adv__n{font-family:var(--dm-h);font-size:12.3px;line-height:1.2;font-weight:700;color:var(--dm-ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dm-adv__r{font-size:9.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--dm-brz)}
.dm-adv__o{font-size:10.5px;color:var(--dm-mut)}

.dm-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:14px 0 4px}
.dm-num{display:flex;flex-direction:column;gap:2px;align-items:center;text-align:center;padding:10px 4px;
  border-radius:4px;background:rgba(255,255,255,.06);border:1px solid rgba(180,145,94,.24)}
.dm-num b{font-family:var(--dm-h);font-size:18px;line-height:1;font-weight:800;color:var(--dm-gold)}
.dm-num span{font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(246,243,238,.78)}

.dm-sede{display:block;aspect-ratio:3/2;overflow:hidden;border-radius:4px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.dm-sede img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.16,1,.3,1)}
.dm-sede:hover img{transform:scale(1.04)}

.dm-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}
.dm-link{display:grid;gap:6px;justify-items:center;padding:11px 6px;border-radius:4px;text-align:center;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);transition:background .15s,border-color .15s}
.dm-link:hover{background:rgba(180,145,94,.16);border-color:var(--dm-gold)}
.dm-link i{font-size:15px;color:var(--dm-gold)}
.dm-link span{font-size:10.5px;font-weight:700;letter-spacing:.03em;color:#FFFFFF;line-height:1.2}

/* ══ CONTATO ════════════════════════════════════════════════════════════ */
.dm-card{display:flex;flex-direction:column;background:var(--dm-paper);border:1px solid var(--dm-line);border-radius:4px}
.dm-row{display:flex;gap:11px;align-items:flex-start;padding:12px 13px;font-size:12.5px;line-height:1.5;color:var(--dm-ink)}
.dm-row + .dm-row{border-top:1px solid var(--dm-line)}
.dm-row i{flex:none;width:30px;height:30px;display:grid;place-items:center;font-size:12px;color:var(--dm-brz);background:var(--dm-linen);border-radius:4px}
.dm-row small{display:block;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--dm-mut);margin-bottom:2px}
.dm-row b{font-weight:700}
a.dm-row:hover{background:var(--dm-linen)}
.dm-wa{
  display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;margin-top:10px;border-radius:4px;
  font-size:13.5px;font-weight:800;color:#FFFFFF;background:var(--dm-wa);
  box-shadow:0 12px 26px -16px rgba(15,125,112,.9);transition:background .15s;
}
.dm-wa:hover{background:#0B6659}
.dm-wa i{font-size:17px}
.dm-soc{display:flex;align-items:center;gap:10px;margin-top:14px}
.dm-soc__l{font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--dm-mut)}
/* `.agc-dr__soc` é o seletor que social-chips.css já pinta com a cor de cada
   rede; aqui só o tamanho do alvo (36px) e o raio do escudo. */
.agc-dr__soc{display:flex;gap:8px;margin-left:auto}
.agc-dr__soc a{width:36px;height:36px;display:grid;place-items:center;border-radius:4px;font-size:14px}
.dm-foot{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:16px 0 22px;font-size:11px;color:var(--dm-mut)}
.dm-foot a{display:inline-flex;align-items:center;min-height:32px;color:var(--dm-ink);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(123,94,50,.45)}
.dm-foot__oab{margin-left:auto;font-weight:700;letter-spacing:.04em}

@media(prefers-reduced-motion:reduce){
  .dm-sol__img,.dm-sede img,.dm-fe,.dm-do,.dm-intent__i,.dm-act,.dm-more i,.dm-hire__btn{transition:none}
}