:root {
  --branco: #FCFBF8;
  --cinza: #F0EEE9;
  --cinza-2: #E6E3DC;
  --areia: #ECE1CF;
  --areia-2: #E2D5C0;
  --preto: #111213;
  --texto-2: #5A5D5E;
  --texto-3: #8B8D8C;
  --linha: #DEDBD4;
  --cedro: #1F3A30;
  --cedro-2: #2A4A3E;
  --bronze: #9E8B78;
  --dourado: #8D682F;
  --dourado-claro: #D7B478;
  --marca-fundo: #493522;
  --marca-texto: #F7EFE2;
  --marca-ouro: #EAC47F;
  --display: 'Newsreader', Georgia, serif;
  --sans: 'Instrument Sans', system-ui, sans-serif;
  --marca: 'Marcellus', Georgia, serif;
  --margem: clamp(20px, 3vw, 48px);
  --topo: 120px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { overflow-x: hidden; overflow-x: clip; scroll-padding-top: calc(var(--topo) + 16px); }
body { margin: 0; overflow-x: hidden; overflow-x: clip; background: var(--branco); color: var(--preto); font-family: var(--sans); font-size: 17px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 { font-weight: 400; }
:focus-visible { outline: 2px solid var(--cedro); outline-offset: 3px; }
::selection { background: var(--cedro); color: var(--branco); }
.pular { position: fixed; top: 8px; left: 8px; z-index: 200; padding: 10px 14px; background: var(--preto); color: var(--branco); transform: translateY(-160%); }
.pular:focus { transform: none; }
.vis-oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Editorial nos títulos; textos, controles e valores mantêm a leitura em sans. */
.grande { font-family: var(--display); font-optical-sizing: auto; font-weight: 400; font-size: clamp(40px, 5.2vw, 84px); line-height: 1.04; letter-spacing: -0.025em; }
.grande .recuo { display: block; padding-left: 12vw; }
.composicao { font-family: var(--sans); font-size: clamp(36px, 4.4vw, 72px); line-height: 1.12; letter-spacing: -0.045em; }
.tipo-acento { font-family: var(--display); font-style: italic; font-weight: 400; font-size: 1.12em; letter-spacing: -0.025em; color: var(--dourado); }
.hero, .im-hero, .contato { --dourado: var(--dourado-claro); }
.titulo { font-family: var(--display); font-optical-sizing: auto; font-weight: 400; font-size: clamp(34px, 3.6vw, 58px); line-height: 1.08; letter-spacing: -0.02em; }
.cartao-topo h3, .jeito-lista strong, .formulario h3, .im-contato h2, .texto-legal h2 { font-family: var(--display); font-optical-sizing: auto; text-wrap: pretty; }
.preco, .im-card strong, .numeros strong { font-variant-numeric: lining-nums tabular-nums; }
.rotulo { font-family: var(--sans); font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; }
.suave { color: var(--texto-2); }
.lede { max-width: 46ch; font-size: clamp(17px, 1.25vw, 19px); line-height: 1.55; color: var(--texto-2); }

/* Botões e links */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 24px; border: 1px solid transparent; border-radius: 999px; font-size: 15px; font-weight: 500; text-decoration: none; white-space: nowrap; transition: background 0.3s var(--ease), color 0.3s var(--ease), border-color 0.3s var(--ease); }
.btn-preto { background: var(--preto); color: var(--branco); }
.btn-preto:hover { background: var(--cedro); }
.btn-branco { background: var(--branco); color: var(--preto); }
.btn-branco:hover { background: var(--cinza-2); }
.btn-linha { border-color: currentColor; background: transparent; }
.btn-linha:hover { background: var(--preto); border-color: var(--preto); color: var(--branco); }
.escuro .btn-linha:hover, .contato .btn-linha:hover { background: var(--branco); border-color: var(--branco); color: var(--preto); }
.seta { transition: transform 0.3s var(--ease); }
.btn:hover .seta, .link:hover .seta { transform: translate(2px, -2px); }
.link { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.link:hover { text-decoration-color: transparent; }
@media (pointer: coarse) { .btn, .aba, .chip { min-height: 44px; } }

/* Cabeçalho */
.topo { position: fixed; top: 0; left: 0; right: 0; z-index: 50; height: var(--topo); padding: 0 var(--margem); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 24px; color: var(--marca-texto); background: var(--marca-fundo); border-bottom: 1px solid rgba(234, 196, 127, 0.25); transition: background 0.4s var(--ease), color 0.4s var(--ease), border-color 0.4s var(--ease); }
.topo.sobre-foto { background: var(--marca-fundo); color: var(--marca-texto); border-bottom-color: rgba(234, 196, 127, 0.25); backdrop-filter: none; -webkit-backdrop-filter: none; }
.marca { position: relative; display: inline-flex; align-items: center; gap: 12px; text-decoration: none; justify-self: start; }
.marca svg { width: 32px; height: 32px; color: var(--bronze); flex-shrink: 0; }
.topo .marca-emblema { display: block; width: clamp(220px, 24vw, 300px); max-width: 100%; flex-shrink: 0; }
.marca-emblema img, .logo-aprovado img { display: block; width: 100%; height: auto; }
.topo.sobre-foto .marca-emblema { filter: none; }
.logo-aprovado { display: block; width: min(260px, 100%); aspect-ratio: 1; }
.marca-rodape { width: min(260px, 100%); align-self: start; }
.marca-texto { display: flex; flex-direction: column; gap: 4px; line-height: 1; }
.marca-nome { font-family: var(--marca); font-size: 22px; letter-spacing: 0.2em; }
.marca-sub { font-size: 8.5px; font-weight: 600; letter-spacing: 0.52em; color: var(--bronze); }
.menu { display: flex; justify-content: center; gap: clamp(16px, 2.5vw, 32px); font-size: 14px; font-weight: 500; letter-spacing: 0.01em; }
.menu a { text-decoration: none; padding: 6px 0; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size 0.35s var(--ease); }
.menu a:hover, .menu a[aria-current="page"] { background-size: 100% 1px; }
.topo-acoes { justify-self: end; display: flex; align-items: center; gap: 10px; }
.topo-acoes .btn { min-height: 44px; }
.topo .btn-preto, .topo.sobre-foto .btn-preto { background: var(--marca-ouro); color: #302114; }
.topo .btn-preto:hover { background: #F6D99F; }
.topo :focus-visible, .rodape :focus-visible, .painel-lateral :focus-visible { outline-color: var(--marca-ouro); }
.topo.sobre-foto .marca svg, .topo.sobre-foto .marca-sub { color: var(--bronze); }
.menu-btn { display: none; width: 44px; height: 44px; border: 1px solid currentColor; border-radius: 50%; background: transparent; align-items: center; justify-content: center; }

/* Abertura (inspirada no RIO Property) */
.hero { position: relative; height: 100vh; height: 100svh; min-height: 620px; overflow: hidden; color: var(--branco); background: #1B2A30; }
.hero-foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(var(--hz, 1.06)); transform-origin: 50% 60%; will-change: transform; }
.hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8, 14, 16, 0.45) 0%, rgba(8, 14, 16, 0.05) 32%, rgba(8, 14, 16, 0.08) 55%, rgba(8, 14, 16, 0.55) 100%); pointer-events: none; }
.hero-info { position: absolute; z-index: 1; top: calc(var(--topo) + 28px); left: var(--margem); right: var(--margem); display: grid; grid-template-columns: 1fr 1fr; gap: 24px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; }
.hero-info ul { margin: 0; padding: 0; list-style: none; line-height: 1.7; }
.hero-info p { max-width: 36ch; line-height: 1.6; }
.hero-titulo { position: absolute; z-index: 1; left: var(--margem); right: var(--margem); bottom: clamp(28px, 5vh, 56px); font-family: var(--sans); font-weight: 400; font-size: clamp(60px, 9.8vw, 156px); line-height: 1.04; letter-spacing: -0.045em; }
.hero-titulo span { display: block; will-change: transform; }
.hero-titulo .l1 { transform: translateX(calc(var(--hx, 0) * -1px)); }
.hero-titulo .l2 { padding-left: 14vw; transform: translateX(calc(var(--hx, 0) * 0.6px)); }
.hero-titulo .l3 { text-align: right; padding-right: 0.04em; transform: translateX(calc(var(--hx, 0) * 1px)); }
.hero-credito { position: absolute; z-index: 1; right: var(--margem); top: calc(var(--topo) + 28px); font-size: 11px; letter-spacing: 0.04em; color: rgba(252, 251, 248, 0.72); }
.js .hero-titulo span { opacity: 0; translate: 0 40px; transition: opacity 1.1s var(--ease), translate 1.1s var(--ease); }
.js .hero.pronto .hero-titulo span { opacity: 1; translate: 0 0; }
.js .hero.pronto .hero-titulo .l2 { transition-delay: 0.1s; }
.js .hero.pronto .hero-titulo .l3 { transition-delay: 0.2s; }

/* Seções */
.secao { padding: clamp(96px, 11vw, 176px) var(--margem); }
.secao + .secao { padding-top: 0; }
.cabeca { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; margin-bottom: clamp(48px, 5vw, 80px); }

/* Você veio procurar um imóvel */
.intro { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 40px 24px; }
.intro .grande { grid-column: 1 / -1; }
.intro .busca { grid-column: 1 / 9; }
.intro .intro-texto { grid-column: 9 / 13; display: flex; flex-direction: column; gap: 20px; align-self: end; }
.busca { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 1.2fr) auto; gap: 8px; padding: 8px; border-radius: 999px; background: var(--cinza); }
.busca select, .busca input { min-height: 52px; padding: 0 22px; border: 0; border-radius: 999px; background: var(--branco); font-size: 15px; color: var(--preto); appearance: none; -webkit-appearance: none; }
.busca select { padding-right: 42px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23111213' stroke-width='1.5'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 20px center; }
.segmento { display: flex; gap: 2px; padding: 4px; border-radius: 999px; background: var(--branco); }
.segmento button { min-height: 44px; padding: 0 20px; border: 0; border-radius: 999px; background: transparent; font-size: 15px; font-weight: 500; transition: background 0.3s var(--ease), color 0.3s var(--ease); }
.segmento button[aria-pressed="true"] { background: var(--preto); color: var(--branco); }

/* Quem é você (RIO) */
.perfis-titulo { text-align: center; margin-bottom: clamp(40px, 4vw, 64px); }
.perfis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--preto); }
.perfil { display: flex; flex-direction: column; gap: 18px; padding: 32px 28px 40px 0; }
.perfil + .perfil { padding-left: 28px; border-left: 1px solid var(--linha); }
.perfil h3 { font-family: var(--display); font-optical-sizing: auto; font-weight: 400; font-size: clamp(28px, 2.2vw, 36px); line-height: 1.1; letter-spacing: -0.02em; }
.perfil p { color: var(--texto-2); max-width: 30ch; flex-grow: 1; }

/* Cartões numerados (360 Lexington) */
.abas { display: flex; gap: 28px; }
.aba { min-height: 40px; padding: 0; border: 0; border-bottom: 1px solid transparent; background: none; font-size: 15px; font-weight: 500; color: var(--texto-3); transition: color 0.3s var(--ease), border-color 0.3s var(--ease); }
.aba:hover { color: var(--preto); }
.aba[aria-pressed="true"] { color: var(--preto); border-bottom-color: var(--preto); }
.cartoes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.cartao { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; min-height: clamp(460px, 38vw, 580px); padding: 28px; background: var(--cinza); color: var(--preto); text-decoration: none; overflow: hidden; transition: background 0.5s var(--ease), color 0.5s var(--ease); }
.cartao-topo { display: flex; flex-direction: column; gap: 10px; padding-right: 84px; }
.cartao.dupla .cartao-topo { padding-right: 0; }
.cartao.dupla .cartao-topo h3 { padding-right: 140px; }
.cartao.fechado .selo { background: var(--cedro); border-color: var(--cedro); color: var(--branco); }
.cartao.fechado .cartao-foto img { filter: saturate(0.55); }
.cartao-topo h3 { font-size: clamp(28px, 2.4vw, 38px); line-height: 1.1; letter-spacing: -0.02em; }
.cartao-topo p { font-size: 15px; color: var(--texto-2); transition: color 0.5s var(--ease); }
.cartao-topo .preco { margin-top: 6px; font-size: 17px; font-weight: 500; color: var(--preto); transition: color 0.5s var(--ease); }
.cartao-base { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; }
.cartao-num { font-size: clamp(56px, 6vw, 96px); font-weight: 400; line-height: 0.8; letter-spacing: -0.04em; color: #C4C1B9; transition: color 0.5s var(--ease); }
.cartao-foto { width: 62%; aspect-ratio: 4 / 3; overflow: hidden; background: var(--cinza-2); }
.cartao-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.cartao .selo { position: absolute; top: 28px; right: 28px; padding: 5px 12px; border: 1px solid currentColor; border-radius: 999px; font-size: 12px; font-weight: 500; }
.cartao:hover { background: var(--areia); color: var(--preto); }
.cartao:hover .cartao-topo p { color: var(--texto-2); }
.cartao:hover .preco { color: var(--preto); }
.cartao:hover .cartao-num { color: rgba(17, 18, 19, 0.3); }
.cartao:hover .cartao-foto img { transform: scale(1.04); }
.depois-cartoes { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 32px; }

/* Onde a Rema atua (mapa numerado) */
.onde { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; align-items: start; }
.onde-mapa { grid-column: 1 / 8; position: relative; background: var(--cinza); aspect-ratio: 7 / 5; overflow: hidden; }
.onde-mapa svg { width: 100%; height: 100%; display: block; }
.pino { position: absolute; width: 36px; height: 36px; margin: -18px 0 0 -18px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--preto); color: var(--branco); font-size: 13px; font-weight: 500; text-decoration: none; transition: background 0.3s var(--ease), transform 0.3s var(--ease); }
.pino:hover, .pino.ativo { background: var(--cedro); transform: scale(1.15); }
.onde-lista { grid-column: 9 / 13; display: flex; flex-direction: column; align-self: end; }
.onde-lista .lede { margin-bottom: 32px; }
.onde-bairros { margin-top: 24px; font-size: 14px; line-height: 1.6; }
.onde-bairros a { color: inherit; }
.bairro { display: grid; grid-template-columns: 36px 1fr auto; gap: 12px; align-items: baseline; padding: 16px 0; border-top: 1px solid var(--linha); text-decoration: none; transition: padding 0.3s var(--ease); }
.bairro:last-child { border-bottom: 1px solid var(--linha); }
.bairro span:first-child { font-size: 13px; color: var(--texto-3); }
.bairro b { font-weight: 500; }
.bairro small { font-size: 13px; color: var(--texto-2); }
.bairro:hover, .bairro.ativo { padding-left: 8px; }

/* O jeito Rema (princípios) */
.jeito { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; }
.jeito-titulo { grid-column: 1 / 6; align-self: start; position: sticky; top: calc(var(--topo) + 40px); display: flex; flex-direction: column; gap: 24px; }
.jeito-lista { grid-column: 7 / 13; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--preto); }
.jeito-lista li { display: grid; grid-template-columns: 56px 1fr; gap: 16px; padding: 32px 0; border-bottom: 1px solid var(--linha); }
.jeito-lista li > span { font-size: 13px; color: var(--texto-3); padding-top: 8px; }
.jeito-lista strong { display: block; font-size: clamp(24px, 2vw, 32px); font-weight: 400; line-height: 1.15; letter-spacing: -0.015em; margin-bottom: 8px; }
.jeito-lista p { color: var(--texto-2); }

/* Para proprietários (faixa areia) */
.escuro { background: var(--areia); color: var(--preto); }
.escuro .lede, .escuro .suave { color: var(--texto-2); }
.donos { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 48px 24px; }
.donos .grande { grid-column: 1 / 9; }
.donos .donos-texto { grid-column: 9 / 13; align-self: end; display: flex; flex-direction: column; gap: 24px; align-items: flex-start; }
.passos { grid-column: 1 / -1; margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.passos li { display: flex; flex-direction: column; justify-content: space-between; gap: 48px; min-height: 240px; padding: 24px; background: var(--areia-2); }
.passos li span { font-size: clamp(48px, 4.5vw, 72px); line-height: 0.8; letter-spacing: -0.04em; color: rgba(17, 18, 19, 0.3); }
.passos li b { font-size: 20px; font-weight: 400; line-height: 1.2; }
.passos li small { display: block; margin-top: 8px; font-size: 14px; color: var(--texto-2); }

/* Contato sobre a foto do pôr do sol */
.contato { position: relative; overflow: hidden; color: var(--branco); background: #151A1C; }
.contato > img { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 38%; }
/* A camada de contraste precisa ficar acima da foto, não atrás dela. */
.contato::before { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, rgba(10, 14, 16, 0.84) 0%, rgba(10, 14, 16, 0.78) 55%, rgba(10, 14, 16, 0.45) 100%); pointer-events: none; }
.contato-grade { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 48px 24px; align-items: end; }
.contato-texto { grid-column: 1 / 7; display: flex; flex-direction: column; gap: 32px; }
.contato-dados { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; padding-top: 28px; border-top: 1px solid rgba(252, 251, 248, 0.3); font-size: 16px; }
.contato-dados .rotulo { display: block; margin-bottom: 8px; color: rgba(252, 251, 248, 0.7); }
.formulario { grid-column: 8 / 13; padding: clamp(28px, 3vw, 40px); display: flex; flex-direction: column; gap: 18px; background: var(--branco); color: var(--preto); }
.formulario h3 { font-size: 28px; letter-spacing: -0.02em; margin-bottom: 4px; }
.campo { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 500; color: var(--texto-2); }
.campo input, .campo textarea, .campo select { width: 100%; min-height: 50px; padding: 12px 16px; border: 1px solid var(--linha); border-radius: 0; background: var(--branco); font-size: 16px; color: var(--preto); transition: border-color 0.3s; }
.campo textarea { resize: vertical; min-height: 96px; }
.campo input:focus, .campo textarea:focus { outline: none; border-color: var(--preto); }
.aceite { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--texto-2); }
.aceite input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--preto); flex-shrink: 0; }
.credito-foto { position: absolute; z-index: 2; right: var(--margem); bottom: 16px; font-size: 11px; color: rgba(252, 251, 248, 0.8); }

/* Rodapé */
.rodape { --linha: rgba(234, 196, 127, 0.25); --texto-3: #D4C3AA; padding: clamp(72px, 8vw, 120px) var(--margem) 32px; background: var(--marca-fundo); color: var(--marca-texto); }
.rodape-grade { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 32px; padding-bottom: 64px; border-bottom: 1px solid var(--linha); }
.rodape-grade > div { display: flex; flex-direction: column; gap: 10px; font-size: 15px; }
.rodape-grade .rotulo { margin-bottom: 8px; color: var(--texto-3); }
.rodape-grade a { text-decoration: none; }
.rodape-grade a:hover { text-decoration: underline; text-underline-offset: 4px; }
.logo-completo { width: 150px; height: auto; color: var(--bronze); }
.rodape-base { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; padding-top: 24px; font-size: 13px; color: var(--texto-3); }
.rodape-base a { color: inherit; }

/* Entradas suaves */
.js [data-revela] { opacity: 0; translate: 0 28px; transition: opacity 0.9s var(--ease), translate 0.9s var(--ease); }
.js [data-revela].in { opacity: 1; translate: 0 0; }
.js .cartoes [data-revela]:nth-child(2) { transition-delay: 0.08s; }
.js .cartoes [data-revela]:nth-child(3) { transition-delay: 0.16s; }
.js .cartoes [data-revela].in { transition-delay: 0s; transition-property: opacity, translate, background, color; }

/* ===== Catálogo ===== */
.pagina-topo { padding: calc(var(--topo) + clamp(56px, 7vw, 112px)) var(--margem) 40px; display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; }
.migalhas { margin-bottom: 20px; font-size: 13px; color: var(--texto-2); }
.migalhas a { color: inherit; }
.contador { font-family: var(--sans); font-stretch: 100%; font-weight: 400; font-size: 0.32em; letter-spacing: 0; vertical-align: top; margin-left: 0.2em; color: var(--texto-3); }
.filtros { position: sticky; top: var(--topo); z-index: 30; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 14px var(--margem); background: var(--branco); border-block: 1px solid var(--linha); }
.filtros .segmento { background: var(--cinza); }
.filtros select, .filtros summary { min-height: 44px; padding: 0 40px 0 18px; border: 1px solid var(--linha); border-radius: 999px; background-color: var(--branco); font-size: 14px; font-weight: 500; cursor: pointer; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23111213' stroke-width='1.5'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; }
.filtros select:hover, .filtros summary:hover { border-color: var(--preto); }
.mais { position: relative; }
.mais summary { display: flex; align-items: center; list-style: none; }
.mais summary::-webkit-details-marker { display: none; }
.mais-corpo { position: absolute; top: calc(100% + 8px); left: 0; z-index: 5; width: 320px; padding: 20px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; background: var(--branco); border: 1px solid var(--linha); box-shadow: 0 24px 48px -24px rgba(17, 18, 19, 0.25); }
.mais-corpo .campo:last-child { grid-column: 1 / -1; }
.filtros .direita { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.limpar { min-height: 44px; padding: 0 8px; border: 0; background: none; font-size: 14px; font-weight: 500; text-decoration: underline; text-underline-offset: 4px; }
.resultado { padding: 40px var(--margem) clamp(96px, 10vw, 160px); }
.resultado .cartoes { gap: 12px; }
.vazio { grid-column: 1 / -1; padding: clamp(48px, 7vw, 96px); display: flex; flex-direction: column; align-items: flex-start; gap: 20px; background: var(--cinza); }
.vazio .acoes { display: flex; flex-wrap: wrap; gap: 10px; }

/* ===== Página do imóvel ===== */
.im-hero { position: relative; height: 100vh; height: 100svh; min-height: 600px; color: var(--branco); background: #1B2A30; overflow: hidden; }
.im-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.im-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8, 14, 16, 0.4) 0%, rgba(8, 14, 16, 0.1) 30%, rgba(8, 14, 16, 0.55) 55%, rgba(8, 14, 16, 0.84) 100%); }
.im-hero-texto { position: absolute; z-index: 1; left: var(--margem); bottom: clamp(32px, 6vh, 64px); max-width: min(760px, 60vw); display: flex; flex-direction: column; gap: 16px; }
.im-hero-texto h1 { font-family: var(--sans); font-size: clamp(36px, 4.2vw, 68px); line-height: 1.1; letter-spacing: -0.045em; text-wrap: pretty; }
.im-hero-texto p { font-size: 17px; color: rgba(252, 251, 248, 0.85); }
.im-card { position: absolute; z-index: 1; right: var(--margem); bottom: clamp(32px, 6vh, 64px); width: 320px; padding: 24px; display: flex; flex-direction: column; gap: 14px; background: var(--branco); color: var(--preto); }
.im-card strong { font-size: 34px; font-weight: 400; letter-spacing: -0.02em; line-height: 1; }
.im-card strong small { font-size: 16px; }
.precos-duplos { display: flex; flex-direction: column; gap: 12px; }
.preco-opcao { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-top: 10px; border-top: 1px solid var(--linha); }
.preco-opcao span { color: var(--texto-2); font-size: 12px; line-height: 1.3; }
.preco-opcao strong { flex: 0 0 auto; font-size: clamp(21px, 2vw, 28px); font-variant-numeric: lining-nums tabular-nums; font-weight: 400; letter-spacing: -0.035em; line-height: 1.05; text-align: right; }
.precos-duplos + .suave { display: block; }
.im-card .acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.im-card .btn { min-height: 46px; padding: 0 12px; }
.numeros { display: grid; grid-template-columns: repeat(var(--n, 5), minmax(0, 1fr)); border-bottom: 1px solid var(--linha); }
.numeros div { padding: 36px var(--margem) 36px 24px; border-right: 1px solid var(--linha); }
.numeros div:first-child { padding-left: var(--margem); }
.numeros div:last-child { border-right: 0; }
.numeros span { display: block; margin-bottom: 14px; font-size: 13px; color: var(--texto-2); }
.numeros strong { font-size: clamp(40px, 4.4vw, 72px); font-weight: 400; line-height: 0.9; letter-spacing: -0.04em; }
.codigo-imovel { margin-top: 20px; font-size: 14px; color: var(--texto-2); }
.codigo-imovel strong { font-weight: 500; color: var(--preto); letter-spacing: 0.04em; user-select: all; }
.numeros .texto strong { font-size: clamp(28px, 2.6vw, 44px); line-height: 1.05; letter-spacing: -0.02em; }
.im-corpo { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; padding: clamp(80px, 9vw, 140px) var(--margem); align-items: start; }
.im-conteudo { grid-column: 1 / 8; display: flex; flex-direction: column; gap: clamp(56px, 6vw, 88px); }
.im-bloco { display: flex; flex-direction: column; gap: 24px; }
.im-bloco .texto p { font-size: clamp(18px, 1.35vw, 21px); line-height: 1.6; max-width: 58ch; }
.im-bloco .texto p + p { margin-top: 1em; }
.destaques { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.destaques li { padding: 22px; background: var(--cinza); font-size: 16px; }
.destaques li span { display: block; margin-bottom: 24px; font-size: 13px; color: var(--texto-3); }
.galeria { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.galeria button { padding: 0; border: 0; background: var(--cinza); aspect-ratio: 4 / 3; overflow: hidden; }
.galeria button:first-child { grid-column: 1 / -1; aspect-ratio: 16 / 9; }
.galeria img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.galeria button:hover img { transform: scale(1.03); }
.mapa-im { position: relative; background: var(--cinza); aspect-ratio: 16 / 10; }
.mapa-im svg { width: 100%; height: 100%; display: block; }
.refs { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; }
.refs li { display: flex; gap: 12px; padding: 14px 0; border-top: 1px solid var(--linha); font-size: 15px; }
.refs li span { color: var(--texto-3); }
.im-contato { grid-column: 9 / 13; position: sticky; top: calc(var(--topo) + 24px); padding: 28px; display: flex; flex-direction: column; gap: 18px; background: var(--cinza); }
.im-contato h2 { font-size: 26px; letter-spacing: -0.02em; }
.im-preco-contato { display: flex; flex-direction: column; gap: 12px; }
.im-preco-contato > .rotulo { margin-bottom: -4px; }
.im-preco-contato > .suave { font-size: 14px; }
.im-preco-contato > strong { font-size: 32px; font-weight: 400; letter-spacing: -0.02em; line-height: 1.1; }
.im-preco-contato > strong small { font-size: 16px; }
.abas-form { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; padding: 4px; border-radius: 999px; background: var(--branco); }
.abas-form button { min-height: 44px; border: 0; border-radius: 999px; background: transparent; font-size: 14px; font-weight: 500; transition: background 0.3s, color 0.3s; }
.abas-form button[aria-pressed="true"] { background: var(--preto); color: var(--branco); }
.dias { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.chip { min-height: 44px; padding: 0 10px; border: 1px solid var(--linha); background: var(--branco); font-size: 14px; font-weight: 500; transition: background 0.3s, color 0.3s, border-color 0.3s; }
.chip:hover { border-color: var(--preto); }
.chip[aria-pressed="true"] { background: var(--preto); color: var(--branco); border-color: var(--preto); }
.dias .chip { height: 60px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; }
.dias .chip small { font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; opacity: 0.75; }
.periodos { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.im-contato form { display: flex; flex-direction: column; gap: 16px; }
.im-contato .btn { width: 100%; }
.sucesso { display: flex; flex-direction: column; gap: 14px; }
.sucesso p { color: var(--texto-2); }
.barra-acoes { display: none; }

.visor { width: 100vw; height: 100vh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: var(--preto); color: var(--branco); }
.visor::backdrop { background: var(--preto); }
.visor[open] { display: flex; align-items: center; justify-content: center; }
.visor img { max-width: min(1400px, 100vw - 180px); max-height: calc(100vh - 140px); object-fit: contain; }
.redondo { position: absolute; width: 52px; height: 52px; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(252, 251, 248, 0.35); border-radius: 50%; background: transparent; color: var(--branco); transition: background 0.3s, color 0.3s; }
.redondo:hover { background: var(--branco); color: var(--preto); }
.visor-fechar { top: 24px; right: 24px; }
.visor-ant { left: 24px; top: 50%; transform: translateY(-50%); }
.visor-prox { right: 24px; top: 50%; transform: translateY(-50%); }
.visor-contador { position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%); font-size: 13px; letter-spacing: 0.06em; }

/* ===== Painel ===== */
.painel { display: grid; grid-template-columns: 250px minmax(0, 1fr); min-height: 100vh; }
.painel-lateral { padding: 28px 20px; display: flex; flex-direction: column; gap: 40px; background: var(--marca-fundo); color: var(--marca-texto); }
.painel-lateral .marca-emblema { display: block; width: 210px; max-width: 100%; height: auto; }
.painel-nav { display: flex; flex-direction: column; gap: 4px; }
.painel-nav a { min-height: 44px; padding: 0 14px; display: flex; align-items: center; border-radius: 999px; color: var(--marca-texto); text-decoration: none; font-size: 15px; }
.painel-nav a:hover, .painel-nav a[aria-current="page"] { background: rgba(234, 196, 127, 0.16); color: var(--marca-ouro); }
.painel-usuario { margin-top: auto; padding-top: 16px; border-top: 1px solid rgba(234, 196, 127, 0.25); font-size: 14px; display: flex; flex-direction: column; gap: 2px; }
.painel-usuario span { color: #D4C3AA; }
.painel-principal { padding: 48px var(--margem); display: flex; flex-direction: column; gap: 28px; min-width: 0; }
.painel-topo { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.painel-topo .acoes { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.busca-painel input { width: 300px; min-height: 48px; padding: 0 20px; border: 1px solid var(--linha); border-radius: 999px; background: var(--branco); font-size: 15px; }
.abas-status { display: flex; flex-wrap: wrap; gap: 6px; }
.abas-status button { min-height: 40px; padding: 0 16px; border: 1px solid var(--linha); border-radius: 999px; background: var(--branco); font-size: 14px; font-weight: 500; }
.abas-status button[aria-pressed="true"] { background: var(--preto); color: var(--branco); border-color: var(--preto); }
.abas-status small { margin-left: 6px; opacity: 0.7; }
.tabela { border-top: 1px solid var(--preto); overflow-x: auto; }
.tabela-linha { min-width: 940px; min-height: 84px; display: grid; grid-template-columns: minmax(0, 2.6fr) 110px 150px 170px 90px 170px; gap: 16px; align-items: center; border-bottom: 1px solid var(--linha); }
.tabela-cabeca { min-height: 48px; font-size: 12px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--texto-3); }
.tabela-imovel { display: flex; align-items: center; gap: 14px; }
.tabela-imovel .mini { width: 72px; height: 54px; flex-shrink: 0; object-fit: cover; background: var(--cinza); }
.tabela-imovel b { display: block; font-weight: 500; }
.tabela-imovel span { font-size: 14px; color: var(--texto-2); }
.status { justify-self: start; padding: 5px 12px; border-radius: 999px; font-size: 13px; font-weight: 500; }
.estrela { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border: 0; background: none; color: #B9B6AE; }
.estrela[aria-pressed="true"] { color: var(--cedro); }
.estrela[aria-pressed="true"] svg { fill: currentColor; }
.tabela-acoes { display: flex; gap: 16px; font-size: 14px; font-weight: 500; }

.aviso { position: fixed; left: 50%; bottom: 24px; z-index: 100; width: max-content; max-width: min(460px, calc(100% - 32px)); padding: 14px 22px; border-radius: 999px; background: var(--preto); color: var(--branco); font-size: 15px; text-align: center; transform: translate(-50%, 16px); opacity: 0; pointer-events: none; transition: opacity 0.3s var(--ease), transform 0.3s var(--ease); }
.aviso.visivel { opacity: 1; transform: translate(-50%, 0); }

/* Aviso de cookies (LGPD) */
.cookies { position: fixed; left: var(--margem); bottom: 24px; z-index: 90; width: min(440px, calc(100% - 2 * var(--margem))); padding: 20px; display: flex; flex-direction: column; gap: 14px; background: var(--branco); border: 1px solid var(--linha); box-shadow: 0 24px 48px -24px rgba(17, 18, 19, 0.3); font-size: 15px; opacity: 0; translate: 0 16px; transition: opacity 0.4s var(--ease), translate 0.4s var(--ease); }
.cookies.visivel { opacity: 1; translate: 0 0; }
.cookies a { text-underline-offset: 3px; }
.cookies-acoes { display: flex; justify-content: flex-end; gap: 8px; }
.cookies .btn { min-height: 44px; }

/* Assinatura da LW Code */
.assinatura { display: flex; justify-content: center; align-items: center; gap: 14px; padding: 16px var(--margem); background: var(--preto); color: rgba(252, 251, 248, 0.7); font-size: 13px; }
.assinatura a { display: inline-flex; border-radius: 6px; transition: opacity 0.3s var(--ease); }
.assinatura a:hover { opacity: 0.8; }
.assinatura img { width: 120px; height: auto; }

.migalhas-claras, .migalhas-claras a { color: rgba(252, 251, 248, 0.8); }
.im-hero-texto .migalhas { margin-bottom: 4px; }
.texto-legal { display: flex; flex-direction: column; gap: 16px; max-width: 760px; }
.texto-legal h2 { margin-top: 24px; font-size: clamp(24px, 2vw, 32px); }
.texto-legal p { color: var(--texto-2); }
.rodape-base a { text-underline-offset: 3px; }
.rodape-grade a[href^="tel:"], .contato-dados a[href^="tel:"] { text-decoration: none; }

/* ===== Telas médias ===== */
@media (max-width: 1100px) {
  .menu { gap: 20px; font-size: 13px; }
  .perfis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .perfil:nth-child(3) { padding-left: 0; border-left: 0; }
  .perfil:nth-child(n + 3) { border-top: 1px solid var(--linha); }
  .cartoes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .intro .busca { grid-column: 1 / -1; }
  .intro .intro-texto { grid-column: 1 / -1; }
  .passos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .im-contato { grid-column: 8 / 13; }
}

/* ===== Celular ===== */
@media (max-width: 860px) {
  :root { --topo: 104px; }
  body { font-size: 16px; }
  .topo { grid-template-columns: minmax(0, 1fr) auto; gap: 16px; }
  .topo .marca-emblema { width: clamp(200px, 62vw, 260px); max-width: 100%; }
  .painel-lateral .marca-emblema { width: 240px; max-width: 100%; }
  .contato::before { background: rgba(10, 14, 16, 0.78); }
  .menu { display: none; position: fixed; top: var(--topo); left: 0; right: 0; bottom: 0; flex-direction: column; gap: 0; padding: 24px var(--margem); background: var(--branco); color: var(--preto); font-family: var(--display); font-weight: 400; font-size: 34px; }
  .menu.aberto { display: flex; }
  .menu a { padding: 16px 0; border-bottom: 1px solid var(--linha); background: none; }
  .topo-acoes .btn { display: none; }
  .menu-btn { display: inline-flex; }
  .hero-info { grid-template-columns: 1fr; }
  .hero-info p { display: none; }
  .hero-credito { top: auto; bottom: 8px; }
  .hero-titulo { font-size: clamp(46px, 15.5vw, 92px); bottom: 40px; }
  .hero-titulo .l2 { padding-left: 8vw; }
  .grande .recuo { padding-left: 0; }
  .busca { grid-template-columns: 1fr; border-radius: 28px; }
  .segmento button { flex: 1; }
  .perfis, .cartoes, .passos { grid-template-columns: 1fr; }
  .perfil, .perfil + .perfil { padding: 28px 0; border-left: 0; }
  .perfil + .perfil { border-top: 1px solid var(--linha); }
  .cabeca { flex-direction: column; align-items: flex-start; }
  .cartao { min-height: 0; }
  .cartao-foto { width: 70%; }
  .intro, .onde, .jeito, .donos, .contato-grade, .im-corpo { grid-template-columns: 1fr; }
  .intro > *, .onde > *, .jeito > *, .donos > *, .contato-grade > *, .im-corpo > * { grid-column: 1 / -1 !important; }
  .onde-mapa { aspect-ratio: 1 / 1; }
  .jeito-titulo { position: static; }
  .jeito-lista li { grid-template-columns: 40px 1fr; }
  .passos li { min-height: 0; gap: 28px; }
  .contato-dados { grid-template-columns: 1fr; }
  .rodape-grade { grid-template-columns: 1fr 1fr; }
  .rodape-grade > div:first-child { grid-column: 1 / -1; }
  .pagina-topo { flex-direction: column; align-items: flex-start; }
  .filtros { position: static; flex-wrap: nowrap; overflow-x: auto; }
  .filtros .direita { margin-left: 0; }
  .mais-corpo { position: fixed; left: 16px; right: 16px; top: auto; bottom: 16px; width: auto; }
  .im-hero-texto { max-width: none; right: var(--margem); bottom: 104px; }
  .depois-cartoes { flex-direction: column; align-items: flex-start; }
  .im-card { display: none; }
  .numeros { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .numeros .texto { grid-column: 1 / -1; }
  .numeros div, .numeros div:first-child { padding: 24px var(--margem); border-bottom: 1px solid var(--linha); }
  .numeros div:nth-child(3n) { border-right: 0; }
  .destaques, .refs { grid-template-columns: 1fr; }
  .galeria { grid-template-columns: 1fr; }
  .im-contato { position: static; }
  .barra-acoes { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 40; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 6px; border-radius: 999px; background: var(--preto); }
  .barra-acoes .btn { min-height: 48px; }
  .pagina-imovel { padding-bottom: 80px; }
  .visor img { max-width: 100vw; }
  .visor-ant { left: 8px; }
  .visor-prox { right: 8px; }
  .painel { grid-template-columns: 1fr; }
  .painel-lateral { flex-direction: row; align-items: center; justify-content: space-between; padding: 12px var(--margem); }
  .painel-nav, .painel-usuario { display: none; }
  .busca-painel input { width: 100%; }
  .cookies { left: 12px; right: 12px; bottom: 12px; width: auto; padding: 14px 16px; gap: 10px; font-size: 14px; }
  .pagina-imovel .cookies { bottom: 84px; }
  .assinatura { flex-wrap: wrap; padding-bottom: 20px; }
  .pagina-imovel .assinatura { padding-bottom: 96px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js [data-revela] { opacity: 1; translate: 0 0; }
  .js .hero-titulo span { opacity: 1; translate: 0 0; }
  .hero-foto, .hero-titulo span { transform: none !important; }
}