/* ============================================================
   GPS · Área Cliente VIP — app CSS
   Carregado SÓ depois do login (screen-app). O CSS do login fica
   embutido em index.html para ler primeiro paint sem 2º request.
   Tokens replicam o cockpit base.css (independência intencional).
   ============================================================ */

/* ─── App shell ─────────────────────────────────────────── */
.vip-app {
  display: none;
  flex-direction: column;
  min-height: 100dvh;
  background: var(--cream);
}
.vip-app.is-active { display: flex; }

.vip-topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 24px;
  background: white;
  border-bottom: 1px solid var(--cream-border);
}
.vip-topbar .brand {
  display: flex;
  align-items: center;
  gap: 14px;
}
.vip-topbar .brand-mark {
  font-family: var(--ff-display);
  font-size: var(--font-xl);
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--ink);
  line-height: 1;
}
.vip-topbar .brand-mark span { color: var(--terracotta); }
.vip-topbar .troca-pill {
  /* Alinhado com .fase-pill do cockpit (negocios.css:170) */
  display: none;
  font-size: var(--font-xs);
  padding: 3px 9px;
  background: var(--terracotta-bg);
  color: var(--terracotta);
  border: 1px solid var(--terracotta-light);
  border-radius: 10px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.vip-topbar .troca-pill.is-on { display: inline-flex; align-items: center; gap: 6px; }
.vip-topbar .user-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}
.vip-topbar .user-name {
  font-size: var(--font-sm);
  color: var(--ink-soft);
}
.vip-topbar .btn-logout {
  font-size: var(--font-sm);
  color: var(--ink-muted);
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px 10px;
  border-radius: var(--r);
}
.vip-topbar .btn-logout:hover { color: var(--ink); background: var(--cream); }

@media (max-width: 540px) {
  .vip-topbar { padding: 12px 16px; }
  .vip-topbar .user-name { display: none; }
}

/* ─── Selector de negócios (só visível em troca) ─── */
.vip-troca-selector {
  display: none;
  background: white;
  border-bottom: 1px solid var(--cream-border);
  padding: 12px 24px;
}
.vip-troca-selector.is-on { display: block; }
.vip-troca-selector .label {
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-muted);
  margin-bottom: 8px;
}
.vip-troca-selector .opcoes {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.vip-troca-selector .opcao {
  padding: 8px 14px;
  background: var(--cream);
  border: 1px solid var(--cream-border);
  border-radius: var(--r);
  font-size: var(--font-sm);
  color: var(--ink-soft);
  cursor: pointer;
  transition: border-color .15s, background .15s;
}
.vip-troca-selector .opcao:hover { border-color: var(--ink-muted); }
.vip-troca-selector .opcao.is-active {
  background: var(--ink);
  color: white;
  border-color: var(--ink);
}

/* ─── Nav tabs ─────────────────────────────────────────── */
.vip-nav {
  background: white;
  border-bottom: 1px solid var(--cream-border);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.vip-nav::-webkit-scrollbar { display: none; }
.vip-nav-inner {
  display: flex;
  gap: 4px;
  padding: 0 20px;
  min-width: max-content;
}
.vip-nav-tab {
  background: none;
  border: none;
  padding: 16px 14px 14px;
  font-family: inherit;
  font-size: var(--font-sm);
  font-weight: 500;
  color: var(--ink-muted);
  cursor: pointer;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  transition: color .15s, border-color .15s;
}
.vip-nav-tab:hover { color: var(--ink-soft); }
.vip-nav-tab.is-active {
  color: var(--ink);
  border-bottom-color: var(--terracotta);
}

/* ─── Main content ─────────────────────────────────────── */
.vip-main {
  flex: 1;
  padding: 28px 24px 60px;
  max-width: 980px;
  width: 100%;
  margin: 0 auto;
}
@media (max-width: 540px) {
  .vip-main { padding: 20px 16px 60px; }
}

.vip-section {
  background: white;
  border: 1px solid var(--cream-border);
  border-radius: var(--r-lg);
  padding: 24px 28px;
  margin-bottom: 18px;
  box-shadow: 0 4px 20px rgba(26,24,20,0.04);
}
@media (max-width: 540px) {
  .vip-section { padding: 18px 18px; }
}
.vip-section.is-active-troca {
  box-shadow: 0 0 0 2px var(--terracotta), 0 4px 20px rgba(154,75,51,0.10);
}
.vip-section h2 {
  font-family: var(--ff-display);
  font-size: var(--font-xl);
  font-weight: 500;
  color: var(--ink);
  margin: 0 0 4px;
}
.vip-section .lead {
  font-size: var(--font-sm);
  color: var(--ink-muted);
  margin-bottom: 20px;
}

/* ─── Mantra bar — entre tabs e conteúdo ──────────────── */
.vip-mantra-bar {
  background: white;
  border-bottom: 1px solid var(--cream-border);
  padding: 14px 24px;
  text-align: center;
}
.vip-mantra {
  font-family: var(--ff-display);
  font-style: italic;
  font-weight: 400;
  font-size: var(--font-base);
  line-height: 1.5;
  color: var(--ink-soft);
  max-width: 640px;
  margin: 0 auto;
  letter-spacing: 0.005em;
  transition: opacity .35s ease-out;
}
@media (max-width: 540px) {
  .vip-mantra-bar { padding: 12px 18px; }
  .vip-mantra { font-size: var(--font-sm); }
}

/* ─── Loading & empty states ───────────────────────────── */
.vip-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  color: var(--ink-muted);
  font-size: var(--font-sm);
}
.vip-empty {
  text-align: center;
  padding: 40px 20px;
  color: var(--ink-muted);
  font-size: var(--font-sm);
}
.vip-empty .icon { font-size: 28px; margin-bottom: 10px; opacity: 0.5; }

/* ─── Fase pipeline (4 fases públicas) ─────────────────── */
.fase-track {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin: 12px 0 8px;
}
.fase-track::before {
  content: '';
  position: absolute;
  top: 13px;
  left: 14px;
  right: 14px;
  height: 1px;
  background: var(--cream-border);
  z-index: 0;
}
.fase-step {
  position: relative;
  z-index: 1;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.fase-num {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: white;
  border: 1.5px solid var(--cream-border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ff-display);
  font-size: var(--font-sm);
  font-weight: 600;
  color: var(--ink-muted);
}
.fase-step.is-passed .fase-num { background: var(--terracotta-light); border-color: var(--terracotta); color: white; }
.fase-step.is-current .fase-num { background: var(--ink); border-color: var(--ink); color: white; }
.fase-label {
  font-size: var(--font-sm);
  font-weight: 500;
  color: var(--ink-soft);
  text-align: center;
  letter-spacing: 0.02em;
  max-width: 90px;
  line-height: 1.3;
}
.fase-step.is-current .fase-label { color: var(--ink); }
@media (max-width: 540px) {
  .fase-label { font-size: var(--font-xs); max-width: 60px; }
}

.fase-mensagem {
  background: var(--cream);
  border-left: 3px solid var(--terracotta);
  padding: 14px 18px;
  border-radius: 0 var(--r) var(--r) 0;
  font-size: var(--font-base);
  color: var(--ink-soft);
  line-height: 1.55;
  margin-top: 18px;
}

/* ─── Consultor card ───────────────────────────────────── */
.consultor-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  background: var(--cream);
  border-radius: var(--r-lg);
  margin-top: 22px;
}
.consultor-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--ink);
  color: white;
  font-family: var(--ff-display);
  font-size: var(--font-lg);
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.consultor-info { flex: 1; min-width: 0; }
.consultor-info .role {
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-muted);
  margin-bottom: 2px;
}
.consultor-info .nome { font-size: var(--font-base); font-weight: 500; color: var(--ink); }
.consultor-actions { display: flex; gap: 8px; flex-shrink: 0; }
.consultor-actions a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: white;
  border: 1px solid var(--cream-border);
  color: var(--ink-soft);
  text-decoration: none;
  transition: background .15s;
}
.consultor-actions a:hover { background: var(--terracotta-bg); color: var(--ink); }

/* ─── Imóvel — galeria + meta ─────────────────────────── */
.imovel-galeria {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 6px;
  margin-bottom: 18px;
  border-radius: var(--r-lg);
  overflow: hidden;
  aspect-ratio: 16/9;
  max-height: 380px;
}
.imovel-galeria img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: var(--cream-dark);
}
.imovel-galeria .more-overlay {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--cream-dark);
  color: var(--ink);
  font-weight: 500;
  font-size: var(--font-base);
}
@media (max-width: 540px) {
  .imovel-galeria { grid-template-columns: 1fr; max-height: 240px; aspect-ratio: 4/3; }
  .imovel-galeria > *:nth-child(n+2) { display: none; }
}

.imovel-meta {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.imovel-meta .field .k {
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-muted);
  margin-bottom: 4px;
}
.imovel-meta .field .v {
  font-size: var(--font-base);
  color: var(--ink);
  font-weight: 500;
}
.imovel-descricao {
  font-size: var(--font-base);
  line-height: 1.65;
  color: var(--ink-soft);
  white-space: pre-wrap;
}

/* ─── Toast ─────────────────────────────────────────────── */
.vip-toast {
  position: fixed;
  left: 50%;
  bottom: 24px;
  transform: translate(-50%, 20px);
  background: var(--ink);
  color: white;
  padding: 12px 18px;
  border-radius: var(--r);
  font-family: var(--ff-body);
  font-size: var(--font-sm);
  line-height: 1.5;
  max-width: 480px;
  width: calc(100% - 40px);
  text-align: center;
  box-shadow: var(--shadow-lg);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s, transform .25s;
  z-index: 9999;
}
.vip-toast.is-on {
  opacity: 1;
  transform: translate(-50%, 0);
}

/* ─── Visitas — lista ───────────────────────────────────── */
.visita-card {
  background: var(--cream);
  border-radius: var(--r-lg);
  padding: 16px 18px;
  margin-bottom: 12px;
}
.visita-card .top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 8px;
}
.visita-card .data {
  font-family: var(--ff-display);
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--ink);
}
.visita-card .estado-wrap {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.visita-card .estado-acao {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 0;
  background: transparent;
  border: none;
  color: var(--ink-muted);
  border-radius: var(--r);
  cursor: pointer;
  transition: color .15s, background .15s;
}
.visita-card .estado-acao:hover {
  color: var(--terracotta);
  background: var(--terracotta-bg);
}
.visita-card .estado-pill {
  /* Alinhado com .fase-pill do cockpit (negocios.css:170) */
  font-size: var(--font-xs);
  padding: 3px 9px;
  border-radius: 10px;
  background: white;
  color: var(--ink-soft);
  border: 1px solid var(--cream-border);
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.visita-card .estado-pill.realizada { background: var(--terracotta-bg); color: var(--terracotta); border-color: var(--terracotta-light); }
.visita-card .estado-pill.cancelada { background: var(--red-bg); color: var(--red-soft); border-color: rgba(192,57,43,0.2); }
.visita-card .visitante { font-size: var(--font-sm); color: var(--ink-soft); }
.visita-card .feedback {
  margin-top: 10px;
  padding: 12px 14px;
  background: white;
  border-radius: var(--r);
  font-size: var(--font-sm);
  color: var(--ink-soft);
  line-height: 1.55;
  white-space: pre-wrap;
}
.visita-card .feedback .label {
  display: block;
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-muted);
  margin-bottom: 6px;
}
.visita-card .ficha-respostas {
  margin-top: 10px;
  padding: 12px 14px;
  background: white;
  border-radius: var(--r);
  font-size: var(--font-sm);
  color: var(--ink-soft);
}
.visita-card .ficha-respostas .qa { margin-bottom: 8px; }
.visita-card .ficha-respostas .qa:last-child { margin-bottom: 0; }
.visita-card .ficha-respostas .q { font-size: var(--font-xs); color: var(--ink-muted); margin-bottom: 2px; }
.visita-card .ficha-respostas .a { color: var(--ink); }

/* ─── Documentos checklist próxima fase ────────────────── */
.docs-checklist {
  background: var(--terracotta-bg);
  border-left: 3px solid var(--terracotta);
  border-radius: 0 var(--r) var(--r) 0;
  padding: 16px 20px;
  margin-bottom: 22px;
}
.docs-checklist-titulo {
  font-family: var(--ff-display);
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--ink);
  margin: 0 0 10px;
}
.docs-checklist-lista { list-style: none; margin: 0; padding: 0; }
.docs-checklist-item {
  padding: 10px 0;
  border-bottom: 1px solid rgba(154,75,51,0.15);
}
.docs-checklist-item:last-child { border-bottom: none; }
.docs-checklist-doc {
  font-size: var(--font-sm);
  color: var(--ink);
  font-weight: 500;
}
.docs-checklist-nota {
  font-size: var(--font-xs);
  color: var(--ink-soft);
  margin-top: 2px;
  line-height: 1.5;
}
.docs-checklist-marca {
  display: inline-block;
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--terracotta);
  font-weight: 500;
  margin-top: 4px;
}
.docs-checklist-rodape {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid rgba(154,75,51,0.2);
  font-size: var(--font-sm);
  color: var(--ink-soft);
  font-style: italic;
}

/* ─── Onboarding ───────────────────────────────────────── */
.onb-lista { display: flex; flex-direction: column; gap: 18px; margin-top: 12px; }
.onb-passo {
  display: flex;
  gap: 14px;
  background: var(--cream);
  border-radius: var(--r-lg);
  padding: 18px 20px;
  position: relative;
  transition: opacity .2s;
}
.onb-passo.is-passed { opacity: 0.55; }
.onb-passo.is-current {
  background: var(--terracotta-bg);
  box-shadow: 0 0 0 2px var(--terracotta);
}
.onb-passo-num {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: white;
  border: 1.5px solid var(--cream-border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ff-display);
  font-size: var(--font-lg);
  font-weight: 600;
  color: var(--ink-muted);
}
.onb-passo.is-passed .onb-passo-num { background: var(--terracotta-light); border-color: var(--terracotta); color: white; }
.onb-passo.is-current .onb-passo-num { background: var(--ink); border-color: var(--ink); color: white; }
.onb-passo-body { flex: 1; min-width: 0; }
.onb-passo-titulo {
  font-family: var(--ff-display);
  font-size: var(--font-lg);
  font-weight: 500;
  color: var(--ink);
  margin: 0 0 12px;
}
.onb-passo-bloco { margin-bottom: 12px; }
.onb-passo-bloco:last-child { margin-bottom: 0; }
.onb-passo-label {
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-muted);
  font-weight: 500;
  margin-bottom: 4px;
}
.onb-passo-texto {
  font-size: var(--font-sm);
  color: var(--ink-soft);
  line-height: 1.55;
}
.onb-passo-docs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}
.onb-doc-chip {
  display: inline-flex;
  align-items: center;
  font-size: var(--font-xs);
  padding: 4px 10px;
  background: white;
  border: 1px solid var(--cream-border);
  border-radius: 16px;
  color: var(--ink-soft);
  line-height: 1;
}
.onb-passo-cta {
  display: inline-block;
  margin-top: 10px;
  font-size: var(--font-sm);
  color: var(--terracotta);
  text-decoration: none;
}
.onb-passo-cta:hover { text-decoration: underline; }
.onb-rodape {
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid var(--cream-border);
  font-size: var(--font-sm);
  color: var(--ink-muted);
  font-style: italic;
}

/* ─── Propostas ────────────────────────────────────────── */
.propostas-lista { display: flex; flex-direction: column; gap: 14px; margin-top: 14px; }
.proposta-card {
  background: var(--cream);
  border-radius: var(--r-lg);
  padding: 18px 20px;
}
.proposta-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}
.proposta-meta { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.proposta-data {
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-muted);
}
.proposta-proponente {
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--ink);
}
.estado-pill.andamento  { background: white; color: var(--ink-soft); border: 1px solid var(--cream-border); }
.estado-pill.aceite     { background: var(--green-bg); color: var(--green); border: 1px solid rgba(45,80,22,0.25); }
.estado-pill.rejeitada  { background: var(--red-bg); color: var(--red-soft); border: 1px solid rgba(184,51,40,0.25); }

.proposta-valor {
  font-family: var(--ff-display);
  font-size: var(--font-2xl);
  font-weight: 600;
  color: var(--ink);
  line-height: 1.1;
  margin-bottom: 12px;
}
.proposta-valor-anterior {
  font-family: var(--ff-body);
  font-size: var(--font-sm);
  font-weight: 400;
  color: var(--ink-muted);
  text-decoration: line-through;
  margin-left: 10px;
}

.proposta-detalhes {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 12px;
}
.proposta-det { display: flex; flex-direction: column; gap: 2px; }
.proposta-det .k {
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-muted);
}
.proposta-det .v {
  font-size: var(--font-sm);
  color: var(--ink);
  font-weight: 500;
}

.proposta-condicoes {
  background: white;
  border-radius: var(--r);
  padding: 12px 14px;
  margin-top: 6px;
}
.proposta-condicoes .k {
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-muted);
  margin-bottom: 4px;
}
.proposta-condicoes .v {
  font-size: var(--font-sm);
  color: var(--ink-soft);
  line-height: 1.55;
  white-space: pre-wrap;
}

/* ─── Análise & Marketing ───────────────────────────────── */
.analise-grupo {
  font-family: var(--ff-display);
  font-size: var(--font-lg);
  font-weight: 500;
  color: var(--ink);
  margin: 22px 0 14px;
  padding-top: 18px;
  border-top: 1px solid var(--cream-border);
}
.analise-grupo:first-child { padding-top: 0; border-top: none; margin-top: 12px; }

.analise-bloco { margin-bottom: 22px; }
.analise-titulo {
  font-family: var(--ff-display);
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--ink);
  margin: 0 0 4px;
  letter-spacing: 0.01em;
}
.analise-micro {
  font-size: var(--font-sm);
  color: var(--ink-muted);
  margin-bottom: 10px;
  line-height: 1.5;
  font-style: italic;
}
.analise-texto {
  background: var(--cream);
  border-left: 3px solid var(--terracotta);
  border-radius: 0 var(--r) var(--r) 0;
  padding: 14px 18px;
  font-size: var(--font-sm);
  color: var(--ink-soft);
  line-height: 1.65;
  white-space: pre-wrap;
}
.analise-em {
  font-size: var(--font-xs);
  color: var(--ink-muted);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-top: 6px;
}

.mkt-totais {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 14px 0 22px;
}
.mkt-tot {
  background: var(--cream);
  border-radius: var(--r-lg);
  padding: 14px 12px;
  text-align: center;
}
.mkt-tot-num {
  font-family: var(--ff-display);
  font-size: var(--font-2xl);
  font-weight: 600;
  color: var(--ink);
  line-height: 1.1;
}
.mkt-tot-label {
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-muted);
  margin-top: 4px;
}
@media (max-width: 540px) {
  .mkt-totais { grid-template-columns: 1fr; }
}

.mkt-portais { list-style: none; margin: 0; padding: 0; }
.mkt-portal {
  display: flex;
  flex-direction: column;
  padding: 12px 0;
  border-bottom: 1px solid var(--cream-border);
}
.mkt-portal:last-child { border-bottom: none; }
.mkt-portal-nome {
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--ink);
  margin-bottom: 2px;
}
.mkt-portal-meta {
  font-size: var(--font-sm);
  color: var(--ink-muted);
  line-height: 1.5;
}

/* ─── A minha procura — critérios + chips ───────────────── */
.procura-criterios {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin: 18px 0 24px;
}
.procura-criterios .criterio {
  background: var(--cream);
  border-radius: var(--r-lg);
  padding: 12px 16px;
}
.procura-criterios .k {
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-muted);
  margin-bottom: 4px;
}
.procura-criterios .v {
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--ink);
}

.procura-bloco { margin-top: 18px; }
.procura-bloco-titulo {
  font-family: var(--ff-display);
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--ink);
  margin: 0 0 4px;
  letter-spacing: 0.01em;
}
.procura-bloco-lead {
  font-size: var(--font-sm);
  color: var(--ink-muted);
  margin-bottom: 10px;
  line-height: 1.5;
}

.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.chip {
  /* Alinhado com .pc-chip do cockpit (preferencias-chips.css:44) */
  display: inline-flex;
  align-items: center;
  font-size: var(--font-sm);
  padding: 5px 12px;
  background: var(--terracotta-bg);
  color: var(--terracotta);
  border: 1px solid var(--terracotta-light);
  border-radius: 16px;
  line-height: 1;
}

.procura-rodape {
  margin-top: 28px;
  padding-top: 18px;
  border-top: 1px solid var(--cream-border);
  font-size: var(--font-sm);
  color: var(--ink-muted);
  font-style: italic;
}

/* ─── Imóveis sugeridos — grid de cards com score ───────── */
.sug-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 16px;
  margin-top: 14px;
}
.sug-card {
  background: var(--cream);
  border-radius: var(--r-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform .15s, box-shadow .15s;
}
.sug-card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(20,35,53,0.10); }
.sug-img {
  position: relative;
  height: 150px;
  background-size: cover;
  background-position: center;
}
.match-score {
  /* Alinhado com .fase-pill do cockpit (negocios.css:170) */
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: var(--font-xs);
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 10px;
  background: white;
  color: var(--ink);
}
.match-score--hi  { background: var(--terracotta); color: white; }
.match-score--mid { background: white; color: var(--ink); }
.match-score--lo  { background: var(--cream-dark); color: var(--ink-muted); }
.sug-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 4px; }
.sug-meta {
  display: flex;
  justify-content: space-between;
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-muted);
}
.sug-fonte { font-weight: 500; }
.sug-titulo {
  font-family: var(--ff-display);
  font-size: var(--font-lg);
  font-weight: 500;
  color: var(--ink);
  margin-top: 4px;
}
.sug-local { font-size: var(--font-sm); color: var(--ink-soft); }
.sug-bottom {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--cream-border);
}
.sug-preco {
  font-family: var(--ff-display);
  font-size: var(--font-base);
  font-weight: 600;
  color: var(--ink);
}
.sug-area {
  font-size: var(--font-sm);
  color: var(--ink-muted);
}
.sug-rodape {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--cream-border);
  font-size: var(--font-sm);
  color: var(--ink-muted);
  font-style: italic;
}

/* ─── Sugeridos — botões interesse + nota ─────────────── */
.sug-card.is-interessa { box-shadow: 0 0 0 2px var(--terracotta); }
.sug-card.is-nao_interessa { opacity: 0.6; }

.sug-actions {
  display: flex;
  gap: 6px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--cream-border);
}
.sug-btn {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 7px 8px;
  font-family: var(--ff-body);
  font-size: var(--font-xs);
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: white;
  color: var(--ink-soft);
  border: 1px solid var(--cream-border);
  border-radius: var(--r);
  cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
}
.sug-btn:hover { background: var(--cream); }
.sug-btn--yes.is-on { background: var(--terracotta); color: white; border-color: var(--terracotta); }
.sug-btn--no.is-on  { background: var(--ink); color: white; border-color: var(--ink); }
.sug-btn svg { flex-shrink: 0; }

.sug-toggle-nota {
  align-self: flex-start;
  margin-top: 6px;
  font-family: var(--ff-body);
  font-size: var(--font-xs);
  color: var(--terracotta);
  background: none;
  border: none;
  padding: 4px 0;
  cursor: pointer;
  letter-spacing: 0.02em;
}
.sug-toggle-nota:hover { text-decoration: underline; }

.sug-nota-wrap {
  display: none;
  margin-top: 4px;
}
.sug-nota-wrap.is-open { display: block; }
.sug-nota {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--cream-border);
  border-radius: var(--r);
  background: white;
  color: var(--ink);
  font-family: var(--ff-body);
  font-size: var(--font-sm);
  line-height: 1.5;
  resize: vertical;
  outline: none;
  transition: border-color .15s;
}
.sug-nota:focus { border-color: var(--terracotta); box-shadow: 0 0 0 3px rgba(154,75,51,0.12); }
.sug-nota-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 6px;
}
.sug-btn-save {
  font-family: var(--ff-body);
  font-size: var(--font-xs);
  font-weight: 500;
  letter-spacing: 0.04em;
  padding: 6px 12px;
  background: var(--ink);
  color: white;
  border: none;
  border-radius: var(--r);
  cursor: pointer;
}
.sug-btn-save:hover { background: var(--terracotta); }
.sug-nota-status {
  font-size: var(--font-xs);
  color: var(--ink-muted);
}

/* ─── Documentos — lista + upload box ──────────────────── */
.docs-upload {
  background: var(--cream);
  border-radius: var(--r-lg);
  padding: 18px 20px;
  margin-bottom: 24px;
}
.docs-upload-head { margin-bottom: 14px; }
.docs-upload-titulo {
  font-family: var(--ff-display);
  font-size: var(--font-lg);
  font-weight: 500;
  color: var(--ink);
  margin-bottom: 4px;
}
.docs-upload-lead {
  font-size: var(--font-sm);
  color: var(--ink-soft);
  line-height: 1.55;
}
.docs-upload-form {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: stretch;
}
.docs-upload-select {
  flex: 1 1 220px;
  min-width: 180px;
  padding: 10px 14px;
  border: 1px solid var(--cream-border);
  border-radius: var(--r);
  background: white;
  color: var(--ink);
  font-family: inherit;
  font-size: var(--font-base);
  cursor: pointer;
}
.docs-upload-select:focus {
  outline: none;
  border-color: var(--terracotta);
  box-shadow: 0 0 0 3px rgba(154,75,51,0.12);
}
.docs-upload-file {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 18px;
  background: var(--ink);
  color: white;
  border-radius: var(--r);
  font-size: var(--font-sm);
  font-weight: 500;
  cursor: pointer;
  transition: background .15s;
}
.docs-upload-file:hover { background: var(--terracotta); }
.docs-upload-status {
  margin-top: 10px;
  font-size: var(--font-sm);
  color: var(--ink-muted);
  min-height: 18px;
}
.docs-upload-status.is-uploading { color: var(--ink-soft); }
.docs-upload-status.is-ok { color: var(--green); }
.docs-upload-status.is-err { color: var(--red-soft); }

.docs-grupo-titulo {
  font-family: var(--ff-display);
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--ink);
  margin: 22px 0 10px;
  letter-spacing: 0.02em;
}
.docs-lista { list-style: none; margin: 0; padding: 0; }
.doc-item {
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 12px 14px;
  background: var(--cream);
  border-radius: var(--r);
  margin-bottom: 8px;
}
.doc-icon { color: var(--ink-muted); flex-shrink: 0; }
.doc-body { flex: 1; min-width: 0; }
.doc-titulo {
  font-size: var(--font-base);
  color: var(--ink);
  font-weight: 500;
  margin-bottom: 2px;
}
.doc-meta {
  font-size: var(--font-xs);
  color: var(--ink-muted);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.doc-origem {
  /* Alinhado com .fase-pill do cockpit (negocios.css:170) */
  font-size: var(--font-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--ink-muted);
  padding: 3px 9px;
  background: white;
  border: 1px solid var(--cream-border);
  border-radius: 10px;
  white-space: nowrap;
  flex-shrink: 0;
}
.doc-origem--cliente {
  background: var(--terracotta-bg);
  color: var(--terracotta);
  border-color: var(--terracotta-light);
}

/* ─── A minha casa — teaser pré + dicas pós ───────────── */
.minha-casa-teaser {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  margin-top: 18px;
}
.teaser-bloco {
  background: var(--cream);
  border-radius: var(--r-lg);
  padding: 18px 20px;
}
.teaser-titulo {
  font-family: var(--ff-display);
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--ink);
  margin-bottom: 6px;
}
.teaser-texto {
  font-size: var(--font-sm);
  color: var(--ink-soft);
  line-height: 1.55;
}

.minha-casa-grupo {
  font-family: var(--ff-display);
  font-size: var(--font-lg);
  font-weight: 500;
  color: var(--ink);
  margin: 22px 0 12px;
  letter-spacing: 0.01em;
}

.dicas-lista, .manut-lista { list-style: none; margin: 0; padding: 0; }
.dica-item, .manut-item {
  display: flex;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid var(--cream-border);
}
.dica-item:last-child, .manut-item:last-child { border-bottom: none; }
.dica-icon {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--terracotta-bg);
  color: var(--terracotta);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 2px;
}
.dica-body { flex: 1; min-width: 0; }
.dica-titulo {
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--ink);
  margin-bottom: 4px;
}
.dica-texto {
  font-size: var(--font-sm);
  color: var(--ink-soft);
  line-height: 1.55;
}
.dica-link {
  display: inline-block;
  margin-top: 6px;
  font-size: var(--font-sm);
  color: var(--terracotta);
  text-decoration: none;
}
.dica-link:hover { text-decoration: underline; }

.manut-period {
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-muted);
  font-weight: 500;
  width: 80px;
  flex-shrink: 0;
  padding-top: 3px;
}
.manut-titulo {
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--ink);
  margin-bottom: 2px;
}
.manut-texto {
  font-size: var(--font-sm);
  color: var(--ink-soft);
  line-height: 1.55;
}

/* ─── Eventos GPS — grid de cards ──────────────────────── */
.eventos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 18px;
  margin-top: 8px;
}
.evento-card {
  display: flex;
  flex-direction: column;
  background: var(--cream);
  border-radius: var(--r-lg);
  overflow: hidden;
  transition: transform .15s, box-shadow .15s;
}
.evento-card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(26,24,20,0.08); }
.evento-card.is-passed { opacity: 0.78; }
.evt-img {
  height: 160px;
  background-size: cover;
  background-position: center;
  background-color: var(--cream-dark);
}
.evt-body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.evt-meta {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-muted);
}
.evt-tipo { font-weight: 500; }
.evt-titulo {
  font-family: var(--ff-display);
  font-size: var(--font-lg);
  font-weight: 500;
  color: var(--ink);
  margin: 0;
  line-height: 1.3;
}
.evt-local { font-size: var(--font-sm); color: var(--ink-soft); }
.evt-desc {
  font-size: var(--font-sm);
  color: var(--ink-soft);
  line-height: 1.55;
  margin: 4px 0 8px;
}
.evt-cta {
  align-self: flex-start;
  font-family: inherit;
  font-size: var(--font-sm);
  font-weight: 500;
  color: var(--ink);
  background: white;
  border: 1px solid var(--ink);
  border-radius: var(--r);
  padding: 9px 16px;
  cursor: pointer;
  margin-top: auto;
  transition: background .15s, color .15s;
}
.evt-cta:hover:not(:disabled) { background: var(--ink); color: white; }
.evt-cta:disabled { cursor: default; }
.evt-cta.is-done { background: var(--terracotta-bg); color: var(--terracotta); border-color: var(--terracotta-light); }

/* ─── Visitas — acções comprador (ficha + proposta) ────── */
.visita-acoes {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--cream-border);
}
.visita-acao {
  flex: 1 1 180px;
  font-family: var(--ff-body);
  font-size: var(--font-sm);
  font-weight: 500;
  padding: 9px 14px;
  background: white;
  color: var(--ink);
  border: 1px solid var(--cream-border);
  border-radius: var(--r);
  cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
}
.visita-acao:hover { background: var(--cream-dark); }
.visita-acao--cta { background: var(--ink); color: white; border-color: var(--ink); }
.visita-acao--cta:hover { background: var(--terracotta); border-color: var(--terracotta); }

/* ─── Actividade — timeline ────────────────────────────── */
.timeline { position: relative; padding-left: 22px; margin-top: 8px; }
.timeline::before {
  content: '';
  position: absolute;
  top: 6px;
  bottom: 6px;
  left: 6px;
  width: 1px;
  background: var(--cream-border);
}
.timeline-item {
  position: relative;
  padding-bottom: 18px;
}
.timeline-item::before {
  content: '';
  position: absolute;
  top: 6px;
  left: -22px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: white;
  border: 2px solid var(--terracotta);
}
.timeline-item .tl-data {
  font-size: var(--font-xs);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-muted);
  margin-bottom: 4px;
}
.timeline-item .tl-label {
  font-size: var(--font-sm);
  color: var(--ink);
  line-height: 1.5;
}
