/* REMAX GOLD — bios. Celular primeiro; computador com largura de leitura controlada.
   Tipografia do sistema (SF Pro no iPhone, Roboto no Android): nenhuma fonte baixada. */
:root {
  --azul: #0b1f3f;
  --azul-2: #17346a;
  --azul-fundo: #0a1834;
  --dourado: #c69a3e;
  --dourado-texto: #8a6a1f; /* dourado para texto pequeno sobre claro (contraste 5:1) */
  --dourado-escuro: #9a7426;
  --dourado-claro: #f2e3bd;
  --vermelho: #d6202e;
  --tinta: #0f1a2c;
  --suave: #5d6678;
  --linha: #e6e9ef;
  --superficie: #f4f6f9;
  --fundo: #ffffff;
  --fundo-2: #f7f8fb;
  --destaque: var(--azul);     /* títulos e textos de marca sobre o fundo */
  --icone: #636c7b;
  --apagado: #6b7486;
  --cartao: #ffffff;
  --cartao-2: #fbfbfc;
  --sombra: 0 1px 2px rgba(11, 31, 63, .05), 0 4px 14px rgba(11, 31, 63, .05);
  --sombra-alta: 0 2px 6px rgba(11, 31, 63, .08), 0 16px 36px rgba(11, 31, 63, .14);
  --sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", system-ui, "Segoe UI", Roboto, Arial, sans-serif;
  --curva: cubic-bezier(.2, .7, .2, 1);
  color-scheme: light;
}
/* modo noturno (botão sol/lua; escolha guardada no aparelho) */
:root[data-tema="escuro"] {
  --fundo: #07122a;
  --dourado-texto: #e2bf6e;
  --fundo-2: #0a1834;
  --destaque: #ffffff;
  --tinta: #eef2fa;
  --suave: #aab4c8;
  --icone: #9aa6bd;
  --apagado: #7f8aa2;
  --linha: rgba(255, 255, 255, .09);
  --superficie: #13254a;
  --cartao: #0d1d3d;
  --cartao-2: #0b1934;
  --sombra: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .25);
  --sombra-alta: 0 2px 6px rgba(0, 0, 0, .35), 0 16px 36px rgba(0, 0, 0, .4);
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: clip; }
body {
  margin: 0;
  background: var(--fundo);
  color: var(--tinta);
  font: 400 15px/1.45 var(--sans);
  letter-spacing: -.005em;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  transition: background-color .3s, color .3s;
}
img { display: block; max-width: 100%; }

.coluna { max-width: 440px; margin: 0 auto; padding: 0 16px calc(env(safe-area-inset-bottom) + 24px); }

/* ---------- cabeçalho ---------- */
.cabecalho { position: relative; isolation: isolate; text-align: center; padding-top: calc(env(safe-area-inset-top) + 32px); }
.cabecalho::before { /* brilho dourado bem suave atrás do avatar */
  content: ""; position: absolute; z-index: -1; left: 50%; top: calc(env(safe-area-inset-top) - 30px); width: 340px; height: 260px; margin-left: -170px;
  background: radial-gradient(closest-side, rgba(198, 154, 62, .16), rgba(198, 154, 62, .05) 60%, transparent);
  pointer-events: none;
}
/* avatar com anel dourado girando devagar e selo de verificado */
.avatar-moldura {
  position: relative; display: inline-grid; place-items: center; padding: 3px; border-radius: 50%;
  box-shadow: 0 12px 30px rgba(11, 31, 63, .18);
}
.avatar-moldura::before {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 50%;
  background: conic-gradient(#f6dfa0, #c69a3e, #8f6a22, #c69a3e, #f2e3bd, #c69a3e, #f6dfa0);
  animation: girar 10s linear infinite;
}
.avatar {
  width: 120px; height: 120px; border-radius: 50%;
  object-fit: cover; border: 4px solid var(--fundo);
  background: var(--azul);
}
.selo-verificado {
  position: absolute; right: 1px; bottom: 5px; width: 32px; height: 32px;
  animation: carimbar .5s .7s var(--curva) both;
}
.selo-verificado polygon { fill: #1d9bf0; stroke: #fff; stroke-width: 2.4; stroke-linejoin: round; }
.selo-verificado path { fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
@keyframes girar { to { transform: rotate(1turn); } }
@keyframes carimbar { from { opacity: 0; transform: scale(.3) rotate(-30deg); } }
.avatar-iniciais {
  display: grid; place-items: center;
  background: linear-gradient(150deg, var(--azul-2), var(--azul));
  color: var(--dourado); font-size: 32px; font-weight: 600; letter-spacing: -.01em;
}
h1 { margin: 14px 0 0; color: var(--destaque); font-size: 27px; font-weight: 700; line-height: 1.1; letter-spacing: -.03em; }
.subtitulo { margin: 6px 0 0; color: var(--suave); font-size: 14px; }
.apresentacao { margin: 10px auto 0; max-width: 31ch; color: var(--suave); font-size: 15.5px; line-height: 1.45; }
.redes { display: flex; justify-content: center; gap: 8px; margin-top: 9px; }
.rede { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; color: var(--icone); transition: color .18s, transform .18s var(--curva); }
.rede .ico { width: 24px; height: 24px; }
.rede.pendente { opacity: .8; }
a.rede:hover { color: var(--destaque); }
a.rede:active { transform: scale(.92); }
a.rede:focus-visible { outline: 2px solid var(--dourado); outline-offset: 3px; border-radius: 8px; }
.selo-demo {
  display: inline-block; margin: 14px 0 0; padding: 5px 11px; border-radius: 999px;
  background: #fdeff0; color: #9b1d27; font-size: 12px; font-weight: 500;
}

/* botão sol/lua no canto superior direito */
.tema {
  position: absolute; z-index: 5; top: calc(env(safe-area-inset-top) + 14px); right: 16px;
  display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--linha); border-radius: 50%;
  background: var(--cartao); color: var(--icone); cursor: pointer; box-shadow: var(--sombra);
  transition: transform .18s var(--curva), background-color .3s, color .3s;
}
.tema .ico { grid-area: 1 / 1; width: 20px; height: 20px; transition: opacity .3s, transform .45s var(--curva); }
.tema .ico-lua, :root[data-tema="escuro"] .tema .ico-sol { opacity: 0; transform: rotate(-90deg) scale(.5); }
:root[data-tema="escuro"] .tema .ico-lua { opacity: 1; transform: none; color: var(--dourado-claro); }
.tema:active { transform: scale(.92); }
.tema:focus-visible { outline: 2px solid var(--dourado); outline-offset: 3px; }
:root[data-tema="escuro"] .aviso { background: #1d3a75; }

/* ---------- cards ---------- */
.cards { display: grid; gap: 16px; margin-top: 28px; }
.card { position: relative; color: var(--tinta); text-decoration: none; transition: transform .18s var(--curva), box-shadow .25s var(--curva); }

/* vitrine: card grande, imagem/arte de ponta a ponta, texto na base */
.card-vitrine {
  display: flex; align-items: flex-end; aspect-ratio: 5 / 6; overflow: hidden;
  border-radius: 26px; background: var(--azul-fundo); color: #fff;
  box-shadow: 0 10px 30px rgba(11, 31, 63, .16);
  isolation: isolate;
}
.card-vitrine::after { /* leitura do texto sobre a imagem */
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(8, 20, 44, 0) 34%, rgba(8, 20, 44, .58) 62%, rgba(8, 20, 44, .94) 100%);
}
.vitrine-imagem, .vitrine-fundo { position: absolute; inset: 0; width: 100%; height: 100%; }
.vitrine-imagem { object-fit: cover; object-position: center top; transition: transform .7s var(--curva); }
.vitrine-conteudo { position: relative; z-index: 2; display: grid; justify-items: start; gap: 6px; padding: 24px 22px 32px; }
.vitrine-rotulo { color: var(--dourado-claro); font-size: 14px; font-weight: 600; letter-spacing: -.01em; }
.vitrine-titulo { font-size: 34px; font-weight: 700; line-height: 1.02; letter-spacing: -.04em; text-wrap: balance; }
.vitrine-desc { max-width: 30ch; color: rgba(255, 255, 255, .8); font-size: 15px; line-height: 1.4; }

/* botão-pílula com círculo de seta */
.pilula {
  display: inline-flex; align-items: center; gap: 12px; margin-top: 12px;
  padding: 5px 5px 5px 18px; border-radius: 999px;
  background: #fff; color: var(--azul); font-size: 15px; font-weight: 600; letter-spacing: -.01em;
}
.pilula-seta { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--azul); color: #fff; transition: transform .2s var(--curva); }
.pilula-seta .ico { width: 17px; height: 17px; }
.pilula-breve { border: 0; font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; background: rgba(255, 255, 255, .9); }
.pilula-breve:active { transform: scale(.97); }
/* aviso ao tocar num botão pendente */
.aviso {
  position: fixed; left: 50%; bottom: calc(env(safe-area-inset-bottom) + 20px); z-index: 10; width: max-content; max-width: calc(100% - 32px);
  padding: 12px 18px; border-radius: 14px; background: var(--azul); color: #fff; font-size: 14px; font-weight: 500;
  box-shadow: 0 10px 30px rgba(11, 31, 63, .3); transform: translate(-50%, 20px); opacity: 0; pointer-events: none;
  transition: opacity .2s, transform .25s var(--curva);
}
.aviso.on { opacity: 1; transform: translate(-50%, 0); }

/* artes sem foto (SVG em componentes.js) */
.vitrine-arte { position: absolute; inset: 0; width: 100%; height: 100%; }
.vitrine-arte text { font-family: var(--sans); }
.nuvem, .pino, .balao, .placa, .pulso, .pendulo, .faisca { transform-box: fill-box; transform-origin: center; } /* só nos animados: não afeta os transform= do SVG */
.fundo-liso { background: linear-gradient(165deg, #12306a, var(--azul-fundo) 70%); }
.fundo-casa, .fundo-balao { background: radial-gradient(80% 40% at 70% 0%, rgba(198, 154, 62, .45), transparent 70%), linear-gradient(180deg, #3a5c9e, #1a3c80 45%, var(--azul-fundo) 85%); }
.fundo-placa { background: radial-gradient(80% 40% at 50% 0%, rgba(198, 154, 62, .45), transparent 70%), linear-gradient(180deg, #3a5c9e, #1a3c80 40%, var(--azul-fundo) 85%); }
.fundo-equipe {
  background:
    repeating-radial-gradient(circle at 50% 32%, transparent 0 34px, rgba(198, 154, 62, .16) 35px 36px),
    radial-gradient(60% 45% at 50% 32%, rgba(60, 100, 190, .5), transparent 72%),
    linear-gradient(165deg, #12306a, var(--azul-fundo) 70%);
}
.fundo-mapa { background: #13306a; }
.nuvem { fill: rgba(255, 255, 255, .13); animation: vento 14s calc(var(--n) * -3s) ease-in-out infinite alternate; }
.luz { animation: acender 2.4s calc(var(--n) * -.5s) ease-in-out infinite alternate; }
.arte-casa .vidro { animation: acender 3.2s ease-in-out infinite alternate; }
.pino { transform-origin: 50% 100%; animation: quicar 1.6s ease-in-out infinite alternate; }
.arte-casa .lupa { animation: lupa 6s ease-in-out infinite alternate; }
.arte-casa .lupa-zoom { animation: lupa-zoom 6s ease-in-out infinite alternate; } /* compensa o deslocamento: o zoom acompanha o centro da lente */
.arte-placa .placa { transform-origin: 50% 100%; animation: balancar 4s ease-in-out infinite alternate; }
.balao { animation: flutuar 5s ease-in-out infinite alternate; }
.arte-equipe .pendulo { transform-origin: 50% 0%; animation: balancar 3.6s ease-in-out infinite alternate; }
.arte-equipe .reflexo { transform-box: view-box; animation: reflexo 4s 1s ease-in-out infinite; }
.faisca { animation: piscar 2.2s calc(var(--n) * -.45s) ease-in-out infinite alternate; }
.arte-mapa .rota { animation: andar 1.2s linear infinite; }
.arte-mapa .pulso { animation: pulso 2.4s calc(var(--n) * 1.2s) ease-out infinite; }
@keyframes vento { from { transform: translateX(-3px); } to { transform: translateX(3px); } }
@keyframes acender { from { opacity: .7; } to { opacity: 1; } }
@keyframes quicar { from { transform: translateY(0); } to { transform: translateY(-1.6px); } }
@keyframes lupa { from { transform: translateX(-26px); } to { transform: translateX(0); } }
@keyframes lupa-zoom { from { transform: translateX(26px); } to { transform: translateX(0); } }
@keyframes balancar { from { transform: rotate(-1.2deg); } to { transform: rotate(1.2deg); } }
@keyframes flutuar { from { transform: translateY(1.5px) rotate(-1.5deg); } to { transform: translateY(-1.5px) rotate(1.5deg); } }
@keyframes reflexo { 0%, 50% { transform: translateX(0) skewX(-15deg); } 100% { transform: translateX(30px) skewX(-15deg); } }
@keyframes piscar { from { transform: scale(.4); opacity: .3; } to { transform: scale(1); opacity: 1; } }
@keyframes andar { to { stroke-dashoffset: -3; } }
@keyframes pulso { from { transform: scale(.3); opacity: .9; } to { transform: scale(2.4); opacity: 0; } }

/* linha e sólido: cards compactos (bio do corretor) */
.card-linha, .card-solido {
  display: flex; align-items: center; gap: 14px; min-height: 66px; padding: 13px 14px 13px 13px;
  border: 1px solid var(--linha); border-radius: 20px; background: var(--cartao); box-shadow: var(--sombra);
}
.card-icone { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--superficie); color: var(--destaque); font-weight: 600; font-size: 14px; }
.card-icone .ico { width: 22px; height: 22px; }
.card-texto { flex: 1; min-width: 0; display: grid; gap: 1px; }
.card-titulo { font-size: 16px; font-weight: 600; letter-spacing: -.015em; }
.card-desc { color: var(--suave); font-size: 13.5px; }
.seta { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--superficie); color: var(--destaque); transition: transform .2s var(--curva); }
.seta .ico { width: 17px; height: 17px; }
.card-solido { border: 0; color: #fff; background: linear-gradient(150deg, var(--azul-2), var(--azul)); box-shadow: 0 8px 22px rgba(11, 31, 63, .22); }
.card-solido .card-icone { background: rgba(255, 255, 255, .1); color: var(--dourado); }
.card-solido .card-desc { color: rgba(255, 255, 255, .72); }
.card-solido .seta { background: var(--vermelho); color: #fff; }

/* texto: ação secundária discreta */
.card-texto.card { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; color: var(--destaque); font-size: 15px; font-weight: 600; }
.card-texto.pendente { color: var(--apagado); }

.selo-breve {
  flex: none; padding: 4px 9px; border-radius: 999px; background: var(--dourado-claro); color: var(--dourado-escuro);
  font-size: 10.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
}
.card.pendente { cursor: default; }
.card-linha.pendente { box-shadow: none; background: var(--cartao-2); }

/* ---------- imóveis em destaque ---------- */
.destaques { margin-top: 36px; }
.secao-titulo { margin: 0 0 14px 2px; color: var(--destaque); font-size: 22px; font-weight: 700; letter-spacing: -.03em; }
.grade-imoveis { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.imovel {
  display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--linha); border-radius: 18px;
  background: var(--cartao); color: var(--tinta); text-decoration: none; box-shadow: var(--sombra);
  transition: transform .18s var(--curva), box-shadow .25s var(--curva);
}
.imovel-foto { position: relative; aspect-ratio: 4 / 3; background: var(--superficie); overflow: hidden; }
.imovel-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--curva); }
.imovel-semfoto { display: grid; place-content: center; justify-items: center; gap: 4px; height: 100%; color: var(--apagado); font-size: 11.5px; }
.imovel-semfoto .ico { width: 24px; height: 24px; }
.etiqueta, .etiqueta-demo { position: absolute; top: 8px; padding: 3px 9px; border-radius: 999px; font-size: 10.5px; font-weight: 700; letter-spacing: .02em; }
.etiqueta { left: 8px; background: var(--vermelho); color: #fff; }
.etiqueta-demo { right: 8px; background: rgba(255, 255, 255, .92); color: var(--azul); }
.imovel-info { display: grid; gap: 2px; padding: 10px 12px 12px; }
.imovel-preco { color: var(--destaque); font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.imovel-preco.sob-consulta { font-size: 14px; font-weight: 600; line-height: 1.45; }
.imovel-titulo { font-size: 13.5px; font-weight: 600; line-height: 1.3; letter-spacing: -.01em; }
.imovel-resumo { color: var(--suave); font-size: 12px; line-height: 1.35; }
.imovel-link { display: flex; align-items: center; gap: 4px; margin-top: 8px; color: var(--vermelho); font-size: 12px; font-weight: 600; white-space: nowrap; }
.imovel.pendente { box-shadow: none; cursor: default; }
.imovel.pendente .imovel-link { color: var(--apagado); font-weight: 500; }
.ico-mini { width: 13px; height: 13px; }

/* ---------- rodapé ---------- */
.rodape { margin-top: 44px; text-align: center; color: var(--apagado); font-size: 12.5px; }
.rodape p { margin: 4px 0; }
.marca { margin-bottom: 8px !important; font-size: 13px; }
.marca span { color: var(--destaque); font-weight: 700; letter-spacing: -.01em; }
.marca b { color: var(--dourado); font-weight: 700; letter-spacing: .08em; }
.vazio { text-align: center; color: var(--suave); }

/* ---------- interação ---------- */
a.card:active, a.imovel:active { transform: scale(.985); }
a.card:focus-visible, a.imovel:focus-visible { outline: 2px solid var(--dourado); outline-offset: 3px; }
@media (hover: hover) {
  a.card:hover, a.imovel:hover { transform: translateY(-2px); box-shadow: var(--sombra-alta); }
  a.card:hover .seta, a.card:hover .pilula-seta { transform: translateX(2px); }
  a.card:hover .vitrine-imagem, a.imovel:hover .imovel-foto img { transform: scale(1.03); }
}

/* entrada suave, escalonada, uma única vez */
/* cada bloco sobe desfocado e assenta; nos cards, rótulo, título, texto e botão chegam logo depois do card */
.rv { animation: subir 1s cubic-bezier(.16, 1, .3, 1) backwards; animation-delay: calc(min(var(--i, 0), 12) * 90ms + 80ms); } /* cascata ao abrir; páginas longas não esperam demais */
.card.rv .vitrine-conteudo > * { animation: subir .9s cubic-bezier(.16, 1, .3, 1) backwards; animation-delay: calc(min(var(--i, 0), 12) * 90ms + 330ms + var(--j, 0) * 70ms); }
.card.rv .vitrine-conteudo > :nth-child(2) { --j: 1; }
.card.rv .vitrine-conteudo > :nth-child(3) { --j: 2; }
.card.rv .vitrine-conteudo > :nth-child(4) { --j: 3; }
@keyframes subir { from { opacity: 0; transform: translateY(22px) scale(.985); filter: blur(5px); } }
@media (prefers-reduced-motion: reduce) {
  .rv, .card.rv .vitrine-conteudo > *, .vitrine-arte *, .avatar-moldura::before, .selo-verificado { animation: none !important; }
  * { transition: none !important; }
}

/* ---------- computador ---------- */
@media (min-width: 760px) {
  body { background: linear-gradient(var(--fundo) 0, var(--fundo) 60%, var(--fundo-2) 100%) fixed; }
  .coluna { max-width: 460px; }
  .cabecalho { padding-top: 64px; }
  .avatar { width: 132px; height: 132px; }
  h1 { font-size: 30px; }
}

/* ---------- carrossel infinito dos cards (computador; montado pelo bio.js) ---------- */
@media (min-width: 900px) {
  .cabecalho { padding-top: 44px; }
  .carrossel {
    position: relative; display: flex; gap: 28px; width: 100vw; margin-left: calc(50% - 50vw); padding: 14px 0 26px;
    overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; cursor: grab;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent); mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
  }
  .carrossel::-webkit-scrollbar { display: none; }
  .carrossel.sem-snap { scroll-snap-type: none; }
  .carrossel.arrastando { cursor: grabbing; user-select: none; }
  .carrossel > .card, .carrossel > a.card:hover, .carrossel > a.card:active {
    flex: 0 0 320px; scroll-snap-align: center; animation: none;
    transform: scale(calc(1 - var(--d, 0) * .12)); opacity: calc(1 - var(--d, 0) * .45);
    transition: box-shadow .25s var(--curva);
  }
  .carrossel-nav { display: flex; justify-content: center; gap: 12px; }
  .carrossel-nav button {
    display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--linha); border-radius: 50%;
    background: var(--cartao); color: var(--destaque); cursor: pointer; box-shadow: var(--sombra); transition: transform .18s var(--curva);
  }
  .carrossel-nav button:first-child .ico { transform: scaleX(-1); }
  .carrossel-nav .ico { width: 18px; height: 18px; }
  .carrossel-nav button:hover { transform: translateY(-1px); }
  .carrossel-nav button:active { transform: scale(.94); }
}

/* ---------- Somos GOLD: lista vertical; liderança em destaque no topo ---------- */
.equipe-lista { display: grid; gap: 10px; margin: 22px 0 0; padding: 0; list-style: none; }
.equipe-item { display: flex; align-items: center; gap: 14px; padding: 12px 16px 12px 12px; border: 1px solid var(--linha); border-radius: 20px; background: var(--cartao); box-shadow: var(--sombra); color: var(--tinta); text-decoration: none; transition: transform .18s var(--curva); -webkit-tap-highlight-color: transparent; }
.equipe-item:active { transform: scale(.985); }
.equipe-foto { flex: none; display: grid; width: 56px; height: 56px; aspect-ratio: 1; overflow: hidden; padding: 2px; border-radius: 50%; background: var(--linha); }
.equipe-foto > * { min-width: 0; min-height: 0; display: grid; place-items: center; width: 100%; height: 100%; border-radius: 50%; border: 2px solid var(--cartao); object-fit: cover; background: var(--azul); color: #fff; font-size: 17px; font-weight: 700; }
.equipe-info { flex: 1; min-width: 0; display: grid; gap: 2px; }
.equipe-nome { font-size: 16px; font-weight: 700; letter-spacing: -.01em; }
.equipe-cargo { color: var(--suave); font-size: 13px; }
.equipe-item .seta { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--cartao-2); color: var(--suave); }
.equipe-item .seta .ico { width: 16px; height: 16px; }
.equipe-item.lider { gap: 16px; padding: 18px 18px 18px 16px; border-color: color-mix(in srgb, var(--dourado) 45%, var(--linha)); background: linear-gradient(135deg, color-mix(in srgb, var(--dourado) 10%, var(--cartao)), var(--cartao) 60%); }
.lider .equipe-foto { width: 82px; height: 82px; padding: 3px; background: linear-gradient(135deg, #f6dfa0, #c69a3e 55%, #9c7425); }
.lider .equipe-nome { font-size: 19px; }
.lider .equipe-cargo { color: var(--dourado); font-weight: 600; }
.equipe-selo { justify-self: start; margin-bottom: 3px; padding: 3px 9px; border-radius: 999px; background: linear-gradient(135deg, #f6dfa0, #c69a3e); color: #3d2b08; font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.lider .seta { background: var(--dourado); color: #fff; }

/* ---------- Voltar: vidro no topo (padrão do recrutamento) e botão escuro no fim da página ---------- */
.voltar-vidro {
  position: absolute; z-index: 5; top: calc(env(safe-area-inset-top) + 14px); left: 16px;
  display: inline-flex; align-items: center; gap: 3px; height: 44px; padding: 0 16px 0 10px; border-radius: 999px;
  border: 1px solid var(--linha); background: color-mix(in srgb, var(--cartao) 72%, transparent); color: var(--tinta); font-size: 15px; font-weight: 600; text-decoration: none;
  -webkit-backdrop-filter: blur(16px) saturate(1.6); backdrop-filter: blur(16px) saturate(1.6);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 4px 14px rgba(11, 31, 63, .08); transition: transform .18s var(--curva);
}
.voltar-vidro .ico { width: 18px; height: 18px; }
.voltar-vidro:active { transform: translateX(-2px); }
.voltar-fim-nav { margin-top: 22px; }
.voltar-fim {
  display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 56px; border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .1); background: linear-gradient(180deg, #23262e, #0b0c10); color: #fff; font-size: 16px; font-weight: 600; text-decoration: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 10px 24px rgba(11, 15, 25, .22); transition: transform .18s var(--curva);
}
.voltar-fim .ico { width: 19px; height: 19px; }
.voltar-fim:active { transform: scale(.98); }

/* ---------- card em faixa (páginas dos corretores): identidade da vitrine, baixa e larga ---------- */
.card-faixa {
  display: flex; align-items: center; gap: 14px; min-height: 104px; padding: 18px 16px 18px 22px; overflow: hidden;
  border-radius: 22px; background: var(--azul-fundo); color: #fff; text-decoration: none; isolation: isolate;
  box-shadow: 0 8px 22px rgba(11, 31, 63, .14);
}
.faixa-arte { position: absolute; inset: 0; z-index: 0; } /* o fundo da arte ocupa o card inteiro */
.faixa-arte::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8, 20, 44, .38) 0%, rgba(8, 20, 44, .1) 45%, rgba(8, 20, 44, 0) 60%); } /* véu leve só atrás do texto */
.faixa-arte .vitrine-fundo { position: absolute; inset: 0; }
.faixa-arte .faixa-svg { position: absolute; inset: 0; width: 100%; height: 100%; } /* a cena inteira, no formato do card */
.fx-placa { transform-box: fill-box; transform-origin: 50% 100%; animation: balancar 4s ease-in-out infinite alternate; }
.fx-pendulo { transform-box: view-box; transform-origin: 150px -4px; animation: balancar 3.6s ease-in-out infinite alternate; }
.fx-flutua { transform-box: fill-box; transform-origin: 50% 50%; animation: flutuar 4.5s calc(var(--n, 0) * -1.4s) ease-in-out infinite alternate; }
.faixa-icone { position: absolute; right: 54px; top: 50%; z-index: 0; width: 86px; height: 86px; transform: translateY(-50%) rotate(-8deg); color: rgba(255, 255, 255, .1); }
.faixa-icone .ico { width: 100%; height: 100%; }
.card-faixa::before { content: ""; position: absolute; inset: 0; z-index: 0; background: radial-gradient(90% 120% at 0% 0%, rgba(198, 154, 62, .28), transparent 60%); pointer-events: none; }
.faixa-texto { position: relative; z-index: 1; flex: 1; min-width: 0; display: grid; gap: 3px; }
.faixa-titulo { font-size: 21px; font-weight: 700; letter-spacing: -.03em; text-shadow: 0 1px 10px rgba(8, 20, 44, .5); }
.faixa-desc { color: rgba(255, 255, 255, .78); font-size: 14px; }
.card-faixa .pilula-seta { position: relative; z-index: 1; flex: none; background: #fff; color: var(--azul); box-shadow: 0 4px 12px rgba(0, 0, 0, .2); }
.card-faixa:active { transform: scale(.985); }

/* voltar do fim: mais estreito que os cards, centralizado */
.voltar-fim-nav { display: flex; justify-content: center; }
.voltar-fim { min-height: 52px; padding: 0 30px 0 24px; }

/* cards em faixa: sem seta (o card inteiro é o link), um pouco mais altos; pendentes ficam levemente apagados */
.card-faixa { min-height: 116px; padding-right: 22px; }
.card-faixa.pendente { filter: saturate(.75); }
.card-faixa.pendente .faixa-desc { color: rgba(255, 255, 255, .6); }
.fx-luz { animation: acender 3s ease-in-out infinite alternate; }
.fx-rota { animation: andar 1.2s linear infinite; }
.fx-pulso { transform-box: fill-box; transform-origin: 50% 50%; animation: pulso 2.4s calc(var(--n, 0) * 1.2s) ease-out infinite; }


/* Somos GOLD: linha de luz dourada percorrendo a borda do card da liderança */
@property --giro { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
.equipe-item.lider { position: relative; }
.equipe-item.lider::before {
  content: ""; position: absolute; inset: -1.5px; border-radius: inherit; padding: 1.5px; pointer-events: none;
  background: conic-gradient(from var(--giro), transparent 0 62%, rgba(246, 223, 160, .2) 70%, #f6dfa0 84%, #fff6d8 88%, #c69a3e 92%, transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
  filter: drop-shadow(0 0 4px rgba(246, 223, 160, .9)) drop-shadow(0 0 10px rgba(198, 154, 62, .55));
  animation: giro-borda 3.2s linear infinite;
}
@keyframes giro-borda { to { --giro: 360deg; } }
@media (prefers-reduced-motion: reduce) { .equipe-item.lider::before { animation: none; --giro: 200deg; } }
.faixa-texto { max-width: 56%; } /* o texto não invade o desenho; títulos longos quebram em duas linhas */
.faixa-titulo { line-height: 1.1; }
/* Meus imóveis: a lupa passeia pela casa; o conteúdo ampliado anda ao contrário para ficar parado no lugar */
.fx-lupa { animation: fx-lupa 6s ease-in-out infinite alternate; }
.fx-lupa-zoom { animation: fx-lupa-zoom 6s ease-in-out infinite alternate; }
@keyframes fx-lupa { from { transform: translateX(-26px); } to { transform: translateX(14px); } }
@keyframes fx-lupa-zoom { from { transform: translateX(26px); } to { transform: translateX(-14px); } }
.voltar-vidro.so-seta { width: 44px; padding: 0; justify-content: center; } /* páginas dos corretores: bolinha de vidro só com a seta */
.voltar-vidro.so-seta .ico { width: 20px; height: 20px; }
.card-faixa { min-height: 128px; }

/* ---------- topo das páginas dos corretores: capa noturna com o avatar saindo dela e etiquetas ---------- */
.cabecalho-corretor { padding-top: calc(env(safe-area-inset-top) + 78px); }
.cabecalho-corretor::before { display: none; }
.cabecalho-corretor .avatar-moldura { box-shadow: 0 0 0 5px var(--fundo), 0 12px 30px rgba(11, 31, 63, .25); border-radius: 50%; }
.chips-corretor { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; margin-top: 12px; }
.chip { display: inline-flex; align-items: center; gap: 5px; padding: 5px 10px; white-space: nowrap; border: 1px solid var(--linha); border-radius: 999px; background: var(--cartao-2); color: var(--tinta); font-size: 11.5px; font-weight: 600; }
.chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--dourado); }

/* ---------- Encontre seu imóvel ---------- */
.cabecalho-imoveis { padding-top: calc(env(safe-area-inset-top) + 78px); }
.cabecalho-imoveis h1 { font-size: 30px; letter-spacing: -.03em; }
.filtros { display: flex; gap: 6px; margin: 16px -16px 0; padding: 2px 16px 4px; overflow-x: auto; scrollbar-width: none; justify-content: safe center; }
.filtros::-webkit-scrollbar { display: none; }
.filtro { flex: none; padding: 8px 14px; border: 1px solid var(--linha); border-radius: 999px; background: var(--cartao); color: var(--tinta); font: 600 13.5px var(--sans); cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.filtro[aria-pressed="true"] { border-color: var(--azul); background: var(--azul); color: #fff; }
.grade-todos { margin-top: 18px; }
.grade-todos .imovel[hidden] { display: none; }
.imovel-corretor { margin-top: 4px; color: var(--dourado); font-size: 12px; font-weight: 600; }
.vazio-filtro { margin: 24px 0; color: var(--suave); text-align: center; }
.botao-remax { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 0 26px; border-radius: 999px; background: linear-gradient(135deg, #f6dfa0, #c69a3e 60%, #a8802f); color: #2b1d05; font-size: 15.5px; font-weight: 700; text-decoration: none; box-shadow: 0 10px 24px rgba(198, 154, 62, .3); transition: transform .18s var(--curva); }
.botao-remax .ico { width: 17px; height: 17px; }
.botao-remax:active { transform: scale(.98); }

/* corretores sem capa; no lugar do subtítulo, o selo da marca em vidro azul-escuro */
.cabecalho-corretor { padding-top: calc(env(safe-area-inset-top) + 32px); }
.cabecalho-corretor::before { display: block; }
.cabecalho-corretor .avatar-moldura { box-shadow: none; }
.selo-marca {
  display: inline-flex; align-items: baseline; gap: 5px; margin: 10px 0 0; padding: 7px 16px 8px; border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .14); background: linear-gradient(160deg, rgba(31, 58, 114, .92), rgba(8, 20, 46, .96));
  -webkit-backdrop-filter: blur(14px) saturate(1.6); backdrop-filter: blur(14px) saturate(1.6);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), inset 0 -8px 16px rgba(0, 0, 0, .25), 0 8px 20px rgba(11, 31, 63, .22);
  font-family: Outfit, var(--sans); font-size: 14px; letter-spacing: .02em; line-height: 1;
}
.selo-marca span { color: #fff; font-weight: 700; letter-spacing: .06em; }
.selo-marca b {
  font-weight: 700; background: linear-gradient(100deg, #b8862f 0%, #d4a94c 30%, #f6e2a8 46%, #d4a94c 62%, #b8862f 100%) 0 0 / 250% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent; animation: reflexo-marca 5s 1.5s ease-in-out infinite;
}
@keyframes reflexo-marca { 0%, 45% { background-position: 100% 0; } 100% { background-position: -50% 0; } }
@media (prefers-reduced-motion: reduce) { .selo-marca b { animation: none; } }
.busca-imoveis { display: flex; gap: 8px; margin-top: 18px; }
.busca { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; height: 46px; padding: 0 14px; border: 1px solid var(--linha); border-radius: 14px; background: var(--cartao); box-shadow: var(--sombra); color: var(--suave); }
.busca .ico { width: 18px; height: 18px; flex: none; }
.busca input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; color: var(--tinta); font: 500 16px var(--sans); }
.ordem { flex: none; height: 46px; padding: 0 12px; border: 1px solid var(--linha); border-radius: 14px; background: var(--cartao); color: var(--tinta); font: 600 13.5px var(--sans); box-shadow: var(--sombra); }
.contagem { margin: 12px 0 0; color: var(--suave); font-size: 13px; }
.mais-imoveis { display: flex; justify-content: center; margin-top: 18px; }
.botao-mais { min-height: 48px; padding: 0 24px; border: 1px solid var(--linha); border-radius: 999px; background: var(--cartao); color: var(--tinta); font: 600 15px var(--sans); box-shadow: var(--sombra); cursor: pointer; }
.botao-mais:active { transform: scale(.98); }
/* revisão de acessibilidade (ui-ux-pro-max): texto dourado legível e filtros com área de toque de 44 px */
.imovel-corretor, .lider .equipe-cargo { color: var(--dourado-texto); }
.filtro { min-height: 44px; }
/* imóveis: botão + e menu recolhível; ações do fim lado a lado */
.filtro-mais { display: grid; place-items: center; width: 44px; padding: 0; }
.filtro-mais .ico { width: 18px; height: 18px; transition: transform .3s var(--curva); }
.filtro-mais[aria-expanded="true"] { border-color: var(--azul); background: var(--azul); color: #fff; }
.filtro-mais[aria-expanded="true"] .ico { transform: rotate(45deg); }
.mais-filtros { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 8px; animation: subir .35s var(--curva) both; }
.mais-filtros[hidden] { display: none; }
.botao-mais { display: inline-flex; align-items: center; gap: 6px; border: 0; background: none; box-shadow: none; color: var(--azul); text-decoration: underline; text-underline-offset: 4px; }
.botao-mais .ico { width: 16px; height: 16px; transform: rotate(90deg); }
:root[data-tema="escuro"] .botao-mais { color: var(--tinta); }
.acoes-fim { display: flex; justify-content: center; gap: 10px; margin-top: 26px; }
.acoes-fim .voltar-fim { min-height: 52px; padding: 0 22px 0 18px; }
.acoes-fim .botao-remax { padding: 0 22px; }
.grade-todos .imovel.rv { animation-delay: calc(min(var(--i, 0), 16) * 70ms + 120ms); } /* topo primeiro; cards seguem sem atraso exagerado */

/* filtros dos imóveis: controle segmentado em vidro, com bolha deslizante; "+" ao lado, sem rolagem */
.filtros { display: flex; align-items: center; gap: 8px; margin: 16px 0 0; padding: 0; overflow: visible; }
.segmentos {
  position: relative; flex: 1; min-width: 0; display: flex; padding: 4px; border-radius: 999px;
  border: 1px solid var(--linha); background: color-mix(in srgb, var(--cartao) 80%, transparent);
  -webkit-backdrop-filter: blur(14px) saturate(1.5); backdrop-filter: blur(14px) saturate(1.5);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6), var(--sombra);
}
.segmento-bolha {
  position: absolute; top: 4px; bottom: 4px; left: 0; width: var(--w, 0); transform: translateX(var(--x, 4px)); border-radius: 999px;
  background: linear-gradient(180deg, #1d3a74, var(--azul)); box-shadow: 0 4px 12px rgba(11, 31, 63, .3), inset 0 1px 0 rgba(255, 255, 255, .18);
  transition: transform .45s var(--curva), width .45s var(--curva), opacity .25s;
}
.segmentos.sem-bolha .segmento-bolha { opacity: 0; }
.segmentos .filtro { position: relative; z-index: 1; flex: 1 1 auto; min-width: 0; min-height: 40px; padding: 0 6px; border: 0; background: none; color: var(--suave); font-size: 13px; white-space: nowrap; transition: color .3s; }
.segmentos .filtro[aria-pressed="true"] { border: 0; background: none; color: #fff; }
.filtros .filtro-mais { flex: none; width: 48px; height: 48px; min-height: 48px; border-radius: 50%; box-shadow: var(--sombra); }
@media (prefers-reduced-motion: reduce) { .segmento-bolha { transition: none; } }
@media (max-width: 359px) { .segmentos .filtro { padding: 0 3px; font-size: 11.5px; } .filtros { gap: 6px; } .filtros .filtro-mais { width: 44px; height: 44px; min-height: 44px; } }

/* =========================================================================================
   COMPUTADOR (≥ 900 px): mesma identidade do celular, mas aproveitando a largura.
   O celular não é afetado por nada abaixo.
   ========================================================================================= */
@media (min-width: 900px) {
  /* ---- Encontre seu imóvel: cabeçalho à esquerda, busca e filtros lado a lado, grade de 4 colunas ---- */
  body[data-pagina="imoveis"] .coluna { max-width: 1240px; padding: 0 48px 56px; }
  .cabecalho-imoveis {
    display: grid; grid-template-columns: minmax(320px, 440px) 1fr; column-gap: 20px; align-items: center;
    padding-top: 104px; text-align: left;
  }
  .cabecalho-imoveis::before { left: 0; transform: none; }
  .cabecalho-imoveis h1 { grid-column: 1 / -1; font-size: 48px; letter-spacing: -.035em; }
  .cabecalho-imoveis .apresentacao { grid-column: 1 / -1; max-width: none; margin: 8px 0 0; font-size: 17px; }
  .cabecalho-imoveis .busca-imoveis { margin-top: 28px; }
  .cabecalho-imoveis .filtros { margin-top: 28px; justify-self: end; width: min(100%, 560px); }
  .cabecalho-imoveis .mais-filtros { grid-column: 1 / -1; justify-content: flex-end; }
  .cabecalho-imoveis .contagem { grid-column: 1 / -1; margin-top: 18px; }
  .grade-todos { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 24px; margin-top: 14px; }
  .grade-todos .imovel { transition: transform .35s var(--curva), box-shadow .35s var(--curva); }
  .grade-todos .imovel:hover { transform: translateY(-5px); box-shadow: 0 18px 40px rgba(11, 31, 63, .14); }
  .grade-todos .imovel-preco { font-size: 19px; }
  .acoes-fim { margin-top: 36px; }

  /* ---- Somos GOLD: duas colunas; a liderança ocupa a largura toda ---- */
  body[data-pagina="equipe"] .coluna { max-width: 1040px; padding: 0 48px 56px; }
  .equipe-lista { grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 36px; }
  .equipe-lista > li:has(.lider) { grid-column: 1 / -1; }
  .equipe-item { padding: 16px 20px 16px 16px; transition: transform .3s var(--curva), box-shadow .3s var(--curva); }
  .equipe-item:hover { transform: translateY(-3px); box-shadow: 0 14px 32px rgba(11, 31, 63, .12); }
  .equipe-foto { width: 64px; height: 64px; }
  .equipe-item.lider { padding: 26px 30px 26px 26px; gap: 24px; }
  .lider .equipe-foto { width: 108px; height: 108px; }
  .lider .equipe-nome { font-size: 26px; }

  /* ---- Página do corretor: perfil fixo à esquerda, cards e imóveis à direita ---- */
  .coluna:has(.cabecalho-corretor) {
    max-width: 1160px; padding: 0 48px 56px;
    display: grid; grid-template-columns: 360px minmax(0, 1fr); column-gap: 64px; align-items: start;
  }
  .coluna:has(.cabecalho-corretor) > * { grid-column: 2; }
  .coluna:has(.cabecalho-corretor) > .cabecalho-corretor { grid-column: 1; grid-row: 1 / span 6; position: sticky; top: 0; padding-top: 104px; }
  .coluna:has(.cabecalho-corretor) > .rodape { grid-column: 1 / -1; }
  .coluna:has(.cabecalho-corretor) > .cards { margin-top: 104px; gap: 16px; }
  .coluna:has(.cabecalho-corretor) .card-faixa { min-height: 140px; padding-left: 30px; transition: transform .3s var(--curva), box-shadow .3s var(--curva); }
  .coluna:has(.cabecalho-corretor) .card-faixa:hover { transform: translateY(-4px); box-shadow: 0 18px 36px rgba(11, 31, 63, .22); }
  .coluna:has(.cabecalho-corretor) .grade-imoveis { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px; }
  .coluna:has(.cabecalho-corretor) .voltar-fim-nav { justify-content: flex-start; }
}
@media (min-width: 900px) { .coluna:has(.cabecalho-corretor) .faixa-titulo { font-size: 24px; } .coluna:has(.cabecalho-corretor) .faixa-desc { font-size: 15px; } }
/* bio no computador: cards do carrossel mais largos (cabe o título numa linha e o texto respira) */
@media (min-width: 900px) {
  .carrossel > .card, .carrossel > a.card:hover, .carrossel > a.card:active { flex-basis: 460px; aspect-ratio: 7 / 6; }
  .carrossel .vitrine-conteudo { padding: 28px 30px 32px; }
  .carrossel .vitrine-titulo { font-size: 38px; }
  .carrossel .vitrine-desc { max-width: 38ch; font-size: 15.5px; }
}
@media (min-width: 900px) { .carrossel .vitrine-arte { transform: translateY(-17%); } } /* card largo: sobe a cena para o desenho não ficar atrás do título */
/* seletor de ordem: seta própria, com respiro da borda (a nativa ficava colada) */
.ordem {
  -webkit-appearance: none; appearance: none; padding: 0 38px 0 16px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235d6678' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; background-size: 16px;
}
:root[data-tema="escuro"] .ordem { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23aab4c8' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }

/* selo REMAX Gold dos corretores: menor e em vidro claro (liquid glass), acompanha o tema */
.selo-marca {
  gap: 4px; margin-top: 8px; padding: 5px 12px 6px; font-size: 12px;
  border: 1px solid rgba(255, 255, 255, .7); background: linear-gradient(135deg, rgba(255, 255, 255, .75), rgba(255, 255, 255, .35));
  -webkit-backdrop-filter: blur(18px) saturate(1.8); backdrop-filter: blur(18px) saturate(1.8);
  box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(11, 31, 63, .06), 0 1px 2px rgba(11, 31, 63, .06), 0 6px 16px rgba(11, 31, 63, .08);
}
.selo-marca span { color: var(--tinta); letter-spacing: .08em; }
:root[data-tema="escuro"] .selo-marca { border-color: rgba(255, 255, 255, .14); background: linear-gradient(135deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .04)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 6px 16px rgba(0, 0, 0, .3); }
.cabecalho-corretor .apresentacao { margin-top: 12px; }
.cabecalho-corretor .chips-corretor { margin-top: 14px; }

/* logo REMAX Gold no topo (mesma linha do Voltar e do botão de tema): REMAX segue o tema, Gold sempre dourado */
.marca-topo {
  position: absolute; z-index: 5; top: calc(env(safe-area-inset-top) + 14px); left: 50%; transform: translateX(-50%);
  display: flex; align-items: center; gap: 5px; height: 44px; margin: 0;
  font-family: Outfit, var(--sans); font-size: 17px; font-weight: 800; letter-spacing: .02em; line-height: 1;
}
.marca-topo span { color: var(--tinta); letter-spacing: .06em; }
.marca-topo b { font-weight: 800; background: linear-gradient(100deg, #b8862f, #d4a94c 35%, #f6e2a8 50%, #d4a94c 65%, #b8862f) 0 0 / 250% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: reflexo-marca 6s 1s ease-in-out infinite; }

/* Ver mais: estado carregando com uma bolinha girando */
.botao-mais.carregando { pointer-events: none; color: var(--suave); }
.botao-mais.carregando .ico { opacity: 0; }
.botao-mais.carregando::after { content: ""; width: 15px; height: 15px; margin-left: -20px; border-radius: 50%; border: 2px solid var(--linha); border-top-color: var(--dourado); animation: girar .7s linear infinite; }
.grade-todos.assentado .imovel.rv { animation: none; }
.grade-todos.assentado .imovel.surge { animation: subir .55s cubic-bezier(.16, 1, .3, 1) both; }

/* card de imóvel: altura uniforme na grade e, no rodapé, a foto pequena e o nome de quem anuncia */
.grade-todos .imovel { display: flex; flex-direction: column; }
.grade-todos .imovel-info { flex: 1; }
.imovel-pessoa { display: flex; align-items: center; gap: 8px; margin: 0 12px 12px; padding-top: 10px; border-top: 1px solid var(--linha); color: var(--tinta); font-size: 12.5px; font-weight: 600; }
.imovel-pessoa img, .imovel-pessoa > span { flex: none; width: 26px; height: 26px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1.5px var(--dourado); }
.imovel-pessoa > span { display: grid; place-items: center; background: var(--azul); color: #fff; font-size: 10px; }

/* ---------- revelação ao rolar (celular e computador) ---------- */
.rv.aguarda { animation: none; opacity: 0; transform: translateY(34px) scale(.97); filter: blur(6px); }
.rv.revela { animation: revelar .95s cubic-bezier(.16, 1, .3, 1) both; }
@keyframes revelar { from { opacity: 0; transform: translateY(34px) scale(.97); filter: blur(6px); } }

/* ---------- bio GOLD no computador: mosaico (bento) no lugar do carrossel ---------- */
.bento-num { display: none; }
@media (min-width: 900px) {
  .cards-vitrine.bento {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 250px; gap: 20px;
    width: min(1180px, calc(100vw - 80px)); margin: 40px 0 0 50%; transform: translateX(-50%);
  }
  .bento > .card { aspect-ratio: auto; height: 100%; border-radius: 28px; transition: transform .35s var(--curva), box-shadow .35s var(--curva); }
  .bento > .card:hover { transform: translateY(-5px); box-shadow: 0 22px 44px rgba(11, 31, 63, .22); }
  .bento > :nth-child(1) { grid-column: span 2; grid-row: span 2; }         /* Comprar: o destaque */
  .bento > :nth-child(2) { grid-column: span 2; }                            /* Vender */
  .bento > :nth-child(n+2) { grid-column: span 2; }                         /* demais cards: largos (2×1) */
  .bento > .card .vitrine-titulo { font-size: 28px; }
  .bento > :nth-child(1) .vitrine-titulo { font-size: 46px; }
  .bento > .card .vitrine-desc { font-size: 14px; max-width: 34ch; }
  .bento > .card .vitrine-conteudo { padding: 22px 24px 24px; }
  .bento > :nth-child(1) .vitrine-conteudo { padding: 34px 36px 36px; }
  .bento-num {
    display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; padding: 26px 28px; border-radius: 28px;
    border: 1px solid var(--linha); background: var(--cartao); box-shadow: var(--sombra); color: var(--tinta); text-decoration: none;
    transition: transform .35s var(--curva), box-shadow .35s var(--curva);
  }
  .bento-num:hover { transform: translateY(-5px); box-shadow: 0 18px 36px rgba(11, 31, 63, .12); }
  .bento-num b { font-size: 64px; font-weight: 800; line-height: .9; letter-spacing: -.05em; background: linear-gradient(135deg, #c69a3e, #8a6a1f); -webkit-background-clip: text; background-clip: text; color: transparent; }
  .bento-num span { color: var(--suave); font-size: 15px; font-weight: 600; }
  body[data-pagina="gold"] .rodape { margin-top: 48px; }
}
@media (min-width: 900px) {
  /* cards largos e baixos: desenho só na metade direita, dissolvendo no fundo; texto à esquerda */
  .bento > :nth-child(n+2) .vitrine-arte {
    inset: 0 0 0 auto; width: 60%; transform: none;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 30%); mask-image: linear-gradient(90deg, transparent, #000 30%);
  }
  .bento > :nth-child(n+2)::after { background: linear-gradient(90deg, rgba(8, 20, 44, .92) 0%, rgba(8, 20, 44, .55) 45%, rgba(8, 20, 44, 0) 70%); }
  .bento > :nth-child(n+2) .vitrine-conteudo { max-width: 52%; }
}

/* cores de fundo das cenas de WhatsApp e Instagram (quando o desenho não cobre o card todo) */
.card-faixa:has(.fx-whatsapp) { background: linear-gradient(180deg, #1f7a68, #0d3b45); }
.card-faixa:has(.fx-instagram) { background: linear-gradient(180deg, #4a3a9e, #1c1f5e); }

/* celular: cards dos corretores mais altos; imóvel de destaque ocupando a largura toda */
.card-faixa { min-height: 146px; }
.destaques .grade-imoveis > :first-child { grid-column: 1 / -1; }
.destaques .grade-imoveis > :first-child .imovel-foto { aspect-ratio: 16 / 10; }

/* =========================================================================================
   CORRETOR NO COMPUTADOR: perfil centralizado e mosaico (como a bio GOLD).
   Ordem dos cards: 1 Meus imóveis · 2 Venda · 3 Faça Parte · 4 WhatsApp · 5 Instagram · 6 REMAX Gold · 7 Escritório
   ========================================================================================= */
@media (min-width: 900px) {
  .coluna:has(.cabecalho-corretor) { display: block; max-width: 1180px; padding: 0 40px 56px; }
  .coluna:has(.cabecalho-corretor) > .cabecalho-corretor { position: static; padding-top: 64px; max-width: 560px; margin: 0 auto; }
  .coluna:has(.cabecalho-corretor) > .cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 230px; gap: 18px; margin-top: 40px; }
  .coluna:has(.cabecalho-corretor) > .cards > * { display: flex; min-height: 0; }
  .coluna:has(.cabecalho-corretor) > .cards > :nth-child(1) { grid-area: 1 / 1 / 3 / 3; }   /* Meus imóveis: destaque 2×2 */
  .coluna:has(.cabecalho-corretor) > .cards > :nth-child(2) { grid-area: 1 / 3 / 2 / 5; }   /* Venda */
  .coluna:has(.cabecalho-corretor) > .cards > :nth-child(3) { grid-area: 2 / 3 / 3 / 5; }   /* Faça Parte */
  .coluna:has(.cabecalho-corretor) > .cards > :nth-child(6) { grid-area: 3 / 3 / 4 / 5; }   /* REMAX Gold */
  .coluna:has(.cabecalho-corretor) > .cards > :nth-child(4) { grid-area: 3 / 1 / 4 / 2; }   /* WhatsApp */
  .coluna:has(.cabecalho-corretor) > .cards > :nth-child(5) { grid-area: 3 / 2 / 4 / 3; }   /* Instagram */
  .coluna:has(.cabecalho-corretor) > .cards > :nth-child(7) { grid-area: 4 / 1 / 5 / 5; }   /* Escritório: faixa larga */

  /* cards largos: texto à esquerda, desenho à direita */
  .coluna:has(.cabecalho-corretor) > .cards > :is(:nth-child(2), :nth-child(3), :nth-child(6), :nth-child(7)) .faixa-titulo { font-size: 26px; }
  .coluna:has(.cabecalho-corretor) > .cards > :is(:nth-child(2), :nth-child(3), :nth-child(6)) .faixa-texto { max-width: 48%; }

  /* destaque e quadrados: texto em cima, desenho inteiro na base */
  .coluna:has(.cabecalho-corretor) > .cards > :is(:nth-child(1), :nth-child(4), :nth-child(5)) { flex-direction: column; align-items: flex-start; justify-content: flex-start; padding: 28px 30px; }
  .coluna:has(.cabecalho-corretor) > .cards > :is(:nth-child(1), :nth-child(4), :nth-child(5)) .faixa-texto { flex: none; max-width: 100%; }
  .coluna:has(.cabecalho-corretor) > .cards > :is(:nth-child(1), :nth-child(4), :nth-child(5)) .faixa-svg {
    top: auto; bottom: 0; height: auto; -webkit-mask-image: linear-gradient(180deg, transparent, #000 30%); mask-image: linear-gradient(180deg, transparent, #000 30%);
  }
  .coluna:has(.cabecalho-corretor) > .cards > :is(:nth-child(1), :nth-child(4), :nth-child(5)) .faixa-arte::after { background: linear-gradient(180deg, rgba(8, 20, 44, .25), rgba(8, 20, 44, 0) 45%); }
  .coluna:has(.cabecalho-corretor) > .cards > :nth-child(1) { background: linear-gradient(180deg, #2a4a86 0%, #6a86c4 100%); padding: 40px 44px; }
  .coluna:has(.cabecalho-corretor) > .cards > :nth-child(1) .faixa-titulo { font-size: 44px; }
  .coluna:has(.cabecalho-corretor) > .cards > :nth-child(1) .faixa-desc { font-size: 17px; }
  .coluna:has(.cabecalho-corretor) > .cards > :nth-child(1) .faixa-svg { left: auto; right: 0; width: 165%; }
  .coluna:has(.cabecalho-corretor) > .cards > :is(:nth-child(4), :nth-child(5)) .faixa-svg { left: auto; right: -6%; width: 210%; }
  .coluna:has(.cabecalho-corretor) > .cards > :is(:nth-child(4), :nth-child(5)) .faixa-titulo { font-size: 26px; }
  .coluna:has(.cabecalho-corretor) > .cards > :is(:nth-child(4), :nth-child(5)) .faixa-desc { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }

  /* imóveis em destaque: o principal no centro (2×2) e quatro menores ao redor */
  .coluna:has(.cabecalho-corretor) .destaques { margin-top: 56px; }
  .coluna:has(.cabecalho-corretor) .secao-titulo { font-size: 26px; letter-spacing: -.03em; text-align: center; }
  .coluna:has(.cabecalho-corretor) .grade-imoveis { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-flow: dense; gap: 18px; }
  .coluna:has(.cabecalho-corretor) .grade-imoveis > :first-child { grid-area: 1 / 2 / 3 / 4; }
  .coluna:has(.cabecalho-corretor) .grade-imoveis > :first-child .imovel-foto { aspect-ratio: auto; flex: 1; min-height: 300px; }
  .coluna:has(.cabecalho-corretor) .grade-imoveis > :first-child { display: flex; flex-direction: column; }
  .coluna:has(.cabecalho-corretor) .grade-imoveis > :first-child .imovel-preco { font-size: 28px; letter-spacing: -.03em; }
  .coluna:has(.cabecalho-corretor) .grade-imoveis .imovel { transition: transform .3s var(--curva), box-shadow .3s var(--curva); }
  .coluna:has(.cabecalho-corretor) .grade-imoveis .imovel:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(11, 31, 63, .14); }
  .coluna:has(.cabecalho-corretor) .voltar-fim-nav { justify-content: center; }
}
/* celular: com o card mais alto a cena cresce; ela anda um pouco para a direita para não encostar no título */
@media (max-width: 899px) { .card-faixa .faixa-svg { width: 114%; } }

/* selo REMAX Gold dos corretores: sempre no visual do modo noturno (vidro azul-escuro), nos dois temas */
.selo-marca, :root[data-tema="escuro"] .selo-marca {
  border-color: rgba(255, 255, 255, .14);
  background: #213f62; /* base #17314E pedida por Lucas, um tom mais leve */
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 6px 16px rgba(11, 31, 63, .22);
}
.selo-marca span { color: #fff; }
/* "Gold" com mais presença: ouro mais claro e um brilho suave em volta; o reflexo continua passando */
.selo-marca b { background-image: linear-gradient(100deg, #e2b85a 0%, #f3d27e 30%, #fff4cf 46%, #f3d27e 62%, #e2b85a 100%); filter: drop-shadow(0 0 6px rgba(242, 201, 110, .45)); font-weight: 800; }
.card-faixa:has(.fx-balao) .faixa-texto { max-width: 68%; } /* "Faça Parte da Gold" numa linha; o balão fica bem à direita */
.card-faixa:has(.fx-balao) .faixa-titulo { white-space: nowrap; }
/* WhatsApp e Instagram um pouco para a esquerda nos cards largos; nos quadrados do computador continuam centrados */
.fx-desloca { transform: translateX(-10px); }
@media (min-width: 900px) { .coluna:has(.cabecalho-corretor) > .cards > :is(:nth-child(4), :nth-child(5)) .fx-desloca { transform: none; } }
/* ---------- /politicas: texto simples e legível ---------- */
.politicas { max-width: 680px; margin: 0 auto; padding: 28px 4px 64px; color: var(--tinta); font-size: 16px; line-height: 1.65; }
.politicas-voltar { color: var(--suave); font-size: 14px; font-weight: 600; text-decoration: none; }
.politicas h1 { margin: 22px 0 4px; color: var(--destaque); font-size: clamp(30px, 7vw, 40px); line-height: 1.1; letter-spacing: -.035em; }
.politicas-data { margin: 0; color: var(--suave); font-size: 14px; }
.politicas-indice { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 8px; }
.politicas-indice a { padding: 8px 14px; border: 1px solid var(--linha); border-radius: 999px; background: var(--cartao); color: var(--tinta); font-size: 14px; font-weight: 600; text-decoration: none; }
.politicas h2 { margin: 40px 0 8px; padding-top: 8px; color: var(--destaque); font-size: 25px; letter-spacing: -.025em; scroll-margin-top: 16px; }
.politicas h3 { margin: 26px 0 4px; font-size: 17px; letter-spacing: -.01em; }
.politicas p, .politicas ul { margin: 8px 0; }
.politicas ul { padding-left: 20px; }
.politicas li { margin: 4px 0; }
