/*
 * ============================================================
 *  mt-responsive.css · Maria Teixeira Advogados
 *  v2 — abril 2026
 *  Prefixo: .mt-   (evita colisão com WordPress / Elementor)
 *  Breakpoints:
 *    Mobile  → ≤ 767 px
 *    Tablet  → 768 px – 1023 px
 *    Desktop → ≥ 1024 px
 *
 *  v2 — Mudanças em relação à v1:
 *    fix #1  Seção 05 — HTML canônico + JS toggle hambúrguer (ver mt-nav-toggle.js)
 *    fix #2  Após 01  — :where() reset defensivo para .hero / .page / .post legados
 *    fix #3  Seções 03/04 — aliases seletores DOM real (.mt-hdr-* / .mt-hdr-subbar-*)
 *    fix #4  Seções 09/18 — overflow desktop 59px em /publicacoes/ (box-sizing + max-inline-size)
 *    fix #5  Seções 03/05 — threshold hambúrguer movido de ≤767 para ≤1023 (cobre tablet)
 *    fix #6  Seção 04    — subbar oculta em mobile (≤767) libera ~70px de viewport
 * ============================================================
 *
 * ÍNDICE DE COMPONENTES
 * ──────────────────────────────────────────────────────────
 *  00. Tokens (CSS Custom Properties)
 *  01. Reset de base
 *  01b. Reset defensivo legado (v2 fix #2)
 *  02. Container & grid utilitários
 *  03. MT Header  (.mt-header / .mt-hdr-*)
 *  04. MT Subbar  (.mt-subbar / .mt-hdr-subbar-*)
 *  05. MT Nav mobile  (.mt-nav-mobile)
 *  05b. MT CTA Sticky bottom  (.mt-cta-sticky)  ≤1023px
 *  06. MT Breadcrumb  (.mt-breadcrumb)
 *  07. MT Hero — Home  (.mt-hero)
 *  08. MT Hero — Pillar  (.mt-pillar-hero)
 *  09. MT Hero — Blog Index  (.mt-index-hero)
 *  10. MT Hero — Artigo  (.mt-article-hero)
 *  11. MT Pillar Layout  (.mt-pillar-layout / .mt-pillar-sidebar)
 *  12. MT Article Layout  (.mt-article-layout / .mt-toc)
 *  13. MT Article Body  (.mt-article-body)
 *  14. MT Loop Grid  (.mt-loop-grid)
 *  15. MT Loop Card  (.mt-loop-card)
 *  16. MT Loop Featured  (.mt-loop-featured)
 *  17. MT Loop Row  (.mt-loop-row)
 *  18. MT Filters  (.mt-filters)
 *  19. MT Subcats Grid  (.mt-subcat-grid / .mt-subcat)
 *  20. MT Base Legal  (.mt-base-legal)
 *  21. MT FAQ  (.mt-faq-wrap / .mt-faq-item)
 *  22. MT CTA Band  (.mt-cta-band)
 *  23. MT Author Block  (.mt-author-block)
 *  24. MT TL;DR Box  (.mt-tldr)
 *  25. MT Footer  (.mt-footer)
 *  26. MT Form  (.mt-form / .mt-field)
 *  27. MT Botões  (.mt-btn)
 *  28. MT Chip / Tag  (.mt-chip)
 *  29. MT Eyebrow  (.mt-eyebrow / .mt-sec-eyebrow)
 *  30. Utilitários  (.mt-hide-mobile etc.)
 * ──────────────────────────────────────────────────────────
 *
 * TABELA DE CLASSES × COMPONENTE × ONDE APARECE
 * ──────────────────────────────────────────────────────────
 * Classe               | Componente CD                      | Onde aparece
 * ─────────────────────|────────────────────────────────────|──────────────────────────────────────
 * .mt-header           | MT Header                          | Topo de todas as páginas
 * .mt-header__inner    | MT Header · inner row (BEM)        | Faixa interna do cabeçalho
 * .mt-hdr-inner        | MT Header · inner row (DOM real)   | Alias DOM Elementor
 * .mt-header__brand    | MT Header · Logotipo (BEM)         | Logo + subtítulo no header
 * .mt-hdr-brand        | MT Header · Logotipo (DOM real)    | Alias DOM Elementor
 * .mt-header__nav      | MT Header · Nav links (BEM)        | Links de navegação principal
 * .mt-hdr-nav          | MT Header · Nav links (DOM real)   | Alias DOM Elementor
 * .mt-subbar           | MT Subbar (faixa institucional)    | Segunda faixa abaixo do header
 * .mt-subbar__inner    | MT Subbar inner (BEM)              | Inner da subbar
 * .mt-hdr-subbar-inner | MT Subbar inner (DOM real)         | Alias DOM Elementor
 * .mt-subbar__left     | MT Subbar esquerda (BEM)           | Coluna esquerda subbar
 * .mt-hdr-subbar-left  | MT Subbar esquerda (DOM real)      | Alias DOM Elementor
 * .mt-subbar__right    | MT Subbar direita (BEM)            | Coluna direita subbar
 * .mt-hdr-subbar-right | MT Subbar direita (DOM real)       | Alias DOM Elementor
 * .mt-nav-mobile       | MT Nav Mobile                      | Menu hambúrguer ≤1023px
 * .mt-breadcrumb       | MT Breadcrumb                      | Trilha de navegação abaixo do header
 * .mt-hero             | MT Home Hero                       | Primeira seção da Home
 * .mt-pillar-hero      | MT Pillar Hero                     | Seção hero dos Pillars
 * .mt-pillar-hero__guide | MT Pillar Sidebar Guide          | Card lateral de navegação do Pillar (sticky)
 * .mt-index-hero       | MT Blog Index Hero                 | Cabeçalho do Blog Index
 * .mt-article-hero     | MT Article Hero                    | Cabeçalho do Single Post
 * .mt-pillar-layout    | MT Pillar Layout (grid)            | Grade 7fr/5fr do conteúdo principal dos Pillars
 * .mt-pillar-sidebar   | MT Pillar Sidebar                  | Coluna direita com card guia nos Pillars
 * .mt-article-layout   | MT Article Layout (grid)           | Grade TOC + Corpo do artigo (Single Post)
 * .mt-toc              | MT TOC Sidebar                     | Sumário lateral fixo no Single Post
 * .mt-toc--mobile      | MT TOC Mobile Dropdown             | Sumário colapsável em mobile/tablet
 * .mt-article-body     | MT Article Body                    | Corpo de texto do artigo (Single Post)
 * .mt-loop-grid        | MT Loop Grid                       | Grade 3 colunas de cards do Blog Index e Archives
 * .mt-loop-card        | MT Loop Item · Article Card        | Card individual de artigo no Blog Index e Archives
 * .mt-loop-featured    | MT Loop Featured Card              | Card em destaque no topo do Blog Index
 * .mt-loop-row         | MT Loop Item · List Row            | Linha de artigo no listing dos Pillars
 * .mt-filters          | MT Filters Bar                     | Barra de filtros do Blog Index (sticky)
 * .mt-subcat-grid      | MT Subcat Grid                     | Grade 3 colunas de subcategorias nos Pillars
 * .mt-subcat           | MT Subcat Card                     | Card de subcategoria nos Pillars
 * .mt-base-legal       | MT Base Legal Strip                | Faixa de fundamentação jurídica nos Pillars e Artigos
 * .mt-faq-wrap         | MT FAQ Container                   | Wrapper do bloco FAQ (Pillars e página FAQ)
 * .mt-faq-item         | MT FAQ Item (acordeão)             | Item individual do FAQ
 * .mt-faq-toggle       | MT FAQ Toggle                      | Botão +/- do acordeão de FAQ
 * .mt-cta-band         | MT CTA Band                        | Faixa navy de chamada para ação (todas as páginas)
 * .mt-author-block     | MT Author Block                    | Bloco de autoria (Single Post e Pillars)
 * .mt-tldr             | MT TL;DR Box                       | Caixa de resumo dourada nos artigos
 * .mt-footer           | MT Footer                          | Rodapé de todas as páginas
 * .mt-footer__grid     | MT Footer Grid                     | Grade de colunas do rodapé
 * .mt-form             | MT Contact Form                    | Formulário da página Contato
 * .mt-field            | MT Form Field                      | Campo individual de formulário
 * .mt-btn              | MT Button (base)                   | Botão base — todos os contextos
 * .mt-btn--primary     | MT Button · WhatsApp               | CTA WhatsApp verde
 * .mt-btn--secondary   | MT Button · Outline Navy           | Botão institucional outline
 * .mt-btn--gold        | MT Button · Gold Fill              | Botão dourado
 * .mt-chip             | MT Chip / Tag                      | Etiqueta de categoria/área
 * .mt-eyebrow          | MT Eyebrow                         | Rótulo uppercase com linha antes
 * .mt-sec-eyebrow      | MT Section Eyebrow                 | Eyebrow de seção com linha-guia dourada
 * .mt-hide-mobile      | Utilitário                         | Oculta elemento em mobile
 * .mt-hide-tablet      | Utilitário                         | Oculta elemento em tablet
 * .mt-hide-desktop     | Utilitário                         | Oculta elemento em desktop
 * .mt-show-mobile-only | Utilitário                         | Exibe apenas em mobile
 * .mt-container        | Utilitário de layout               | Wrapper de largura máxima centralizado
 * ─────────────────────────────────────────────────────────
 */


/* ============================================================
   00. TOKENS — CSS Custom Properties
   ============================================================ */
:root {
  /* Paleta */
  --mt-navy:        #0F2C4C;
  --mt-navy-deep:   #081A30;
  --mt-gold:        #B88A3E;

  /* Tokens semânticos de acento — use estes para texto, não --mt-gold diretamente */
  --color-accent:          var(--mt-gold);   /* decorativo: bordas, fundos, ícones */
  --color-accent-on-light:#7a5614;          /* texto em fundo claro  → 4.84:1 no branco ✓ */
  --color-accent-on-dark:  #C9A44A;          /* texto em fundo escuro → 5.98:1 no navy  ✓ */
  --mt-burgundy:    #7A1C2E;
  --mt-cream:       #FBF8F2;
  --mt-cream-2:     #F3ECDC;
  --mt-ivory:       #FFFFFF;
  --mt-ink:         #1A1A1A;
  --mt-slate:       #5A6472;
  --mt-border:      #E6E1D6;
  --mt-green:       #2E7D5A;

  /* Tipografia */
  --mt-serif:  "Source Serif 4", "Lora", Georgia, serif;
  --mt-sans:   "Inter", system-ui, -apple-system, sans-serif;
  --mt-script: "Dancing Script", cursive;
  --mt-mono:   ui-monospace, "SF Mono", Menlo, monospace;

  /* Espaçamento base */
  --mt-sp-1:  4px;
  --mt-sp-2:  8px;
  --mt-sp-3:  12px;
  --mt-sp-4:  16px;
  --mt-sp-5:  24px;
  --mt-sp-6:  32px;
  --mt-sp-7:  48px;
  --mt-sp-8:  64px;
  --mt-sp-9:  96px;
  --mt-sp-10: 128px;

  /* Gutter de página — varia por viewport */
  --mt-gutter:      96px;   /* desktop */
  --mt-max-width:   1200px;

  /* Largura máxima de leitura */
  --mt-measure:     680px;
}

/* Tablet */
@media (max-width: 1023px) {
  :root {
    --mt-gutter: 48px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  :root {
    --mt-gutter: 20px;
  }
}


/* ============================================================
   01. RESET DE BASE (escopado ao prefixo mt-)
   ============================================================ */
.mt-header *, .mt-subbar *, .mt-breadcrumb *,
.mt-hero *, .mt-pillar-hero *, .mt-index-hero *, .mt-article-hero *,
.mt-pillar-layout *, .mt-article-layout *, .mt-article-body *,
.mt-loop-grid *, .mt-loop-card *, .mt-loop-featured *, .mt-loop-row *,
.mt-faq-wrap *, .mt-cta-band *, .mt-footer *, .mt-form *,
.mt-subcat-grid *, .mt-base-legal *, .mt-author-block *, .mt-tldr *,
.mt-filters *, .mt-toc * {
  box-sizing: border-box;
}


/* ============================================================
   01b. RESET DEFENSIVO — classes legadas sem prefixo mt-     v2 fix #2
   :where() tem especificidade zero, logo .mt-* continua
   prevalecendo em qualquer conflito de cascata.
   Protege contra wrappers legacy (.hero, .page, .post) com
   width fixo herdado de versões anteriores do tema WP.
   ============================================================ */

/* v2 fix #2 */
:where(section, div).hero,
:where(section, div).page,
:where(section, div).post {
  max-width: 100%;
  width: auto;
}


/* ============================================================
   02. CONTAINER & UTILITÁRIOS DE LAYOUT
   ============================================================ */

/* Wrapper de largura máxima */
.mt-container {
  width: 100%;
  max-width: var(--mt-max-width);
  margin-inline: auto;
  padding-inline: var(--mt-gutter);
}

/* Separador de seção */
.mt-rule {
  width: 100%;
  height: 1px;
  background: var(--mt-border);
  border: none;
  margin: 0;
}

.mt-rule--gold {
  background: var(--mt-gold);
  width: 40px;
}


/* ============================================================
   03. MT HEADER
   Componente: MT Header
   Onde aparece: topo de todas as páginas
   DOM real: .mt-header > .mt-hdr-inner > .mt-hdr-brand + .mt-hdr-nav + .mt-btn--primary
   v2 fix #3 — aliases .mt-hdr-* adicionados para cobrir naming do DOM real
   v2 fix #5 — nav inline oculta em ≤1023px (tablet passa a usar hambúrguer)
   ============================================================ */

.mt-header {
  background: var(--mt-cream);
  border-bottom: 1px solid var(--mt-border);
  position: relative;
}

/* v2 fix #3 — alias DOM real ao lado do seletor BEM original */
.mt-header__inner,
.mt-hdr-inner {
  display: flex;
  align-items: center;
  gap: var(--mt-sp-7);
  padding-block: 22px;
  max-width: var(--mt-max-width);
  margin-inline: auto;
  padding-inline: var(--mt-gutter);
}

/* Logotipo */
/* v2 fix #3 */
.mt-header__brand,
.mt-hdr-brand {
  line-height: 1;
  flex-shrink: 0;
  text-decoration: none;
}

.mt-header__brand-mark {
  font-family: var(--mt-script);
  font-size: 30px;
  color: var(--color-accent-on-light);
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1;
}

.mt-header__brand-sub {
  font-family: var(--mt-sans);
  font-size: 9px;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--mt-slate);
  margin-top: 4px;
  font-weight: 600;
  display: block;
}

/* Logotipo — elementos filhos do alias DOM real */
/* v2 fix #3 */
.mt-hdr-brand h1 {
  font-family: var(--mt-script);
  font-size: 30px;
  color: var(--color-accent-on-light);
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1;
  margin: 0;
}

.mt-hdr-brand span {
  font-family: var(--mt-sans);
  font-size: 9px;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--mt-slate);
  margin-top: 4px;
  font-weight: 600;
  display: block;
}

/* Navegação principal */
/* v2 fix #3 + fix #5 — alias + colapsa em ≤1023px */
.mt-header__nav,
.mt-hdr-nav {
  display: flex;
  gap: 28px;
  flex: 1;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}

.mt-header__nav a,
.mt-hdr-nav a,
.mt-hdr-nav li a {
  font-family: var(--mt-sans);
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--mt-navy);
  text-decoration: none;
  font-weight: 500;
  padding-block: 6px;
  position: relative;
  white-space: nowrap;
}

.mt-header__nav a:hover,
.mt-hdr-nav a:hover,
.mt-hdr-nav li a:hover {
  color: var(--color-accent-on-light);
}

.mt-header__nav a.is-active,
.mt-hdr-nav a.is-active,
.mt-hdr-nav li a.is-active {
  color: var(--color-accent-on-light);
}

.mt-header__nav a.is-active::after,
.mt-hdr-nav a.is-active::after,
.mt-hdr-nav li a.is-active::after {
  content: "";
  position: absolute;
  left: 0; right: 0;
  bottom: -4px;
  height: 1.5px;
  background: var(--mt-gold);
}

/* Header variante escuro (Blog Index, Single Post) */
.mt-header--dark {
  background: var(--mt-navy-deep);
  border-bottom-color: rgba(255,255,255,.07);
}

.mt-header--dark .mt-header__nav a,
.mt-header--dark .mt-hdr-nav a,
.mt-header--dark .mt-hdr-nav li a {
  color: #CFC3A8;
}

.mt-header--dark .mt-header__nav a.is-active,
.mt-header--dark .mt-hdr-nav a.is-active {
  color: var(--color-accent-on-dark);
}

.mt-header--dark .mt-header__brand-sub,
.mt-header--dark .mt-hdr-brand span {
  color: #A8A090;
}

/* Tablet — fix #5: nav some em ≤1023px (hambúrguer cobre tablet também) */
/* v2 fix #5 */
@media (max-width: 1023px) {
  .mt-header__nav,
  .mt-hdr-nav {
    display: none;
  }
  .mt-header__inner,
  .mt-hdr-inner {
    justify-content: space-between;
    gap: var(--mt-sp-4);
  }
}


/* ============================================================
   04. MT SUBBAR (faixa institucional)
   Componente: MT Subbar
   Onde aparece: segunda faixa abaixo do header, todas as páginas
   DOM real: .mt-subbar > .mt-hdr-subbar-inner > .mt-hdr-subbar-left + .mt-hdr-subbar-right
   v2 fix #3 — aliases .mt-hdr-subbar-* para cobrir naming DOM real
   v2 fix #6 — subbar oculta em mobile (≤767) para liberar ~70px de viewport
   ============================================================ */

.mt-subbar {
  background: var(--mt-navy-deep);
  color: #CFC3A8;
  font-family: var(--mt-sans);
  font-size: 13px;
  line-height: 20px;
  letter-spacing: .02em;
}

/* v2 fix #3 — alias .mt-hdr-subbar-inner */
.mt-subbar__inner,
.mt-hdr-subbar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: 8px;
  max-width: var(--mt-max-width);
  margin-inline: auto;
  padding-inline: var(--mt-gutter);
}

/* v2 fix #3 — alias .mt-hdr-subbar-left */
.mt-subbar__left,
.mt-hdr-subbar-left {
  display: flex;
  gap: 20px;
  align-items: center;
  flex-wrap: wrap;
}

.mt-subbar__dot {
  width: 4px;
  height: 4px;
  background: var(--mt-gold);
  border-radius: 50%;
}

.mt-subbar strong {
  color: #F5EEDC;
  font-weight: 600;
}

/* v2 fix #3 — alias .mt-hdr-subbar-right */
.mt-subbar__right,
.mt-hdr-subbar-right {
  font-family: var(--mt-mono);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #A8A090;
  white-space: nowrap;
}

/* v2 fix #6 — ocultar subbar inteira em mobile */
/* Isso libera ~60-70px de viewport (altura da subbar empilhada) */
@media (max-width: 767px) {
  .mt-subbar {
    display: none; /* v2 fix #6 */
  }
}

/* Tablet — mantém subbar mas esconde coluna direita */
@media (min-width: 768px) and (max-width: 1023px) {
  .mt-subbar__right,
  .mt-hdr-subbar-right {
    display: none;
  }
  .mt-subbar__left,
  .mt-hdr-subbar-left {
    gap: 12px;
    font-size: 12px;
  }
  .mt-subbar__dot {
    display: none;
  }
}


/* ============================================================
   05. MT NAV MOBILE — hambúrguer
   Componente: MT Nav Mobile
   Onde aparece: ≤ 1023 px (mobile + tablet)
   v2 fix #1 — HTML canônico esperado (colar no template WP):
   ─────────────────────────────────────────────────────────
   Inserir DENTRO de .mt-hdr-inner, após o .mt-hdr-brand:

   <button class="mt-nav-mobile__toggle"
           aria-label="Abrir menu"
           aria-expanded="false"
           aria-controls="mt-nav-drawer">
     <span class="mt-nav-mobile__icon" aria-hidden="true">☰</span>
     <span class="mt-nav-mobile__label">MENU</span>
   </button>

   <div class="mt-nav-mobile__drawer" id="mt-nav-drawer" aria-hidden="true">
     <button class="mt-nav-mobile__close" aria-label="Fechar menu">✕</button>
     <nav>
       <ul class="mt-nav-mobile__list">
         <li><a class="mt-nav-mobile__link" href="/previdenciario/">Previdenciário</a></li>
         <li><a class="mt-nav-mobile__link" href="/servidor-publico/">Servidor Público</a></li>
         <li><a class="mt-nav-mobile__link" href="/trabalho/">Trabalho</a></li>
         <li><a class="mt-nav-mobile__link" href="/familia-sucessoes/">Família e Sucessões</a></li>
         <li><a class="mt-nav-mobile__link" href="/publicacoes/">Publicações</a></li>
         <li><a class="mt-nav-mobile__link" href="/faq/">FAQ</a></li>
       </ul>
     </nav>
     <div class="mt-nav-mobile__footer">
       <a class="mt-btn mt-btn--primary" href="https://wa.me/SEUNUMERO">
         FALAR COM ADVOGADO
       </a>
     </div>
   </div>

   Para o JS de toggle, incluir mt-nav-toggle.js no rodapé do template.
   ─────────────────────────────────────────────────────────
   v2 fix #5 — threshold movido de ≤767 para ≤1023 (tablet incluso)
   ============================================================ */

.mt-nav-mobile__toggle {
  display: none;             /* escondido em desktop */
  background: transparent;
  border: 1px solid var(--mt-border);
  color: var(--mt-navy);
  padding: 8px 14px;
  font-family: var(--mt-sans);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  border-radius: 2px;
  align-items: center;
  gap: 8px;
  letter-spacing: .04em;
  flex-shrink: 0;
  line-height: 1;
  transition: background 150ms, color 150ms;
}

.mt-nav-mobile__toggle:hover {
  background: var(--mt-navy);
  color: var(--mt-cream);
  border-color: var(--mt-navy);
}

.mt-nav-mobile__icon {
  font-size: 16px;
  line-height: 1;
}

.mt-nav-mobile__label {
  font-size: 11px;
  letter-spacing: .14em;
}

/* Drawer — posicionamento fixed cobrindo toda a tela */
.mt-nav-mobile__drawer {
  display: none;             /* padrão oculto; JS adiciona .is-open */
  position: fixed;
  inset: 0;
  z-index: 500;
  background: var(--mt-cream);
  padding: var(--mt-sp-7) var(--mt-gutter);
  flex-direction: column;
  gap: var(--mt-sp-5);
  overflow-y: auto;
}

.mt-nav-mobile__drawer.is-open {
  display: flex;
}

/* Botão fechar */
.mt-nav-mobile__close {
  position: absolute;
  top: 20px;
  right: var(--mt-gutter);
  font-size: 22px;
  background: transparent;
  border: none;
  color: var(--mt-navy);
  cursor: pointer;
  line-height: 1;
  padding: 8px;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 150ms;
}

.mt-nav-mobile__close:hover {
  background: var(--mt-cream-2);
}

/* Lista de links */
.mt-nav-mobile__list {
  list-style: none;
  margin: 48px 0 0;
  padding: 0;
}

.mt-nav-mobile__link {
  font-family: var(--mt-sans);
  font-size: 22px;
  font-weight: 600;
  color: var(--mt-navy);
  text-decoration: none;
  padding-block: 16px;
  border-bottom: 1px solid var(--mt-border);
  display: block;
  letter-spacing: -.005em;
  transition: color 150ms;
}

.mt-nav-mobile__link:hover {
  color: var(--color-accent-on-dark);
}

/* Rodapé do drawer com CTA */
.mt-nav-mobile__footer {
  margin-top: auto;
  padding-top: var(--mt-sp-6);
  border-top: 1px solid var(--mt-border);
}

/* Overlay backdrop — clique fora fecha */
.mt-nav-mobile__overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 499;
  background: rgba(8, 26, 48, .5);
}

.mt-nav-mobile__overlay.is-open {
  display: block;
}

/* v2 fix #1 + fix #5 — hambúrguer visível em ≤1023px (mobile + tablet) */
@media (max-width: 1023px) {
  .mt-nav-mobile__toggle {
    display: inline-flex; /* v2 fix #5 */
  }
}


/* ============================================================
   05b. MT CTA Sticky Bottom (.mt-cta-sticky)
   Componente: CTA "Falar com Advogado" fixo no rodapé em mobile/tablet
   Onde aparece: ≤1023px, todas as páginas (injetado via mt-nav-toggle.js)
   Comportamento: oculto quando drawer aberto (body.mt-drawer-open)
   ============================================================ */

.mt-cta-sticky {
  display: none; /* desktop oculto por padrão; @media abaixo libera ≤1023px */
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 480; /* abaixo do drawer (500) e overlay (499) */
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  background: rgba(255, 255, 255, .96);
  backdrop-filter: saturate(140%) blur(8px);
  -webkit-backdrop-filter: saturate(140%) blur(8px);
  border-top: 1px solid var(--mt-border);
  box-shadow: 0 -4px 14px rgba(8, 26, 48, .08);
  transition: transform 220ms ease, opacity 180ms ease;
}

/* Chain .mt-cta-sticky .mt-cta-sticky__btn — specificity 0,2,0 — vence
   .mt-btn--primary (0,1,0) que aparece depois no source order */
.mt-cta-sticky .mt-cta-sticky__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px; /* alvo de toque ≥44px (WCAG 2.5.5) */
  /* Cores idênticas ao CTA "Falar com Advogado" do header (.btn-gold) */
  background: var(--mt-gold);
  color: var(--mt-navy);
  border: 1px solid var(--mt-gold);
  border-radius: 999px;
  font-family: var(--mt-sans);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none;
}

.mt-cta-sticky .mt-cta-sticky__btn:hover,
.mt-cta-sticky .mt-cta-sticky__btn:focus-visible {
  background: var(--mt-navy);
  color: #fff;
  border-color: var(--mt-navy);
}

/* Mostrar em mobile + tablet */
@media (max-width: 1023px) {
  .mt-cta-sticky {
    display: block;
  }
  /* Reserva espaço no fim da página para o conteúdo não ficar coberto */
  body.mt-has-cta-sticky {
    padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px));
  }
}

/* Oculta enquanto drawer está aberto (libera o footer do drawer) */
body.mt-drawer-open .mt-cta-sticky {
  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
}

/* Quando o podcast player está ativo (.mt-podcast-bar visível, fixed bottom 0,
   altura ~79px), empurra o sticky CTA pra cima pra não colidir. */
body.mt-podcast-bar--active .mt-cta-sticky {
  bottom: 79px;
}
@media (max-width: 1023px) {
  body.mt-has-cta-sticky.mt-podcast-bar--active {
    padding-bottom: calc(64px + 79px + env(safe-area-inset-bottom, 0px));
  }
}


/* ============================================================
   06. MT BREADCRUMB
   Componente: MT Breadcrumb
   Onde aparece: abaixo do header, em todas as páginas internas
   ============================================================ */

.mt-breadcrumb {
  background: var(--mt-cream);
  border-bottom: 1px solid var(--mt-border);
  padding-block: 16px;
}

.mt-breadcrumb__inner {
  max-width: var(--mt-max-width);
  margin-inline: auto;
  padding-inline: var(--mt-gutter);
}

.mt-breadcrumb__path {
  font-family: var(--mt-sans);
  font-size: 13px;
  color: var(--mt-slate);
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
}

.mt-breadcrumb__path a {
  color: var(--mt-slate);
  text-decoration: none;
}

.mt-breadcrumb__path a:hover {
  color: var(--mt-navy);
}

.mt-breadcrumb__sep {
  color: #C6BEA8;
  font-size: 11px;
}

.mt-breadcrumb__current {
  color: var(--mt-navy);
  font-weight: 600;
}

.mt-breadcrumb__eyebrow {
  margin-top: 8px;
  font-family: var(--mt-sans);
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--color-accent-on-light);
  font-weight: 700;
}

/* Mobile */
@media (max-width: 767px) {
  .mt-breadcrumb {
    padding-block: 12px;
  }
  .mt-breadcrumb__path {
    font-size: 12px;
    gap: 6px;
  }
  .mt-breadcrumb__eyebrow {
    display: none;
  }
}


/* ============================================================
   07. MT HERO — HOME
   Componente: MT Home Hero
   Onde aparece: primeira seção da Home
   ============================================================ */

.mt-hero {
  background: var(--mt-cream);
  padding-block: 140px 120px;
  position: relative;
}

.mt-hero__eyebrow {
  font-family: var(--mt-sans);
  font-size: 12px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--color-accent-on-dark);
  font-weight: 700;
  margin-bottom: 32px;
  display: inline-flex;
  align-items: center;
  gap: 14px;
}

.mt-hero__eyebrow::before {
  content: "";
  width: 32px;
  height: 1.5px;
  background: var(--mt-gold);
}

.mt-hero h1 {
  font-family: var(--mt-serif);
  font-size: 64px;
  line-height: 1.12;
  letter-spacing: -0.02em;
  font-weight: 500;
  color: var(--mt-navy);
  margin: 0 0 32px;
  max-width: 820px;
  text-wrap: balance;
}

.mt-hero h1 em {
  font-style: italic;
  color: var(--color-accent-on-dark);
}

.mt-hero__dek {
  font-family: var(--mt-serif);
  font-size: 22px;
  line-height: 32px;
  color: var(--mt-slate);
  max-width: var(--mt-measure);
  margin: 0 0 40px;
}

.mt-hero__actions {
  display: flex;
  align-items: center;
  gap: 28px;
  padding-top: 16px;
  border-top: 1px solid var(--mt-border);
  max-width: var(--mt-measure);
  flex-wrap: wrap;
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-hero {
    padding-block: 80px 64px;
  }
  .mt-hero h1 {
    font-size: 48px;
  }
  .mt-hero__dek {
    font-size: 19px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-hero {
    padding-block: 56px 48px;
  }
  .mt-hero h1 {
    font-size: 34px;
    line-height: 1.15;
  }
  .mt-hero__dek {
    font-size: 17px;
    line-height: 28px;
  }
  .mt-hero__actions {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
}


/* ============================================================
   08. MT PILLAR HERO
   Componente: MT Pillar Hero
   Onde aparece: primeira seção dos Pillars
   (Previdenciário, Servidor Público, Trabalho, Família, FAQ, Notícias)
   ============================================================ */

.mt-pillar-hero {
  background: var(--mt-cream);
  padding-block: 120px 80px;
}

.mt-pillar-hero h1 {
  font-family: var(--mt-serif);
  font-size: 64px;
  line-height: 1.12;
  letter-spacing: -0.02em;
  font-weight: 500;
  color: var(--mt-navy);
  margin: 0 0 24px;
  max-width: 820px;
  text-wrap: balance;
}

.mt-pillar-hero__sub {
  font-family: var(--mt-serif);
  font-style: italic;
  font-size: 28px;
  line-height: 36px;
  color: var(--mt-navy);
  font-weight: 400;
  margin: 0 0 36px;
  max-width: var(--mt-measure);
  letter-spacing: -0.005em;
}

.mt-pillar-hero__dek {
  max-width: var(--mt-measure);
}

.mt-pillar-hero__dek p {
  font-size: 19px;
  line-height: 30px;
  color: var(--mt-slate);
  margin: 0 0 18px;
}

.mt-pillar-hero__dek p strong {
  color: var(--mt-navy);
  font-weight: 600;
}

.mt-pillar-hero__dek a {
  color: var(--mt-ink);
  border-bottom: 1.5px solid var(--mt-gold);
  text-decoration: none;
  font-weight: 500;
}

/* Guide card lateral — sticky no desktop */
.mt-pillar-hero__guide {
  background: var(--mt-ivory);
  border: 1px solid var(--mt-border);
  padding: 32px 32px 28px;
  position: sticky;
  top: 24px;
}

.mt-pillar-hero__guide-ey {
  font-family: var(--mt-sans);
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--color-accent-on-dark);
  font-weight: 700;
  margin-bottom: 20px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--mt-border);
}

.mt-pillar-hero__guide-item {
  display: flex;
  flex-direction: column;
  padding-block: 14px;
  border-bottom: 1px solid var(--mt-border);
  text-decoration: none;
}

.mt-pillar-hero__guide-item:last-of-type {
  border-bottom: none;
}

.mt-pillar-hero__guide-item-title {
  font-family: var(--mt-serif);
  font-size: 20px;
  line-height: 28px;
  color: var(--mt-navy);
  font-weight: 500;
  letter-spacing: -0.005em;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
}

.mt-pillar-hero__guide-item-title::after {
  content: "→";
  color: var(--color-accent-on-dark);
  font-family: var(--mt-sans);
  font-weight: 600;
  font-size: 15px;
  flex-shrink: 0;
}

.mt-pillar-hero__guide-item:hover .mt-pillar-hero__guide-item-title {
  color: var(--color-accent-on-dark);
}

.mt-pillar-hero__guide-item-sub {
  font-family: var(--mt-sans);
  font-size: 13px;
  line-height: 18px;
  color: var(--mt-slate);
  margin-top: 4px;
}

.mt-pillar-hero__guide-foot {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--mt-border);
  font-family: var(--mt-serif);
  font-style: italic;
  font-size: 14px;
  color: var(--mt-slate);
  line-height: 1.5;
}

.mt-pillar-hero__guide-foot a {
  color: var(--mt-navy);
  border-bottom: 1.5px solid var(--mt-gold);
  text-decoration: none;
  font-family: var(--mt-sans);
  font-style: normal;
  font-weight: 600;
  font-size: 13px;
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-pillar-hero {
    padding-block: 80px 56px;
  }
  .mt-pillar-hero h1 {
    font-size: 48px;
  }
  .mt-pillar-hero__sub {
    font-size: 22px;
    line-height: 30px;
  }
  .mt-pillar-hero__guide {
    position: static;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-pillar-hero {
    padding-block: 48px 40px;
  }
  .mt-pillar-hero h1 {
    font-size: 32px;
    line-height: 1.15;
  }
  .mt-pillar-hero__sub {
    font-size: 18px;
    line-height: 26px;
  }
  .mt-pillar-hero__dek p {
    font-size: 16px;
    line-height: 26px;
  }
  .mt-pillar-hero__guide {
    margin-top: 32px;
  }
}


/* ============================================================
   09. MT INDEX HERO (Blog Index)
   Componente: MT Blog Index Hero
   Onde aparece: cabeçalho da listagem de artigos
   v2 fix #4 — box-sizing + max-inline-size para evitar overflow
               horizontal de 59px em /publicacoes/ (desktop 1440)
   ============================================================ */

.mt-index-hero {
  box-sizing: border-box;          /* v2 fix #4 */
  max-inline-size: 100%;           /* v2 fix #4 */
  background: var(--mt-cream);
  padding: 72px var(--mt-gutter) 56px;
  border-bottom: 1px solid var(--mt-border);
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 64px;
  align-items: end;
}

.mt-index-hero h1 {
  font-family: var(--mt-sans);
  font-size: 56px;
  font-weight: 700;
  color: var(--mt-navy-deep);
  letter-spacing: -0.028em;
  line-height: 1.08;
  margin: 0 0 24px;
  text-wrap: balance;
}

.mt-index-hero__lede {
  font-family: var(--mt-sans);
  font-size: 20px;
  line-height: 1.6;
  color: var(--mt-slate);
  margin: 0;
  max-width: 620px;
}

.mt-index-hero__stats {
  display: flex;
  flex-direction: column;
  gap: 0;
  align-self: end;
}

.mt-index-hero__stat {
  padding-block: 16px;
  border-bottom: 1px solid var(--mt-border);
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mt-index-hero__stat:first-child {
  border-top: 1px solid var(--mt-border);
}

.mt-index-hero__stat-num {
  font-family: var(--mt-serif);
  font-size: 36px;
  font-weight: 500;
  color: var(--mt-navy);
  letter-spacing: -0.02em;
  line-height: 1;
}

.mt-index-hero__stat-label {
  font-family: var(--mt-sans);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--mt-slate);
  font-weight: 500;
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-index-hero {
    grid-template-columns: 1fr;
    gap: 32px;
    padding-block: 56px 40px;
  }
  .mt-index-hero__stats {
    flex-direction: row;
    gap: 24px;
  }
  .mt-index-hero__stat {
    border-top: 1px solid var(--mt-border);
    flex: 1;
  }
  .mt-index-hero h1 {
    font-size: 40px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-index-hero {
    padding-block: 40px 32px;
  }
  .mt-index-hero h1 {
    font-size: 28px;
    line-height: 1.18;
  }
  .mt-index-hero__lede {
    font-size: 16px;
  }
  .mt-index-hero__stats {
    flex-direction: column;
    gap: 0;
  }
  .mt-index-hero__stat-num {
    font-size: 28px;
  }
}


/* ============================================================
   10. MT ARTICLE HERO (Single Post)
   Componente: MT Article Hero
   Onde aparece: cabeçalho do artigo (Single Post)
   ============================================================ */

.mt-article-hero {
  background: var(--mt-cream);
  padding: 64px var(--mt-gutter) 48px;
  max-width: 1000px;
}

.mt-article-hero__title {
  font-family: var(--mt-serif);
  font-size: 52px;
  line-height: 1.15;
  font-weight: 500;
  color: var(--mt-navy);
  letter-spacing: -0.018em;
  margin: 0 0 32px;
  max-width: 900px;
  text-wrap: balance;
}

.mt-article-hero__standfirst {
  font-family: var(--mt-serif);
  font-style: italic;
  font-size: 22px;
  line-height: 34px;
  color: var(--mt-slate);
  margin: 0 0 32px;
  max-width: 780px;
}

.mt-article-hero__byline {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-top: 24px;
  border-top: 1px solid var(--mt-border);
  font-family: var(--mt-sans);
  font-size: 14px;
  color: var(--mt-slate);
  flex-wrap: wrap;
}

.mt-article-hero__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: radial-gradient(circle at 32% 38%, #D8C6A4 0 24%, transparent 25%), linear-gradient(135deg, #1E3E66, #0F2C4C);
  border: 1.5px solid var(--mt-gold);
  flex-shrink: 0;
}

.mt-article-hero__byline strong {
  color: var(--mt-navy);
  font-weight: 600;
}

.mt-article-hero__sep {
  color: #C6BEA8;
  margin-inline: 4px;
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-article-hero {
    padding: 48px var(--mt-gutter) 36px;
  }
  .mt-article-hero__title {
    font-size: 38px;
  }
  .mt-article-hero__standfirst {
    font-size: 19px;
    line-height: 28px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-article-hero {
    padding: 32px var(--mt-gutter) 28px;
  }
  .mt-article-hero__title {
    font-size: 26px;
    line-height: 1.2;
  }
  .mt-article-hero__standfirst {
    font-size: 17px;
    line-height: 26px;
  }
}


/* ============================================================
   11. MT PILLAR LAYOUT (grade principal dos Pillars)
   Componente: MT Pillar Layout
   Onde aparece: grade de conteúdo principal dos Pillars
   ============================================================ */

.mt-pillar-layout {
  display: grid;
  grid-template-columns: 7fr 5fr;
  gap: 64px;
  align-items: flex-start;
}

/* Coluna lateral sticky */
.mt-pillar-sidebar {
  position: sticky;
  top: 24px;
}

/* Tablet — empilha */
@media (max-width: 1023px) {
  .mt-pillar-layout {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .mt-pillar-sidebar {
    position: static;
    order: -1; /* sidebar sobe antes do conteúdo */
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-pillar-layout {
    gap: 28px;
  }
}


/* ============================================================
   12. MT ARTICLE LAYOUT (TOC + body)
   Componente: MT Article Layout
   Onde aparece: corpo do Single Post
   ============================================================ */

.mt-article-layout {
  background: var(--mt-cream);
  padding: 56px var(--mt-gutter) 80px;
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 64px;
  align-items: flex-start;
}

/* TOC sidebar */
.mt-toc {
  position: sticky;
  top: 24px;
  font-family: var(--mt-sans);
}

.mt-toc__kicker {
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--color-accent-on-light);
  font-weight: 700;
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--mt-border);
}

.mt-toc ol {
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: tocnum;
}

.mt-toc li {
  counter-increment: tocnum;
  padding-block: 10px;
  border-bottom: 1px solid var(--mt-border);
}

.mt-toc li a {
  display: flex;
  gap: 12px;
  align-items: baseline;
  font-size: 14px;
  color: var(--mt-navy);
  text-decoration: none;
  line-height: 1.4;
  font-weight: 500;
}

.mt-toc li a::before {
  content: counter(tocnum, decimal-leading-zero);
  font-family: var(--mt-mono);
  font-size: 11px;
  color: var(--color-accent-on-light);
  font-weight: 600;
  letter-spacing: .04em;
  flex-shrink: 0;
}

.mt-toc li a:hover,
.mt-toc li.is-active a {
  color: var(--color-accent-on-light);
}

.mt-toc__progress {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--mt-border);
  font-size: 12px;
  color: var(--mt-slate);
  line-height: 1.5;
}

.mt-toc__progress-bar {
  margin-top: 10px;
  height: 2px;
  background: var(--mt-border);
  position: relative;
}

.mt-toc__progress-fill {
  position: absolute;
  left: 0; top: 0; bottom: 0;
  background: var(--mt-gold);
  width: 0%;
  transition: width 200ms ease;
}

/* TOC móvel — dropdown colapsável */
.mt-toc--mobile {
  display: none;
  background: var(--mt-cream-2);
  border: 1px solid var(--mt-border);
  padding: 14px 18px;
  margin-bottom: 28px;
}

.mt-toc--mobile__kicker {
  font-family: var(--mt-sans);
  font-size: 10px;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--color-accent-on-light);
  font-weight: 700;
  margin-bottom: 6px;
}

.mt-toc--mobile__current {
  font-family: var(--mt-serif);
  font-size: 15px;
  color: var(--mt-navy);
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}

.mt-toc--mobile__current span {
  color: var(--color-accent-on-light);
  font-size: 13px;
}

/* Tablet — inverte colunas, TOC fica mobile */
@media (max-width: 1023px) {
  .mt-article-layout {
    grid-template-columns: 1fr;
    gap: 0;
    padding: 40px var(--mt-gutter) 64px;
  }
  .mt-toc {
    display: none;
  }
  .mt-toc--mobile {
    display: block;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-article-layout {
    padding: 28px var(--mt-gutter) 48px;
  }
}


/* ============================================================
   13. MT ARTICLE BODY
   Componente: MT Article Body
   Onde aparece: corpo de texto do Single Post
   ============================================================ */

.mt-article-body {
  max-width: var(--mt-measure);
  font-family: var(--mt-sans);
}

.mt-article-body h2 {
  font-family: var(--mt-serif);
  font-size: 34px;
  line-height: 42px;
  font-weight: 500;
  color: var(--mt-navy);
  letter-spacing: -0.01em;
  margin: 56px 0 20px;
  text-wrap: balance;
}

.mt-article-body h3 {
  font-family: var(--mt-serif);
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  color: var(--mt-navy);
  margin: 36px 0 14px;
}

.mt-article-body h4 {
  font-family: var(--mt-sans);
  font-size: 18px;
  font-weight: 600;
  color: var(--mt-navy);
  margin: 28px 0 10px;
}

.mt-article-body p {
  font-family: var(--mt-serif);
  font-size: 18px;
  line-height: 30px;
  color: var(--mt-ink);
  margin: 0 0 20px;
}

.mt-article-body p strong {
  color: var(--mt-navy);
  font-weight: 600;
  font-family: var(--mt-sans);
}

.mt-article-body a {
  color: var(--mt-ink);
  border-bottom: 1.5px solid var(--mt-gold);
  text-decoration: none;
  font-weight: 500;
}

.mt-article-body ul,
.mt-article-body ol {
  font-family: var(--mt-serif);
  font-size: 18px;
  line-height: 30px;
  color: var(--mt-ink);
  padding-left: 24px;
  margin: 0 0 20px;
}

.mt-article-body li {
  margin-bottom: 8px;
}

.mt-article-body li::marker {
  color: var(--color-accent-on-light);
}

.mt-article-body blockquote {
  border-left: 4px solid var(--mt-gold);
  margin: 28px 0;
  padding: 16px 24px;
  background: var(--mt-cream-2);
  font-family: var(--mt-serif);
  font-style: italic;
  font-size: 20px;
  line-height: 32px;
  color: var(--mt-navy);
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-article-body {
    max-width: 100%;
  }
  .mt-article-body h2 {
    font-size: 26px;
    line-height: 34px;
    margin-top: 40px;
  }
  .mt-article-body p {
    font-size: 17px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-article-body h2 {
    font-size: 22px;
    line-height: 30px;
  }
  .mt-article-body h3 {
    font-size: 20px;
  }
  .mt-article-body p,
  .mt-article-body ul,
  .mt-article-body ol {
    font-size: 16px;
    line-height: 27px;
  }
}


/* ============================================================
   14. MT LOOP GRID (grade de artigos)
   Componente: MT Loop Grid
   Onde aparece: Blog Index, Archive por Categoria, Archive por Autor
   ============================================================ */

.mt-loop-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 48px;
}

/* Tablet — 2 colunas */
@media (max-width: 1023px) {
  .mt-loop-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Mobile — 1 coluna */
@media (max-width: 767px) {
  .mt-loop-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}


/* ============================================================
   15. MT LOOP CARD (card de artigo)
   Componente: MT Loop Item · Article Card
   Onde aparece: Blog Index, Archive por Categoria, Archive por Autor
   ============================================================ */

.mt-loop-card {
  background: var(--mt-ivory);
  border: 1px solid var(--mt-border);
  display: flex;
  flex-direction: column;
  text-decoration: none;
  transition: box-shadow 200ms ease;
}

.mt-loop-card:hover {
  box-shadow: 0 8px 32px -8px rgba(8,26,48,.14), 0 2px 8px -2px rgba(8,26,48,.08);
}

.mt-loop-card__thumb {
  aspect-ratio: 16/9;
  background: linear-gradient(135deg, #1a3658 0%, #0F2C4C 100%);
  overflow: hidden;
  flex-shrink: 0;
}

.mt-loop-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.mt-loop-card__body {
  padding: 24px 24px 20px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.mt-loop-card__category {
  font-family: var(--mt-sans);
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--color-accent-on-light);
  font-weight: 700;
  margin-bottom: 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.mt-loop-card__category::before {
  content: "";
  width: 14px;
  height: 1.5px;
  background: var(--mt-gold);
}

.mt-loop-card__title {
  font-family: var(--mt-sans);
  font-size: 20px;
  font-weight: 700;
  color: var(--mt-navy-deep);
  line-height: 1.22;
  letter-spacing: -0.012em;
  margin: 0 0 12px;
  text-wrap: balance;
}

.mt-loop-card:hover .mt-loop-card__title {
  color: var(--color-accent-on-light);
}

.mt-loop-card__excerpt {
  font-family: var(--mt-sans);
  font-size: 15px;
  line-height: 1.6;
  color: var(--mt-slate);
  margin: 0;
  flex: 1;
}

.mt-loop-card__footer {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 16px;
  margin-top: 20px;
  border-top: 1px solid var(--mt-border);
}

.mt-loop-card__avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: radial-gradient(circle at 32% 38%, #D8C6A4 0 22%, transparent 23%), linear-gradient(135deg, #1E3E66, #0F2C4C);
  border: 1.5px solid var(--mt-gold);
  flex-shrink: 0;
}

.mt-loop-card__meta {
  font-family: var(--mt-sans);
  font-size: 13px;
  color: var(--mt-slate);
  line-height: 1.4;
}

.mt-loop-card__meta strong {
  color: var(--mt-navy);
  font-weight: 600;
  display: block;
}

.mt-loop-card__read-time {
  margin-left: auto;
  font-family: var(--mt-mono);
  font-size: 11px;
  color: #AAA49A;
  letter-spacing: .04em;
  white-space: nowrap;
}

/* Mobile — ajuste de padding */
@media (max-width: 767px) {
  .mt-loop-card__body {
    padding: 18px 18px 16px;
  }
  .mt-loop-card__title {
    font-size: 18px;
  }
}


/* ============================================================
   16. MT LOOP FEATURED (card em destaque)
   Componente: MT Loop Featured Card
   Onde aparece: topo do Blog Index
   ============================================================ */

.mt-loop-featured {
  display: grid;
  grid-template-columns: 1fr 420px;
  background: var(--mt-ivory);
  border: 1px solid var(--mt-border);
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 64px;
  text-decoration: none;
  transition: box-shadow 200ms ease;
}

.mt-loop-featured:hover {
  box-shadow: 0 12px 40px -12px rgba(8,26,48,.18), 0 4px 12px -4px rgba(8,26,48,.10);
}

.mt-loop-featured__thumb {
  aspect-ratio: 3/2;
  background: linear-gradient(135deg, #1a3658 0%, #0F2C4C 40%, rgba(184,138,62,.13) 100%);
  overflow: hidden;
}

.mt-loop-featured__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.mt-loop-featured__body {
  padding: 40px 40px 36px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.mt-loop-featured__eyebrow {
  font-family: var(--mt-sans);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--color-accent-on-light);
  font-weight: 700;
  margin-bottom: 16px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.mt-loop-featured__eyebrow::before {
  content: "";
  width: 16px;
  height: 1.5px;
  background: var(--mt-gold);
}

.mt-loop-featured__title {
  font-family: var(--mt-sans);
  font-size: 32px;
  font-weight: 700;
  color: var(--mt-navy-deep);
  line-height: 1.18;
  letter-spacing: -0.02em;
  margin: 0 0 16px;
  text-wrap: balance;
}

.mt-loop-featured:hover .mt-loop-featured__title {
  color: var(--color-accent-on-light);
}

.mt-loop-featured__excerpt {
  font-family: var(--mt-sans);
  font-size: 16px;
  line-height: 1.6;
  color: var(--mt-slate);
  margin: 0 0 32px;
  flex: 1;
}

.mt-loop-featured__footer {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 24px;
  border-top: 1px solid var(--mt-border);
}

.mt-loop-featured__cta {
  margin-left: auto;
  font-family: var(--mt-sans);
  font-size: 13px;
  font-weight: 600;
  color: var(--color-accent-on-light);
  border-bottom: 1px solid var(--color-accent-on-light);
  padding-bottom: 1px;
  white-space: nowrap;
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-loop-featured {
    grid-template-columns: 1fr;
    border-radius: 8px;
  }
  .mt-loop-featured__thumb {
    aspect-ratio: 16/7;
  }
  .mt-loop-featured__body {
    padding: 28px 28px 24px;
  }
  .mt-loop-featured__title {
    font-size: 24px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-loop-featured {
    border-radius: 4px;
    margin-bottom: 32px;
  }
  .mt-loop-featured__title {
    font-size: 20px;
  }
  .mt-loop-featured__excerpt {
    font-size: 15px;
    margin-bottom: 20px;
  }
  .mt-loop-featured__body {
    padding: 22px 20px 18px;
  }
}


/* ============================================================
   17. MT LOOP ROW (linha de artigo nos Pillars)
   Componente: MT Loop Item · List Row
   Onde aparece: listagem de artigos nos Pillars
   ============================================================ */

.mt-loop-row {
  display: grid;
  grid-template-columns: 120px 1fr 220px;
  gap: 32px;
  padding-block: 28px;
  border-bottom: 1px solid var(--mt-border);
  align-items: baseline;
  text-decoration: none;
}

.mt-loop-row__date {
  font-family: var(--mt-serif);
  font-style: italic;
  font-size: 13px;
  line-height: 20px;
  color: var(--mt-slate);
}

.mt-loop-row__title {
  font-family: var(--mt-serif);
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  color: var(--mt-navy);
  letter-spacing: -0.005em;
  margin: 0 0 10px;
  text-wrap: balance;
}

.mt-loop-row:hover .mt-loop-row__title {
  color: var(--color-accent-on-light);
}

.mt-loop-row__excerpt {
  font-family: var(--mt-serif);
  font-size: 15px;
  line-height: 24px;
  color: var(--mt-slate);
  margin: 0;
}

.mt-loop-row__byline {
  font-family: var(--mt-sans);
  font-size: 13px;
  color: var(--mt-slate);
  text-align: right;
  line-height: 1.5;
}

.mt-loop-row__byline strong {
  color: var(--mt-navy);
  font-weight: 600;
  display: block;
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-loop-row {
    grid-template-columns: 96px 1fr;
    gap: 20px;
  }
  .mt-loop-row__byline {
    grid-column: 2;
    text-align: left;
  }
  .mt-loop-row__title {
    font-size: 20px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-loop-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .mt-loop-row__date {
    font-size: 12px;
  }
  .mt-loop-row__title {
    font-size: 18px;
    line-height: 26px;
  }
  .mt-loop-row__byline {
    text-align: left;
  }
}


/* ============================================================
   18. MT FILTERS (barra de filtros do Blog Index)
   Componente: MT Filters Bar
   Onde aparece: abaixo do hero no Blog Index (sticky)
   v2 fix #4 — box-sizing + max-inline-size para conter overflow
               de 59px em /publicacoes/ viewport 1440
   ============================================================ */

.mt-filters {
  box-sizing: border-box;          /* v2 fix #4 */
  max-inline-size: 100%;           /* v2 fix #4 */
  background: var(--mt-cream);
  border-bottom: 1px solid var(--mt-border);
  padding: 20px var(--mt-gutter);
  position: sticky;
  top: 0;
  z-index: 40;
  box-shadow: 0 2px 8px -4px rgba(8,26,48,.08);
}

.mt-filters__inner {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: nowrap;
  max-width: var(--mt-max-width);
  margin-inline: auto;
  /* v2 fix #4 — garantir que inner não excede container */
  box-sizing: border-box;
  max-inline-size: 100%;
}

.mt-filters__chips {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
  flex-wrap: wrap;
}

.mt-filters__chip {
  font-family: var(--mt-sans);
  font-size: 13px;
  font-weight: 500;
  padding: 7px 16px;
  border-radius: 999px;
  border: 1.5px solid var(--mt-border);
  color: var(--mt-slate);
  background: transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: all 180ms ease;
}

.mt-filters__chip:hover {
  border-color: var(--mt-navy);
  color: var(--mt-navy);
}

.mt-filters__chip.is-active {
  background: var(--mt-navy-deep);
  color: #fff;
  border-color: var(--mt-navy-deep);
}

.mt-filters__divider {
  width: 1px;
  height: 28px;
  background: var(--mt-border);
  flex-shrink: 0;
}

.mt-filters__search {
  flex: 1;
  position: relative;
  /* v2 fix #4 — limitar largura para não causar overflow */
  max-width: 280px;
  min-width: 0;
  margin-left: auto;
}

.mt-filters__search-input {
  width: 100%;
  font-family: var(--mt-sans);
  font-size: 13px;
  color: var(--mt-ink);
  background: var(--mt-ivory);
  border: 1.5px solid var(--mt-border);
  border-radius: 999px;
  padding: 7px 16px 7px 36px;
  transition: border-color 180ms;
  outline: none;
  box-sizing: border-box; /* v2 fix #4 */
}

.mt-filters__search-input::placeholder {
  color: #AAA49A;
}

.mt-filters__search-input:focus {
  border-color: var(--mt-navy);
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-filters__inner {
    flex-wrap: wrap;
    gap: 10px;
  }
  .mt-filters__search {
    max-width: 100%;
    width: 100%;
    margin-left: 0;
  }
  .mt-filters__divider {
    display: none;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-filters {
    padding: 14px var(--mt-gutter);
  }
  .mt-filters__chip {
    font-size: 12px;
    padding: 5px 12px;
  }
}


/* ============================================================
   19. MT SUBCAT GRID (subcategorias dos Pillars)
   Componente: MT Subcat Grid + MT Subcat Card
   Onde aparece: seção de subáreas nos Pillars
   ============================================================ */

.mt-subcat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.mt-subcat {
  background: var(--mt-ivory);
  border: 1px solid var(--mt-border);
  padding: 32px;
  display: flex;
  flex-direction: column;
}

.mt-subcat__eyebrow {
  font-family: var(--mt-sans);
  font-size: 10px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--color-accent-on-light);
  font-weight: 700;
  margin-bottom: 14px;
}

.mt-subcat h3 {
  font-family: var(--mt-serif);
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  color: var(--mt-navy);
  letter-spacing: -0.005em;
  margin: 0 0 12px;
}

.mt-subcat__desc {
  font-family: var(--mt-serif);
  font-size: 15px;
  line-height: 24px;
  color: var(--mt-slate);
  margin: 0 0 20px;
  min-height: 72px;
}

.mt-subcat__stubs {
  border-top: 1px solid var(--mt-border);
  padding-top: 14px;
  margin-top: auto;
}

.mt-subcat__stub {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding-block: 8px;
  font-family: var(--mt-sans);
  text-decoration: none;
  align-items: baseline;
  border-bottom: 1px solid rgba(230,225,214,.5);
}

.mt-subcat__stub:last-child {
  border-bottom: none;
}

.mt-subcat__stub-title {
  font-size: 14px;
  color: var(--mt-navy);
  font-weight: 500;
  line-height: 20px;
  flex: 1;
}

.mt-subcat__stub:hover .mt-subcat__stub-title {
  color: var(--color-accent-on-light);
}

.mt-subcat__stub-meta {
  font-size: 11px;
  color: var(--mt-slate);
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
  font-family: var(--mt-mono);
}

.mt-subcat__all {
  margin-top: 16px;
  font-family: var(--mt-sans);
  font-size: 13px;
  font-weight: 600;
  color: var(--color-accent-on-light);
  text-decoration: none;
  border-bottom: 1px solid var(--color-accent-on-light);
  padding-bottom: 1px;
  align-self: flex-start;
  display: inline-block;
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-subcat-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .mt-subcat__desc {
    min-height: auto;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-subcat-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .mt-subcat {
    padding: 24px 20px;
  }
}


/* ============================================================
   20. MT BASE LEGAL (faixa de fundamentação jurídica)
   Componente: MT Base Legal Strip
   Onde aparece: seção de base legal nos Pillars e Artigos
   ============================================================ */

.mt-base-legal {
  background: var(--mt-cream-2);
  border-top: 1px solid var(--mt-border);
  border-bottom: 1px solid var(--mt-border);
  padding-block: 72px;
}

.mt-base-legal__inner {
  border-left: 4px solid var(--mt-burgundy);
  padding-left: 40px;
  max-width: 960px;
}

.mt-base-legal__eyebrow {
  font-family: var(--mt-sans);
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--mt-burgundy);
  font-weight: 700;
  margin-bottom: 16px;
}

.mt-base-legal h3 {
  font-family: var(--mt-serif);
  font-size: 32px;
  line-height: 40px;
  font-weight: 500;
  color: var(--mt-navy);
  letter-spacing: -0.01em;
  margin: 0 0 28px;
}

.mt-base-legal__row {
  display: grid;
  grid-template-columns: 260px 1fr auto;
  gap: 24px;
  padding-block: 18px;
  border-top: 1px solid #D9CDB0;
  align-items: baseline;
}

.mt-base-legal__row:last-child {
  border-bottom: 1px solid #D9CDB0;
}

.mt-base-legal__law {
  font-family: var(--mt-serif);
  font-size: 19px;
  color: var(--mt-navy);
  font-weight: 600;
  letter-spacing: -0.005em;
}

.mt-base-legal__exp {
  font-family: var(--mt-sans);
  font-size: 15px;
  line-height: 22px;
  color: var(--mt-slate);
}

.mt-base-legal__link {
  font-family: var(--mt-sans);
  font-size: 13px;
  font-weight: 600;
  color: var(--mt-burgundy);
  text-decoration: none;
  border-bottom: 1px solid var(--mt-burgundy);
  padding-bottom: 1px;
  white-space: nowrap;
}

.mt-base-legal__link::after {
  content: " ↗";
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-base-legal {
    padding-block: 56px;
  }
  .mt-base-legal__row {
    grid-template-columns: 180px 1fr;
  }
  .mt-base-legal__link {
    grid-column: 2;
  }
  .mt-base-legal h3 {
    font-size: 26px;
    line-height: 34px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-base-legal {
    padding-block: 40px;
  }
  .mt-base-legal__inner {
    padding-left: 20px;
    border-left-width: 3px;
  }
  .mt-base-legal__row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .mt-base-legal__link {
    grid-column: 1;
  }
  .mt-base-legal__law {
    font-size: 16px;
  }
  .mt-base-legal h3 {
    font-size: 22px;
    line-height: 30px;
  }
}


/* ============================================================
   21. MT FAQ WRAP / MT FAQ ITEM (acordeão)
   Componente: MT FAQ Container + MT FAQ Item
   Onde aparece: Pillars, página FAQ, Home
   ============================================================ */

.mt-faq-wrap {
  max-width: 820px;
}

.mt-faq-item {
  border-top: 1px solid var(--mt-border);
  padding-block: 28px;
}

.mt-faq-item:last-child {
  border-bottom: 1px solid var(--mt-border);
}

.mt-faq-item__row {
  display: flex;
  gap: 28px;
  align-items: flex-start;
}

.mt-faq-item h4,
.mt-faq-item__question {
  font-family: var(--mt-sans);
  font-size: 22px;
  line-height: 30px;
  font-weight: 600;
  color: var(--mt-navy);
  margin: 0;
  letter-spacing: -0.005em;
  flex: 1;
  cursor: pointer;
}

.mt-faq-toggle {
  width: 34px;
  height: 34px;
  border: 1px solid var(--mt-border);
  background: var(--mt-ivory);
  color: var(--color-accent-on-light);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
  border-radius: 50%;
  font-family: var(--mt-serif);
  cursor: pointer;
  transition: background 150ms, color 150ms;
  line-height: 1;
  user-select: none;
}

.mt-faq-item.is-open .mt-faq-toggle {
  background: var(--mt-navy);
  color: var(--color-accent-on-dark);
  border-color: var(--mt-navy);
}

.mt-faq-item__answer {
  margin-top: 16px;
  max-width: var(--mt-measure);
  display: none;
}

.mt-faq-item.is-open .mt-faq-item__answer {
  display: block;
}

.mt-faq-item__answer p {
  font-size: 17px;
  line-height: 28px;
  color: var(--mt-ink);
  margin: 0 0 14px;
}

.mt-faq-item__answer p:last-child {
  margin-bottom: 0;
}

.mt-faq-item__answer strong {
  color: var(--mt-navy);
  font-weight: 600;
}

.mt-faq-item__answer a {
  color: var(--mt-ink);
  border-bottom: 1.5px solid var(--mt-gold);
  text-decoration: none;
  font-weight: 500;
}

/* Mobile */
@media (max-width: 767px) {
  .mt-faq-item {
    padding-block: 20px;
  }
  .mt-faq-item h4,
  .mt-faq-item__question {
    font-size: 17px;
    line-height: 26px;
  }
  .mt-faq-toggle {
    width: 28px;
    height: 28px;
    font-size: 18px;
  }
}


/* ============================================================
   22. MT CTA BAND (faixa de chamada para ação)
   Componente: MT CTA Band
   Onde aparece: antes do footer, em todas as páginas
   ============================================================ */

.mt-cta-band {
  background: var(--mt-navy);
  color: #F5EEDC;
  padding: 120px var(--mt-gutter);
  text-align: center;
  position: relative;
}

.mt-cta-band::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 40px;
  transform: translateX(-50%);
  width: 40px;
  height: 1.5px;
  background: var(--mt-gold);
}

.mt-cta-band h2 {
  font-family: var(--mt-serif);
  font-size: 42px;
  line-height: 52px;
  font-weight: 500;
  color: #F5EEDC;
  letter-spacing: -0.015em;
  margin: 0 auto 20px;
  text-wrap: balance;
  max-width: 780px;
}

.mt-cta-band__dek {
  font-family: var(--mt-sans);
  font-size: 18px;
  line-height: 28px;
  color: #CFC3A8;
  margin: 0 auto 40px;
  max-width: 560px;
}

.mt-cta-band__actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 32px;
}

.mt-cta-band__disc {
  font-family: var(--mt-serif);
  font-style: italic;
  font-size: 13px;
  line-height: 20px;
  color: #A8A090;
  max-width: 620px;
  margin: 0 auto;
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-cta-band {
    padding: 80px var(--mt-gutter);
  }
  .mt-cta-band h2 {
    font-size: 32px;
    line-height: 40px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-cta-band {
    padding: 60px var(--mt-gutter);
  }
  .mt-cta-band h2 {
    font-size: 26px;
    line-height: 34px;
  }
  .mt-cta-band__dek {
    font-size: 16px;
  }
}


/* ============================================================
   23. MT AUTHOR BLOCK
   Componente: MT Author Block
   Onde aparece: Single Post (assinatura de autoria), Pillars (bio resumida)
   ============================================================ */

.mt-author-block {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  background: var(--mt-ivory);
  border: 1px solid var(--mt-border);
  padding: 24px 28px;
}

.mt-author-block__photo {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 35%, #EBDDC0 0 25%, transparent 26%), linear-gradient(135deg, #0F2C4C, #1E3E66);
  flex-shrink: 0;
  border: 2px solid var(--mt-gold);
}

.mt-author-block__name {
  font-family: var(--mt-serif);
  font-size: 20px;
  font-weight: 500;
  color: var(--mt-navy);
  margin: 0 0 2px;
}

.mt-author-block__oab {
  font-family: var(--mt-mono);
  font-size: 12px;
  color: var(--color-accent-on-light);
  letter-spacing: .08em;
  font-weight: 600;
  margin-bottom: 6px;
}

.mt-author-block__spec {
  font-size: 14px;
  color: var(--mt-slate);
  margin-bottom: 10px;
}

.mt-author-block__link {
  font-family: var(--mt-sans);
  font-size: 13px;
  color: var(--color-accent-on-light);
  text-decoration: none;
  font-weight: 600;
  border-bottom: 1px solid var(--color-accent-on-light);
  padding-bottom: 1px;
  display: inline-block;
}

/* WordPress auto-linked lawyer names — added 2026-05-10
   WP wraps OAB-mentioned names in `<a class="mt-author-autolink">` pointing to
   /advogados/<slug>/. Without an explicit rule the anchor inherits the browser
   default link color (red on this theme). Match the design system accent gold
   used by the OAB eyebrow text. */
.mt-author-autolink,
a.mt-author-autolink:link,
a.mt-author-autolink:visited {
  color: var(--color-accent-on-light);
  text-decoration: none;
  font-weight: inherit;
  border-bottom: 0;
}
.mt-author-autolink:hover,
.mt-author-autolink:focus {
  color: var(--mt-gold);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Mobile */
@media (max-width: 767px) {
  .mt-author-block {
    flex-direction: column;
    gap: 14px;
    padding: 20px;
  }
  .mt-author-block__photo {
    width: 56px;
    height: 56px;
  }
}


/* ============================================================
   24. MT TL;DR BOX
   Componente: MT TL;DR Box
   Onde aparece: topo do corpo nos Artigos técnicos
   ============================================================ */

.mt-tldr {
  background: #F4ECD8;
  border-left: 4px solid var(--mt-gold);
  padding: 24px 28px;
  max-width: var(--mt-measure);
  margin-bottom: 32px;
}

.mt-tldr__kicker {
  font-family: var(--mt-sans);
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--mt-navy);
  font-weight: 700;
  margin-bottom: 12px;
}

.mt-tldr p {
  font-family: var(--mt-sans);
  font-size: 17px;
  line-height: 1.6;
  color: var(--mt-ink);
  margin: 0 0 10px;
}

.mt-tldr ul {
  margin: 0;
  padding-left: 20px;
  font-family: var(--mt-sans);
  font-size: 17px;
  line-height: 1.6;
  color: var(--mt-ink);
}

.mt-tldr li {
  margin-bottom: 6px;
}

.mt-tldr li::marker {
  color: var(--color-accent-on-light);
}

/* Mobile */
@media (max-width: 767px) {
  .mt-tldr {
    padding: 18px 20px;
  }
  .mt-tldr p,
  .mt-tldr ul {
    font-size: 15px;
  }
}


/* ============================================================
   25. MT FOOTER
   Componente: MT Footer
   Onde aparece: rodapé de todas as páginas
   ============================================================ */

.mt-footer {
  background: var(--mt-navy-deep);
  color: #A8A090;
  padding: 80px 0 32px;
  font-family: var(--mt-sans);
}

.mt-footer__inner {
  max-width: var(--mt-max-width);
  margin-inline: auto;
  padding-inline: var(--mt-gutter);
}

.mt-footer__grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.3fr;
  gap: 56px;
  padding-bottom: 48px;
}

/* Coluna da marca */
.mt-footer__brand-mark {
  font-family: var(--mt-script);
  font-size: 36px;
  color: var(--color-accent-on-dark);
  font-weight: 600;
  line-height: 1;
}

.mt-footer__brand-sub {
  font-family: var(--mt-sans);
  font-size: 10px;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: #A8A090;
  margin-top: 6px;
  margin-bottom: 22px;
  display: block;
}

.mt-footer__brand-desc {
  font-family: var(--mt-serif);
  font-size: 15px;
  color: #CFC3A8;
  line-height: 24px;
  margin: 0;
  max-width: 280px;
  font-style: italic;
}

/* Colunas de links */
.mt-footer h5 {
  font-family: var(--mt-sans);
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--color-accent-on-dark);
  font-weight: 700;
  margin: 0 0 20px;
}

.mt-footer ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mt-footer li {
  margin-bottom: 10px;
}

.mt-footer li a {
  font-family: var(--mt-sans);
  font-size: 14px;
  color: #CFC3A8;
  text-decoration: none;
  transition: color 150ms;
}

.mt-footer li a:hover {
  color: var(--color-accent-on-dark);
}

/* Coluna de contato */
.mt-footer__contact p {
  font-family: var(--mt-sans);
  font-size: 14px;
  color: #CFC3A8;
  line-height: 1.6;
  margin: 0 0 12px;
}

.mt-footer__wa-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--mt-green) !important;
  font-weight: 600;
  text-decoration: none;
}

.mt-footer__wa-link svg {
  width: 14px;
  height: 14px;
  fill: currentColor;
}

/* Linha divisória */
.mt-footer__rule {
  height: 1px;
  background: #1C2F46;
  margin-bottom: 20px;
  position: relative;
  border: none;
}

.mt-footer__rule::after {
  content: "";
  position: absolute;
  left: 0; top: 0;
  width: 60px;
  height: 1px;
  background: var(--mt-gold);
}

/* Rodapé inferior */
.mt-footer__colophon {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  font-family: var(--mt-sans);
  font-size: 12px;
  color: #6A6155;
  padding-top: 12px;
  flex-wrap: wrap;
}

.mt-footer__colophon em {
  font-family: var(--mt-serif);
  font-style: italic;
  color: #A8A090;
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-footer__grid {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-footer {
    padding: 56px 0 24px;
  }
  .mt-footer__grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .mt-footer__colophon {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }
}


/* ============================================================
   26. MT FORM / MT FIELD
   Componente: MT Contact Form + MT Form Field
   Onde aparece: página Contato; formulários em geral
   ============================================================ */

.mt-form {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.mt-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.mt-field {
  margin-bottom: 22px;
}

.mt-field label {
  display: block;
  font-family: var(--mt-sans);
  font-size: 13px;
  font-weight: 600;
  color: var(--mt-navy);
  margin-bottom: 8px;
  letter-spacing: .02em;
}

.mt-field label .req {
  color: var(--mt-burgundy);
  margin-left: 2px;
}

.mt-field label .opt {
  color: var(--mt-slate);
  font-weight: 400;
  margin-left: 4px;
  font-size: 12px;
}

.mt-field input,
.mt-field textarea,
.mt-field select {
  width: 100%;
  padding: 14px 16px;
  background: var(--mt-ivory);
  border: 1px solid var(--mt-border);
  border-radius: 2px;
  font-family: var(--mt-sans);
  font-size: 16px;
  color: var(--mt-ink);
  outline: none;
  transition: border-color .15s, box-shadow .15s;
  -webkit-appearance: none;
  appearance: none;
}

.mt-field textarea {
  resize: vertical;
  min-height: 120px;
  line-height: 1.6;
}

.mt-field input::placeholder,
.mt-field textarea::placeholder {
  color: #A8A29E;
}

.mt-field input:focus,
.mt-field textarea:focus,
.mt-field select:focus {
  border-color: var(--mt-navy);
  box-shadow: 0 0 0 3px rgba(15,44,76,.1);
}

.mt-field input.is-error,
.mt-field textarea.is-error {
  border-color: var(--mt-burgundy);
}

.mt-field__help {
  margin-top: 8px;
  font-size: 13px;
  color: var(--mt-slate);
  line-height: 1.5;
}

.mt-field__error {
  margin-top: 6px;
  font-size: 13px;
  color: var(--mt-burgundy);
  font-weight: 600;
}

.mt-form__submit-area {
  display: flex;
  align-items: center;
  gap: 20px;
  padding-top: 8px;
  flex-wrap: wrap;
}

.mt-form__disc {
  font-family: var(--mt-serif);
  font-style: italic;
  font-size: 13px;
  color: var(--mt-slate);
  line-height: 1.5;
}

/* Mobile */
@media (max-width: 767px) {
  .mt-form__row {
    grid-template-columns: 1fr;
    gap: 0;
  }
}


/* ============================================================
   27. MT BOTÕES
   Componente: MT Button
   Onde aparece: todos os contextos (CTAs, formulários, header)
   ============================================================ */

.mt-btn {
  font-family: var(--mt-sans);
  font-size: 15px;
  font-weight: 600;
  border-radius: 999px;
  padding: 13px 26px;
  cursor: pointer;
  border: 1.5px solid transparent;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  letter-spacing: .01em;
  transition: background 150ms, color 150ms, border-color 150ms;
}

/* Primário — WhatsApp verde */
.mt-btn--primary {
  background: var(--mt-green);
  color: #fff;
  border-color: var(--mt-green);
}

.mt-btn--primary:hover {
  background: #256b4d;
  border-color: #256b4d;
}

.mt-btn--primary svg {
  width: 17px;
  height: 17px;
  fill: currentColor;
}

/* Secundário — outline navy */
.mt-btn--secondary {
  background: transparent;
  color: var(--mt-navy);
  border-color: var(--mt-navy);
}

.mt-btn--secondary:hover {
  background: var(--mt-navy);
  color: var(--mt-cream);
}

/* Ouro — fill dourado */
.mt-btn--gold {
  background: var(--mt-gold);
  color: var(--mt-navy);
  border-color: var(--mt-gold);
}

.mt-btn--gold:hover {
  background: var(--mt-navy);
  color: var(--color-accent-on-dark);
  border-color: var(--mt-navy);
}

/* Fantasma sobre fundo escuro */
.mt-btn--ghost-light {
  background: transparent;
  color: #F5EEDC;
  border-color: #6A7B91;
}

.mt-btn--ghost-light:hover {
  border-color: var(--color-accent-on-dark);
  color: var(--color-accent-on-dark);
}

/* Link terciário (sem capsule) */
.mt-link-tertiary {
  font-family: var(--mt-sans);
  font-size: 15px;
  color: var(--mt-navy);
  text-decoration: none;
  border-bottom: 1.5px solid var(--mt-gold);
  padding-bottom: 3px;
  font-weight: 600;
  display: inline-block;
  transition: color 150ms;
}

.mt-link-tertiary:hover {
  color: var(--color-accent-on-light);
}

/* Tamanho pequeno */
.mt-btn--sm {
  font-size: 13px;
  padding: 9px 18px;
}

/* Tamanho grande */
.mt-btn--lg {
  font-size: 17px;
  padding: 16px 32px;
}

/* Mobile — botões full-width quando necessário */
@media (max-width: 767px) {
  .mt-btn--full-mobile {
    width: 100%;
    justify-content: center;
  }
}


/* ============================================================
   28. MT CHIP / TAG
   Componente: MT Chip / Tag
   Onde aparece: cards de artigo (categoria), filtros, breadcrumb de contexto
   ============================================================ */

.mt-chip {
  display: inline-block;
  background: var(--mt-cream);
  color: var(--mt-navy);
  font-family: var(--mt-sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  padding: 6px 12px;
  border-radius: 2px;
  border: 1px solid var(--mt-border);
  text-transform: none;
}

.mt-chip--gold {
  background: transparent;
  color: var(--color-accent-on-light);
  border-color: var(--color-accent-on-light);
}

.mt-chip--navy {
  background: var(--mt-navy);
  color: #F5EEDC;
  border-color: var(--mt-navy);
}


/* ============================================================
   29. MT EYEBROW / MT SEC-EYEBROW
   Componente: MT Eyebrow + MT Section Eyebrow
   Onde aparece: antes de títulos de seção, em todas as páginas
   ============================================================ */

/* Eyebrow simples (com linha antes) */
.mt-eyebrow {
  font-family: var(--mt-sans);
  font-size: 11px;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--color-accent-on-light);
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}

.mt-eyebrow::before {
  content: "";
  width: 24px;
  height: 1.5px;
  background: var(--mt-gold);
  flex-shrink: 0;
}

/* Eyebrow de seção (com linha completa à direita) */
.mt-sec-eyebrow {
  font-family: var(--mt-sans);
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--color-accent-on-light);
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}

.mt-sec-eyebrow::before {
  content: "";
  width: 24px;
  height: 1.5px;
  background: var(--mt-gold);
  flex-shrink: 0;
}

/* Título de seção (h2 editorial) */
.mt-sec-title {
  font-family: var(--mt-serif);
  font-size: 48px;
  line-height: 1.15;
  font-weight: 500;
  color: var(--mt-navy);
  letter-spacing: -0.015em;
  margin: 0 0 24px;
  max-width: 820px;
  text-wrap: balance;
}

/* Deck / subtítulo de seção */
.mt-sec-dek {
  font-family: var(--mt-serif);
  font-size: 20px;
  line-height: 32px;
  color: var(--mt-slate);
  max-width: 720px;
  margin: 0 0 56px;
}

/* Tablet */
@media (max-width: 1023px) {
  .mt-sec-title {
    font-size: 36px;
  }
  .mt-sec-dek {
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 40px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .mt-sec-title {
    font-size: 26px;
    line-height: 1.2;
  }
  .mt-sec-dek {
    font-size: 16px;
    line-height: 26px;
    margin-bottom: 28px;
  }
}


/* ============================================================
   30. UTILITÁRIOS
   ============================================================ */

/* Ocultar em mobile (≤ 767 px) */
.mt-hide-mobile {
  /* nada no desktop/tablet */
}

@media (max-width: 767px) {
  .mt-hide-mobile {
    display: none !important;
  }
}

/* Ocultar em tablet (768–1023 px) */
@media (min-width: 768px) and (max-width: 1023px) {
  .mt-hide-tablet {
    display: none !important;
  }
}

/* Ocultar em desktop (≥ 1024 px) */
@media (min-width: 1024px) {
  .mt-hide-desktop {
    display: none !important;
  }
}

/* Exibir apenas em mobile */
.mt-show-mobile-only {
  display: none !important;
}

@media (max-width: 767px) {
  .mt-show-mobile-only {
    display: revert !important;
  }
}

/* Exibir apenas em tablet */
.mt-show-tablet-only {
  display: none !important;
}

@media (min-width: 768px) and (max-width: 1023px) {
  .mt-show-tablet-only {
    display: revert !important;
  }
}

/* Texto: não selecionar */
.mt-noselect {
  user-select: none;
}

/* Texto screen-reader only */
.mt-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;
}

/* Espaçadores de seção */
.mt-band {
  padding-block: 120px;
}

.mt-band--sm {
  padding-block: 72px;
}

.mt-band--lg {
  padding-block: 160px;
}

@media (max-width: 1023px) {
  .mt-band     { padding-block: 80px; }
  .mt-band--sm { padding-block: 56px; }
  .mt-band--lg { padding-block: 96px; }
}

@media (max-width: 767px) {
  .mt-band     { padding-block: 56px; }
  .mt-band--sm { padding-block: 40px; }
  .mt-band--lg { padding-block: 64px; }
}

/* Fundo creme-2 para bandas alternadas */
.mt-band--alt {
  background: var(--mt-cream-2);
  border-top: 1px solid var(--mt-border);
  border-bottom: 1px solid var(--mt-border);
}

/* Fundo navy para bandas de destaque */
.mt-band--navy {
  background: var(--mt-navy);
  color: #F5EEDC;
}

/* ============================================================
   31. /PUBLICACOES/ — centralização do container principal
   Onde aparece: página de listagem de artigos (/publicacoes/)
   Problema: containers e-con-full sem max-width estendem até
             a borda da tela em viewports largas (ex. 1440px+)
   Fix: constrager pubmainwrp a 1440px (igual ao inner das
        pillar pages), com fundo cream cobrindo a seção toda
   ============================================================ */

/* Background cream cobrindo toda a largura da seção — elimina o
   contraste branco/cream nas margens laterais em viewports largas */
html body .elementor-element-pubmainsec {
  background-color: var(--mt-cream);
}

/* Container centralizado a 1440px — igual ao inner das sections Elementor
   nas pillar pages (e8e442c inner = 1440px a 1920px de viewport) */
html body .elementor-element-pubmainwrp {
  max-width: 1440px;
  margin-inline: auto;
  width: 100%;
  box-sizing: border-box;
}


/* ============================================================
   32. PÁGINAS LEGAIS + CONTATO — centralização do container
   Onde aparece: /politica-privacidade/ · /termos-de-uso/ · /contato/
   Problema: main#content theme Hello Elementor usa max-width 1140px
             em vez dos 1440px canônicos das pillar pages
   Fix: override pra 1440px, centrado (margin auto já aplicado pelo tema)
   ============================================================ */

html body.page-id-4436 main#content,
html body.page-id-4437 main#content,
html body.page-id-4438 main#content {
  max-width: 1440px;
}

/* ============================================================
   FIM DO ARQUIVO mt-responsive.css  v2
   ============================================================ */


/* ============================================================
 *  v3 — Homepage v4 additions (2026-05-07)
 *  Classes novas exclusivas da home v4 keyword-driven.
 *  Mantém prefixo .mt- e breakpoints canônicos (≤767 / 768-1023 / ≥1024).
 *  Tokens via var(--mt-*) já definidos no :root da seção 00.
 * ============================================================ */

/* --- Box-sizing reset for v4 sections (matches scoped reset at line 188) - */
.mt-benefit-group *, .mt-authority *, .mt-sede *, .mt-midia *,
.mt-confia *, .mt-info-consult *, .mt-newsletter *, .mt-revisao *,
.mt-specialists-intro *, .mt-hero--split *, .mt-footer-grid-v4 *,
.mt-blog-grid-v4 * {
  box-sizing: border-box;
}

/* --- Submenu desktop dropdown ----------------------------- */
.mt-menu-item { position: relative; display: inline-flex; align-items: center; }
.mt-menu-item__caret { width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); margin-left: 6px; margin-top: -3px; }
.mt-menu-item__submenu { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(8px); min-width: 320px; background: var(--mt-ivory); border: 1px solid var(--mt-border); box-shadow: 0 20px 40px -12px rgba(8,26,48,.18); padding: 14px 0; opacity: 0; visibility: hidden; transition: opacity .18s, transform .18s; z-index: 50; }
.mt-menu-item:hover .mt-menu-item__submenu, .mt-menu-item:focus-within .mt-menu-item__submenu { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.mt-menu-item__submenu a { display: block; padding: 12px 24px; font-family: var(--mt-sans); font-size: 14px; font-weight: 500; color: var(--mt-navy); text-decoration: none; text-transform: none; letter-spacing: .01em; border-left: 2px solid transparent; }
.mt-menu-item__submenu a:hover { background: var(--mt-cream); color: var(--color-accent-on-light); border-left-color: var(--mt-gold); }
.mt-menu-item__submenu a small { display: block; font-size: 12px; color: var(--mt-slate); margin-top: 2px; font-weight: 400; }

/* --- Hero v4: 2-column with photo ------------------------- */
.mt-hero--split { padding-block: 104px 88px; }
.mt-hero__grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: center; max-width: var(--mt-max-width); margin-inline: auto; }
.mt-hero__col { min-width: 0; }
.mt-hero__trust { margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--mt-border); display: flex; gap: 32px; flex-wrap: wrap; font-family: var(--mt-sans); font-size: 13px; color: var(--mt-slate); max-width: var(--mt-measure); }
.mt-hero__trust-item { display: inline-flex; align-items: center; gap: 8px; }
.mt-hero__trust-item strong { color: var(--mt-navy); font-weight: 600; }
.mt-hero__trust-tick { width: 18px; height: 18px; border: 1.5px solid var(--mt-gold); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: var(--color-accent-on-light); font-family: var(--mt-serif); font-size: 12px; font-weight: 600; flex-shrink: 0; }

.mt-hero__photo { position: relative; width: 100%; aspect-ratio: 3/4; background: linear-gradient(160deg, #1E3E66 0%, var(--mt-navy) 60%, var(--mt-navy-deep) 100%); border: 1px solid var(--mt-border); overflow: hidden; box-shadow: 0 24px 48px -16px rgba(8,26,48,.4); }
.mt-hero__photo::before { content: ""; position: absolute; inset: 0; background-image: repeating-linear-gradient(135deg, rgba(184,138,62,.06) 0 14px, transparent 14px 28px); }
.mt-hero__photo-frame { position: absolute; inset: 18px; border: 1.5px solid rgba(184,138,62,.4); }
.mt-hero__photo-name { position: absolute; top: 24px; left: 24px; font-family: var(--mt-script); font-size: 24px; color: var(--color-accent-on-dark); font-weight: 600; line-height: 1; }
.mt-hero__photo-oab { position: absolute; top: 60px; left: 24px; font-family: var(--mt-mono); font-size: 10px; letter-spacing: .16em; color: #CFC3A8; text-transform: uppercase; }
.mt-hero__photo-silhouette { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 62%; height: 78%; background: radial-gradient(ellipse 28% 20% at 50% 18%, rgba(216,198,164,.42) 0 60%, transparent 70%), radial-gradient(ellipse 60% 50% at 50% 95%, rgba(216,198,164,.18) 0 60%, transparent 75%); }
.mt-hero__photo-label { position: absolute; left: 32px; right: 32px; bottom: 32px; background: rgba(8,26,48,.78); border-left: 3px solid var(--mt-gold); padding: 14px 18px; color: #F5EEDC; font-family: var(--mt-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; line-height: 1.5; }
.mt-hero__photo-label strong { color: var(--color-accent-on-dark); font-weight: 600; display: block; margin-bottom: 4px; }

@media (max-width: 1023px) {
  .mt-hero--split { padding-block: 64px 56px; }
  .mt-hero__grid { grid-template-columns: 1fr; gap: 40px; }
  .mt-hero__photo { max-width: 380px; margin-inline: auto; }
}
@media (max-width: 767px) {
  .mt-hero__photo { max-width: 280px; }
  .mt-hero__trust { gap: 14px; }
}

/* --- Specialists intro band ------------------------------- */
.mt-specialists-intro { padding-block: 80px 32px; background: var(--mt-ivory); border-top: 1px solid var(--mt-border); text-align: center; }
.mt-specialists-intro .mt-sec-eyebrow { justify-content: center; }
.mt-specialists-intro h2 { font-family: var(--mt-serif); font-size: 42px; line-height: 1.13; font-weight: 500; color: var(--mt-navy); letter-spacing: -0.015em; margin: 8px auto 0; max-width: 780px; text-wrap: balance; }
.mt-specialists-intro h2 em { font-style: italic; color: var(--color-accent-on-light); font-weight: 500; }
.mt-specialists-intro__sub { font-family: var(--mt-serif); font-style: italic; font-size: 16px; color: var(--mt-slate); margin: 18px auto 0; max-width: 540px; }
@media (max-width: 1023px) { .mt-specialists-intro h2 { font-size: 32px; } }
@media (max-width: 767px)  { .mt-specialists-intro { padding-block: 56px 24px; } .mt-specialists-intro h2 { font-size: 26px; } }

/* --- Benefit group + benefit card ------------------------- */
.mt-benefit-group { padding-block: 48px 88px; background: var(--mt-ivory); }
.mt-benefit-group + .mt-benefit-group { padding-top: 0; }
.mt-benefit-group__head { display: flex; align-items: flex-end; gap: 24px; margin-bottom: 32px; flex-wrap: wrap; padding-bottom: 18px; border-bottom: 1px solid var(--mt-border); }
.mt-benefit-group__head h3 { font-family: var(--mt-serif); font-size: 30px; line-height: 1.18; font-weight: 500; color: var(--mt-navy); letter-spacing: -0.015em; margin: 0; flex: 1; min-width: 280px; }
.mt-benefit-group__head h3 em { font-style: italic; color: var(--color-accent-on-light); font-weight: 500; }
.mt-benefit-group__tag { font-family: var(--mt-sans); font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--color-accent-on-light); font-weight: 700; border: 1px solid var(--mt-gold); padding: 6px 12px; background: var(--mt-cream); }
.mt-benefit-group__cta { font-family: var(--mt-sans); font-size: 13px; font-weight: 600; color: var(--color-accent-on-light); text-decoration: none; border-bottom: 1px solid var(--mt-gold); padding-bottom: 1px; }

.mt-benefit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.mt-benefit-card { background: var(--mt-cream); border: 1px solid var(--mt-border); padding: 26px 24px 22px; display: flex; flex-direction: column; gap: 10px; text-decoration: none; position: relative; min-height: 200px; transition: border-color .2s, transform .2s; }
.mt-benefit-card:hover { border-color: var(--mt-gold); transform: translateY(-2px); }
.mt-benefit-card--featured { border-color: var(--mt-gold); background: linear-gradient(180deg, rgba(184,138,62,.06) 0%, var(--mt-cream) 60%); }
.mt-benefit-card__icon { width: 32px; height: 32px; color: var(--color-accent-on-light); margin-bottom: 4px; }
.mt-benefit-card__icon svg { width: 100%; height: 100%; stroke: currentColor; fill: none; stroke-width: 1.5; }
.mt-benefit-card h4 { font-family: var(--mt-serif); font-size: 19px; line-height: 25px; font-weight: 500; color: var(--mt-navy); letter-spacing: -0.005em; margin: 0; }
.mt-benefit-card p { font-family: var(--mt-sans); font-size: 13.5px; line-height: 20px; color: var(--mt-slate); margin: 0; flex: 1; }
.mt-benefit-card__arrow { font-family: var(--mt-sans); font-size: 12px; font-weight: 600; letter-spacing: .04em; color: var(--mt-navy); border-bottom: 1.5px solid var(--mt-gold); padding-bottom: 2px; align-self: flex-start; margin-top: 6px; }
.mt-benefit-card__star { position: absolute; top: 18px; right: 20px; color: var(--color-accent-on-light); font-size: 11px; letter-spacing: .04em; }

@media (max-width: 1023px) {
  .mt-benefit-grid { grid-template-columns: repeat(2, 1fr); }
  .mt-benefit-group { padding-block: 32px 64px; }
  .mt-benefit-group__head h3 { font-size: 24px; }
}
@media (max-width: 767px) {
  .mt-benefit-grid { grid-template-columns: 1fr; }
  .mt-benefit-group__head { flex-direction: column; align-items: flex-start; gap: 10px; }
}

/* --- Revisão block ---------------------------------------- */
.mt-revisao { padding-block: 88px; background: var(--mt-cream); }
.mt-revisao__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: flex-start; max-width: var(--mt-max-width); margin-inline: auto; }
.mt-revisao h3 { font-family: var(--mt-serif); font-size: 34px; line-height: 1.15; font-weight: 500; color: var(--mt-navy); letter-spacing: -0.015em; margin: 8px 0 18px; }
.mt-revisao h3 em { font-style: italic; color: var(--color-accent-on-light); font-weight: 500; }
.mt-revisao p { font-family: var(--mt-serif); font-size: 17px; line-height: 27px; color: var(--mt-slate); margin: 0 0 24px; max-width: 480px; }
.mt-revisao__list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--mt-border); }
.mt-revisao__list li { font-family: var(--mt-sans); font-size: 15px; color: var(--mt-ink); padding: 16px 0 16px 36px; border-bottom: 1px solid var(--mt-border); position: relative; line-height: 1.5; }
.mt-revisao__list li::before { content: ""; position: absolute; left: 0; top: 22px; width: 18px; height: 1.5px; background: var(--mt-gold); }
.mt-revisao__list li strong { color: var(--mt-navy); font-weight: 600; }
@media (max-width: 1023px) { .mt-revisao__grid { grid-template-columns: 1fr; gap: 32px; } .mt-revisao h3 { font-size: 26px; } }
@media (max-width: 767px)  { .mt-revisao { padding-block: 56px; } }

/* --- Authority cells (uses .mt-band) ---------------------- */
.mt-authority { padding-block: 88px; background: var(--mt-ivory); border-top: 1px solid var(--mt-border); }
.mt-authority__head { margin-bottom: 48px; max-width: var(--mt-max-width); margin-inline: auto; }
.mt-authority__head h2 { font-family: var(--mt-serif); font-size: 38px; line-height: 1.15; font-weight: 500; color: var(--mt-navy); letter-spacing: -0.015em; margin: 0 0 14px; max-width: 780px; text-wrap: balance; }
.mt-authority__head h2 em { font-style: italic; color: var(--color-accent-on-light); font-weight: 500; }
.mt-authority__lead { font-family: var(--mt-serif); font-size: 17px; line-height: 27px; color: var(--mt-slate); max-width: 700px; margin: 0; }
.mt-authority__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; max-width: var(--mt-max-width); margin-inline: auto; }
.mt-authority__cell { background: var(--mt-cream); border: 1px solid var(--mt-border); border-top: 3px solid var(--mt-gold); padding: 28px 24px; }
.mt-authority__num { font-family: var(--mt-serif); font-size: 48px; line-height: 1; font-weight: 500; color: var(--mt-navy); letter-spacing: -0.02em; }
.mt-authority__num small { font-size: 24px; color: var(--color-accent-on-light); }
.mt-authority__label { font-family: var(--mt-sans); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--mt-slate); font-weight: 600; margin-top: 14px; line-height: 1.5; }
.mt-authority__label strong { color: var(--mt-navy); }
.mt-authority__foot { margin-top: 24px; font-family: var(--mt-serif); font-style: italic; font-size: 13px; line-height: 20px; color: var(--mt-slate); max-width: 780px; }
@media (max-width: 1023px) { .mt-authority__grid { grid-template-columns: repeat(2, 1fr); } .mt-authority__head h2 { font-size: 30px; } }
@media (max-width: 767px)  { .mt-authority__grid { grid-template-columns: 1fr; } }

/* --- Sede / map ------------------------------------------- */
.mt-sede { padding-block: 88px; background: var(--mt-cream-2); }
.mt-sede__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: stretch; max-width: var(--mt-max-width); margin-inline: auto; }
.mt-sede-map { background: var(--mt-navy-deep); position: relative; overflow: hidden; min-height: 380px; border: 1px solid var(--mt-border); display: block; text-decoration: none; }
.mt-sede-map::before { content: ""; position: absolute; inset: 0; background-image: repeating-linear-gradient(0deg, rgba(184,138,62,.18) 0 1px, transparent 1px 48px), repeating-linear-gradient(90deg, rgba(184,138,62,.18) 0 1px, transparent 1px 48px); }
.mt-sede-map__pin { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 56px; height: 56px; border-radius: 50%; background: var(--mt-gold); display: flex; align-items: center; justify-content: center; color: var(--mt-navy); font-family: var(--mt-serif); font-weight: 700; font-size: 24px; box-shadow: 0 0 0 8px rgba(184,138,62,.18), 0 0 0 22px rgba(184,138,62,.08); }
.mt-sede-map__cap { position: absolute; left: 18px; bottom: 18px; background: rgba(8,26,48,.85); color: #F5EEDC; font-family: var(--mt-mono); font-size: 11px; letter-spacing: .08em; padding: 10px 14px; border-left: 2px solid var(--mt-gold); text-transform: uppercase; }
.mt-sede__info { display: flex; flex-direction: column; justify-content: center; }
.mt-sede__info h3 { font-family: var(--mt-serif); font-size: 32px; line-height: 1.15; font-weight: 500; color: var(--mt-navy); letter-spacing: -0.015em; margin: 8px 0 10px; }
.mt-sede__addr { font-family: var(--mt-serif); font-size: 18px; line-height: 28px; color: var(--mt-ink); margin: 0 0 24px; }
.mt-sede__phone { font-family: var(--mt-serif); font-size: 34px; color: var(--mt-navy); font-weight: 500; letter-spacing: -0.01em; margin: 0 0 4px; text-decoration: none; display: block; }
.mt-sede__phone-label { font-family: var(--mt-sans); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--mt-slate); margin-bottom: 24px; font-weight: 600; }
.mt-sede__about { font-family: var(--mt-serif); font-size: 16px; line-height: 26px; color: var(--mt-slate); margin: 0 0 24px; border-top: 1px solid var(--mt-border); padding-top: 24px; }
.mt-sede__cta-row { display: flex; gap: 14px; flex-wrap: wrap; }
@media (max-width: 1023px) { .mt-sede__grid { grid-template-columns: 1fr; gap: 28px; } .mt-sede-map { min-height: 300px; } .mt-sede__info h3 { font-size: 26px; } }
@media (max-width: 767px)  { .mt-sede { padding-block: 56px; } }

/* --- Mídia logo strip ------------------------------------- */
.mt-midia { padding-block: 72px; background: var(--mt-ivory); border-top: 1px solid var(--mt-border); border-bottom: 1px solid var(--mt-border); text-align: center; }
.mt-midia__inner { max-width: var(--mt-max-width); margin-inline: auto; }
.mt-midia h3 { font-family: var(--mt-serif); font-size: 24px; line-height: 1.2; font-weight: 500; color: var(--mt-navy); letter-spacing: -0.01em; margin: 0 0 6px; }
.mt-midia h3 em { font-style: italic; color: var(--color-accent-on-light); font-weight: 500; }
.mt-midia__sub { font-family: var(--mt-serif); font-style: italic; font-size: 14px; color: var(--mt-slate); margin: 0 0 36px; }
.mt-midia-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 24px 32px; align-items: center; }
.mt-midia-cell { aspect-ratio: 5/2; background: var(--mt-cream); border: 1px solid var(--mt-border); display: flex; align-items: center; justify-content: center; font-family: var(--mt-serif); font-weight: 500; color: var(--mt-slate); font-size: 13px; letter-spacing: .04em; text-align: center; padding: 8px; line-height: 1.2; font-style: italic; position: relative; }
.mt-midia-cell::before { content: "placeholder"; position: absolute; top: 4px; left: 6px; font-family: var(--mt-mono); font-size: 7px; letter-spacing: .1em; color: #B6AC95; font-style: normal; text-transform: uppercase; }
.mt-midia__foot { margin-top: 24px; font-family: var(--mt-serif); font-style: italic; font-size: 13px; color: var(--mt-slate); }
@media (max-width: 1023px) { .mt-midia-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px)  { .mt-midia-grid { grid-template-columns: repeat(2, 1fr); } }

/* --- Confia (Google Reviews carousel) --------------------- */
.mt-confia { padding-block: 88px; background: var(--mt-cream); overflow: hidden; }
.mt-confia > .mt-container { max-width: var(--mt-max-width); margin-inline: auto; }
.mt-confia__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; flex-wrap: wrap; margin-bottom: 36px; }
.mt-confia__head-left { max-width: 640px; }
.mt-confia__head h3 { font-family: var(--mt-serif); font-size: 34px; line-height: 1.15; font-weight: 500; color: var(--mt-navy); letter-spacing: -0.015em; margin: 8px 0 12px; }
.mt-confia__head h3 em { font-style: italic; color: var(--color-accent-on-light); font-weight: 500; }
.mt-confia__head p { font-family: var(--mt-serif); font-size: 16px; line-height: 25px; color: var(--mt-slate); margin: 0; max-width: 560px; }
.mt-confia__summary { display: flex; align-items: center; gap: 16px; background: var(--mt-ivory); border: 1px solid var(--mt-border); padding: 14px 18px; flex-shrink: 0; text-decoration: none; }
.mt-confia__g-logo { width: 32px; height: 32px; border-radius: 50%; background: #fff; border: 1px solid var(--mt-border); display: flex; align-items: center; justify-content: center; font-family: var(--mt-sans); font-weight: 700; font-size: 16px; color: #4285F4; }
.mt-confia__g-meta { display: flex; flex-direction: column; gap: 2px; }
.mt-confia__g-row { display: flex; align-items: center; gap: 8px; }
.mt-confia__g-num { font-family: var(--mt-serif); font-size: 18px; font-weight: 600; color: var(--mt-navy); letter-spacing: -0.01em; line-height: 1; }
.mt-confia__g-stars { color: #F5B400; font-size: 14px; letter-spacing: 1px; line-height: 1; }
.mt-confia__g-cap { font-family: var(--mt-sans); font-size: 11px; color: var(--mt-slate); letter-spacing: .04em; }
.mt-confia-carousel { position: relative; }
.mt-confia-track { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: 6px 2px 24px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.mt-confia-track::-webkit-scrollbar { display: none; }
.mt-confia-card { flex: 0 0 calc((100% - 40px) / 3); min-width: 300px; scroll-snap-align: start; background: var(--mt-ivory); border: 1px solid var(--mt-border); padding: 26px 24px 22px; display: flex; flex-direction: column; gap: 14px; }
.mt-confia-card__top { display: flex; align-items: center; gap: 14px; }
.mt-confia-card__avatar { width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg, var(--mt-navy) 0%, var(--mt-navy-deep) 100%); color: var(--color-accent-on-dark, var(--mt-gold)); font-family: var(--mt-serif); font-size: 16px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; letter-spacing: -0.02em; }
.mt-confia-card__avatar--2 { background: linear-gradient(135deg, #1E3E66 0%, var(--mt-navy) 100%); }
.mt-confia-card__avatar--3 { background: linear-gradient(135deg, #7A1C2E 0%, #4A1018 100%); }
.mt-confia-card__avatar--4 { background: linear-gradient(135deg, #5C7A3E 0%, #3D5128 100%); }
.mt-confia-card__who { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.mt-confia-card__name { font-family: var(--mt-serif); font-size: 16px; font-weight: 600; color: var(--mt-navy); line-height: 1.2; }
.mt-confia-card__when { font-family: var(--mt-sans); font-size: 11px; color: var(--mt-slate); letter-spacing: .04em; }
.mt-confia-card__stars { color: #F5B400; font-size: 14px; letter-spacing: 2px; line-height: 1; }
.mt-confia-card__quote { font-family: var(--mt-serif); font-size: 15px; line-height: 23px; color: var(--mt-ink, #1A1A1A); margin: 0; flex: 1; }
.mt-confia-card__src { display: flex; align-items: center; gap: 8px; font-family: var(--mt-sans); font-size: 11px; color: var(--mt-slate); letter-spacing: .04em; padding-top: 12px; border-top: 1px solid var(--mt-border); }
.mt-confia-card__g { width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 1px solid var(--mt-border); display: inline-flex; align-items: center; justify-content: center; font-family: var(--mt-sans); font-weight: 700; font-size: 9px; color: #4285F4; flex-shrink: 0; }
.mt-confia__controls { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 8px; flex-wrap: wrap; }
.mt-confia__dots { display: flex; gap: 8px; }
.mt-confia__dots button { width: 28px; height: 3px; background: var(--mt-border); border: none; cursor: pointer; padding: 0; transition: background .2s; }
.mt-confia__dots button.is-active { background: var(--mt-gold); }
.mt-confia__arrows { display: flex; gap: 8px; }
.mt-confia__arrows button { width: 44px; height: 44px; border: 1px solid var(--mt-border); background: var(--mt-ivory); cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--mt-navy); font-size: 18px; transition: border-color .2s, background .2s; }
.mt-confia__arrows button:hover { border-color: var(--mt-gold); background: var(--mt-cream); }
.mt-confia__arrows button:disabled { opacity: .35; cursor: not-allowed; }
.mt-confia__foot { font-family: var(--mt-serif); font-style: italic; font-size: 12px; color: #9A9483; margin-top: 18px; line-height: 1.5; max-width: 780px; }
@media (min-width: 768px) and (max-width: 1023px) { .mt-confia-card { flex: 0 0 calc((100% - 20px) / 2); min-width: 0; } .mt-confia__summary { flex: 1 1 100%; } }
@media (max-width: 767px) { .mt-confia { padding-block: 56px; } .mt-confia__head { flex-direction: column; align-items: flex-start; } .mt-confia__head h3 { font-size: 26px; } .mt-confia-card { flex: 0 0 85%; min-width: 0; } }

/* --- Info-consult (CNPJ etc.) ----------------------------- */
.mt-info-consult { padding-block: 80px; background: var(--mt-ivory); border-top: 1px solid var(--mt-border); }
.mt-info-consult__grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 48px; max-width: var(--mt-max-width); margin-inline: auto; }
.mt-info-consult h3 { font-family: var(--mt-serif); font-size: 30px; line-height: 1.18; font-weight: 500; color: var(--mt-navy); letter-spacing: -0.015em; margin: 8px 0 16px; }
.mt-info-consult h3 em { font-style: italic; color: var(--color-accent-on-light); font-weight: 500; }
.mt-info-consult__lead { font-family: var(--mt-serif); font-size: 16px; line-height: 26px; color: var(--mt-slate); margin: 0; max-width: 380px; }
.mt-info-consult__dl { display: grid; grid-template-columns: 200px 1fr; gap: 0; border-top: 1px solid var(--mt-border); margin: 0; }
.mt-info-consult__dl dt { font-family: var(--mt-sans); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--color-accent-on-light); font-weight: 700; padding: 18px 24px 18px 0; border-bottom: 1px solid var(--mt-border); align-self: start; }
.mt-info-consult__dl dd { margin: 0; font-family: var(--mt-serif); font-size: 16px; line-height: 24px; color: var(--mt-ink); padding: 18px 0; border-bottom: 1px solid var(--mt-border); }
.mt-info-consult__dl dd small { font-family: var(--mt-mono); font-size: 12px; color: var(--mt-slate); display: block; margin-top: 4px; letter-spacing: .04em; }
@media (max-width: 1023px) { .mt-info-consult__grid { grid-template-columns: 1fr; gap: 24px; } .mt-info-consult__dl { grid-template-columns: 140px 1fr; } .mt-info-consult h3 { font-size: 24px; } }
@media (max-width: 767px)  { .mt-info-consult__dl { grid-template-columns: 1fr; } .mt-info-consult__dl dt { padding: 14px 0 4px; border-bottom: none; } .mt-info-consult__dl dd { padding: 0 0 14px; } }

/* --- Newsletter form -------------------------------------- */
.mt-newsletter { padding-block: 80px; background: var(--mt-cream); border-top: 1px solid var(--mt-border); }
.mt-newsletter__grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: center; max-width: var(--mt-max-width); margin-inline: auto; }
.mt-newsletter h3 { font-family: var(--mt-serif); font-size: 30px; line-height: 1.2; font-weight: 500; color: var(--mt-navy); letter-spacing: -0.015em; margin: 0 0 12px; }
.mt-newsletter h3 em { font-style: italic; color: var(--color-accent-on-light); font-weight: 500; }
.mt-newsletter p { font-family: var(--mt-serif); font-size: 16px; line-height: 25px; color: var(--mt-slate); margin: 0; }
.mt-newsletter-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.mt-newsletter-form__field { display: flex; flex-direction: column; gap: 6px; }
.mt-newsletter-form__field--full { grid-column: 1 / -1; }
.mt-newsletter-form label { font-family: var(--mt-sans); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--mt-slate); font-weight: 700; }
.mt-newsletter-form input[type=text], .mt-newsletter-form input[type=email] { font-family: var(--mt-sans); font-size: 15px; padding: 12px 14px; border: 1px solid var(--mt-border); background: var(--mt-ivory); color: var(--mt-ink); outline: none; }
.mt-newsletter-form input:focus { border-color: var(--mt-gold); }
.mt-newsletter-form__consent { display: flex; gap: 10px; align-items: flex-start; font-family: var(--mt-sans); font-size: 13px; color: var(--mt-slate); line-height: 1.5; }
.mt-newsletter-form__consent label { text-transform: none; letter-spacing: 0; font-size: 13px; color: var(--mt-slate); font-weight: 400; }
.mt-newsletter-form__consent a { color: var(--color-accent-on-light); text-decoration: underline; }
.mt-newsletter-form button { font-family: var(--mt-sans); font-size: 14px; font-weight: 600; padding: 13px 20px; background: var(--mt-navy); color: var(--color-accent-on-dark); border: 1.5px solid var(--mt-navy); border-radius: 999px; cursor: pointer; letter-spacing: .02em; }
.mt-newsletter-form button:hover { background: var(--mt-gold); color: var(--mt-navy); border-color: var(--mt-gold); }
@media (max-width: 1023px) { .mt-newsletter__grid { grid-template-columns: 1fr; gap: 24px; } }
@media (max-width: 767px)  { .mt-newsletter-form { grid-template-columns: 1fr; } }

/* --- Social icon row -------------------------------------- */
.mt-social-row { display: flex; gap: 10px; }
.mt-social-row a { width: 32px; height: 32px; border: 1px solid #2A3D54; display: inline-flex; align-items: center; justify-content: center; color: #CFC3A8; text-decoration: none; font-family: var(--mt-sans); font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.mt-social-row a:hover { border-color: var(--mt-gold); color: var(--color-accent-on-dark); }

/* --- FAQ category divider --------------------------------- */
.mt-faq-cat { font-family: var(--mt-sans); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--color-accent-on-light); font-weight: 700; margin: 36px 0 0; padding-bottom: 14px; border-bottom: 1.5px solid var(--mt-gold); }
.mt-faq-cat:first-of-type { margin-top: 8px; }

/* --- Hero gutter wrapper ---------------------------------- */
.mt-page-pad { padding-inline: var(--mt-gutter); }
