/* ══════════════════════════════════════════════════════════════════════════
   Contraste (WCAG 2.1 AA) — ajustes das landings a partir da medição de 2026-09-20.
   Carregar DEPOIS dos <style> da página (vence por ordem de origem). Cada bloco diz
   qual falha corrige e o contraste que passou a ter.
   Tokens: cada página pode redefinir --c-* num <style> logo depois do <link>.
   ══════════════════════════════════════════════════════════════════════════ */
:root {
  --c-acento-texto:  #7D6033;  /* bronze escuro: acento como TEXTO em fundo claro   (4,8–5,3:1; o #B89667 dava 1,6–2,5:1) */
  --c-acento-escuro: #DCC9AE;  /* dourado claro: acento como texto em fundo escuro   (≥ 5,4:1 sobre o oliva #464C44)       */
  --c-texto-botao:   #1C1C1E;  /* texto de botão dourado                             (7,6:1; o oliva dava 3,9–4,5:1)       */
  --c-chip-bg:       rgba(10, 13, 9, 0.78);
}

/* 1) Acento (bronze/dourado) usado como texto sobre seções CLARAS ─────────────────
      Antes: rótulos "MÉTODO CADORY", "Localização", números 01–05 e "Ler editorial" com 1,6–2,5:1 */
:is(.section-light, #curadoria, .metodo-section, .olhar-section, .artigo-card, .manifesto-card)
  :is(.label, .etapa-num, .artigo-link) {
  color: var(--c-acento-texto) !important;
}

/* 2) Botões e acentos sobre fundo escuro/oliva ───────────────────────────────── */
.btn-primary, button.btn-primary, a.btn-primary { color: var(--c-texto-botao); }
.btn-secondary { color: var(--c-acento-escuro); }
.btn-secondary:hover { color: var(--c-texto-botao); }
.vender-beneficio h4 { color: var(--c-acento-escuro); }

/* 3) Banner de cookies (LGPD) — estilos dele vêm depois no documento, por isso #id + !important */
#lgpd-actions .lgpd-primary { color: var(--c-texto-botao) !important; }
#lgpd-text a { color: var(--c-acento-escuro) !important; }

/* 4) Cabeçalho e textos do herói sobre FOTO/VÍDEO ────────────────────────────────
      Menu, marca ("VILA EMA", "MANAI") e "Torre L · Lançamento" ficavam sobre o céu claro (2,0–3,4:1).
      Película escura no topo + lateral esquerda (onde fica o texto), sem esconder a foto. */
/* As películas ficam DENTRO de .hero-overlay, que em todas as páginas já é posicionado abaixo do texto —
   assim não escurecem o título nem mexem no layout. */
.hero-overlay::before {               /* topo: menu e marca */
  content: ""; position: absolute; inset: 0 0 auto 0; height: 38%;
  background: linear-gradient(to bottom, rgba(6, 8, 6, 0.72), rgba(6, 8, 6, 0.32) 55%, rgba(6, 8, 6, 0));
  pointer-events: none;
}
.hero-overlay::after {                /* esquerda: título e parágrafo */
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(6, 8, 6, 0.52) 0%, rgba(6, 8, 6, 0.26) 48%, rgba(6, 8, 6, 0) 74%);
  pointer-events: none;
}
.hero-badge {                         /* selo sobre a foto: fundo escuro translúcido */
  background: var(--c-chip-bg) !important;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}

/* No celular o texto do herói ocupa a largura toda — película uniforme em vez de só a lateral esquerda */
@media (max-width: 700px) {
  .hero-overlay::after { background: linear-gradient(to top, rgba(6, 8, 6, 0.62), rgba(6, 8, 6, 0.38)); }
}

/* 5) Cartões de imóveis da home (carregados da API — só aparecem em produção)
      Texto ("Destaque", título, quartos) sobre foto clara chegava a 1,1:1. O bloco de texto ganha
      o próprio fundo em degradê (a foto continua aparecendo no alto do cartão). */
.imovel-card-overlay {
  background: linear-gradient(to top, rgba(14, 14, 15, 0.9) 0%, rgba(14, 14, 15, 0.55) 60%, rgba(14, 14, 15, 0.15) 100%);
}
.imovel-card-info {
  padding-top: 3.5rem;
  background: linear-gradient(to top, rgba(14, 14, 15, 0.94) 0%, rgba(14, 14, 15, 0.9) 60%, rgba(14, 14, 15, 0) 100%);
}
.imovel-card-info .label { color: var(--c-acento-escuro); }
.imovel-card-info h3, .imovel-card-info .imovel-spec { text-shadow: 0 1px 8px rgba(0, 0, 0, 0.5); }

