/* Comércio Colaborativo — design system próprio (mobile-first).
   Paleta: verde-petróleo (principal) + laranja (acento). Nunca o roxo do OLX. */

:root {
  --cor-principal: #0f6f6b;
  --cor-principal-escura: #0a4f4c;
  --cor-principal-clara: #e3f2f1;
  --cor-acento: #ff8a3d;
  --cor-acento-escura: #e06f1f;

  --cor-fundo: #f7f8f7;
  --cor-superficie: #ffffff;
  --cor-borda: #e1e5e4;
  --cor-texto: #1a2321;
  --cor-texto-suave: #5c6b68;
  --cor-texto-fraco: #8a9895;

  --cor-sucesso: #1e8e5a;
  --cor-erro: #d64545;
  --cor-erro-fundo: #fdecec;

  --raio: 12px;
  --raio-lg: 20px;
  --sombra: 0 1px 2px rgba(10, 40, 38, 0.05), 0 2px 8px rgba(10, 40, 38, 0.05);
  --sombra-lg: 0 12px 32px -8px rgba(10, 60, 56, 0.18), 0 4px 10px -4px rgba(10, 40, 38, 0.08);
  --gutter: 16px;
  --fonte: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --hero-fundo: radial-gradient(1200px 500px at 85% -10%, rgba(255, 162, 97, 0.28), transparent 60%),
                radial-gradient(900px 480px at 0% 110%, rgba(53, 179, 172, 0.35), transparent 60%),
                linear-gradient(135deg, #0d6763 0%, #083d3a 100%);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) {
    --cor-principal: #35b3ac;
    --cor-principal-escura: #1e8b85;
    --cor-principal-clara: #113330;
    --cor-acento: #ffa561;
    --cor-acento-escura: #ff8a3d;

    --cor-fundo: #101513;
    --cor-superficie: #171f1c;
    --cor-borda: #283330;
    --cor-texto: #eef3f1;
    --cor-texto-suave: #a9b8b4;
    --cor-texto-fraco: #74847f;

    --cor-erro-fundo: #3a1d1d;
  }
}

:root[data-tema="escuro"] {
  --cor-principal: #35b3ac;
  --cor-principal-escura: #1e8b85;
  --cor-principal-clara: #113330;
  --cor-acento: #ffa561;
  --cor-acento-escura: #ff8a3d;
  --cor-fundo: #101513;
  --cor-superficie: #171f1c;
  --cor-borda: #283330;
  --cor-texto: #eef3f1;
  --cor-texto-suave: #a9b8b4;
  --cor-texto-fraco: #74847f;
  --cor-erro-fundo: #3a1d1d;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--fonte);
  background: var(--cor-fundo);
  color: var(--cor-texto);
  line-height: 1.5;
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }

img { max-width: 100%; display: block; }

button, input, select, textarea { font-family: inherit; font-size: inherit; }

.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;
}

.pular-link {
  position: absolute; left: -999px; top: 0; background: var(--cor-principal); color: #fff;
  padding: 10px 16px; z-index: 100; border-radius: 0 0 var(--raio) 0;
}
.pular-link:focus { left: 0; }

:focus-visible {
  outline: 3px solid var(--cor-acento);
  outline-offset: 2px;
}

/* ===== Topo ===== */
.topo {
  background: var(--cor-superficie);
  border-bottom: 1px solid var(--cor-borda);
  position: sticky; top: 0; z-index: 40;
}
.topo-container {
  max-width: 1200px; margin: 0 auto; padding: 12px var(--gutter);
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
}
.logo {
  display: flex; align-items: center; gap: 8px;
  font-size: 1.1rem; font-weight: 500; color: var(--cor-principal-escura);
  white-space: nowrap;
}
.logo strong { color: var(--cor-acento-escura); font-weight: 800; }

.busca-form {
  display: flex; flex: 1 1 260px; min-width: 0; gap: 0;
  border: 1.5px solid var(--cor-borda); border-radius: var(--raio); overflow: hidden;
  background: var(--cor-superficie);
}
.busca-form input[type="search"] {
  flex: 1; min-width: 0; border: none; padding: 10px 12px; background: transparent; color: var(--cor-texto);
}
.busca-form input[type="search"]:focus { outline: none; }
.busca-form select {
  border: none; border-left: 1px solid var(--cor-borda); background: var(--cor-fundo);
  padding: 0 8px; color: var(--cor-texto-suave); max-width: 130px;
}
.busca-form button {
  display: flex; align-items: center; gap: 6px; border: none; background: var(--cor-principal);
  color: #fff; padding: 0 16px; cursor: pointer; font-weight: 600;
}
.busca-form button:hover { background: var(--cor-principal-escura); }

.topo-nav { display: flex; align-items: center; gap: 18px; margin-left: auto; }
.nav-link { display: flex; flex-direction: column; align-items: center; font-size: 0.72rem; color: var(--cor-texto-suave); gap: 2px; }
.nav-link:hover { color: var(--cor-principal); }
.nav-tema { background: none; border: 0; padding: 0; cursor: pointer; font: inherit; font-size: 0.72rem; }
.nav-tema .tema-sol, .nav-tema[aria-pressed="true"] .tema-lua { display: none; }
.nav-tema[aria-pressed="true"] .tema-sol { display: block; }
.btn-anunciar {
  background: var(--cor-acento); color: #fff; padding: 10px 16px; border-radius: var(--raio);
  font-weight: 700; white-space: nowrap;
}
.btn-anunciar:hover { background: var(--cor-acento-escura); }

/* ===== Layout geral ===== */
main { max-width: 1200px; margin: 0 auto; padding: var(--gutter); min-height: 60vh; }

.secao-titulo { font-size: 1.3rem; font-weight: 700; margin: 24px 0 12px; color: var(--cor-principal-escura); }

/* ===== Hero / Home ===== */
.hero {
  background: linear-gradient(135deg, var(--cor-principal) 0%, var(--cor-principal-escura) 100%);
  color: #fff; border-radius: var(--raio-lg); padding: 40px 24px; margin-top: 8px;
  text-align: center;
}
.hero h1 { font-size: 1.8rem; margin: 0 0 8px; }
.hero p { margin: 0 0 20px; opacity: 0.92; }
.hero-busca {
  display: flex; max-width: 560px; margin: 0 auto; background: #fff; border-radius: var(--raio);
  overflow: hidden; box-shadow: var(--sombra-lg);
}
.hero-busca input {
  flex: 1; border: none; padding: 14px 16px; color: var(--cor-texto); min-width: 0;
}
.hero-busca input:focus { outline: none; }
.hero-busca button {
  border: none; background: var(--cor-acento); color: #fff; padding: 0 20px; font-weight: 700; cursor: pointer;
}
.hero-busca button:hover { background: var(--cor-acento-escura); }

.hero-stats { display: flex; justify-content: center; gap: 28px; margin-top: 20px; flex-wrap: wrap; font-size: 0.85rem; }
.hero-stats strong { display: block; font-size: 1.3rem; }

.grade-categorias {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 12px;
}
.card-categoria {
  background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio);
  padding: 16px 10px; text-align: center; transition: transform .15s, box-shadow .15s, border-color .15s;
}
.card-categoria:hover { transform: translateY(-2px); box-shadow: var(--sombra); border-color: var(--cor-principal); }
.card-categoria .icone { font-size: 1.8rem; display: block; margin-bottom: 6px; }
.card-categoria .nome { font-size: 0.82rem; font-weight: 600; }

/* ===== Grade de anúncios ===== */
.grade-anuncios {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px;
}
.card-anuncio {
  background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio);
  overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .15s, transform .15s;
  position: relative;
}
.card-anuncio:hover { box-shadow: var(--sombra-lg); transform: translateY(-2px); }
.card-anuncio .thumb-wrap { aspect-ratio: 4/3; overflow: hidden; background: var(--cor-fundo); position: relative; }
.card-anuncio .thumb-wrap img { width: 100%; height: 100%; object-fit: cover; }
.card-anuncio .corpo { padding: 12px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.card-anuncio .preco { font-size: 1.1rem; font-weight: 800; color: var(--cor-principal-escura); }
.card-anuncio .titulo { font-size: 0.92rem; font-weight: 500; color: var(--cor-texto); }
.card-anuncio .local { font-size: 0.78rem; color: var(--cor-texto-fraco); margin-top: auto; padding-top: 6px; }
.btn-favorito {
  position: absolute; top: 8px; right: 8px; background: rgba(255,255,255,0.92); border: none; border-radius: 50%;
  width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; cursor: pointer;
  box-shadow: var(--sombra); color: var(--cor-texto-suave);
}
.btn-favorito.ativo { color: var(--cor-erro); }
.btn-favorito:hover { color: var(--cor-erro); }

/* ===== Busca / filtros ===== */
.layout-busca { display: grid; grid-template-columns: 1fr; gap: 20px; align-items: start; }
@media (min-width: 860px) {
  .layout-busca { grid-template-columns: 240px 1fr; }
}
.filtros {
  background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio);
  padding: 16px; display: flex; flex-direction: column; gap: 16px; align-self: start;
}
.filtro-grupo { display: flex; flex-direction: column; gap: 6px; }
.filtro-grupo label { font-size: 0.8rem; font-weight: 700; color: var(--cor-texto-suave); text-transform: uppercase; letter-spacing: .03em; }
.filtro-grupo select, .filtro-grupo input {
  padding: 9px 10px; border: 1px solid var(--cor-borda); border-radius: var(--raio); background: var(--cor-fundo); color: var(--cor-texto);
}
.filtro-preco { display: flex; gap: 8px; }
.filtro-preco input { width: 100%; min-width: 0; }
.btn-limpar-filtros {
  background: none; border: 1px solid var(--cor-borda); border-radius: var(--raio); padding: 8px; cursor: pointer;
  color: var(--cor-texto-suave); font-weight: 600;
}
.btn-limpar-filtros:hover { border-color: var(--cor-erro); color: var(--cor-erro); }

.resultados-cabecalho { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.resultados-contagem { color: var(--cor-texto-suave); font-size: 0.9rem; }
.chips-ativos { display: flex; gap: 6px; flex-wrap: wrap; }
.chip {
  background: var(--cor-principal-clara); color: var(--cor-principal-escura); border-radius: 999px;
  padding: 4px 10px; font-size: 0.78rem; display: flex; align-items: center; gap: 6px;
}
.chip button { border: none; background: none; color: inherit; cursor: pointer; font-weight: 800; }

.estado-vazio {
  text-align: center; padding: 48px 16px; color: var(--cor-texto-suave);
}
.estado-vazio .icone { font-size: 2.4rem; margin-bottom: 8px; }

.paginacao { display: flex; justify-content: center; gap: 6px; margin: 24px 0; flex-wrap: wrap; }
.paginacao button {
  border: 1px solid var(--cor-borda); background: var(--cor-superficie); color: var(--cor-texto);
  border-radius: var(--raio); padding: 8px 12px; cursor: pointer; min-width: 40px;
}
.paginacao button[aria-current="page"] { background: var(--cor-principal); color: #fff; border-color: var(--cor-principal); }
.paginacao button:disabled { opacity: 0.4; cursor: not-allowed; }
.paginacao .pag-reticencias { align-self: center; min-width: 20px; text-align: center; color: var(--cor-texto-fraco); }

/* ===== Detalhe do anúncio ===== */
.detalhe-layout { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 900px) {
  .detalhe-layout { grid-template-columns: 1.6fr 1fr; }
}
.galeria-principal {
  aspect-ratio: 4/3; border-radius: var(--raio-lg); overflow: hidden; background: var(--cor-fundo); border: 1px solid var(--cor-borda);
}
.galeria-principal img { width: 100%; height: 100%; object-fit: cover; }
.galeria-thumbs { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.galeria-thumbs button {
  width: 64px; height: 48px; border-radius: 6px; overflow: hidden; border: 2px solid transparent; padding: 0; cursor: pointer; background: var(--cor-fundo);
}
.galeria-thumbs button.ativo { border-color: var(--cor-principal); }
.galeria-thumbs img { width: 100%; height: 100%; object-fit: cover; }

.detalhe-titulo { font-size: 1.4rem; font-weight: 700; margin: 20px 0 4px; }
.detalhe-preco { font-size: 1.8rem; font-weight: 800; color: var(--cor-principal-escura); margin: 8px 0; }
.detalhe-meta { color: var(--cor-texto-fraco); font-size: 0.85rem; display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 16px; }
.detalhe-descricao { white-space: pre-line; line-height: 1.7; margin-bottom: 20px; }

.caracteristicas-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; margin-bottom: 20px; }
.caracteristica { background: var(--cor-fundo); border-radius: var(--raio); padding: 10px 12px; }
.caracteristica .chave { font-size: 0.72rem; color: var(--cor-texto-fraco); text-transform: uppercase; }
.caracteristica .valor { font-weight: 600; }

.painel-lateral { display: flex; flex-direction: column; gap: 16px; }
.card-anunciante, .card-acoes {
  background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio-lg); padding: 18px;
}
.anunciante-cabecalho { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.avatar-iniciais {
  width: 44px; height: 44px; border-radius: 50%; background: var(--cor-principal); color: #fff;
  display: flex; align-items: center; justify-content: center; font-weight: 700;
}
.card-acoes { display: flex; flex-direction: column; gap: 10px; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 16px; border-radius: var(--raio); font-weight: 700; cursor: pointer; border: none; text-align: center; }
.btn-primario { background: var(--cor-principal); color: #fff; }
.btn-primario:hover { background: var(--cor-principal-escura); }
.btn-secundario { background: var(--cor-principal-clara); color: var(--cor-principal-escura); }
.btn-secundario:hover { background: var(--cor-borda); }
.btn-acento { background: var(--cor-acento); color: #fff; }
.btn-acento:hover { background: var(--cor-acento-escura); }
.btn-fantasma { background: transparent; border: 1px solid var(--cor-borda); color: var(--cor-texto-suave); }
.btn-fantasma:hover { border-color: var(--cor-erro); color: var(--cor-erro); }
.btn-bloco { width: 100%; }
.btn:disabled { opacity: .5; cursor: not-allowed; }

.telefone-revelado { font-size: 1.2rem; font-weight: 800; text-align: center; padding: 10px; background: var(--cor-principal-clara); border-radius: var(--raio); color: var(--cor-principal-escura); }

/* ===== Formulário anunciar ===== */
.form-anunciar { max-width: 680px; margin: 0 auto; }
.etapas-indicador { display: flex; gap: 8px; margin-bottom: 20px; }
.etapa-bolha { flex: 1; height: 6px; border-radius: 999px; background: var(--cor-borda); }
.etapa-bolha.ativa, .etapa-bolha.concluida { background: var(--cor-principal); }

.campo { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.campo label { font-weight: 600; font-size: 0.9rem; }
.campo .ajuda { font-size: 0.78rem; color: var(--cor-texto-fraco); }
.campo input, .campo select, .campo textarea {
  padding: 11px 12px; border: 1px solid var(--cor-borda); border-radius: var(--raio); background: var(--cor-superficie); color: var(--cor-texto);
}
.campo textarea { min-height: 120px; resize: vertical; }
.campo.erro input, .campo.erro select, .campo.erro textarea { border-color: var(--cor-erro); }
.campo .msg-erro { color: var(--cor-erro); font-size: 0.8rem; }
.campo-linha { display: flex; gap: 12px; }
.campo-linha .campo { flex: 1; }

.lista-fotos-url { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.linha-foto-url { display: flex; gap: 8px; }
.linha-foto-url input { flex: 1; }
.preview-fotos { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); gap: 8px; margin-top: 10px; }
.preview-fotos img { aspect-ratio: 1; object-fit: cover; border-radius: 6px; border: 1px solid var(--cor-borda); }

.form-nav { display: flex; justify-content: space-between; margin-top: 20px; gap: 10px; }

.card-revisao { background: var(--cor-fundo); border-radius: var(--raio); padding: 16px; margin-bottom: 16px; }
.card-revisao dt { font-size: 0.75rem; color: var(--cor-texto-fraco); text-transform: uppercase; margin-top: 10px; }
.card-revisao dd { margin: 2px 0 0; font-weight: 600; }

/* ===== Páginas institucionais / conta / favoritos ===== */
.pagina-simples { max-width: 720px; margin: 0 auto; line-height: 1.8; }
.pagina-simples h1 { color: var(--cor-principal-escura); }

.aviso-protótipo, .aviso-prototipo {
  background: var(--cor-principal-clara); color: var(--cor-principal-escura); border-radius: var(--raio);
  padding: 14px 16px; margin-bottom: 20px; font-size: 0.9rem; border: 1px dashed var(--cor-principal);
}

/* ===== Modal ===== */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(10, 20, 18, 0.55); display: flex; align-items: center; justify-content: center;
  z-index: 100; padding: 16px;
}
.modal-caixa {
  background: var(--cor-superficie); border-radius: var(--raio-lg); padding: 24px; max-width: 420px; width: 100%;
  box-shadow: var(--sombra-lg);
}
.modal-caixa h2 { margin-top: 0; }
.modal-acoes { display: flex; gap: 10px; justify-content: flex-end; margin-top: 18px; }

/* ===== Toast ===== */
.toast-raiz { position: fixed; bottom: 16px; left: 50%; transform: translateX(-50%); z-index: 200; display: flex; flex-direction: column; gap: 8px; }
.toast {
  background: var(--cor-texto); color: var(--cor-fundo); padding: 12px 18px; border-radius: var(--raio); font-size: 0.88rem;
  box-shadow: var(--sombra-lg); animation: toast-in .2s ease-out;
}
.toast.erro { background: var(--cor-erro); color: #fff; }
.toast.sucesso { background: var(--cor-sucesso); color: #fff; }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* ===== Rodapé ===== */
.rodape { background: var(--cor-superficie); border-top: 1px solid var(--cor-borda); margin-top: 40px; }
.rodape-container { max-width: 1200px; margin: 0 auto; padding: 32px var(--gutter) 16px; display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 700px) { .rodape-container { grid-template-columns: 2fr 1fr 1fr; } }
.rodape-col h3 { font-size: 0.85rem; text-transform: uppercase; color: var(--cor-texto-fraco); margin-bottom: 10px; }
.rodape-col a { display: block; padding: 4px 0; color: var(--cor-texto-suave); font-size: 0.9rem; }
.rodape-col a:hover { color: var(--cor-principal); }
.rodape-col p { color: var(--cor-texto-fraco); font-size: 0.85rem; }
.rodape-copy { text-align: center; color: var(--cor-texto-fraco); font-size: 0.78rem; padding: 12px var(--gutter) 24px; }

/* ===== Skeleton / loading ===== */
.skeleton { background: linear-gradient(90deg, var(--cor-borda) 25%, var(--cor-fundo) 37%, var(--cor-borda) 63%); background-size: 400% 100%; animation: skeleton-anim 1.4s ease infinite; border-radius: var(--raio); }
@keyframes skeleton-anim { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }
.skeleton-card { height: 220px; }

/* ===== Utilidades responsivas ===== */
@media (max-width: 640px) {
  .topo-nav { order: 3; width: 100%; justify-content: space-around; }
  .busca-form { order: 2; width: 100%; }
  .logo { order: 1; }
  .hero h1 { font-size: 1.4rem; }
}

/* ===== Autenticação: botão Google, menu do usuário, badge de não lidas ===== */
.auth-area { position: relative; display: flex; align-items: center; }
.btn-entrar {
  background: var(--cor-principal); color: #fff; padding: 9px 14px; border-radius: var(--raio);
  font-weight: 700; border: none; cursor: pointer; white-space: nowrap; font-size: 0.85rem;
}
.btn-entrar:hover { background: var(--cor-principal-escura); }
.usuario-chip {
  display: flex; align-items: center; gap: 8px; border: 1px solid var(--cor-borda); border-radius: 999px;
  padding: 4px 10px 4px 4px; background: var(--cor-superficie); cursor: pointer; position: relative;
}
.usuario-chip img, .usuario-chip .avatar-iniciais-mini {
  width: 28px; height: 28px; border-radius: 50%; object-fit: cover;
}
.avatar-iniciais-mini {
  display: flex; align-items: center; justify-content: center; background: var(--cor-principal); color: #fff;
  font-size: 0.7rem; font-weight: 700;
}
.usuario-chip .nome-curto { font-size: 0.82rem; font-weight: 600; max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.badge-nao-lidas {
  position: absolute; top: -4px; right: -4px; background: var(--cor-erro); color: #fff; border-radius: 999px;
  font-size: 0.65rem; font-weight: 800; min-width: 16px; height: 16px; display: flex; align-items: center; justify-content: center; padding: 0 3px;
}
.menu-usuario {
  position: absolute; top: calc(100% + 8px); right: 0; background: var(--cor-superficie); border: 1px solid var(--cor-borda);
  border-radius: var(--raio); box-shadow: var(--sombra-lg); min-width: 200px; z-index: 60; overflow: hidden;
}
.menu-usuario a, .menu-usuario button {
  display: block; width: 100%; text-align: left; padding: 10px 14px; border: none; background: none; cursor: pointer;
  color: var(--cor-texto); font-size: 0.88rem;
}
.menu-usuario a:hover, .menu-usuario button:hover { background: var(--cor-fundo); }
.menu-usuario .separador { border-top: 1px solid var(--cor-borda); margin: 4px 0; }

/* ===== Login (modal Google / dev) ===== */
.login-caixa { text-align: center; }
.login-caixa .g-botao-slot { min-height: 44px; display: flex; align-items: center; justify-content: center; margin: 16px 0; }
.login-dev-lista { display: flex; flex-direction: column; gap: 8px; margin: 12px 0; max-height: 240px; overflow-y: auto; }
.login-dev-item {
  display: flex; align-items: center; gap: 10px; border: 1px solid var(--cor-borda); border-radius: var(--raio);
  padding: 10px; cursor: pointer; background: var(--cor-superficie); text-align: left;
}
.login-dev-item:hover { border-color: var(--cor-principal); background: var(--cor-principal-clara); }
.login-dev-separador { display: flex; align-items: center; gap: 10px; color: var(--cor-texto-fraco); font-size: 0.78rem; margin: 14px 0; }
.login-dev-separador::before, .login-dev-separador::after { content: ''; flex: 1; height: 1px; background: var(--cor-borda); }
.aviso-dev { background: var(--cor-erro-fundo); color: var(--cor-erro); border-radius: var(--raio); padding: 10px 12px; font-size: 0.8rem; margin-bottom: 12px; text-align: left; }

/* ===== Selo de destaque ===== */
.selo-destaque {
  position: absolute; top: 8px; left: 8px; background: var(--cor-acento); color: #fff; font-size: 0.7rem;
  font-weight: 800; padding: 4px 8px; border-radius: 999px; z-index: 2; letter-spacing: .02em;
}

/* ===== Upload de fotos real ===== */
.upload-fotos-area {
  border: 2px dashed var(--cor-borda); border-radius: var(--raio-lg); padding: 24px; text-align: center; cursor: pointer;
  color: var(--cor-texto-suave); margin-bottom: 12px;
}
.upload-fotos-area:hover { border-color: var(--cor-principal); color: var(--cor-principal); }
.upload-fotos-area input[type="file"] { display: none; }
.grade-fotos-upload { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 10px; margin-top: 10px; }
.foto-upload-item { position: relative; aspect-ratio: 1; border-radius: var(--raio); overflow: hidden; border: 1px solid var(--cor-borda); }
.foto-upload-item img { width: 100%; height: 100%; object-fit: cover; }
.foto-upload-item .capa-tag {
  position: absolute; bottom: 0; left: 0; right: 0; background: rgba(15,111,107,0.9); color: #fff;
  font-size: 0.65rem; text-align: center; padding: 3px; font-weight: 700;
}
.foto-upload-item .btn-remover-foto {
  position: absolute; top: 4px; right: 4px; background: rgba(0,0,0,0.6); color: #fff; border: none; border-radius: 50%;
  width: 22px; height: 22px; cursor: pointer; font-size: 0.8rem; line-height: 1;
}
.foto-upload-item.enviando { opacity: 0.5; }

/* ===== Chat / mensagens ===== */
.layout-mensagens { display: grid; grid-template-columns: 1fr; gap: 0; border: 1px solid var(--cor-borda); border-radius: var(--raio-lg); overflow: hidden; min-height: 60vh; background: var(--cor-superficie); }
@media (min-width: 760px) {
  .layout-mensagens { grid-template-columns: 300px 1fr; min-height: 70vh; }
}
.lista-conversas { border-right: 1px solid var(--cor-borda); overflow-y: auto; }
.item-conversa { display: flex; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--cor-borda); cursor: pointer; position: relative; }
.item-conversa:hover, .item-conversa.ativa { background: var(--cor-principal-clara); }
.item-conversa img { width: 44px; height: 44px; border-radius: 8px; object-fit: cover; flex-shrink: 0; background: var(--cor-fundo); }
.item-conversa .info { min-width: 0; flex: 1; }
.item-conversa .nome { font-weight: 700; font-size: 0.88rem; }
.item-conversa .anuncio-titulo { font-size: 0.76rem; color: var(--cor-texto-fraco); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-conversa .previa { font-size: 0.8rem; color: var(--cor-texto-suave); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-conversa .badge-nao-lidas { position: static; margin-left: auto; align-self: center; }

.painel-thread { display: flex; flex-direction: column; min-height: 0; }
.thread-cabecalho { padding: 12px 16px; border-bottom: 1px solid var(--cor-borda); font-weight: 700; display: flex; align-items: center; gap: 10px; }
.thread-mensagens { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.bolha-mensagem { max-width: 75%; padding: 10px 14px; border-radius: 14px; font-size: 0.9rem; line-height: 1.4; white-space: pre-wrap; overflow-wrap: anywhere; }
.bolha-mensagem.minha { align-self: flex-end; background: var(--cor-principal); color: #fff; border-bottom-right-radius: 4px; }
.bolha-mensagem.outra { align-self: flex-start; background: var(--cor-fundo); border-bottom-left-radius: 4px; }
.bolha-mensagem .hora { display: block; font-size: 0.68rem; opacity: 0.75; margin-top: 4px; }
.thread-form { display: flex; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--cor-borda); }
.thread-form textarea { flex: 1; resize: none; min-height: 42px; max-height: 120px; padding: 10px 12px; border: 1px solid var(--cor-borda); border-radius: var(--raio); }
.thread-form button { align-self: flex-end; }

/* ===== Destaque (anunciar) ===== */
.card-plano { border: 2px solid var(--cor-borda); border-radius: var(--raio-lg); padding: 18px; margin-bottom: 12px; cursor: pointer; }
.card-plano.selecionado { border-color: var(--cor-principal); background: var(--cor-principal-clara); }
.card-plano h3 { margin: 0 0 6px; }
.card-plano .preco-plano { font-size: 1.3rem; font-weight: 800; color: var(--cor-principal-escura); }

/* ===== Checkout de ensaio ===== */
.checkout-caixa { max-width: 480px; margin: 0 auto; background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio-lg); padding: 28px; text-align: center; }
.tag-ensaio { display: inline-block; background: var(--cor-erro-fundo); color: var(--cor-erro); font-size: 0.72rem; font-weight: 800; padding: 4px 10px; border-radius: 999px; margin-bottom: 14px; letter-spacing: .03em; }
.checkout-valor { font-size: 2rem; font-weight: 800; color: var(--cor-principal-escura); margin: 10px 0; }

/* ===== Moderação ===== */
.tabs-moderacao { display: flex; gap: 6px; margin-bottom: 16px; flex-wrap: wrap; }
.tabs-moderacao button {
  border: 1px solid var(--cor-borda); background: var(--cor-superficie); padding: 8px 14px; border-radius: 999px;
  cursor: pointer; font-size: 0.85rem; font-weight: 600; color: var(--cor-texto-suave);
}
.tabs-moderacao button.ativa { background: var(--cor-principal); color: #fff; border-color: var(--cor-principal); }
.lista-denuncias { display: flex; flex-direction: column; gap: 12px; }
.card-denuncia { background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio); padding: 16px; }
.card-denuncia .cabecalho { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.card-denuncia .motivo-tag { background: var(--cor-erro-fundo); color: var(--cor-erro); font-size: 0.72rem; font-weight: 700; padding: 3px 9px; border-radius: 999px; }
.card-denuncia .estado-tag { font-size: 0.72rem; font-weight: 700; padding: 3px 9px; border-radius: 999px; background: var(--cor-borda); color: var(--cor-texto-suave); }
.card-denuncia .acoes-moderacao { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.card-denuncia .acoes-moderacao .btn { padding: 8px 12px; font-size: 0.82rem; }

.aviso-bloqueio { background: var(--cor-erro-fundo); color: var(--cor-erro); border-radius: var(--raio); padding: 14px 16px; margin-bottom: 20px; font-size: 0.9rem; }
.aviso-oculto { font-weight: 600; }
.aviso-bloqueio .ic { flex-shrink: 0; }

/* =====================================================================================
   Camada premium (29/09/2026, ATIV#7179) — tipografia, ícones SVG, hero de posicionamento
   ("facilitador de negociações") e acabamento de cards. Sobrepõe as regras acima.
   ===================================================================================== */
body { letter-spacing: -0.005em; -webkit-font-smoothing: antialiased; }
h1, h2, h3 { letter-spacing: -0.02em; }
.ic { flex-shrink: 0; vertical-align: -0.18em; }

/* Topo em vidro */
.topo {
  background: color-mix(in srgb, var(--cor-superficie) 82%, transparent);
  backdrop-filter: saturate(1.6) blur(14px); -webkit-backdrop-filter: saturate(1.6) blur(14px);
}
.logo { font-size: 1.12rem; font-weight: 600; letter-spacing: -0.02em; }
.logo img { border-radius: 10px; box-shadow: 0 4px 12px -4px rgba(10, 70, 67, 0.45); }
.busca-form { border-radius: 999px; border-width: 1px; box-shadow: var(--sombra); transition: box-shadow .2s, border-color .2s; }
.busca-form:focus-within { border-color: var(--cor-principal); box-shadow: 0 0 0 4px color-mix(in srgb, var(--cor-principal) 16%, transparent); }
.busca-form input[type="search"] { padding: 11px 18px; }
.busca-form button { border-radius: 999px; margin: 4px; padding: 0 18px; }
.busca-form select { background: transparent; }
.nav-link { gap: 3px; font-weight: 500; }
.btn-anunciar {
  display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 10px 18px;
  background: linear-gradient(135deg, #ff9a52, var(--cor-acento-escura));
  box-shadow: 0 8px 18px -8px rgba(224, 111, 31, 0.7); transition: transform .15s, box-shadow .15s;
}
.btn-anunciar:hover { transform: translateY(-1px); box-shadow: 0 12px 22px -8px rgba(224, 111, 31, 0.8); }

/* Botões */
.btn { border-radius: 999px; transition: transform .15s, box-shadow .15s, background .15s; }
.btn-primario { background: linear-gradient(135deg, #13847e, var(--cor-principal-escura)); box-shadow: 0 8px 18px -10px rgba(10, 79, 76, 0.8); }
.btn-primario:hover { transform: translateY(-1px); }
.btn-acento { background: linear-gradient(135deg, #ff9a52, var(--cor-acento-escura)); }

/* Hero de posicionamento */
.hero {
  position: relative; overflow: hidden; text-align: left;
  background: var(--hero-fundo); border-radius: 28px; padding: 44px 24px; margin-top: 12px;
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; align-items: center;
  box-shadow: 0 30px 60px -30px rgba(8, 61, 58, 0.55);
}
.hero-texto, .hero-busca input { min-width: 0; }
.hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: radial-gradient(rgba(255,255,255,0.09) 1px, transparent 1px); background-size: 22px 22px;
  mask-image: linear-gradient(120deg, #000 10%, transparent 70%); -webkit-mask-image: linear-gradient(120deg, #000 10%, transparent 70%);
}
.hero-texto { position: relative; z-index: 1; }
.hero-selo {
  display: inline-flex; align-items: center; gap: 7px; font-size: 0.78rem; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; padding: 6px 12px; border-radius: 999px; color: #ffd9bd;
  background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.16);
}
.hero h1 { font-size: clamp(1.9rem, 4.6vw, 3.1rem); line-height: 1.08; margin: 16px 0 14px; font-weight: 800; max-width: 16ch; }
.hero h1 em { font-style: normal; color: #ffb27a; }
.hero-sub { font-size: 1.06rem; line-height: 1.6; opacity: 0.9; max-width: 54ch; margin: 0 0 24px; }
.hero-busca {
  position: relative; align-items: center; margin: 0; max-width: 560px; border-radius: 999px; padding: 6px 6px 6px 16px;
  box-shadow: 0 20px 40px -18px rgba(0, 0, 0, 0.5);
}
.hero-busca .hero-busca-ic { color: #8a9895; }
.hero-busca input { padding: 12px 12px; background: transparent; color: #1a2321; }
.hero-busca button { border-radius: 999px; padding: 12px 24px; background: linear-gradient(135deg, #ff9a52, var(--cor-acento-escura)); }
.hero-stats { justify-content: flex-start; gap: 26px; margin-top: 26px; font-size: 0.82rem; }
.hero-stats > div { display: flex; align-items: center; gap: 10px; opacity: 0.95; }
.hero-stats > div .ic { width: 36px; height: 36px; padding: 8px; border-radius: 12px; background: rgba(255,255,255,0.1); color: #ffcfa9; }
.hero-stats strong { font-size: 1.25rem; line-height: 1.1; }

.hero-visual { position: relative; z-index: 1; display: none; justify-content: center; }
.radar { position: relative; width: 300px; aspect-ratio: 1; }
.radar-anel { position: absolute; inset: 0; margin: auto; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.22); }
.radar-anel.r1 { width: 100%; height: 100%; background: radial-gradient(circle, rgba(255,255,255,0.06), transparent 70%); }
.radar-anel.r2 { width: 66%; height: 66%; }
.radar-anel.r3 { width: 32%; height: 32%; border-color: rgba(255, 178, 122, 0.55); animation: radar-pulso 2.8s ease-out infinite; }
.radar-centro {
  position: absolute; inset: 0; margin: auto; width: 58px; height: 58px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; color: #fff;
  background: linear-gradient(135deg, #ff9a52, #e06f1f); box-shadow: 0 10px 30px -6px rgba(224, 111, 31, 0.8);
}
.radar-ponto {
  position: absolute; width: 38px; height: 38px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
  background: #fff; color: #0a4f4c; box-shadow: 0 10px 20px -8px rgba(0,0,0,0.45);
  animation: radar-flutua 5s ease-in-out infinite;
}
.radar-ponto.p1 { top: 6%; left: 20%; }
.radar-ponto.p2 { top: 22%; right: 2%; color: #e06f1f; animation-delay: -1.2s; }
.radar-ponto.p3 { bottom: 10%; right: 18%; animation-delay: -2.4s; }
.radar-ponto.p4 { bottom: 26%; left: 0; color: #e06f1f; animation-delay: -3.6s; }
@keyframes radar-pulso { 0% { transform: scale(0.8); opacity: 1; } 100% { transform: scale(3); opacity: 0; } }
@keyframes radar-flutua { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@media (prefers-reduced-motion: reduce) { .radar-anel.r3, .radar-ponto { animation: none; } }
@media (min-width: 900px) {
  .hero { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); padding: 64px 56px; }
  .hero-visual { display: flex; }
}

/* Seções */
.secao-titulo { display: flex; align-items: center; gap: 8px; font-size: 1.4rem; font-weight: 800; margin: 40px 0 16px; color: var(--cor-texto); }
.secao-titulo .ic { color: var(--cor-acento-escura); }
.secao-cabecalho { max-width: 640px; margin: 48px 0 20px; }
.secao-cabecalho .secao-titulo { margin: 6px 0 8px; font-size: clamp(1.4rem, 3vw, 1.9rem); }
.secao-sobretitulo { font-size: 0.78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--cor-acento-escura); }
.secao-lead { color: var(--cor-texto-suave); margin: 0; font-size: 1rem; }

.passos { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 760px) { .passos { grid-template-columns: repeat(3, 1fr); } }
.passo {
  position: relative; background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio-lg);
  padding: 24px; box-shadow: var(--sombra); transition: transform .2s, box-shadow .2s;
}
.passo:hover { transform: translateY(-3px); box-shadow: var(--sombra-lg); }
.passo-icone {
  width: 52px; height: 52px; border-radius: 16px; display: flex; align-items: center; justify-content: center;
  color: var(--cor-principal); background: var(--cor-principal-clara);
}
.passo:nth-child(3) .passo-icone { color: var(--cor-acento-escura); background: color-mix(in srgb, var(--cor-acento) 16%, transparent); }
.passo-num { position: absolute; top: 20px; right: 22px; font-size: 1.6rem; font-weight: 800; color: var(--cor-borda); }
.passo h3 { margin: 16px 0 6px; font-size: 1.08rem; }
.passo p { margin: 0; color: var(--cor-texto-suave); font-size: 0.93rem; }

/* Categorias */
.grade-categorias { grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); gap: 12px; }
.card-categoria {
  display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 20px 10px;
  border-radius: var(--raio-lg); cursor: pointer; color: var(--cor-texto);
}
.card-categoria .icone {
  width: 54px; height: 54px; margin: 0; border-radius: 16px; display: flex; align-items: center; justify-content: center;
  color: var(--cor-principal); background: var(--cor-principal-clara); transition: background .2s, color .2s;
}
.card-categoria:hover .icone { background: var(--cor-principal); color: #fff; }
.card-categoria .nome { line-height: 1.25; }

/* Cards de anúncio */
.card-anuncio { border-radius: var(--raio-lg); box-shadow: var(--sombra); }
.card-anuncio:hover { transform: translateY(-3px); }
.card-anuncio .thumb-wrap img { transition: transform .4s; }
.card-anuncio:hover .thumb-wrap img { transform: scale(1.04); }
.card-anuncio .corpo { padding: 14px; }
.card-anuncio .preco { font-size: 1.15rem; color: var(--cor-texto); }
.card-anuncio .local { display: flex; align-items: center; gap: 4px; }
.btn-favorito { backdrop-filter: blur(6px); }
.selo-destaque {
  display: inline-flex; align-items: center; gap: 4px;
  background: linear-gradient(135deg, #ff9a52, var(--cor-acento-escura)); box-shadow: 0 6px 14px -6px rgba(224,111,31,0.8);
}

/* Detalhe, estados vazios, menus */
.detalhe-meta span { display: inline-flex; align-items: center; gap: 5px; }
.detalhe-preco { color: var(--cor-texto); }
.estado-vazio .icone {
  width: 72px; height: 72px; margin: 0 auto 14px; border-radius: 22px; display: flex; align-items: center; justify-content: center;
  color: var(--cor-principal); background: var(--cor-principal-clara);
}
.menu-usuario a { display: flex; align-items: center; gap: 10px; }
.menu-usuario a .ic { color: var(--cor-texto-suave); }
.aviso-bloqueio, .card-acoes .ajuda { display: flex; align-items: center; gap: 8px; }
.upload-fotos-area { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.rodape-col a { display: flex; align-items: center; gap: 8px; }
.rodape-col a .ic { color: var(--cor-principal); }
.rodape-col p { max-width: 42ch; line-height: 1.6; }

@media (max-width: 640px) {
  .hero { padding: 32px 20px; border-radius: 22px; }
  .hero-stats { gap: 16px; }
  .hero-busca { padding-left: 12px; }
  .hero-busca button { padding: 11px 16px; }
  .busca-form .busca-rotulo { display: none; }
}

/* =====================================================================================
   Venda x compra + proximidade (29/09/2026, ATIV#7179)
   ===================================================================================== */
.hero-acoes { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.hero-acao {
  display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 999px;
  font-weight: 700; font-size: 0.9rem; color: #fff; background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.22); transition: background .15s;
}
.hero-acao:hover { background: rgba(255, 255, 255, 0.18); }
.hero-acao .ic { color: #ffcfa9; }

.barra-local {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 40px 0 18px; padding: 16px 18px;
  background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio-lg); box-shadow: var(--sombra);
}
.barra-local-ic {
  width: 44px; height: 44px; border-radius: 14px; display: flex; align-items: center; justify-content: center;
  color: #fff; background: linear-gradient(135deg, #ff9a52, var(--cor-acento-escura)); flex-shrink: 0;
}
.barra-local-texto { flex: 1; min-width: 200px; display: flex; flex-direction: column; }
.barra-local-texto span { color: var(--cor-texto-suave); font-size: 0.88rem; }
.ver-mais { margin: 14px 0 0; text-align: right; }
.ver-mais a { display: inline-flex; align-items: center; gap: 6px; color: var(--cor-principal); font-weight: 700; }
.cabecalho-procuras { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.cabecalho-procuras .secao-titulo { margin-bottom: 6px; }
.secao-perto .secao-lead { margin-bottom: 14px; }
.estado-vazio.compacto { padding: 28px 16px; background: var(--cor-superficie); border: 1px dashed var(--cor-borda); border-radius: var(--raio-lg); }

.card-anuncio .selo-tipo {
  position: absolute; top: 8px; right: 50px; z-index: 2;
  display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px; border-radius: 999px;
  font-size: 0.7rem; font-weight: 800; color: #fff; background: #0a4f4c; box-shadow: 0 6px 14px -6px rgba(10,79,76,0.8);
}
.card-anuncio.lado-compra { border-color: color-mix(in srgb, var(--cor-principal) 35%, var(--cor-borda)); }
.chip-prox {
  align-self: flex-start; display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 999px;
  font-size: 0.7rem; font-weight: 700; color: var(--cor-principal-escura); background: var(--cor-principal-clara);
}
.chip-prox.faixa-0 { color: #fff; background: var(--cor-principal); }

.tag-lado {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 20px; padding: 4px 11px; border-radius: 999px;
  font-size: 0.78rem; font-weight: 800;
}
.tag-lado.venda { color: var(--cor-principal-escura); background: var(--cor-principal-clara); }
.tag-lado.compra { color: #fff; background: #0a4f4c; }
.tag-lado + .detalhe-titulo { margin-top: 8px; }
.secao-contraparte {
  margin-top: 36px; padding: 24px; border-radius: var(--raio-lg);
  background: linear-gradient(135deg, var(--cor-principal-clara), transparent 70%); border: 1px solid var(--cor-borda);
}
.secao-contraparte .secao-sobretitulo { display: inline-flex; align-items: center; gap: 6px; }
.secao-contraparte .secao-lead { margin-bottom: 16px; }

.segmentado { display: flex; background: var(--cor-fundo); border: 1px solid var(--cor-borda); border-radius: 999px; padding: 3px; }
.segmentado button {
  flex: 1; border: none; background: none; padding: 7px 6px; border-radius: 999px; cursor: pointer;
  font-size: 0.8rem; font-weight: 700; color: var(--cor-texto-suave);
}
.segmentado button.ativo { background: var(--cor-principal); color: #fff; }
.btn-local-filtro {
  display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-radius: var(--raio); cursor: pointer; text-align: left;
  border: 1px solid var(--cor-borda); background: var(--cor-fundo); color: var(--cor-texto); font-weight: 600;
}
.btn-local-filtro .ic { color: var(--cor-acento-escura); }

.tipo-escolha { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-bottom: 8px; }
.tipo-opcao {
  display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 12px; align-items: center; text-align: left;
  padding: 16px; border-radius: var(--raio-lg); border: 2px solid var(--cor-borda); background: var(--cor-superficie);
  color: var(--cor-texto); cursor: pointer; transition: border-color .15s, box-shadow .15s;
}
.tipo-opcao .tipo-ic {
  grid-row: span 2; width: 48px; height: 48px; border-radius: 14px; display: flex; align-items: center; justify-content: center;
  color: var(--cor-principal); background: var(--cor-principal-clara);
}
.tipo-opcao span:not(.tipo-ic) { font-size: 0.82rem; color: var(--cor-texto-suave); }
.tipo-opcao.ativo { border-color: var(--cor-principal); box-shadow: var(--sombra-lg); }
.tipo-opcao.ativo .tipo-ic { background: var(--cor-principal); color: #fff; }
.subtitulo-passo { margin: 22px 0 10px; font-size: 1rem; }

/* =====================================================================================
   Módulo geográfico (29/09/2026) — localização por CEP/GPS/cidade, distância em km, mapa
   (Leaflet sob demanda) e "Onde fica". Privacidade: só áreas aproximadas, nunca CEP/endereço.
   ===================================================================================== */
[hidden] { display: none !important; }
.msg-erro { color: var(--cor-erro); font-size: 0.88rem; }
.layout-busca > section { min-width: 0; }

/* Ações de localização (home) e chip de distância dos cards */
.barra-local-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.chip-prox.chip-dist { background: color-mix(in srgb, var(--cor-acento) 22%, var(--cor-superficie)); color: var(--cor-texto); }
.chip-prox.chip-dist .ic { color: var(--cor-acento-escura); }
.chip-prox.chip-dist.perto { background: var(--cor-principal); color: #fff; }
.chip-prox.chip-dist.perto .ic { color: #fff; }

/* Componentes de localização (modal "Sua localização" e passo 4 do anunciar) */
.link-acao {
  display: inline-flex; align-items: center; gap: 6px; background: none; border: 0; padding: 6px 0; cursor: pointer;
  color: var(--cor-principal); font-weight: 700; font-size: 0.9rem; text-align: left;
  text-decoration: underline; text-underline-offset: 3px;
}
.link-acao:hover { color: var(--cor-principal-escura); }
.filtro-grupo .link-acao { font-size: 0.8rem; text-transform: none; letter-spacing: 0; }
.filtro-grupo select:disabled { opacity: 0.55; cursor: not-allowed; }

.geo-status { font-size: 0.85rem; line-height: 1.4; }
.campo .geo-status:empty { margin-top: -6px; }
.geo-ok { display: flex; align-items: flex-start; gap: 6px; color: var(--cor-sucesso); font-weight: 600; }
.geo-ok .ic { margin-top: 2px; }
.geo-erro { color: var(--cor-erro); }
.geo-carregando { color: var(--cor-texto-suave); }
.geo-ou {
  display: flex; align-items: center; gap: 10px; color: var(--cor-texto-fraco); font-size: 0.78rem; margin: 4px 0 12px;
}
.geo-ou::before, .geo-ou::after { content: ''; flex: 1; height: 1px; background: var(--cor-borda); }
.geo-privacidade {
  display: flex; align-items: flex-start; gap: 8px; margin: 14px 0 0; font-size: 0.8rem; line-height: 1.5;
  color: var(--cor-texto-suave);
}
.geo-privacidade .ic { margin-top: 2px; color: var(--cor-principal); }
.card-revisao + .geo-privacidade { margin: -4px 0 16px; }

.modal-local { max-width: 460px; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow-y: auto; }
.modal-local .ajuda { margin: 0 0 12px; font-size: 0.9rem; color: var(--cor-texto-suave); }
.modal-local .btn-bloco { margin-top: 0; }
.modal-local .link-acao { margin-top: 10px; }
.modal-local .modal-acoes { align-items: center; flex-wrap: wrap; }
.loc-atual {
  margin: 0 0 14px; padding: 8px 12px; font-size: 0.9rem; color: var(--cor-texto);
  background: var(--cor-principal-clara); border-radius: var(--raio);
}
.modal-local .loc-remover { margin: 0 auto 0 0; color: var(--cor-texto-suave); font-weight: 600; }

.autocomplete-lista {
  list-style: none; margin: 0; padding: 4px; max-height: 220px; overflow-y: auto;
  background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio); box-shadow: var(--sombra);
}
.autocomplete-lista li {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 9px 10px;
  border-radius: 8px; cursor: pointer; font-size: 0.92rem;
}
.autocomplete-lista li:hover, .autocomplete-lista li.ativo { background: var(--cor-principal-clara); }
.autocomplete-lista .ac-uf { color: var(--cor-texto-fraco); font-weight: 700; font-size: 0.78rem; }

/* Busca: alternância Lista | Mapa */
.resultados-info { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; }
.vista-alterna { flex: 0 0 auto; min-width: 190px; }
.vista-alterna button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 14px; }
@media (max-width: 859px) {
  .layout-busca.vista-mapa .filtros { order: 2; }
}

/* Mapa (busca e detalhe) */
.mapa-wrap {
  position: relative; isolation: isolate; overflow: hidden; background: var(--cor-fundo);
  border: 1px solid var(--cor-borda); border-radius: var(--raio-lg); box-shadow: var(--sombra);
}
.mapa-caixa { width: 100%; height: 70vh; min-height: 420px; border-radius: 0; }
.mapa-caixa.mapa-mini { height: 280px; min-height: 0; }
@media (max-width: 640px) {
  .mapa-caixa { height: 60vh; min-height: 360px; }
  .mapa-caixa.mapa-mini { height: 240px; min-height: 0; }
}
.mapa-legenda {
  display: flex; flex-wrap: wrap; gap: 8px 16px; list-style: none; margin: 0 0 10px; padding: 0;
  font-size: 0.85rem; font-weight: 600; color: var(--cor-texto-suave);
}
.mapa-legenda li { display: inline-flex; align-items: center; gap: 6px; }
.legenda-pino {
  display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%;
  color: #fff; border: 2px solid var(--cor-superficie); box-shadow: 0 2px 6px -1px rgba(0, 0, 0, 0.4);
}
.legenda-pino.venda { background: #0b4f4b; }
.legenda-pino.compra { background: #e8731f; }
.legenda-pino.destaque { box-shadow: 0 0 0 2px #ffc857, 0 2px 6px -1px rgba(0, 0, 0, 0.4); }
.legenda-voce { width: 14px; height: 14px; border-radius: 50%; background: #2b7cff; border: 2px solid #fff; box-shadow: 0 0 0 1px #2b7cff; }
.mapa-nota {
  display: flex; align-items: flex-start; gap: 8px; margin: 10px 0 0; font-size: 0.82rem; line-height: 1.5;
  color: var(--cor-texto-suave);
}
.mapa-nota .ic { margin-top: 2px; color: var(--cor-principal); }
.mapa-aviso {
  position: absolute; z-index: 1100; top: 14px; left: 50%; transform: translateX(-50%);
  width: min(420px, calc(100% - 24px)); padding: 12px 14px; text-align: center; font-size: 0.9rem; line-height: 1.4;
  display: flex; flex-direction: column; gap: 2px; pointer-events: none;
  background: var(--cor-superficie); color: var(--cor-texto); border: 1px solid var(--cor-borda);
  border-radius: var(--raio); box-shadow: var(--sombra-lg);
}
.mapa-aviso span { color: var(--cor-texto-suave); }
.mapa-falha {
  height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  padding: 24px; text-align: center; color: var(--cor-texto-suave); background: var(--cor-superficie);
}
.mapa-falha p { margin: 0 0 8px; }
.mapa-falha .icone {
  width: 56px; height: 56px; margin-bottom: 6px; border-radius: 18px; display: flex; align-items: center; justify-content: center;
  color: var(--cor-principal); background: var(--cor-principal-clara);
}

/* Leaflet: acabamento da casa (as regras do Leaflet entram depois, por isso a especificidade extra) */
.mapa-caixa.leaflet-container { font-family: var(--fonte); background: #e8ecea; }
.mapa-caixa .leaflet-popup-content-wrapper {
  background: #fff; color: #1a2321; border-radius: 16px; padding: 2px; box-shadow: var(--sombra-lg);
}
.mapa-caixa .leaflet-popup-tip { background: #fff; }
.mapa-caixa .leaflet-popup-content { margin: 10px 12px; font-size: 0.9rem; line-height: 1.35; }
.pop-anuncio { display: flex; gap: 10px; align-items: flex-start; }
.pop-thumb { flex: 0 0 auto; width: 64px; height: 64px; object-fit: cover; border-radius: 10px; background: #eef1f0; }
.pop-corpo { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pop-tipo { font-size: 0.66rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.pop-tipo.venda { color: #0b4f4b; }
.pop-tipo.compra { color: #c25a0d; }
.pop-titulo {
  font-size: 0.88rem; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.pop-preco { font-weight: 800; }
.pop-local { font-size: 0.75rem; color: #5c6b68; }
.mapa-caixa .btn.pop-link { display: flex; width: 100%; margin-top: 10px; padding: 8px 12px; font-size: 0.85rem; color: #fff; }

/* Pinos: venda = verde-petróleo, compra (procura) = laranja, destaque = anel + estrela */
.pino-wrap { background: transparent !important; border: 0 !important; }
.pino {
  position: relative; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  color: #fff; border: 2.5px solid #fff; box-shadow: 0 6px 14px -4px rgba(0, 0, 0, 0.5); transition: transform 0.15s;
}
.pino .ic { vertical-align: 0; }
.pino-venda { background: #0b4f4b; }
.pino-compra { background: #e8731f; }
.pino-wrap:hover .pino { transform: scale(1.12); }
.pino-destaque { box-shadow: 0 0 0 3px #ffc857, 0 6px 14px -4px rgba(0, 0, 0, 0.5); }
.pino-estrela {
  position: absolute; top: -10px; right: -10px; width: 18px; height: 18px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; background: #ffc857; color: #7a4300;
  border: 1.5px solid #fff;
}
.pino-estrela .ic { fill: currentColor; }
.pino-voce {
  display: block; width: 22px; height: 22px; border-radius: 50%; background: #2b7cff; border: 3px solid #fff;
  box-shadow: 0 0 0 0 rgba(43, 124, 255, 0.55), 0 3px 8px rgba(0, 0, 0, 0.35); animation: voce-pulso 2.2s ease-out infinite;
}
@keyframes voce-pulso {
  0% { box-shadow: 0 0 0 0 rgba(43, 124, 255, 0.55), 0 3px 8px rgba(0, 0, 0, 0.35); }
  100% { box-shadow: 0 0 0 16px rgba(43, 124, 255, 0), 0 3px 8px rgba(0, 0, 0, 0.35); }
}
@media (prefers-reduced-motion: reduce) { .pino-voce { animation: none; } .pino { transition: none; } }
.marker-cluster.marker-cluster-cc { background: rgba(15, 111, 107, 0.28); }
.marker-cluster.marker-cluster-cc div {
  background: #0f6f6b; color: #fff; font-family: var(--fonte); font-weight: 800; font-size: 0.8rem;
}

/* Detalhe: "Onde fica" */
.onde-fica { margin-top: 8px; }
.onde-fica-local { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 8px; }
.onde-fica .link-acao { margin-bottom: 10px; }

/* ===== Revisão 29/09 (ATIV#7186): celular ===== */
@media (max-width: 640px) {
  /* com usuário logado o chip do nome estourava a linha do topo (406px numa tela de 375) e dava rolagem
     lateral em TODAS as páginas; no celular fica só o avatar - o nome segue na página Minha conta */
  .topo-container { max-width: 100%; overflow-x: clip; }
  .topo-nav {
    gap: 8px; min-width: 0; max-width: 100%;
    flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden;
    justify-content: flex-start; -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .topo-nav::-webkit-scrollbar { display: none; }
  .topo-nav > * { flex-shrink: 0; }
  /* rotulo so visual some; o leitor de tela continua lendo Cadeias/Favoritos (revisao 22/10) */
  .nav-link span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  .btn-anunciar { padding: 10px 11px; font-size: 0.78rem; }
  .btn-entrar { padding: 9px 11px; font-size: 0.8rem; }
  .usuario-chip { padding: 4px; }
  .usuario-chip .nome-curto { display: none; }
  /* alvo de toque: os botões Todas / À venda / Procurando tinham 30px de altura */
  .segmentado button { min-height: 40px; }
}

/* ===== Mapa de cadeias (#/cadeias) - ENCOMENDA 111: so classes cadeia-* ===== */
.cadeia-pagina { display: flex; flex-direction: column; gap: 18px; }
.cadeia-cabecalho h1 { margin: 4px 0 8px; font-size: clamp(1.5rem, 3vw, 2.1rem); line-height: 1.15; }
.cadeia-controles { display: flex; flex-wrap: wrap; gap: 14px 16px; align-items: flex-start; background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio-lg); padding: 16px; }
/* filtros distribuidos em linhas (pedido do dono 25/10): cada campo cresce para preencher a linha; seletor de 3+ opcoes
   (Mostrar, Medir por) ganha largura propria em vez de espremer o texto numa coluna de 190 px */
.cadeia-controles > .campo { flex: 1 1 190px; min-width: 0; }
.cadeia-controles > .campo:has(.segmentado > button:nth-of-type(3)) { flex: 2 1 380px; }
.cadeia-controles > .campo:has(.segmentado > button:nth-of-type(4)) { flex: 3 1 520px; }
.cadeia-controles .segmentado button { flex: 1 1 auto; min-height: 42px; line-height: 1.2; padding: 8px 12px; font-size: 0.86rem; }
/* no celular, 4 opcoes nao cabem numa pilula so (a pagina ia a 394 px): viram uma grade 2x2 */
@media (max-width: 600px) {
  .cadeia-controles .segmentado:has(> button:nth-of-type(4)) { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; border-radius: 22px; }
  .cadeia-controles .segmentado button { flex: 1 1 0; min-width: 0; padding: 8px 6px; }
}
.cadeia-controles .campo { margin-bottom: 0; }
.cadeia-resumo { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 24px; }
.cadeia-titulo { margin: 0 0 6px; font-size: 1.2rem; }
.cadeia-titulo small { color: var(--cor-texto-fraco); font-weight: 600; }
.cadeia-numeros { display: flex; flex-wrap: wrap; gap: 8px 22px; list-style: none; margin: 0; padding: 0; color: var(--cor-texto-suave); }
.cadeia-numeros strong { color: var(--cor-texto); font-size: 1.1rem; }
.cadeia-barra { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.cadeia-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.cadeia-chip { border: 1px solid var(--cor-borda); background: var(--cor-superficie); color: var(--cor-texto); border-radius: 999px; padding: 8px 14px; font-weight: 600; cursor: pointer; min-height: 40px; }
.cadeia-chip.ativo { background: var(--cor-principal); border-color: var(--cor-principal); color: #fff; }
.cadeia-mapa-cab { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 8px 0; }
.cadeia-mapa-cab:empty { display: none; }
.cadeia-mapa-nome { margin: 0; font-size: 1.05rem; }
.cadeia-voltar { min-height: 44px; }
.cadeia-legenda { display: flex; flex-wrap: wrap; gap: 6px 18px; list-style: none; margin: 0; padding: 0; font-size: 0.85rem; color: var(--cor-texto-suave); }
.cadeia-legenda li { display: inline-flex; align-items: center; gap: 6px; }
.cadeia-legenda-ponto { width: 14px; height: 14px; border-radius: 50%; display: inline-block; opacity: 0.8; }
.cadeia-legenda-nota { color: var(--cor-texto-fraco); }
.cadeia-mapa-wrap { position: relative; border-radius: var(--raio-lg); overflow: hidden; border: 1px solid var(--cor-borda); }
.cadeia-mapa { height: 62vh; min-height: 380px; }
.cadeia-card { background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio-lg); padding: 16px; box-shadow: var(--sombra); }
.cadeia-nota { color: var(--cor-texto-suave); font-size: 0.85rem; margin: 6px 0 0; }
.cadeia-tabela-wrap { overflow-x: auto; margin-top: 8px; }
.cadeia-tabela { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.cadeia-tabela th, .cadeia-tabela td { padding: 9px 10px; border-bottom: 1px solid var(--cor-borda); text-align: left; vertical-align: middle; }
.cadeia-tabela th { color: var(--cor-texto-suave); font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.03em; white-space: nowrap; }
.cadeia-tabela .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cadeia-link { border: none; background: none; padding: 0; color: var(--cor-principal-escura); font: inherit; font-weight: 600; text-align: left; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.cadeia-selo { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 0.78rem; font-weight: 700; color: #fff; background: #8a9895; }
.cadeia-selo-lacuna { background: #c25a12; }
.cadeia-selo-saturacao { background: #2563a8; }
.cadeia-razoes { list-style: none; margin: 10px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 8px; }
.cadeia-razoes li { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--cor-borda); border-radius: var(--raio); }
.cadeia-razoes li.baixo { border-color: #c25a12; background: color-mix(in srgb, #e06f1f 10%, var(--cor-superficie)); }
.cadeia-razoes li.alto { border-color: #2563a8; background: color-mix(in srgb, #2563a8 10%, var(--cor-superficie)); }
.cadeia-razao-par { font-weight: 600; font-size: 0.9rem; }
.cadeia-razao-val { display: flex; flex-direction: column; align-items: flex-end; }
.cadeia-razao-val small { color: var(--cor-texto-fraco); font-size: 0.72rem; }
.cadeia-fonte { color: var(--cor-texto-fraco); font-size: 0.8rem; margin: 4px 0 0; }
.cadeia-home { margin: 8px 0; }
.cadeia-home-caixa { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio-lg); padding: 18px; }
.cadeia-home-caixa .secao-titulo, .cadeia-home-caixa .secao-lead { margin-top: 0; }
.cadeia-home-cards { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 0; padding: 0; flex: 1 1 100%; }
.cadeia-home-cards li { flex: 1 1 200px; }
.cadeia-home-cards a { display: flex; flex-direction: column; gap: 2px; height: 100%; padding: 12px 14px; border: 1px solid #c25a12; border-radius: var(--raio); background: color-mix(in srgb, #e06f1f 9%, var(--cor-superficie)); color: var(--cor-texto); }
.cadeia-home-cards a span { color: var(--cor-texto-suave); font-size: 0.85rem; }
@media (max-width: 640px) { .cadeia-mapa { height: 55vh; min-height: 320px; } }

/* ===== Mapa de cadeias v2 (ENCOMENDA 112): abas, trilha por setor, IDH, perto de voce - so classes cadeia-* ===== */
.cadeia-abas { display: flex; gap: 6px; border-bottom: 1px solid var(--cor-borda); }
.cadeia-abas a { padding: 10px 18px; border-radius: var(--raio) var(--raio) 0 0; font-weight: 700; color: var(--cor-texto-suave); border: 1px solid transparent; border-bottom: none; margin-bottom: -1px; text-decoration: none; }
.cadeia-abas a.ativo { color: var(--cor-principal-escura); background: var(--cor-superficie); border-color: var(--cor-borda); }
.cadeia-sub { margin: 16px 0 4px; font-size: 1rem; }
.cadeia-selo.cadeia-q-oportunidade { background: #2e8b57; }
.cadeia-selo.cadeia-q-lacuna_fraca { background: #d9a406; color: #2b2200; }
.cadeia-selo.cadeia-q-saturacao { background: #2563a8; }
.cadeia-selo.cadeia-q-equilibrio { background: #8a9895; }
.cadeia-trilha { display: flex; align-items: flex-start; gap: 10px; overflow-x: auto; padding: 4px 2px 10px; }
.cadeia-trilha-col { flex: 1 1 0; min-width: 230px; display: flex; flex-direction: column; gap: 8px; }
.cadeia-trilha-titulo { margin: 0; font-size: 1rem; display: flex; flex-direction: column; gap: 2px; }
.cadeia-trilha-titulo small { color: var(--cor-texto-fraco); font-weight: 500; font-size: 0.75rem; }
.cadeia-trilha-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.cadeia-seta { align-self: center; font-size: 1.8rem; color: var(--cor-texto-fraco); flex: 0 0 auto; }
.cadeia-elo-btn { width: 100%; text-align: left; display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border: 1px solid var(--cor-borda); border-left-width: 6px; border-radius: var(--raio); background: var(--cor-superficie); color: var(--cor-texto); cursor: pointer; font: inherit; }
.cadeia-elo-btn[disabled] { cursor: default; opacity: 0.9; }
.cadeia-elo-btn.escolhido { box-shadow: 0 0 0 2px var(--cor-principal); }
.cadeia-elo-nome { font-size: 1.02rem; }
.cadeia-elo-papel { color: var(--cor-texto-suave); font-size: 0.78rem; }
.cadeia-elo-nums { display: flex; gap: 14px; font-size: 0.88rem; color: var(--cor-texto-suave); }
.cadeia-elo-nums b { color: var(--cor-texto); }
.cadeia-elo-selos { display: flex; flex-wrap: wrap; gap: 6px; }
.cadeia-qb-oportunidade { border-left-color: #2e8b57; background: color-mix(in srgb, #2e8b57 9%, var(--cor-superficie)); }
.cadeia-qb-lacuna_fraca { border-left-color: #d9a406; background: color-mix(in srgb, #d9a406 10%, var(--cor-superficie)); }
.cadeia-qb-saturacao { border-left-color: #2563a8; background: color-mix(in srgb, #2563a8 9%, var(--cor-superficie)); }
.cadeia-qb-equilibrio { border-left-color: #8a9895; }
.cadeia-escala { display: inline-block; width: 90px; height: 12px; border-radius: 6px; background: linear-gradient(90deg, rgb(241, 227, 179), rgb(74, 163, 139) 50%, rgb(20, 80, 122)); vertical-align: middle; }
.cadeia-perto-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px 16px; align-items: end; margin-top: 10px; }
.cadeia-perto-form .campo { margin-bottom: 0; }
.cadeia-faltam { list-style: none; margin: 8px 0 12px; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 8px; }
.cadeia-faltam li { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--cor-borda); border-left-width: 6px; border-radius: var(--raio); font-size: 0.9rem; }
.cadeia-dims { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 8px; max-width: 520px; }
.cadeia-dims li { display: grid; grid-template-columns: 110px 1fr 56px; gap: 10px; align-items: center; }
.cadeia-dim-barra { display: block; height: 12px; border-radius: 6px; background: var(--cor-borda); overflow: hidden; }
.cadeia-dim-barra span { display: block; height: 100%; }
.cadeia-udh { max-height: 340px; overflow-y: auto; }
@media (max-width: 640px) {
  .cadeia-trilha { flex-direction: column; align-items: stretch; overflow-x: visible; }
  .cadeia-trilha-col { min-width: 0; }
  .cadeia-seta { transform: rotate(90deg); align-self: center; font-size: 1.5rem; line-height: 1; }
  .cadeia-abas a { flex: 1; text-align: center; padding: 10px 8px; }
  .cadeia-dims li { grid-template-columns: 90px 1fr 48px; }
}

/* ===== Mapa de cadeias v3 (ENCOMENDA 113): 6 abas, planos e cadeados - so classes cadeia-* e plano-* ===== */
.cadeia-abas { overflow-x: auto; scrollbar-width: thin; }
.cadeia-abas a { white-space: nowrap; flex: 0 0 auto; }
.cadeia-aba-trava { color: var(--cor-texto-fraco); }
.cadeia-aba-cadeado { display: inline-flex; vertical-align: -2px; margin-left: 2px; color: var(--cor-acento-escura); }
.cadeia-selo.cadeia-q-escala_nacional { background: #6b7a77; }
.cadeia-qb-escala_nacional { border-left-color: #6b7a77; background: color-mix(in srgb, #6b7a77 10%, var(--cor-superficie)); }
.cadeia-elo-escala { color: var(--cor-texto-suave); font-size: 0.8rem; font-style: italic; }
.cadeia-elo-negocios { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 0.86rem; font-weight: 700; text-decoration: none; color: var(--cor-principal-escura); }
.cadeia-elo-negocios:hover { text-decoration: underline; }
.cadeia-elo-negocios-trava { color: var(--cor-texto-suave); }
.cadeia-raio-trava { display: inline-flex; align-items: center; gap: 4px; background: transparent; border: 0; color: var(--cor-texto-fraco); font: inherit; font-weight: 600; padding: 8px 14px; border-radius: 999px; cursor: pointer; }
.cadeia-raio-trava:hover { background: var(--cor-principal-clara); color: var(--cor-texto); }
.cadeia-paginacao { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 12px; flex-wrap: wrap; }
.cadeia-csv { display: inline-flex; align-items: center; gap: 6px; }
.cadeia-comparar { min-width: 560px; }
.cadeia-comparar td { vertical-align: top; }
.cadeia-comparar-info td { color: var(--cor-texto-suave); font-size: 0.82rem; }
.cadeia-cnpj { color: var(--cor-texto-fraco); }

.plano-selo { display: inline-flex; align-items: center; gap: 5px; padding: 3px 11px; border-radius: 999px; font-size: 0.78rem; font-weight: 800; color: #5a2d00; background: #ffe2c6; border: 1px solid #f2b27c; text-decoration: none; }
.plano-pill { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 0.68rem; font-weight: 800; letter-spacing: 0.03em; color: var(--cor-principal-escura); background: var(--cor-principal-clara); border: 1px solid var(--cor-borda); }
.plano-aviso { display: flex; flex-direction: column; gap: 8px; border-left: 6px solid var(--cor-acento); }
.plano-aviso p { margin: 0; }
.plano-acoes { display: flex; flex-wrap: wrap; gap: 10px; }
.plano-exemplo { background: repeating-linear-gradient(135deg, var(--cor-superficie), var(--cor-superficie) 14px, color-mix(in srgb, var(--cor-acento) 5%, var(--cor-superficie)) 14px, color-mix(in srgb, var(--cor-acento) 5%, var(--cor-superficie)) 28px); }
.plano-borrado { color: var(--cor-texto-fraco); letter-spacing: 0.1em; }
.plano-borrada td { color: var(--cor-texto-fraco); letter-spacing: 0.08em; }
.plano-creditos { margin: 0; padding: 10px 14px; border: 1px solid var(--cor-borda); border-radius: var(--raio); background: var(--cor-principal-clara); }
.plano-creditos small { display: block; color: var(--cor-texto-suave); }
.plano-rodape { margin: 4px 0 0; color: var(--cor-texto-suave); font-size: 0.86rem; }
.plano-seu { display: flex; flex-direction: column; gap: 4px; }
.plano-seu p { margin: 0; }
.plano-grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; align-items: stretch; }
.plano-card { display: flex; flex-direction: column; gap: 8px; background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio-lg); padding: 18px; box-shadow: var(--sombra); }
.plano-card header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.plano-card h2 { margin: 0; font-size: 1.15rem; }
.plano-card.plano-atual { border-color: var(--cor-principal); box-shadow: 0 0 0 2px var(--cor-principal); }
.plano-card.plano-pro { border-top: 5px solid #2e8b57; }
.plano-card.plano-profissional { border-top: 5px solid #2563a8; }
.plano-card.plano-institucional { border-top: 5px solid #6b7a77; }
.plano-card.plano-free { border-top: 5px solid var(--cor-borda); }
.plano-preco { margin: 0; font-size: 1.35rem; font-weight: 800; }
.plano-preco small { font-size: 0.78rem; font-weight: 600; color: var(--cor-texto-suave); }
.plano-resumo { margin: 0; color: var(--cor-texto-suave); font-size: 0.92rem; }
.plano-recursos { list-style: none; margin: 4px 0 8px; padding: 0; display: flex; flex-direction: column; gap: 6px; flex: 1; font-size: 0.9rem; }
.plano-sim span { color: #1e8e5a; font-weight: 800; }
.plano-nao { color: var(--cor-texto-fraco); }
.plano-form textarea { width: 100%; }
.plano-ok { display: flex; align-items: center; gap: 10px; border-left: 6px solid var(--cor-sucesso); }
.plano-ok p { margin: 0; }
.plano-moderacao { margin-top: 28px; display: flex; flex-direction: column; gap: 8px; }
.plano-moderacao .btn { padding: 6px 12px; font-size: 0.82rem; }
.pessoas-busca.campo { flex-direction: row; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.pessoas-busca input { flex: 1 1 220px; min-width: 0; }
@media (max-width: 640px) {
  .cadeia-abas { gap: 2px; }
  .cadeia-abas a { flex: 0 0 auto; padding: 10px 12px; }
  .plano-grade { grid-template-columns: 1fr; }
}
.cadeia-pagina > *, .cadeia-card { min-width: 0; max-width: 100%; }
.cadeia-comparar { min-width: 480px; }
.cadeia-tabela-wrap { position: relative; }
.cadeia-elo-lista { min-width: 600px; }

/* ===== Mapa de cadeias v4 (ENCOMENDA 114): peso economico, renda 2022, vizinhanca, demanda, vocacao, sua regiao - so classes cadeia-* e sua-regiao-* ===== */
/* selos novos em tons NEUTROS de proposito: quem os tem nao e oportunidade (nunca o verde) */
.cadeia-selo { white-space: normal; max-width: 100%; text-align: left; }
.cadeia-selo.cadeia-q-coberto_vizinho { background: #7b8aa6; }
.cadeia-selo.cadeia-q-lacuna_sem_demanda { background: #a89f8c; color: #26221a; }
.cadeia-selo.cadeia-q-fora_do_perfil { background: transparent; color: var(--cor-texto-suave); border: 1px dashed var(--cor-texto-fraco); cursor: help; }
.cadeia-qb-coberto_vizinho { border-left-color: #7b8aa6; background: color-mix(in srgb, #7b8aa6 10%, var(--cor-superficie)); }
.cadeia-qb-lacuna_sem_demanda { border-left-color: #a89f8c; background: color-mix(in srgb, #a89f8c 12%, var(--cor-superficie)); }
/* toggle Negocios | Peso economico */
.cadeia-medida .cadeia-nota { margin-top: 4px; }
.cadeia-medida-aviso { font-style: italic; }
.cadeia-trabalho { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--cor-borda, #e2e8e6); }
.cadeia-trabalho-numeros { flex-wrap: wrap; gap: 8px 16px; }
.cadeia-fonte-trabalho { font-size: 0.85rem; color: var(--cor-texto-suave, #5c6b66); margin-top: 8px; }
.cadeia-sparkline { display: block; width: 100%; max-width: 220px; height: 44px; color: var(--cor-primaria, #145a4a); margin: 8px 0; }
.cadeia-elo-trabalho .cadeia-trabalho { margin-top: 8px; text-align: left; }
.segmentado button[disabled] { opacity: 0.55; cursor: not-allowed; }
/* esperado (MIP 2015) x observado nos dados */
.cadeia-elo-obs { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 0.78rem; color: var(--cor-texto-suave); }
.cadeia-obs { display: inline-block; padding: 1px 9px; border-radius: 999px; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.03em; color: #fff; background: #8a9895; cursor: help; }
.cadeia-obs-forte { background: #0f6f6b; }
.cadeia-obs-moderado { background: #4aa38b; }
.cadeia-obs-fraco { background: #a9c9c2; color: #1a2321; }
.cadeia-obs-nulo { background: transparent; color: var(--cor-texto-suave); border: 1px solid var(--cor-texto-fraco); }
.cadeia-esperado-observado { margin: 4px 0 0; }
.cadeia-emergentes { background: var(--cor-superficie); border: 1px dashed var(--cor-borda); border-radius: var(--raio-lg); padding: 14px 16px; }
.cadeia-emergentes .cadeia-sub { margin-top: 0; }
.cadeia-emergentes-lista { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.cadeia-emergentes-lista li { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border: 1px solid var(--cor-borda); border-radius: 999px; background: var(--cor-fundo); }
/* renda 2022 (qualificador) e vocacao */
.cadeia-painel-regiao { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; align-items: start; }
.cadeia-painel-retrato { margin: 12px 0 8px; }
.cadeia-andar-retrato { margin-bottom: 20px; padding-bottom: 16px; border-bottom: 2px solid var(--cor-borda); }
.cadeia-andar-recorte { margin-top: 8px; }
.cadeia-secao-recorte-titulo { font-size: 1.15rem; margin: 0 0 12px; font-weight: 650; }
.cadeia-escassez .cadeia-sub { color: var(--cor-texto); }
.cadeia-renda { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border: 1px solid var(--cor-borda); border-left: 6px solid #4aa38b; border-radius: var(--raio); background: color-mix(in srgb, #4aa38b 8%, var(--cor-superficie)); }
.cadeia-renda-rotulo { font-size: 0.78rem; font-weight: 800; letter-spacing: 0.03em; text-transform: uppercase; color: var(--cor-texto-suave); }
.cadeia-renda-valor { font-size: 1.7rem; line-height: 1.15; color: var(--cor-texto); font-variant-numeric: tabular-nums; }
.cadeia-renda-desc { font-size: 0.8rem; color: var(--cor-texto-suave); }
.cadeia-renda-indice { font-weight: 700; color: var(--cor-principal-escura); }
.cadeia-renda-corte { font-size: 0.82rem; font-weight: 600; }
.cadeia-renda-corte.acima { color: #1e8e5a; }
.cadeia-renda-corte.abaixo { color: #8a6a00; }
.cadeia-vocacao .cadeia-sub { margin-top: 0; }
.cadeia-vocacao-lista { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.cadeia-vocacao-lista li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px; padding: 6px 0; border-bottom: 1px solid var(--cor-borda); }
.cadeia-vocacao-lista li span { color: var(--cor-texto-suave); font-variant-numeric: tabular-nums; }
.cadeia-painel-municipio .cadeia-titulo small { display: block; margin-top: 2px; }
/* "Sua regiao" no rodape + painel de alterar */
.sua-regiao { display: block; }
.sua-regiao small { color: var(--cor-texto-fraco); }
.sua-regiao-painel { margin-top: 8px; }
.sua-regiao-painel[hidden] { display: none; }
.sua-regiao-painel .cadeia-perto-form { margin-bottom: 6px; }
@media (max-width: 640px) {
  .cadeia-renda-valor { font-size: 1.45rem; }
  .cadeia-painel-regiao { grid-template-columns: 1fr; }
}
/* selo dentro de tabela: uma linha so (a tabela rola dentro do wrapper, a pagina nao) */
.cadeia-tabela .cadeia-selo { white-space: nowrap; }
/* ===== Mapa de cadeias v4.1 (ENCOMENDA 115): selo do municipio no mapa e "Neste elo" no painel do municipio ===== */
.cadeia-tip { width: max-content; max-width: min(280px, 76vw); white-space: normal; }
.cadeia-tip-apoio { display: block; margin-top: 4px; font-size: 0.78rem; color: var(--cor-texto-suave); }
.cadeia-neste-elo { border-left-color: #7b8aa6; background: color-mix(in srgb, #7b8aa6 9%, var(--cor-superficie)); }
.cadeia-neste-elo-selos { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 2px; }
/* ENCOMENDA 136: economia local, compras PNCP, mercado de capitais */
.cadeia-136-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; margin: 12px 0 18px; }
/* item de grid nao cresce pelo texto: o objeto da compra (line-clamp em -webkit-box) media a largura da frase inteira
   e esticava Compras e Mercado para 714 px no celular, com rolagem lateral da pagina (25/10) */
.cadeia-136-grid > * { min-width: 0; }
.cadeia-economia, .cadeia-compras, .cadeia-mercado { padding: 14px 16px; border: 1px solid var(--cor-borda); border-radius: var(--raio); background: var(--cor-superficie); }
.cadeia-pib-barras { display: flex; height: 10px; border-radius: 4px; overflow: hidden; margin: 8px 0; }
.cadeia-pib-bar { display: block; min-width: 2px; }
.cadeia-pib-leg { list-style: none; margin: 0 0 10px; padding: 0; font-size: 0.82rem; color: var(--cor-texto-suave); display: flex; flex-wrap: wrap; gap: 8px 14px; }
.cadeia-mini { font-size: 0.85rem; margin: 10px 0 4px; }
.cadeia-top-lista { margin: 0 0 8px; padding-left: 1.1rem; font-size: 0.88rem; }
.cadeia-compras-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.cadeia-compra-card { border: 1px solid var(--cor-borda); border-radius: var(--raio-sm); padding: 10px 12px; background: var(--cor-fundo); }
.cadeia-compra-obj { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cadeia-cerca { font-size: 0.78rem; color: var(--cor-texto-suave); margin: 0 0 8px; }
.cadeia-busca-ativo { max-width: 360px; margin: 8px 0 12px; }
.cadeia-busca-ativo input { width: 100%; }
.cadeia-mercado-cartoes { display: flex; gap: 10px; overflow-x: auto; padding: 8px 0 4px; margin-top: 10px; scroll-snap-type: x mandatory; }
.cadeia-mercado-cartao {
  flex: 0 0 min(220px, 72vw); scroll-snap-align: start; display: flex; flex-direction: column; gap: 4px;
  padding: 10px 12px; border: 1px solid var(--cor-borda); border-radius: var(--raio-sm); background: var(--cor-fundo);
  text-decoration: none; color: inherit;
}
.cadeia-mercado-cartao:hover { border-color: var(--cor-principal); }
.cadeia-mercado-cartao-tick { font-size: 1.05rem; }
.cadeia-mercado-cartao-nome { font-size: 0.85rem; color: var(--cor-texto-suave); }
.cadeia-ativos-barra { flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.cadeia-ativos-totais { display: flex; flex-wrap: wrap; gap: 8px 16px; list-style: none; margin: 0 0 10px; padding: 0; font-size: 0.9rem; }
.cadeia-ativos-tipos { margin: 8px 0 14px; }
.cadeia-ativos-linha { cursor: pointer; }
.cadeia-th-ord { background: none; border: none; font: inherit; cursor: pointer; text-decoration: underline; padding: 0; }
.cadeia-th-ord.ativo { font-weight: 700; }
.cadeia-paginacao { display: flex; gap: 12px; align-items: center; margin: 12px 0; }
@media (max-width: 375px) {
  .cadeia-136-grid { grid-template-columns: minmax(0, 1fr); }
  .cadeia-compra-card { font-size: 0.92rem; }
}
/* ENCOMENDA 137: Região em números (cartões = Medir por) */
.cadeia-regiao-numeros-wrap { position: relative; margin: 0 0 14px; display: flex; align-items: stretch; gap: 4px; }
.cadeia-regiao-numeros-wrap.cadeia-cartoes-tem-mais::after {
  content: ''; position: absolute; top: 0; right: 36px; bottom: 0; width: 48px; pointer-events: none;
  background: linear-gradient(90deg, transparent, var(--cor-fundo, #f6f8f7));
}
.cadeia-cartoes-nav {
  flex: 0 0 auto; align-self: center; width: 28px; height: 28px; border: 1px solid var(--cor-borda); border-radius: 50%;
  background: var(--cor-superficie); cursor: pointer; font-size: 1.1rem; line-height: 1; color: var(--cor-texto-suave);
}
.cadeia-cartoes-nav:focus-visible { outline: 2px solid var(--cor-principal); outline-offset: 2px; }
.cadeia-regiao-numeros { margin: 0; flex: 1; min-width: 0; }
.cadeia-cartoes-regiao { display: flex; flex-wrap: nowrap; gap: 10px; overflow-x: auto; list-style: none; margin: 0; padding: 4px 2px 8px; -webkit-overflow-scrolling: touch; scroll-snap-type: x mandatory; }
.cadeia-cartoes-regiao > li { flex: 0 0 auto; scroll-snap-align: start; position: relative; }
/* todos os cartoes com o MESMO tamanho (pedido do dono 25/10): rotulo 1 linha, valor ate 2 linhas, segunda linha 1, fonte ate 2;
   texto que nao cabe diminui a fonte (cadeiaAjustarTextoCartoes em app.js), nunca estica o cartao */
.cadeia-cartao-regiao {
  display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 4px;
  box-sizing: border-box; width: 196px; min-width: 196px; max-width: 196px; min-height: 140px; height: 140px; max-height: 140px;
  padding: 10px 12px; border: 1px solid var(--cor-borda); border-radius: var(--raio-sm); background: var(--cor-superficie);
  cursor: pointer; text-align: left; font: inherit; color: inherit; overflow: hidden;
}
.cadeia-cartao-regiao.ativo { border-color: var(--cor-principal); box-shadow: 0 0 0 1px var(--cor-principal); }
.cadeia-cartao-regiao:disabled { opacity: 0.55; cursor: not-allowed; }
.cadeia-cartao-regiao > * { flex: 0 0 auto; max-width: 100%; }
.cadeia-cartao-rotulo { display: block; font-size: 0.78rem; line-height: 1.25; font-weight: 700; color: var(--cor-texto-suave); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cadeia-cartao-com-info .cadeia-cartao-rotulo { padding-right: 18px; }
/* o (i) mora fora do botao do cartao (botao dentro de botao quebrava o cartao) e fica por cima do canto */
.cadeia-cartao-info {
  position: absolute; top: 9px; right: 8px; width: 1.2rem; height: 1.2rem; padding: 0; border: none; border-radius: 50%;
  background: transparent; color: var(--cor-texto-suave); font-size: 0.85rem; line-height: 1; cursor: help;
}
.cadeia-cartao-info:focus-visible { outline: 2px solid var(--cor-principal); outline-offset: 1px; }
.cadeia-cartao-valor { font-size: 1.05rem; line-height: 1.2; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: break-word; }
.cadeia-cartao-secundario { font-size: 0.78rem; line-height: 1.25; color: var(--cor-texto-suave); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cadeia-cartao-meta { font-size: 0.72rem; line-height: 1.25; color: var(--cor-texto-suave); margin-top: auto; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } /* fonte em ate 2 linhas, sem cortar (revisao da gestora 25/10) */
.cadeia-cartao-meta-parte { white-space: nowrap; }
@media (max-width: 375px) {
  .cadeia-cartao-regiao { width: calc(50vw - 28px); min-width: calc(50vw - 28px); max-width: calc(50vw - 28px); }
}

/* ===== Minha conta — ciclo do anúncio (ENCOMENDA 129) ===== */
.pagina-conta { max-width: 100%; overflow-x: hidden; }
.conta-cabecalho { margin-bottom: 20px; display: flex; gap: 12px; align-items: center; min-width: 0; }
.conta-avatar { width: 52px; height: 52px; border-radius: 50%; flex-shrink: 0; }
.conta-identidade { min-width: 0; overflow-wrap: anywhere; }
.conta-email-linha { font-size: 0.85rem; color: var(--cor-texto-fraco); }
.conta-preferencia-email { margin-bottom: 24px; padding: 12px 14px; border: 1px solid var(--cor-borda); border-radius: var(--raio); background: var(--cor-superficie); }
.conta-seus-dados { margin-bottom: 28px; padding: 14px 16px; border: 1px solid var(--cor-borda); border-radius: var(--raio); background: var(--cor-superficie); max-width: 100%; }
.conta-seus-dados h2 { margin-top: 0; font-size: 1.1rem; }
.conta-seus-dados-acoes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.btn-perigo { color: var(--cor-erro, #b42318); border-color: color-mix(in srgb, var(--cor-erro, #b42318) 40%, transparent); }
.btn-perigo:hover { background: color-mix(in srgb, var(--cor-erro, #b42318) 8%, transparent); }
.modal-excluir-conta { max-width: 420px; }
.campo-excluir-conta { display: block; margin: 16px 0; }
.campo-excluir-conta input { width: 100%; margin-top: 8px; padding: 10px 12px; border: 1px solid var(--cor-borda); border-radius: var(--raio); box-sizing: border-box; }
.interruptor-email { display: flex; align-items: center; gap: 10px; font-weight: 600; cursor: pointer; }
.interruptor-email input { width: 18px; height: 18px; flex-shrink: 0; }
.lista-meus-anuncios { display: flex; flex-direction: column; gap: 12px; max-width: 100%; }
.card-meu-anuncio { border: 1px solid var(--cor-borda); border-radius: var(--raio); background: var(--cor-superficie); overflow: hidden; max-width: 100%; }
.card-meu-anuncio-link { display: flex; gap: 12px; padding: 12px; text-decoration: none; color: inherit; min-width: 0; }
.card-meu-anuncio-thumb { width: 72px; height: 72px; object-fit: cover; border-radius: var(--raio-sm); flex-shrink: 0; background: var(--cor-fundo); }
.card-meu-anuncio-thumb.vazio { display: flex; align-items: center; justify-content: center; color: var(--cor-texto-fraco); }
.card-meu-anuncio-corpo { min-width: 0; flex: 1; }
.card-meu-anuncio-corpo h3 { margin: 4px 0 2px; font-size: 1rem; overflow-wrap: anywhere; }
.meu-anuncio-selo { display: inline-block; font-size: 0.72rem; font-weight: 700; padding: 2px 8px; border-radius: 999px; }
.meu-anuncio-selo.ativo { background: #e6f4ea; color: #1e6b3a; }
.meu-anuncio-selo.expira { background: #fff4e0; color: #8a5a00; }
.meu-anuncio-selo.expirado { background: #f3e8e8; color: #8a3030; }
.meu-anuncio-selo.vendido { background: #e8eef5; color: #2a4a6a; }
.meu-anuncio-selo.oculto { background: #ececec; color: #555; }
.card-meu-anuncio-acoes { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 12px 12px; }
.btn-sm { padding: 6px 10px; font-size: 0.82rem; }

/* ENCOMENDA 142: Pesquisa CNPJ */
.cadeia-pesquisa-form { display: grid; gap: 12px; max-width: 28rem; margin-bottom: 20px; }
.cadeia-pesquisa-modos { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.cadeia-pesquisa-mapa { min-height: 360px; margin-top: 12px; }
.cadeia-pesquisa-mapa-legenda { list-style: none; margin: 0 0 8px; padding: 0; font-size: 0.9rem; }
.cadeia-pesquisa-mapa-legenda label { display: flex; flex-wrap: nowrap; align-items: baseline; gap: 6px; cursor: pointer; margin-bottom: 4px; }
.cadeia-pesquisa-mapa-legenda .cadeia-pesquisa-camada-linha { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; flex: 1; min-width: 0; }
.cadeia-pesquisa-mapa-legenda .cadeia-pesquisa-camada-fonte { font-size: 0.78rem; white-space: nowrap; }
.cadeia-tabela.cadeia-contexto-raio { font-size: 0.82rem; }
.cadeia-pesquisa-mapa-chips { display: none; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.cadeia-pesquisa-pin-empresa { background: #111; color: #f5d90a; border-radius: 50%; font-size: 14px; line-height: 22px; text-align: center; border: 2px solid #f5d90a; }
.cadeia-estudo-vitrine { border: 1px dashed var(--cor-borda); padding: 12px; margin-bottom: 16px; border-radius: var(--raio-sm); }
.cadeia-estudo-contagem { font-weight: 600; }
@media (max-width: 640px) {
  .cadeia-pesquisa-mapa-legenda { display: none; }
  .cadeia-pesquisa-mapa-chips { display: flex; }
}
.cadeia-pesquisa-elos { margin: 0 0 12px; padding-left: 1.2rem; }
.cadeia-pesquisa-dados { font-size: 0.75rem; max-height: 200px; overflow: auto; background: var(--cor-fundo); padding: 8px; border-radius: var(--raio-sm); }
.cadeia-leitura { font-weight: 600; margin: 0 0 8px; }
.cadeia-pesquisa-cap { margin-bottom: 24px; border-top: 1px solid var(--cor-borda); padding-top: 16px; }
/* Estudo previo de mercado: capa, sumario, topicos e travas premium (pedido do dono 27/10) */
.cadeia-estudo-doc { position: relative; }
.estudo-marca-dagua { display: none; }
.estudo-capa {
  position: relative; overflow: hidden; color: #fff; background: var(--hero-fundo);
  border-radius: var(--raio-lg); padding: 28px 32px; margin: 8px 0 28px; min-height: 420px;
  display: flex; flex-direction: column; gap: 28px;
  box-shadow: 0 24px 48px -28px rgba(8, 61, 58, 0.8);
}
.estudo-capa::after {
  content: ""; position: absolute; right: -90px; bottom: -90px; width: 340px; height: 340px; border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.14); box-shadow: 0 0 0 40px rgba(255, 255, 255, 0.03), 0 0 0 90px rgba(255, 255, 255, 0.025);
  pointer-events: none;
}
.estudo-capa-topo { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.estudo-capa-marca { display: inline-flex; align-items: center; gap: 10px; font-size: 1.05rem; font-weight: 600; letter-spacing: -0.02em; }
.estudo-capa-marca img { border-radius: 9px; background: #fff; padding: 2px; }
.estudo-capa-marca strong { color: #ffb27a; font-weight: 800; }
.estudo-capa-plano {
  border: 1px solid rgba(255, 178, 122, 0.7); color: #ffd2b0; border-radius: 999px; padding: 4px 12px;
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
}
.estudo-capa-miolo { flex: 1; display: flex; flex-direction: column; justify-content: center; position: relative; z-index: 1; }
.estudo-capa-kicker { margin: 0 0 10px; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: #ffb27a; }
.estudo-capa-titulo { margin: 0; font-size: clamp(2rem, 6vw, 3.4rem); line-height: 1.02; letter-spacing: -0.035em; font-weight: 800; word-break: break-word; }
.estudo-capa-local { margin: 8px 0 0; font-size: 1.2rem; color: rgba(255, 255, 255, 0.82); }
.estudo-capa-filete { display: block; width: 72px; height: 4px; border-radius: 4px; margin: 22px 0; background: linear-gradient(90deg, var(--cor-acento), #ffd2b0); }
.estudo-capa-ficha { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px 28px; margin: 0; max-width: 760px; }
.estudo-capa-ficha div { border-left: 2px solid rgba(255, 255, 255, 0.22); padding-left: 12px; }
.estudo-capa-ficha dt { font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255, 255, 255, 0.6); }
.estudo-capa-ficha dd { margin: 3px 0 0; font-size: 0.95rem; font-weight: 500; }
.estudo-capa-rodape { position: relative; z-index: 1; border-top: 1px solid rgba(255, 255, 255, 0.18); padding-top: 14px; font-size: 0.78rem; color: rgba(255, 255, 255, 0.72); }
.estudo-capa-rodape p { margin: 2px 0; }
.estudo-capa-rodape strong { color: #fff; }

.estudo-parte-kicker { margin: 0 0 4px; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--cor-principal); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.estudo-sumario {
  background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio-lg);
  padding: 24px 28px; margin-bottom: 36px;
}
.estudo-sumario h4 { margin: 0 0 14px; font-size: 1.6rem; letter-spacing: -0.02em; }
.estudo-sumario ol { list-style: none; margin: 0; padding: 0; }
.estudo-sumario li + li { border-top: 1px solid var(--cor-borda); }
.estudo-sumario a { display: grid; grid-template-columns: 44px 1fr auto; gap: 14px; align-items: center; padding: 12px 4px; color: inherit; text-decoration: none; }
.estudo-sumario a:hover .estudo-sumario-tit strong { color: var(--cor-principal); }
.estudo-sumario-num { font-size: 1.35rem; font-weight: 800; color: var(--cor-principal); font-variant-numeric: tabular-nums; }
.estudo-sumario-tit strong { display: block; font-size: 1rem; }
.estudo-sumario-tit small { display: block; color: var(--cor-texto-suave); font-size: 0.82rem; margin-top: 2px; }
.estudo-sumario-plano { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--cor-texto-fraco); white-space: nowrap; display: inline-flex; gap: 4px; align-items: center; }
.estudo-sumario-trava .estudo-sumario-num, .estudo-sumario-trava .estudo-sumario-plano { color: var(--cor-acento-escura); }

.estudo-parte { margin: 0 0 40px; }
.estudo-parte-cab {
  display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: start;
  padding-bottom: 14px; margin-bottom: 18px; border-bottom: 2px solid var(--cor-principal);
  position: relative; break-after: avoid;
}
.estudo-parte-cab::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 64px; height: 2px; background: var(--cor-acento); }
.estudo-parte-num {
  font-size: 3rem; line-height: 0.9; font-weight: 800; letter-spacing: -0.04em; font-variant-numeric: tabular-nums;
  background: linear-gradient(160deg, var(--cor-principal), var(--cor-principal-escura));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.estudo-parte-cab h4 { margin: 0; font-size: 1.55rem; letter-spacing: -0.02em; line-height: 1.15; }
.estudo-parte-cab .cadeia-leitura { margin: 6px 0 0; font-weight: 500; color: var(--cor-texto-suave); }
.estudo-selo-premium {
  display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px; letter-spacing: 0.1em;
  background: linear-gradient(135deg, #ffe2c9, #ffc394); color: #8a3d06;
}

/* travas premium: o conteudo pago aparece como vitrine, nunca como pagina vazia */
.cadeia-trava.estudo-parte, .cadeia-estudo-vitrine-bloco.estudo-parte {
  border: 1px solid var(--cor-borda); border-radius: var(--raio-lg); padding: 22px 24px; background:
    repeating-linear-gradient(-45deg, transparent 0 14px, color-mix(in srgb, var(--cor-acento) 4%, transparent) 14px 15px),
    var(--cor-superficie);
  position: relative; overflow: hidden;
}
.cadeia-trava.estudo-parte::before, .cadeia-estudo-vitrine-bloco.estudo-parte::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, var(--cor-acento), #ffc394, var(--cor-acento));
}
.estudo-trava-faixa {
  display: flex; gap: 8px; align-items: center; margin: 0 0 16px; padding: 10px 14px; border-radius: var(--raio-sm);
  background: color-mix(in srgb, var(--cor-acento) 12%, transparent); color: var(--cor-texto); font-weight: 600; font-size: 0.9rem;
}
.cadeia-estudo-vitrine-bloco .cadeia-estudo-vitrine { background: var(--cor-superficie); border-style: solid; border-left: 3px solid var(--cor-acento); }
.cadeia-estudo-vitrine-bloco .cadeia-estudo-vitrine h5 { margin: 0 0 4px; font-size: 1rem; }

.estudo-kpis { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.estudo-kpi {
  background: var(--cor-superficie); border: 1px solid var(--cor-borda); border-radius: var(--raio); padding: 14px 16px;
  display: flex; flex-direction: column; gap: 4px; border-top: 3px solid var(--cor-principal); break-inside: avoid;
}
.estudo-kpi-rotulo { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--cor-texto-suave); margin: 0; }
.estudo-kpi-valor { font-size: 1.8rem; font-weight: 800; letter-spacing: -0.03em; color: var(--cor-texto); line-height: 1.1; font-variant-numeric: tabular-nums; }
.estudo-kpi-valor small { font-size: 0.85rem; font-weight: 600; color: var(--cor-texto-suave); letter-spacing: 0; }
.estudo-kpi-det { font-size: 0.82rem; color: var(--cor-texto-suave); }
.estudo-onde {
  margin-top: 14px; padding: 16px 18px; border-radius: var(--raio); break-inside: avoid;
  background: var(--cor-principal-clara); border: 1px solid color-mix(in srgb, var(--cor-principal) 30%, transparent);
}
.estudo-onde ol { margin: 8px 0 0; padding: 0; list-style: none; counter-reset: onde; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.estudo-onde li { counter-increment: onde; display: flex; flex-direction: column; gap: 2px; padding-left: 38px; position: relative; }
.estudo-onde li::before {
  content: counter(onde); position: absolute; left: 0; top: 2px; width: 28px; height: 28px; border-radius: 50%;
  background: var(--cor-principal); color: #fff; font-weight: 800; display: grid; place-items: center; font-size: 0.9rem;
}
.estudo-onde li span { font-weight: 700; font-size: 1.05rem; }
.estudo-onde li small { font-weight: 500; color: var(--cor-texto-suave); }
.estudo-onde li em { font-style: normal; font-size: 0.82rem; color: var(--cor-texto-suave); }
.estudo-fim { display: flex; gap: 12px; align-items: center; border-top: 1px solid var(--cor-borda); padding-top: 14px; margin-top: 8px; color: var(--cor-texto-suave); font-size: 0.82rem; }
.estudo-fim p { margin: 0; }
@media (max-width: 640px) {
  .estudo-capa { padding: 22px 18px; min-height: 0; }
  .estudo-sumario { padding: 18px 16px; }
  .estudo-sumario a { grid-template-columns: 34px 1fr; }
  .estudo-sumario-plano { grid-column: 2; }
  .estudo-parte-num { font-size: 2.2rem; }
  .estudo-parte-cab h4 { font-size: 1.25rem; }
}

@media print {
  /* o PDF sai sempre claro, mesmo com o site em tema escuro */
  :root, :root[data-tema="escuro"], :root:not([data-tema="claro"]) {
    --cor-principal: #0f6f6b; --cor-principal-escura: #0a4f4c; --cor-principal-clara: #e3f2f1;
    --cor-acento: #ff8a3d; --cor-acento-escura: #e06f1f;
    --cor-fundo: #ffffff; --cor-superficie: #ffffff; --cor-borda: #e1e5e4;
    --cor-texto: #1a2321; --cor-texto-suave: #5c6b68; --cor-texto-fraco: #8a9895;
  }
  html, body { background: #fff !important; }
  * { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .cadeia-abas, .cadeia-pesquisa-form, .cadeia-pesquisa-modos, #cadeia-pesquisa-erro, .btn, .plano-rodape,
  .cadeia-pesquisa-mapa-legenda, .cadeia-pesquisa-mapa-chips, .cadeia-estudo-contagem,
  .cadeia-pesquisa > .secao-titulo, .cadeia-pesquisa > .cadeia-nota,
  body:has(.cadeia-estudo-doc) > .topo, body:has(.cadeia-estudo-doc) > .rodape { display: none !important; }
  body:has(.cadeia-estudo-doc) #conteudo { padding: 0 !important; margin: 0 !important; max-width: none !important; }
  .cadeia-estudo-doc { max-width: none; }
  .cadeia-pesquisa-mapa { min-height: 280px; }

  /* tabelas largas cabem na folha (a de contexto economico cortava a ultima coluna) */
  .cadeia-estudo-doc .cadeia-tabela-wrap { overflow: visible; }
  .cadeia-estudo-doc .cadeia-tabela { font-size: 8pt; }
  .cadeia-estudo-doc .cadeia-tabela th, .cadeia-estudo-doc .cadeia-tabela td { padding: 4px 5px; }
  .cadeia-estudo-doc .cadeia-tabela.cadeia-contexto-raio { font-size: 7pt; }
  .cadeia-estudo-doc .cadeia-tabela.cadeia-contexto-raio .num { white-space: normal; }
  .cadeia-pesquisa-cap { break-inside: auto; }
  .cadeia-pesquisa-cap h3, .cadeia-pesquisa-cap h4 { break-after: avoid; }

  /* capa de pagina inteira (1a folha), sem margem nem cabecalho */
  .estudo-capa {
    break-after: page; border-radius: 0; margin: 0; box-shadow: none;
    width: 210mm; height: 297mm; min-height: 0; padding: 22mm 20mm 18mm; box-sizing: border-box; gap: 0;
  }
  .estudo-capa::after { width: 150mm; height: 150mm; right: -50mm; bottom: -50mm; }
  .estudo-capa-titulo { font-size: 40pt; }
  .estudo-capa-local { font-size: 15pt; }
  .estudo-capa-ficha { grid-template-columns: 1fr 1fr; max-width: none; }
  .estudo-capa-ficha dd { font-size: 10.5pt; }
  .estudo-capa-rodape { font-size: 8.5pt; }

  /* um topico por pagina */
  .estudo-sumario { break-after: page; border: 0; padding: 0; margin: 0; }
  .estudo-sumario h4 { font-size: 22pt; margin-bottom: 8mm; }
  .estudo-sumario a { padding: 4mm 0; }
  .estudo-parte { break-before: page; margin: 0; }
  .estudo-sumario + .estudo-parte { break-before: auto; }
  .estudo-parte-cab { margin-bottom: 7mm; }
  .estudo-parte-num { font-size: 34pt; }
  .estudo-parte-cab h4 { font-size: 18pt; }
  .cadeia-estudo-vitrine-bloco .cadeia-estudo-vitrine, .estudo-kpi, .estudo-onde, table tr { break-inside: avoid; }
  .estudo-fim { break-before: avoid; margin-top: 10mm; }

  /* marca d'agua em todas as paginas (elemento fixo se repete a cada folha) */
  .estudo-marca-dagua {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4mm;
    position: fixed; inset: 0; z-index: 0; pointer-events: none;
    transform: rotate(-32deg); opacity: 0.045; color: var(--cor-principal-escura);
  }
  .estudo-marca-dagua span { font-size: 54pt; font-weight: 800; letter-spacing: -0.02em; white-space: nowrap; }
  .estudo-marca-dagua small { font-size: 16pt; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; }
  .estudo-capa, .estudo-sumario, .estudo-parte, .estudo-fim { position: relative; z-index: 1; }
  .estudo-sumario, .estudo-parte:not(.cadeia-trava):not(.cadeia-estudo-vitrine-bloco) { background: transparent; }

  @page {
    size: A4; margin: 18mm 15mm 18mm;
    @top-left { content: "Estudo prévio de mercado"; font-family: var(--fonte); font-size: 8pt; color: #0f6f6b; font-weight: 700; letter-spacing: 0.04em; }
    @top-center { content: ""; }
    @top-right { content: "Comércio Colaborativo"; font-family: var(--fonte); font-size: 8pt; color: #5c6b68; }
    @bottom-left { content: "Leitura de dado público oficial · não é recomendação"; font-family: var(--fonte); font-size: 7.5pt; color: #8a9895; }
    @bottom-center { content: ""; }
    @bottom-right { content: "página " counter(page) " de " counter(pages); font-family: var(--fonte); font-size: 8pt; color: #5c6b68; }
  }
  @page :first {
    margin: 0;
    @top-left { content: none; } @top-center { content: none; } @top-right { content: none; }
    @bottom-left { content: none; } @bottom-center { content: none; } @bottom-right { content: none; }
  }
}