/* ============================================================
   KR Imóveis e Empreendimentos — v3 (mobile-first)
   Tema claro, UMA cor de ação (azul-marinho da marca), dourado
   como detalhe de marca, movimento pouco e com propósito.

   Regras que valem para o arquivo inteiro:
   1. ESPAÇAMENTO só sai da escala --s-* (múltiplos de 4).
   2. TIPOGRAFIA só sai da escala --t-*.
   3. RAIO, SOMBRA e DURAÇÃO só saem dos tokens (--r-*, --shadow-*, --dur-*).
   4. Campos de formulário compartilham UMA regra (ver "campos").
   ============================================================ */

/* ---------- fontes locais (sem Google Fonts) ---------- */
@font-face{
  font-family:"Inter var";
  src:url("/assets/fonts/inter-latin.woff2") format("woff2");
  font-weight:400 700; font-style:normal; font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Inter var";
  src:url("/assets/fonts/inter-latin-ext.woff2") format("woff2");
  font-weight:400 700; font-style:normal; font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"Inter Tight var";
  src:url("/assets/fonts/inter-tight-latin.woff2") format("woff2");
  font-weight:500 700; font-style:normal; font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Inter Tight var";
  src:url("/assets/fonts/inter-tight-latin-ext.woff2") format("woff2");
  font-weight:500 700; font-style:normal; font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ============================================================
   TOKENS
   ============================================================ */
:root{
  /* — cor — */
  --bg:#ffffff;
  --bg-2:#f5f5f7;
  --ink:#14172a;
  --ink-2:#575c6b;         /* 6,6:1 no branco */
  --ink-3:#666b7d;         /* 5,3:1 no branco · 4,9:1 no cinza — passa AA */
  --line:#d2d3da;          /* borda de cartão e de botão com texto (decorativa) */
  --line-ctl:#868a97;      /* borda de CAMPO: 3,4:1 no branco · 3,2:1 no cinza — WCAG 1.4.11 */
  --line-2:#e7e8ee;        /* divisória discreta */
  --navy:#0e1a40;
  --navy-2:#1a2a66;
  --navy-veil:#f3f5fb;
  --navy-ring:rgba(14,26,64,.14);
  /* dourado tirado da própria logo — detalhe de marca, nunca cor de ação */
  --gold:#a8814a;
  --gold-ink:#8a6a33;      /* 5,0:1 no branco */
  --gold-soft:#e3d2b3;
  --gold-veil:#faf5ec;
  --erro:#a3251c;
  --banco:#00559b;         /* azul institucional do selo do banco */

  /* — espaçamento: só múltiplos de 4 — */
  --s-1:4px;  --s-2:8px;  --s-3:12px; --s-4:16px; --s-5:20px;
  --s-6:24px; --s-7:32px; --s-8:40px; --s-9:48px; --s-10:64px;
  --s-11:80px; --s-12:96px;
  /* respiro entre seções: 56 px no celular → 112 px no desktop */
  --sec-y:clamp(56px, 6vw + 32px, 112px);

  /* — tipografia: saltos grandes entre os degraus — */
  --t-hero:clamp(2.375rem, 8.6vw, 4.25rem);
  --t-h1:clamp(1.875rem, 6vw, 3rem);
  --t-h2:clamp(1.625rem, 5vw, 2.5rem);
  --t-h3:clamp(1.125rem, 3vw, 1.375rem);
  --t-h4:1rem;
  --t-lead:clamp(1.0625rem, 2.6vw, 1.25rem);
  --t-price:1.25rem;
  --t-body:1rem;
  --t-sm:0.875rem;
  --t-xs:0.75rem;
  --t-label:0.8125rem;

  /* — forma — */
  --r-xs:8px;
  --r-sm:12px;
  --r:16px;
  --r-lg:20px;
  --pill:980px;
  --nav-h:60px;
  --medida:65ch;           /* largura máxima confortável de leitura */

  /* — movimento — */
  --ease:cubic-bezier(.25,.1,.25,1);
  --ease-out:cubic-bezier(.22,1,.36,1);
  --dur-1:.18s;            /* resposta ao toque */
  --dur-2:.3s;             /* abrir/fechar */
  --dur-3:.6s;             /* entrada ao rolar */

  /* — sombra — */
  --shadow-sm:0 1px 2px rgba(20,23,42,.05), 0 4px 12px rgba(20,23,42,.05);
  --shadow:0 1px 2px rgba(20,23,42,.04), 0 12px 32px rgba(20,23,42,.08);
  --shadow-lg:0 2px 4px rgba(20,23,42,.05), 0 24px 56px rgba(20,23,42,.14);

  --font:"Inter var", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --display:"Inter Tight var", "Inter var", -apple-system, BlinkMacSystemFont, sans-serif;

  color-scheme:light;
}

/* ============================================================
   BASE
   ============================================================ */
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; scrollbar-gutter:stable; overflow-x:clip; }
body{
  margin:0; font-family:var(--font); font-size:var(--t-body); line-height:1.55;
  color:var(--ink); background:var(--bg);
  -webkit-font-smoothing:antialiased; overflow-x:clip;
  overflow-wrap:break-word;
}
body.travado{ position:fixed; left:0; right:0; overflow:hidden; }
[hidden]{ display:none !important; }
img{ max-width:100%; display:block; }
svg{ width:1em; height:1em; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex:none; }

/* títulos na família de display, com entrelinha e tracking próprios */
h1,h2,h3,h4{
  margin:0; font-family:var(--display); font-weight:700;
  letter-spacing:-.028em; line-height:1.1; text-wrap:balance;
}
h3,h4{ font-weight:600; letter-spacing:-.015em; line-height:1.25; }
p{ margin:0 0 var(--s-3); }
a{ color:var(--navy); }
button{ font:inherit; }
:focus-visible{ outline:2px solid var(--navy); outline-offset:2px; border-radius:4px; }
[id]{ scroll-margin-top:calc(var(--nav-h) + var(--s-4)); }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip{ position:absolute; left:var(--s-3); top:-60px; z-index:500; background:var(--navy); color:#fff; padding:var(--s-3) var(--s-4); border-radius:var(--r-sm); text-decoration:none; }
.skip:focus{ top:var(--s-3); }

/* área de toque de 44px sem engordar o desenho.
   -y = só na vertical (controles lado a lado, para não roubar o clique do vizinho)
   -xy = nos dois eixos (botões redondos isolados) */
.seg button::before, .tchips button::before, .fbtn::before, .chip::before,
.link::before, .back::before, .foot-col a::before, .plus button::before,
.carac-chip::before, .fchips button::before, .catview button::before,
.crumbs a::before{
  content:""; position:absolute; left:0; right:0; top:50%;
  transform:translateY(-50%); height:44px; z-index:0;
}
.icon-btn::before, .share-btn::before, .nav-wa::before, .fav::before, .gal-thumbs button::before{
  content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:max(100%,44px); height:max(100%,44px); z-index:0;
}
.seg button, .tchips button, .fbtn, .chip, .link, .back, .foot-col a, .plus button,
.carac-chip, .fchips button, .icon-btn, .share-btn, .nav-wa, .fav,
.catview button, .gal-thumbs button, .crumbs a{ position:relative; }
.seg button > *, .tchips button > *, .fbtn > *, .link > *, .back > *{ position:relative; z-index:1; }

/* ⚠️ só padding-left/right aqui: as classes de página (.cat, .sp, .im…) usam a
   MESMA caixa e definem padding-block. Com o atalho `padding` uma zerava a outra. */
.wrap{
  width:100%; max-width:1120px; margin:0 auto;
  padding-left:max(var(--s-5), env(safe-area-inset-left));
  padding-right:max(var(--s-5), env(safe-area-inset-right));
}
.wrap-narrow{ max-width:760px; }
.sec{ padding:var(--sec-y) 0; }
.sec-alt{ background:var(--bg-2); }
.sec-head{ margin-bottom:var(--s-6); }
.sec-head h2{ font-size:var(--t-h2); }
.sec-head p{ color:var(--ink-2); margin:var(--s-2) 0 0; font-size:var(--t-lead); max-width:var(--medida); }
/* título + link "Ver todos" na mesma linha: o link nunca quebra, o título cede */
.sec-head.row{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--s-4); }
.sec-head.row h2{ min-width:0; }
.sec-head.row .link{ white-space:nowrap; flex:none; }
.kicker{
  font-family:var(--display); font-size:var(--t-xs); font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold-ink); margin:0 0 var(--s-3);
  display:flex; align-items:center; gap:var(--s-3);
}
.kicker::after{ content:""; flex:1; height:1px; background:linear-gradient(90deg, var(--gold-soft), transparent); }
.lead{ font-size:var(--t-lead); color:var(--ink-2); max-width:var(--medida); }
.btns{ display:flex; flex-wrap:wrap; gap:var(--s-3); }

/* comprimento de linha confortável em todo o corpo de texto */
.sp-texto > p, .priv p, .vender > .lead, .im-desc p, .faq p,
.sobre-grid p, .sb-grid p, .cred-head p, .contato-grid > div > p{ max-width:var(--medida); }

/* ---------- entrada discreta ao rolar ----------
   O bloco inteiro sobe 12 px e aparece; cards e serviços dentro dele
   entram um atrás do outro (60 ms de diferença). */
/* (só com JavaScript — sem ele, `html.js` não existe e tudo fica visível) */
.js .rv{ opacity:0; transform:translateY(12px); transition:opacity var(--dur-3) var(--ease-out), transform var(--dur-3) var(--ease-out); }
.js .rv.in{ opacity:1; transform:none; }
.js .rv .cards > *, .js .rv .sv-grid > *{
  opacity:0; transform:translateY(14px);
  transition:opacity .5s var(--ease-out), transform .5s var(--ease-out);
}
.js .rv.in .cards > *, .js .rv.in .sv-grid > *{ opacity:1; transform:none; }
.rv .cards > :nth-child(2), .rv .sv-grid > :nth-child(2){ transition-delay:.06s; }
.rv .cards > :nth-child(3), .rv .sv-grid > :nth-child(3){ transition-delay:.12s; }
.rv .sv-grid > :nth-child(4){ transition-delay:.18s; }
.rv .sv-grid > :nth-child(5){ transition-delay:.24s; }
.rv .sv-grid > :nth-child(6){ transition-delay:.3s; }

/* troca de página sem recarregar: o conteúdo novo entra com um respiro */
@keyframes viewIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
.view-in{ animation:viewIn .32s var(--ease-out) both; }
@keyframes fadeIn{ from{ opacity:0; } to{ opacity:1; } }

/* ============================================================
   BOTÕES E LINKS
   ============================================================ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s-2);
  height:48px; padding:0 var(--s-6); border-radius:var(--pill); border:0;
  background:var(--navy); color:#fff; font-size:var(--t-sm); font-weight:600;
  font-family:var(--display); letter-spacing:-.005em;
  text-decoration:none; cursor:pointer; white-space:nowrap;
  transition:background var(--dur-1) var(--ease), transform var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
.btn:hover{ background:var(--navy-2); }
.btn:active{ transform:scale(.97); }
.btn svg{ width:18px; height:18px; }
.btn-sm{ height:40px; padding:0 var(--s-4); }
.btn-ghost{ background:transparent; color:var(--navy); border:1px solid var(--line); }
.btn-ghost:hover{ background:var(--bg-2); border-color:var(--ink-3); }
.btn-block{ width:100%; }
.link{
  display:inline-flex; align-items:center; gap:var(--s-2); color:var(--navy);
  font-family:var(--display); font-weight:600; font-size:var(--t-sm); text-decoration:none;
}
.link svg{ width:16px; height:16px; transition:transform var(--dur-1) var(--ease); }
.link:hover svg{ transform:translateX(2px); }
/* seta que vai e volta: 2/3 do ciclo é pausa, para lembrar sem incomodar */
@keyframes setaVaiVolta{ 0%, 55%, 100%{ transform:none; } 76%{ transform:translateX(5px); } }
.link-balanco svg{ animation:setaVaiVolta 2.8s var(--ease) infinite; }
.link-balanco:hover svg{ animation:none; }
.back{ display:inline-flex; align-items:center; gap:var(--s-2); color:var(--ink-2); text-decoration:none; font-size:var(--t-sm); font-weight:500; }
.back svg{ width:16px; height:16px; transition:transform var(--dur-1) var(--ease); }
.back:hover{ color:var(--ink); }
.back:hover svg{ transform:translateX(-2px); }
.icon-btn{
  width:40px; height:40px; border-radius:50%; border:1px solid var(--line); background:#fff;
  display:grid; place-items:center; color:var(--ink); cursor:pointer; padding:0;
  transition:border-color var(--dur-1) var(--ease), background var(--dur-1) var(--ease);
}
.icon-btn:hover{ border-color:var(--ink-3); }
.icon-btn svg{ width:18px; height:18px; position:relative; z-index:1; }
.chip{
  display:inline-flex; align-items:center; height:40px; padding:0 var(--s-4); border-radius:var(--pill);
  border:1px solid var(--line); background:#fff; color:var(--ink); font-size:var(--t-sm); font-weight:500;
  text-decoration:none; white-space:nowrap; transition:border-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
}
.chip:hover{ border-color:var(--gold); color:var(--gold-ink); }
.chips{ display:flex; flex-wrap:wrap; gap:var(--s-2); margin:var(--s-2) 0 var(--s-4); }
.chips:empty{ display:none; }
.chip-i{ font-size:var(--t-label); font-weight:500; color:var(--gold-ink); background:var(--gold-veil); border:1px solid var(--gold-soft); border-radius:var(--pill); padding:var(--s-1) var(--s-3); }
.chip-i:empty{ display:none; }

/* ============================================================
   CAMPOS — uma regra só para todo campo de texto/seleção do site
   ============================================================ */
.form input, .form select, .form textarea, .fgroup select, .range input,
.fref, .carac-search, .sim-campo input[type="text"]{
  width:100%; font:inherit; font-size:16px;  /* 16 px: abaixo disso o iOS dá zoom ao focar */
  color:var(--ink); background:#fff; margin:0; min-height:48px;
  border:1px solid var(--line-ctl); border-radius:var(--r-sm); padding:var(--s-3) var(--s-4);
  transition:border-color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
.form input:focus, .form select:focus, .form textarea:focus, .fgroup select:focus, .range input:focus,
.fref:focus, .carac-search:focus, .sim-campo input[type="text"]:focus{
  outline:0; border-color:var(--navy); box-shadow:0 0 0 3px var(--navy-ring);
}
.form input::placeholder, .fref::placeholder, .carac-search::placeholder, .range input::placeholder{ color:var(--ink-3); }
.form textarea{ resize:vertical; min-height:112px; }
select, .fsort{
  -webkit-appearance:none; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23666b7d' stroke-width='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 var(--s-3) center; background-size:16px; padding-right:36px;
}

/* ---------- trilha de navegação ---------- */
.crumbs{
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--s-1) var(--s-2);
  font-size:var(--t-label); color:var(--ink-3); margin:0 0 var(--s-3); padding:0; list-style:none;
}
.crumbs li{ display:flex; align-items:center; gap:var(--s-1) var(--s-2); }
.crumbs li + li::before{ content:"›"; color:var(--line); }
.crumbs a{ color:var(--ink-2); text-decoration:none; padding:var(--s-2) 0; }
.crumbs a:hover{ color:var(--navy); text-decoration:underline; }
.crumbs [aria-current]{ color:var(--ink); font-weight:500; }

/* ============================================================
   NAVEGAÇÃO
   ============================================================ */
.nav{
  position:sticky; top:0; z-index:120; height:var(--nav-h);
  background:rgba(255,255,255,.86); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line-2);
  transition:box-shadow var(--dur-2) var(--ease);
}
.nav.rolou{ box-shadow:0 8px 24px rgba(20,23,42,.06); }
/* fio dourado da marca sob a navegação */
.nav::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px; pointer-events:none;
  background:linear-gradient(90deg, transparent, var(--gold-soft) 20%, var(--gold) 50%, var(--gold-soft) 80%, transparent);
  opacity:.8;
}
.nav-in{ height:100%; display:flex; align-items:center; justify-content:space-between; gap:var(--s-4); }
.brand{ display:flex; align-items:center; padding:var(--s-2) 0; }
.brand img{ height:32px; width:auto; }
.nav-links{ display:none; gap:var(--s-7); }
.nav-links a{ color:var(--ink-2); text-decoration:none; font-size:var(--t-sm); font-weight:500; padding:var(--s-5) 0; position:relative; transition:color var(--dur-1) var(--ease); }
.nav-links a:hover{ color:var(--ink); }
.nav-links a[aria-current="page"]{ color:var(--ink); }
.nav-links a[aria-current="page"]::after{
  content:""; position:absolute; left:0; right:0; bottom:14px; height:2px; border-radius:2px;
  background:linear-gradient(90deg, var(--gold), var(--gold-soft));
}
.nav-act{ display:flex; align-items:center; gap:var(--s-3); }
.nav-wa span{ display:none; }
.nav-wa{ width:40px; padding:0; }
.nav-fav{ position:relative; }
.nav-fav b{
  position:absolute; top:-2px; right:-2px; min-width:18px; height:18px; padding:0 5px; z-index:2;
  border-radius:9px; background:var(--gold-ink); color:#fff; font-size:11px; font-weight:700;   /* 5,0:1 */
  display:grid; place-items:center; font-family:var(--display);
}
/* no celular o coração só aparece depois que existe algo guardado:
   antes disso ele é um botão a mais competindo com o WhatsApp */
@media (max-width:899px){ body:not(.tem-fav) .nav-fav{ display:none; } }
.nav-burger{ border-color:transparent; background:transparent; }
.menu{
  position:fixed; top:var(--nav-h); left:0; right:0; z-index:119;
  background:#fff; border-bottom:1px solid var(--line); box-shadow:var(--shadow);
  animation:menuDown var(--dur-2) var(--ease-out);
}
@keyframes menuDown{ from{ opacity:0; transform:translateY(-8px); } to{ opacity:1; transform:none; } }
.menu-fundo{ position:fixed; inset:var(--nav-h) 0 0; z-index:118; background:rgba(20,23,42,.25); animation:fadeIn var(--dur-2) var(--ease); }
.menu nav{
  display:grid;
  padding:var(--s-2) max(var(--s-5), env(safe-area-inset-right)) calc(var(--s-5) + env(safe-area-inset-bottom)) max(var(--s-5), env(safe-area-inset-left));
  max-height:calc(100dvh - var(--nav-h)); overflow-y:auto;
}
.menu nav > a:not(.btn){ padding:var(--s-4) 0; border-bottom:1px solid var(--line-2); color:var(--ink); text-decoration:none; font-size:var(--t-lead); font-weight:500; }
.menu nav .btn{ margin-top:var(--s-4); }

/* ============================================================
   HERO
   ============================================================ */
.hero{ padding:var(--s-8) 0 0; text-align:center; }
/* ⚠️ a frase da abertura viaja até virar este h1: as duas TÊM de ter a mesma
   tipografia e a mesma largura, senão a troca no fim salta. Mexeu numa, mexa na outra. */
.hero h1, .intro-title{
  font-family:var(--display);
  font-size:var(--t-hero); font-weight:700; line-height:1.02; letter-spacing:-.04em;
  max-width:880px; margin:0 auto var(--s-5);
}
.hero h1 span, .intro-title span{ color:var(--navy); }
.hero-sub{ font-size:var(--t-lead); color:var(--ink-2); max-width:52ch; margin:0 auto var(--s-7); }
.search{
  display:flex; align-items:center; gap:var(--s-2); max-width:640px; margin:0 auto;
  background:#fff; border:1px solid var(--line); border-radius:var(--pill);
  padding:var(--s-2) var(--s-2) var(--s-2) var(--s-5); box-shadow:var(--shadow); text-align:left;
  transition:border-color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
.search:focus-within{ border-color:var(--navy); box-shadow:0 0 0 3px var(--navy-ring), var(--shadow); }
.search > svg{ width:20px; height:20px; color:var(--ink-3); }
.search input{ flex:1; min-width:0; border:0; outline:0; background:transparent; font:inherit; font-size:16px; color:var(--ink); height:44px; }
.search input::placeholder{ color:var(--ink-3); }
.search input::-webkit-search-cancel-button{ -webkit-appearance:none; }
.search .btn{ height:44px; width:44px; padding:0; }
.search .btn span{ display:none; }
.search .btn svg{ width:18px; height:18px; }
.search-sm{ box-shadow:none; margin:0 0 var(--s-3); }
.search-sm:focus-within{ box-shadow:0 0 0 3px var(--navy-ring); }
.hero-quick{ display:flex; flex-wrap:wrap; justify-content:center; gap:var(--s-2); margin-top:var(--s-5); }
/* a foto: moldura com a proporção, imagem um pouco maior por dentro para o
   parallax leve do desktop ter para onde deslizar (ver app.js) */
.hero-media{ margin-top:var(--s-8); }
.hero-media .foto{ position:relative; overflow:hidden; aspect-ratio:3/2; border-radius:var(--r); background:var(--bg-2); }
.hero-media img{
  position:absolute; left:0; top:-6%; width:100%; height:112%; object-fit:cover;
  transform:translate3d(0, var(--py, 0px), 0);
}

/* ============================================================
   ABERTURA
   ============================================================ */
.intro-veil{
  position:absolute; inset:0; background:rgba(250,246,239,.5);
  -webkit-backdrop-filter:blur(24px) saturate(1.06); backdrop-filter:blur(24px) saturate(1.06);
  opacity:0; transition:opacity var(--dur-2) var(--ease);
}
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  .intro-veil{ background:rgba(252,250,246,.95); }
}
.intro-stage{ position:absolute; inset:0; display:grid; place-items:center; }
.intro-logo{
  grid-area:1/1; justify-self:center; height:58px; width:auto;
  opacity:0; transform:translateY(10px) scale(.96);
  transition:opacity .42s var(--ease), transform .42s var(--ease);
}
.intro-wrap{ grid-area:1/1; justify-self:stretch; }
.intro-title{
  margin-bottom:0; text-align:center; opacity:0; transform:translateY(14px);
  transition:opacity .4s var(--ease), transform .4s var(--ease);
  will-change:transform, opacity;
}
#intro.s1 .intro-veil{ opacity:1; }
#intro.s1 .intro-logo{ opacity:1; transform:none; }
#intro.s2 .intro-logo{ opacity:0; transform:translateY(-12px) scale(.98); transition-duration:.26s; }
#intro.s2 .intro-title{ opacity:1; transform:none; transition-delay:.1s; }
#intro.s3 .intro-veil{ opacity:0; transition:opacity .56s var(--ease) .04s; }
#intro.s3 .intro-title{ transition:transform .66s cubic-bezier(.32,.72,0,1); }

/* ============================================================
   CARDS DE IMÓVEL
   ============================================================ */
.cards{ display:grid; gap:var(--s-4); grid-template-columns:1fr; }
.card{
  position:relative; display:flex; flex-direction:column; background:#fff;
  border:1px solid var(--line-2); border-radius:var(--r); overflow:hidden;
  transition:transform var(--dur-2) var(--ease), box-shadow var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease);
}
.card-media{ position:relative; aspect-ratio:3/2; background:var(--bg-2); overflow:hidden; }
.card-media img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease-out); }
.badge{
  position:absolute; top:var(--s-3); left:var(--s-3); height:26px; padding:0 var(--s-3); border-radius:var(--pill);
  background:rgba(255,255,255,.94); color:var(--ink); font-size:var(--t-xs); font-weight:600;
  display:inline-flex; align-items:center; font-family:var(--display); letter-spacing:.01em;
}
.badge-ex{ left:auto; right:calc(var(--s-3) + 44px); background:rgba(20,23,42,.72); color:#fff; font-weight:500; }
.card-body{ padding:var(--s-4); display:grid; gap:var(--s-1); }
.card-price{ margin:0; font-family:var(--display); font-size:var(--t-price); font-weight:700; letter-spacing:-.02em; }
.card-price small{ font-size:var(--t-label); font-weight:500; color:var(--ink-2); letter-spacing:0; }
.card-title{
  margin:0; font-size:var(--t-sm); line-height:1.35; color:var(--ink); font-weight:500;
  overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
}
.card-title a{ color:inherit; text-decoration:none; }
.card-title a::after{ content:""; position:absolute; inset:0; z-index:1; }
.card-loc{ margin:0; font-size:var(--t-label); color:var(--ink-2); }
.card-specs{
  display:flex; flex-wrap:wrap; gap:var(--s-3) var(--s-4); margin-top:var(--s-3); padding-top:var(--s-3);
  border-top:1px solid var(--line-2); font-size:var(--t-label); color:var(--ink-2);
}
.spec{ display:inline-flex; align-items:center; gap:var(--s-1); }
.spec svg{ width:15px; height:15px; color:var(--ink-3); }
.spec b{ color:var(--ink); font-weight:600; }
@media (hover:hover){
  .card:hover{ transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--line); }
  .card:hover .card-media img{ transform:scale(1.04); }
}

/* ---------- coração de favorito ----------
   Fica por cima de fotos de qualquer cor, então precisa de fundo próprio:
   vidro fosco + borda clara + sombra baixa. Ao guardar, o coração dá uma
   batida e um anel dourado se abre — o suficiente para a pessoa perceber
   que a ação valeu, sem virar espalhafato. */
.fav{
  position:absolute; top:var(--s-3); right:var(--s-3); z-index:2;
  width:40px; height:40px; border-radius:50%; padding:0; cursor:pointer;
  border:1px solid rgba(255,255,255,.75);
  background:rgba(255,255,255,.9);
  -webkit-backdrop-filter:blur(10px) saturate(1.3); backdrop-filter:blur(10px) saturate(1.3);
  color:var(--ink-2); display:grid; place-items:center;
  box-shadow:0 2px 10px rgba(20,23,42,.2);
  transition:color var(--dur-1) var(--ease), background var(--dur-1) var(--ease),
             transform var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
.fav svg{
  width:20px; height:20px; position:relative; z-index:1;
  stroke-width:1.9; transition:fill var(--dur-1) var(--ease), stroke var(--dur-1) var(--ease);
}
@media (hover:hover){
  .fav:hover{
    color:var(--gold-ink); background:#fff; transform:scale(1.08);
    box-shadow:0 4px 14px rgba(20,23,42,.22);
  }
}
.fav:active{ transform:scale(.92); }
/* guardado = círculo dourado cheio com coração branco: o estado se lê de longe */
.fav[aria-pressed="true"]{
  color:#fff; background:var(--gold); border-color:var(--gold);
  box-shadow:0 2px 12px rgba(168,129,74,.5);
}
.fav[aria-pressed="true"] svg{ fill:#fff; stroke:#fff; }
@media (hover:hover){
  .fav[aria-pressed="true"]:hover{ background:var(--gold-ink); border-color:var(--gold-ink); color:#fff; }
}
/* um coração sozinho não diz o que faz: no desktop, o nome aparece embaixo
   (não à esquerda: lá mora o selo "Exemplo") */
.fav-dica{
  position:absolute; right:0; top:calc(100% + 6px);
  transform:translateY(-4px);
  background:rgba(20,23,42,.88); color:#fff;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  font-family:var(--display); font-size:var(--t-xs); font-weight:600;
  padding:5px 10px; border-radius:var(--pill); white-space:nowrap;
  opacity:0; pointer-events:none; z-index:1;
  transition:opacity var(--dur-1) var(--ease), transform var(--dur-1) var(--ease);
}
@media (hover:hover){
  .fav:hover .fav-dica, .fav:focus-visible .fav-dica{ opacity:1; transform:translateY(0); }
}
@media (max-width:639px){ .fav-dica{ display:none; } }
/* anel que se abre ao guardar (o ::before já é a área de toque de 44 px) */
.fav::after{
  content:""; position:absolute; inset:-1px; border-radius:50%;
  border:2px solid var(--gold); opacity:0; pointer-events:none;
}
.fav.pop::after{ animation:favAnel .55s var(--ease); }
.fav.pop svg{ animation:favBatida .45s cubic-bezier(.34,1.56,.64,1); }
@keyframes favAnel{
  from{ opacity:.6; transform:scale(1); }
  to{ opacity:0; transform:scale(1.85); }
}
@keyframes favBatida{
  0%{ transform:scale(1); } 28%{ transform:scale(.76); }
  58%{ transform:scale(1.3); } 100%{ transform:scale(1); }
}

/* destaques: trilho deslizante no celular, grade no desktop.
   ⚠️ `contain:paint` — sem ele os cards do trilho entram na largura do DOCUMENTO
   e o celular passa a caber a página inteira na tela. */
.cards-scroll{
  display:flex; overflow-x:auto; contain:paint;
  scroll-snap-type:x mandatory; scroll-padding-inline:var(--s-5);
  gap:var(--s-3); margin:0 calc(-1 * var(--s-5)); padding:0 var(--s-5) var(--s-2); scrollbar-width:none;
}
.cards-scroll::-webkit-scrollbar{ display:none; }
.cards-scroll .card{ flex:0 0 82%; scroll-snap-align:start; }

/* ============================================================
   SERVIÇOS — lista no celular, cards no desktop
   ============================================================ */
.sv-grid{ display:grid; border-top:1px solid var(--line-2); }
.sv{
  display:flex; align-items:center; gap:var(--s-4); color:inherit; text-decoration:none;
  padding:var(--s-4) 0; border-bottom:1px solid var(--line-2);
  transition:transform var(--dur-2) var(--ease), box-shadow var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease);
}
.sv-ico{ flex:none; width:44px; height:44px; border-radius:50%; background:var(--gold-veil); border:1px solid var(--gold-soft); color:var(--gold-ink); display:grid; place-items:center; }
.sv-ico svg{ width:20px; height:20px; }
.sv-txt{ flex:1; min-width:0; display:grid; gap:var(--s-1); }
.sv h3{ font-size:var(--t-h4); }
.sv p{ margin:0; font-size:var(--t-sm); color:var(--ink-2); }
.sv .link{ display:none; margin-top:var(--s-1); }
.sv-go{ width:18px; height:18px; color:var(--ink-3); transition:transform var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.sv:hover .sv-go{ transform:translateX(3px); color:var(--navy); }

/* ============================================================
   SOBRE (bloco da home e página)
   ============================================================ */
.sobre-grid{ display:grid; gap:var(--s-6); }
.sobre-photo{
  position:relative; width:180px; margin-inline:auto; aspect-ratio:3/4; border-radius:var(--r); overflow:hidden; background:var(--bg-2);
  border:1px solid var(--gold); /* a foto tem fundo branco: sem o fio ela some na página */
  display:grid; place-items:center; color:var(--ink-3); font-size:2rem; font-weight:700; font-family:var(--display);
}
/* a foto cobre as iniciais; se ela falhar, some do DOM e as iniciais aparecem */
.sobre-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.sobre-grid h2{ font-size:var(--t-h2); }
.values{ list-style:none; padding:0; margin:0 0 var(--s-5); display:grid; gap:var(--s-3); }
.values li{ display:flex; align-items:flex-start; gap:var(--s-3); }
.values svg{ width:20px; height:20px; color:var(--gold); margin-top:2px; }

/* ============================================================
   ÁREA DE ATUAÇÃO
   ============================================================ */
.regiao-grid{ display:grid; gap:var(--s-6); }
.regiao-list{ list-style:none; padding:0; margin:0; }
.regiao-list a{ display:flex; justify-content:space-between; align-items:center; gap:var(--s-4); padding:var(--s-4) 0; border-bottom:1px solid var(--line); color:inherit; text-decoration:none; }
.regiao-list a:hover b{ color:var(--navy); }
.regiao-list b{ font-family:var(--display); font-weight:600; }
.regiao-list span{ color:var(--ink-2); font-size:var(--t-sm); }
.map{ aspect-ratio:3/2; border-radius:var(--r); overflow:hidden; background:var(--line-2); }
.map iframe{ width:100%; height:100%; border:0; display:block; }

/* ============================================================
   FAQ
   ============================================================ */
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{
  list-style:none; cursor:pointer; padding:var(--s-5) 0; font-weight:600; font-size:var(--t-body);
  font-family:var(--display); letter-spacing:-.01em;
  display:flex; justify-content:space-between; align-items:center; gap:var(--s-4);
  transition:color var(--dur-1) var(--ease);
}
.faq summary:hover{ color:var(--navy); }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary svg{ width:18px; height:18px; color:var(--ink-3); transition:transform var(--dur-2) var(--ease); }
.faq details[open] summary svg{ transform:rotate(180deg); }
.faq p{ margin:0 0 var(--s-5); color:var(--ink-2); }
.faq details[open] p{ animation:viewIn var(--dur-2) var(--ease-out); }

/* ============================================================
   CONTATO E FORMULÁRIOS
   ============================================================ */
.contato-grid{ display:grid; gap:var(--s-7); }
.contato-grid h2{ font-size:var(--t-h2); }
.contato-grid > div > p{ color:var(--ink-2); margin-top:var(--s-2); }
.c-actions{ display:grid; gap:var(--s-3); margin-top:var(--s-5); }
.c-action{
  display:flex; align-items:center; gap:var(--s-4); padding:var(--s-4); background:#fff;
  border:1px solid var(--line); border-radius:var(--r-sm); color:inherit; text-decoration:none;
  min-height:56px; transition:border-color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
.c-action:hover{ border-color:var(--ink-3); box-shadow:var(--shadow-sm); }
.c-action svg{ width:22px; height:22px; color:var(--navy); }
.c-action b{ display:block; font-family:var(--display); }
.c-action small{ color:var(--ink-2); font-size:var(--t-label); word-break:break-all; }
.form{ display:grid; gap:var(--s-4); }
.form label{ display:grid; gap:var(--s-2); font-size:var(--t-label); font-weight:600; color:var(--ink-2); }
.form-row{ display:grid; gap:var(--s-4); }
.form-note{ font-size:var(--t-label); color:var(--ink-3); margin:0; max-width:var(--medida); }

/* ============================================================
   RODAPÉ
   ============================================================ */
footer{
  position:relative; background:var(--bg-2); border-top:1px solid var(--line);
  padding:var(--s-9) 0 calc(var(--s-7) + env(safe-area-inset-bottom)); font-size:var(--t-sm); color:var(--ink-2);
}
footer::before{
  content:""; position:absolute; left:0; right:0; top:-1px; height:2px;
  background:linear-gradient(90deg, transparent, var(--gold-soft) 18%, var(--gold) 50%, var(--gold-soft) 82%, transparent);
  opacity:.9;
}
.foot-col a, .foot-col span{ overflow-wrap:anywhere; }
/* no celular: uma coluna, mas os links de navegação em duas fileiras
   (o e-mail não cabe em meia coluna sem quebrar no meio da palavra) */
.foot-grid{ display:grid; gap:var(--s-7); }
.foot-nav{ display:grid; grid-template-columns:1fr 1fr; column-gap:var(--s-5); }
.foot-nav h2{ grid-column:1 / -1; }
.foot-brand img{ height:30px; width:auto; margin-bottom:var(--s-3); }
.foot-brand p{ max-width:36ch; }
.foot-social{ display:inline-grid; place-items:center; width:44px; height:44px; border:1px solid var(--line); border-radius:50%; color:var(--ink); }
.foot-social svg{ width:18px; height:18px; }
.foot-col h2{ font-size:var(--t-xs); font-weight:700; line-height:1.25; color:var(--ink); margin-bottom:var(--s-3); text-transform:uppercase; letter-spacing:.1em; font-family:var(--display); }
.foot-col a, .foot-col span{ display:block; color:var(--ink-2); text-decoration:none; padding:var(--s-2) 0; }
.foot-col a:hover{ color:var(--ink); }
.foot-base{ margin-top:var(--s-7); padding-top:var(--s-4); border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:var(--s-2) var(--s-5); font-size:var(--t-xs); color:var(--ink-3); }

/* ============================================================
   CATÁLOGO
   ============================================================ */
.cat{ padding-block:var(--s-5) var(--s-11); }
.cat-head{ margin-bottom:var(--s-4); }
.cat-head h1{ font-size:var(--t-h1); }

/* Barra de filtros — grade no celular (nada sai da tela em 320 px):
   linha 1 = finalidade; linha 2 = tipos + Filtros. No desktop vira uma linha só. */
.fbar{ display:grid; gap:var(--s-2); }
.seg{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); background:var(--bg-2); border-radius:var(--pill); padding:3px; }
.seg button{
  height:38px; padding:0 var(--s-1); border:0; border-radius:var(--pill); background:transparent;
  font-size:var(--t-sm); font-weight:500; color:var(--ink-2); cursor:pointer; white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis;
  transition:background var(--dur-1) var(--ease), color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
.seg button.on{ background:#fff; color:var(--ink); font-weight:600; box-shadow:0 1px 3px rgba(0,0,0,.12); }
.frow{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--s-2); }
.tchips{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s-2); }
.tchips button, .fbtn, .plus button, .carac-chip{
  height:44px; padding:0 var(--s-3); border:1px solid var(--line); border-radius:var(--pill); background:#fff;
  font-size:var(--t-sm); font-weight:500; color:var(--ink); cursor:pointer; white-space:nowrap;
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s-2);
  overflow:hidden; text-overflow:ellipsis;
  transition:background var(--dur-1) var(--ease), color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease);
}
.tchips button:hover, .fbtn:hover, .plus button:hover, .carac-chip:hover{ border-color:var(--ink-3); }
.tchips button.on, .plus button.on, .carac-chip.on{ background:var(--navy); border-color:var(--navy); color:#fff; }
.fbtn svg{ width:16px; height:16px; }
.fbadge{ min-width:20px; height:20px; padding:0 6px; border-radius:10px; background:var(--navy); color:#fff; font-size:var(--t-xs); font-weight:700; display:inline-grid; place-items:center; font-family:var(--display); }
.fbtn.on .fbadge{ background:#fff; color:var(--navy); }
/* Telas comuns de celular (360–399 px): "Terreno" + "Filtros" só cabem na
   mesma linha sem o ícone e com os chips mais justos. Abaixo de 340 px
   sobra só o ícone e a contagem. */
@media (max-width:399px){
  .fbtn svg{ display:none; }
  .tchips button{ padding:0 var(--s-2); }
}
@media (max-width:339px){
  .fbtn svg{ display:block; }
  .fbtn > span{ display:none; }
}

/* linha de resultado: contagem à esquerda, ordenação e Lista/Mapa à direita */
.cat-linha{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--s-2) var(--s-3);
  margin-top:var(--s-4); padding-top:var(--s-3); border-top:1px solid var(--line-2);
}
#catCount{ margin:0; color:var(--ink-2); font-size:var(--t-sm); white-space:nowrap; }
.cat-ferr{ display:flex; align-items:center; gap:var(--s-2); flex:none; margin-left:auto; }
.fsort{
  height:36px; border:0; border-radius:var(--pill); background-color:transparent;
  padding:0 28px 0 var(--s-2); font-size:16px; font-weight:600; color:var(--ink); cursor:pointer;
  background-position:right var(--s-2) center;
}
.fsort:hover{ background-color:var(--bg-2); }
.fsort:focus{ outline:0; box-shadow:0 0 0 3px var(--navy-ring); }
.catview{ display:inline-flex; background:var(--bg-2); border-radius:var(--pill); padding:3px; }
.catview button{
  height:30px; width:36px; padding:0; border:0; border-radius:var(--pill); background:transparent; cursor:pointer;
  font-size:var(--t-label); font-weight:500; color:var(--ink-2); display:inline-flex; align-items:center; justify-content:center; gap:var(--s-2);
  transition:background var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
}
.catview button svg{ width:16px; height:16px; }
.catview button span{ display:none; }
.catview button.on{ background:#fff; color:var(--ink); font-weight:600; box-shadow:0 1px 3px rgba(0,0,0,.12); }
.fchips{ display:flex; flex-wrap:wrap; gap:var(--s-2); margin:var(--s-3) 0 0; }
.fchips:empty{ display:none; }
.fchips button{
  height:34px; padding:0 var(--s-3); border:0; border-radius:var(--pill); background:var(--bg-2);
  font-size:var(--t-label); color:var(--ink); display:inline-flex; align-items:center; gap:var(--s-2); cursor:pointer;
  transition:background var(--dur-1) var(--ease);
}
.fchips button:hover{ background:var(--line-2); }
.fchips button svg{ width:12px; height:12px; color:var(--ink-3); }
.fchips .fchips-clear{ background:transparent; color:var(--navy); font-weight:600; }
.cat .cards{ margin-top:var(--s-5); }
.more{ text-align:center; padding:var(--s-6) 0 0; }

/* fim da lista — a saída de quem rolou tudo e não achou */
.fimlista{ margin-top:var(--s-9); text-align:center; }
.fimlista-marca{
  display:flex; align-items:center; gap:var(--s-4); margin:0 0 var(--s-6);
  font-family:var(--display); font-size:var(--t-xs); font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:var(--gold-ink);
}
.fimlista-marca span{ flex:1; height:1px; background:linear-gradient(90deg, transparent, var(--gold-soft)); }
.fimlista-marca span:last-child{ background:linear-gradient(90deg, var(--gold-soft), transparent); }
.fimlista b{ display:block; font-family:var(--display); font-size:var(--t-h3); letter-spacing:-.02em; }
.fimlista > p{ color:var(--ink-2); max-width:46ch; margin:var(--s-3) auto var(--s-6); font-size:var(--t-sm); }
.fimlista .btns{ justify-content:center; }
.empty{ text-align:center; padding:var(--s-9) var(--s-4); margin-top:var(--s-5); border:1px dashed var(--line); border-radius:var(--r); }
.empty > svg{ width:28px; height:28px; color:var(--ink-3); margin:0 auto var(--s-3); }
.empty b{ display:block; font-size:var(--t-h4); margin-bottom:var(--s-1); font-family:var(--display); }
.empty p{ color:var(--ink-2); max-width:44ch; margin:0 auto var(--s-5); }
.empty .btns{ justify-content:center; }

/* mapa da busca */
.catmap{ margin-top:var(--s-5); display:grid; gap:var(--s-4); }
.catmap .map{ aspect-ratio:1/1; }
.catmap-nota{ font-size:var(--t-label); color:var(--ink-3); margin:0; }
.catmap-list{ list-style:none; margin:0; padding:0; display:grid; gap:var(--s-1); align-content:start; }
.catmap-list button{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:var(--s-3);
  padding:var(--s-3) var(--s-3); border:0; border-bottom:1px solid var(--line-2); background:transparent;
  text-align:left; cursor:pointer; color:inherit; font-size:var(--t-sm); min-height:48px;
  transition:background var(--dur-1) var(--ease);
}
.catmap-list button:hover{ background:var(--bg-2); }
.catmap-list button.on{ background:var(--navy-veil); }
.catmap-list b{ font-family:var(--display); font-weight:600; }
.catmap-list span{ color:var(--ink-2); font-size:var(--t-label); white-space:nowrap; }

/* folha de filtros (sobe do rodapé no celular, caixa no desktop) */
.sheet{ position:fixed; inset:0; z-index:200; background:rgba(20,23,42,.4); display:flex; align-items:flex-end; justify-content:center; animation:fadeIn var(--dur-2) var(--ease); }
.sheet-card{
  background:#fff; width:100%; max-height:88vh; max-height:88dvh; border-radius:var(--r-lg) var(--r-lg) 0 0;
  display:flex; flex-direction:column; animation:sheetUp var(--dur-2) var(--ease-out);
}
@keyframes sheetUp{ from{ transform:translateY(24px); opacity:0; } to{ transform:none; opacity:1; } }
.sheet-head{ display:flex; align-items:center; justify-content:space-between; padding:var(--s-4) var(--s-5); border-bottom:1px solid var(--line-2); }
.sheet-head h2{ font-size:var(--t-h4); }
.sheet-body{ overflow:auto; padding:var(--s-2) var(--s-5) var(--s-5); display:grid; gap:var(--s-5); -webkit-overflow-scrolling:touch; }
.sheet-foot{
  display:flex; gap:var(--s-3);
  padding:var(--s-3) max(var(--s-5), env(safe-area-inset-right)) calc(var(--s-3) + env(safe-area-inset-bottom)) max(var(--s-5), env(safe-area-inset-left));
  border-top:1px solid var(--line-2);
}
.sheet-foot .btn{ flex:1; }
.fgroup{ display:grid; gap:var(--s-2); }
.fgroup > label, .fgroup > p{ font-size:var(--t-label); font-weight:600; color:var(--ink-2); margin:0; }
.plus{ display:grid; grid-template-columns:repeat(5,1fr); gap:var(--s-2); }
.plus button{ padding:0; }
.range{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s-2); }
.fdica{ font-size:var(--t-xs); color:var(--ink-3); margin:0; }
.fdica b{ color:var(--ink-2); font-weight:600; }
.carac-list{ display:flex; flex-wrap:wrap; gap:var(--s-2); max-height:200px; overflow:auto; }
.carac-chip{ height:40px; padding:0 var(--s-3); font-size:var(--t-label); }
.carac-vazio{ font-size:var(--t-label); color:var(--ink-3); margin:0; }

/* ============================================================
   PÁGINA DO IMÓVEL
   ============================================================ */
.im{ padding-block:var(--s-4) var(--s-12); }
.im-top{ display:flex; align-items:center; justify-content:space-between; gap:var(--s-3); margin-bottom:var(--s-3); }
.im-share{ display:flex; align-items:center; gap:var(--s-2); font-size:var(--t-label); color:var(--ink-2); position:relative; }
.im-share > span{ display:none; }
.share-btn{
  width:40px; height:40px; border-radius:50%; border:1px solid var(--line); background:#fff; color:var(--ink);
  display:grid; place-items:center; cursor:pointer; padding:0;
  transition:border-color var(--dur-1) var(--ease), background var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
}
.share-btn:hover{ border-color:var(--ink-3); }
.share-btn svg{ width:16px; height:16px; position:relative; z-index:1; }
.share-btn.ok{ background:var(--navy); border-color:var(--navy); color:#fff; }
.share-ok{ position:absolute; right:0; top:calc(100% + 6px); background:var(--ink); color:#fff; font-size:var(--t-xs); padding:var(--s-1) var(--s-3); border-radius:var(--r-xs); white-space:nowrap; z-index:3; animation:viewIn var(--dur-1) var(--ease-out); }
.im-grid{ display:grid; gap:var(--s-5); grid-template-areas:"gal" "head" "cta" "body"; }
.im-gal{ grid-area:gal; }
.im-head{ grid-area:head; }
.im-aside{ grid-area:cta; }
.im-body{ grid-area:body; }
.gal{ position:relative; border-radius:var(--r); overflow:hidden; background:var(--bg-2); }
.gal-track{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; aspect-ratio:3/2; }
.gal-track::-webkit-scrollbar{ display:none; }
.gal-item{ flex:0 0 100%; scroll-snap-align:start; cursor:zoom-in; }
.gal-item img{ width:100%; height:100%; object-fit:cover; }
.gal-count{ position:absolute; right:var(--s-3); bottom:var(--s-3); background:rgba(20,23,42,.6); color:#fff; font-size:var(--t-xs); padding:var(--s-1) var(--s-3); border-radius:var(--pill); font-variant-numeric:tabular-nums; }
/* setas: só no desktop, e só quando o mouse está sobre a foto */
.gal-nav{
  position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%;
  border:0; background:rgba(255,255,255,.92); color:var(--ink); display:none; place-items:center; cursor:pointer; padding:0;
  box-shadow:var(--shadow-sm); opacity:0;
  transition:opacity var(--dur-2) var(--ease), background var(--dur-1) var(--ease);
}
.gal:hover .gal-nav, .gal:focus-within .gal-nav{ opacity:1; }
.gal-nav:hover{ background:#fff; }
.gal-nav svg{ width:18px; height:18px; }
.gal-prev{ left:var(--s-3); } .gal-next{ right:var(--s-3); }
.gal-thumbs{ display:none; }
.im-head .badge{ position:static; margin-right:var(--s-2); background:var(--bg-2); }
.im-head .badge-ex{ background:rgba(20,23,42,.72); }
.im-head h1{ font-size:var(--t-h1); margin:var(--s-3) 0 var(--s-2); }
.im-loc{ display:flex; align-items:center; gap:var(--s-2); color:var(--ink-2); font-size:var(--t-sm); margin:0; }
.im-loc svg{ width:16px; height:16px; color:var(--ink-3); }
.im-cta{ border:1px solid var(--line); border-radius:var(--r); padding:var(--s-6); background:#fff; box-shadow:var(--shadow-sm); }
.im-price small{ font-size:var(--t-label); color:var(--ink-2); }
.im-price b{ display:block; font-family:var(--display); font-size:2rem; letter-spacing:-.03em; line-height:1.05; }
.im-price b em{ font-style:normal; font-size:var(--t-sm); font-weight:500; color:var(--ink-2); letter-spacing:0; }
.im-taxas{ display:flex; gap:var(--s-6); margin:var(--s-4) 0; padding:var(--s-3) 0; border-top:1px solid var(--line-2); border-bottom:1px solid var(--line-2); font-size:var(--t-sm); }
.im-taxas span{ display:grid; gap:2px; }
.im-taxas small{ color:var(--ink-2); font-size:var(--t-xs); }
.im-taxas b{ font-family:var(--display); }
.im-taxas em{ font-style:normal; font-weight:400; color:var(--ink-3); font-size:var(--t-xs); }
.im-cta .btn{ width:100%; margin-top:var(--s-2); }
/* ações secundárias em texto: guardar e simular, lado a lado */
.im-links{ display:flex; align-items:center; justify-content:center; gap:var(--s-3); margin-top:var(--s-3); flex-wrap:wrap; }
.im-links .sep{ width:1px; height:14px; background:var(--line); }
.im-fav{
  position:relative; height:44px; padding:0 var(--s-2); border:0; background:transparent;
  color:var(--ink-2); cursor:pointer; display:inline-flex; align-items:center; gap:var(--s-2);
  font-family:var(--display); font-size:var(--t-sm); font-weight:600; border-radius:var(--pill);
  transition:color var(--dur-1) var(--ease);
}
.im-fav svg{ width:18px; height:18px; stroke-width:1.9; transition:fill var(--dur-1) var(--ease), stroke var(--dur-1) var(--ease); }
.im-fav:hover{ color:var(--gold-ink); }
.im-fav[aria-pressed="true"]{ color:var(--gold-ink); }
.im-fav[aria-pressed="true"] svg{ fill:var(--gold); stroke:var(--gold); }
.im-fav.pop svg{ animation:favBatida .45s cubic-bezier(.34,1.56,.64,1); }
.im-links .link{ height:44px; padding:0 var(--s-2); }
.im-specs{ display:grid; grid-template-columns:repeat(2, 1fr); gap:var(--s-2); }
.im-spec{ border:1px solid var(--line-2); border-radius:var(--r-sm); padding:var(--s-3); display:grid; gap:2px; }
.im-spec svg{ width:18px; height:18px; color:var(--ink-3); margin-bottom:var(--s-1); }
.im-spec b{ font-size:var(--t-h4); font-family:var(--display); }
.im-spec span{ font-size:var(--t-xs); color:var(--ink-2); }
.im-body h2{ font-size:var(--t-h3); margin:var(--s-8) 0 var(--s-3); }
.im-condo{ margin:var(--s-4) 0 0; color:var(--ink-2); font-size:var(--t-sm); }
.im-body p{ color:var(--ink-2); }
.im-carac ul{ list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:var(--s-2); }
.im-carac li{ background:var(--bg-2); border-radius:var(--pill); padding:var(--s-2) var(--s-3); font-size:var(--t-label); }
/* ficha técnica */
.im-ficha{ margin:0; display:grid; gap:0; }
.im-ficha div{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--s-4); padding:var(--s-3) 0; border-bottom:1px solid var(--line-2); }
.im-ficha dt{ font-size:var(--t-label); color:var(--ink-2); }
.im-ficha dd{ margin:0; font-size:var(--t-sm); font-weight:500; text-align:right; }
.im-map .map{ margin-top:var(--s-2); }
.im-map small{ display:block; color:var(--ink-3); font-size:var(--t-xs); margin-top:var(--s-2); }
.im-sim{ margin-top:var(--s-10); }
.im-sim-head{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--s-4); margin-bottom:var(--s-4); }
.im-sim-head h2{ font-size:var(--t-h3); min-width:0; }
.im-sim-head .link{ white-space:nowrap; flex:none; }
.im-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:95;
  background:rgba(255,255,255,.94); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border-top:1px solid var(--line);
  padding:var(--s-3) max(var(--s-4), env(safe-area-inset-right)) calc(var(--s-3) + env(safe-area-inset-bottom)) max(var(--s-4), env(safe-area-inset-left));
  display:flex; align-items:center; justify-content:space-between; gap:var(--s-3);
}
.im-bar b{ font-size:var(--t-h4); font-family:var(--display); letter-spacing:-.02em; }
.im-bar b small{ font-size:var(--t-xs); font-weight:500; color:var(--ink-2); }
.im-bar small{ display:block; font-size:var(--t-xs); color:var(--ink-2); }
.im-bar .btn{ flex:none; }
/* a barra fixa cobre o fim da página: o conteúdo ganha esse respiro a mais */
body[data-view="imovel"] footer{ padding-bottom:calc(var(--s-7) + 76px + env(safe-area-inset-bottom)); }

/* ---------- simulador de financiamento ---------- */
.sim{
  margin-top:var(--s-6); border:1px solid var(--gold-soft); border-radius:var(--r);
  background:var(--gold-veil); padding:var(--s-6);
}
.sim h2{ font-size:var(--t-h3); margin:0 0 var(--s-1); }
.sim > p{ font-size:var(--t-sm); color:var(--ink-2); margin:0 0 var(--s-5); max-width:52ch; }
.sim-campos{ display:grid; gap:var(--s-4); }
.sim-campo{ display:grid; gap:var(--s-2); }
.sim-campo label{ font-size:var(--t-label); font-weight:600; color:var(--ink-2); display:flex; justify-content:space-between; gap:var(--s-3); }
.sim-campo label b{ color:var(--ink); font-family:var(--display); font-variant-numeric:tabular-nums; }
.sim-campo input[type="range"]{ width:100%; margin:0; height:44px; accent-color:var(--navy); background:transparent; }
.sim-saida{
  margin-top:var(--s-5); padding:var(--s-5); background:#fff; border:1px solid var(--gold-soft); border-radius:var(--r-sm);
  display:grid; gap:var(--s-3);
}
.sim-parcela{ display:grid; gap:2px; }
.sim-parcela small{ font-size:var(--t-label); color:var(--ink-2); }
.sim-parcela b{ font-family:var(--display); font-size:1.75rem; letter-spacing:-.03em; line-height:1.05; font-variant-numeric:tabular-nums; }
.sim-linhas{ display:grid; gap:var(--s-1); margin:0; }
.sim-linhas div{ display:flex; justify-content:space-between; gap:var(--s-4); font-size:var(--t-label); padding:var(--s-1) 0; }
.sim-linhas dt{ color:var(--ink-2); }
.sim-linhas dd{ margin:0; font-weight:500; font-variant-numeric:tabular-nums; }
.sim-alerta{ font-size:var(--t-label); color:var(--erro); margin:0; }
.sim-nota{ font-size:var(--t-xs); color:var(--ink-3); margin:var(--s-4) 0 0; }
/* A saída para o simulador oficial: uma porta para FORA do site, e para um banco. */
.sim-oficial{
  display:flex; align-items:center; gap:var(--s-4); margin-top:var(--s-4); padding:var(--s-4);
  background:#fff; border:1px solid var(--line); border-radius:var(--r-sm); color:inherit; text-decoration:none;
  min-height:72px; transition:border-color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
.sim-oficial:hover{ border-color:var(--banco); box-shadow:var(--shadow-sm); }
.sim-banco{
  flex:none; width:46px; height:46px; border-radius:var(--r-sm);
  background:var(--banco); color:#fff; display:grid; place-items:center;
}
.sim-banco svg{ width:24px; height:24px; }
.sim-txt{ flex:1; min-width:0; display:grid; gap:3px; }
.sim-txt > b{ font-family:var(--display); font-size:var(--t-sm); letter-spacing:-.01em; }
.sim-txt small{ color:var(--ink-2); font-size:var(--t-xs); line-height:1.45; }
.sim-txt small b{ color:var(--banco); font-weight:600; }
.sim-oficial .sim-go{ flex:none; width:18px; height:18px; color:var(--ink-3); }

/* ============================================================
   PÁGINA DE SERVIÇO
   ============================================================ */
.sp{ padding-block:var(--s-5) var(--s-11); }
.sp-head{ max-width:720px; }
.sp-head h1{ font-size:var(--t-h1); margin-bottom:var(--s-3); }
.sp-grid{ display:grid; gap:var(--s-7); margin-top:var(--s-6); }
.sp-texto > p{ color:var(--ink-2); }
.sp-texto h2{ font-size:var(--t-h3); margin:var(--s-6) 0 var(--s-3); }
.sp-etapas{ list-style:none; padding:0; margin:0; display:grid; gap:var(--s-3); counter-reset:etapa; }
.sp-etapas li{ display:flex; align-items:flex-start; gap:var(--s-3); counter-increment:etapa; }
.sp-etapas li::before{
  content:counter(etapa, decimal-leading-zero); flex:none; width:36px; height:36px; border-radius:50%;
  background:#fff; border:1px solid var(--gold-soft); color:var(--gold-ink);
  font-family:var(--display); font-size:var(--t-xs); font-weight:700; display:grid; place-items:center;
}
.sp-boxes{ display:grid; gap:var(--s-3); align-content:start; }
.sp-boxes > p{ font-size:var(--t-label); font-weight:600; color:var(--ink-2); margin:0; }
.sp-box{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s-3); width:100%; text-align:left;
  padding:var(--s-4); border:1px solid var(--line); border-radius:var(--r); background:#fff; cursor:pointer; min-height:64px;
  transition:border-color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
.sp-box b{ display:block; font-family:var(--display); }
.sp-box span{ color:var(--ink-2); font-size:var(--t-sm); }
.sp-box svg{ width:18px; height:18px; color:var(--navy); transition:transform var(--dur-1) var(--ease); }
.sp-box:hover{ border-color:var(--navy); box-shadow:var(--shadow-sm); }
.sp-box:hover svg{ transform:translateX(3px); }

/* ============================================================
   VENDER
   ============================================================ */
.vender{ padding-block:var(--s-5) var(--s-11); max-width:680px; }
.vender h1{ font-size:var(--t-h1); margin-bottom:var(--s-3); }
.etapas{ list-style:none; padding:0; margin:var(--s-6) 0 var(--s-7); display:grid; gap:0; counter-reset:etapa; }
/* no celular, nome em cima e explicação embaixo; no desktop, na mesma linha */
.etapas li{ display:grid; grid-template-columns:28px 1fr; column-gap:var(--s-2); align-items:baseline; counter-increment:etapa; padding:var(--s-3) 0; border-bottom:1px solid var(--line-2); }
.etapas li::before{ content:counter(etapa, decimal-leading-zero); grid-row:1 / span 2; color:var(--gold-ink); font-family:var(--display); font-size:var(--t-xs); font-weight:700; }
.etapas b{ grid-column:2; font-family:var(--display); }
.etapas span{ grid-column:2; color:var(--ink-2); font-size:var(--t-sm); }

/* ============================================================
   SOBRE MIM (página)
   ============================================================ */
.sb{ padding-block:var(--s-5) var(--s-11); }
.sb-head h1{ font-size:var(--t-h1); }
.sb-grid{ display:grid; gap:var(--s-6); margin-top:var(--s-2); }
.cred{ margin-top:var(--s-10); padding-top:var(--s-9); border-top:1px solid var(--line); }
.cred-head{ max-width:640px; margin-bottom:var(--s-6); }
.cred-head h2{ font-size:var(--t-h2); }
.cred-head p{ color:var(--ink-2); margin-top:var(--s-2); }
.cred-grid{ display:grid; gap:var(--s-6); }
.cred-docs{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s-3); align-content:start; }
.cred-doc{
  border:1px solid var(--line); border-radius:var(--r-sm); overflow:hidden; background:#fff; padding:0; cursor:zoom-in; text-align:left; color:inherit;
  transition:border-color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
.cred-doc:hover{ border-color:var(--ink-3); box-shadow:var(--shadow-sm); }
.cred-doc img{ width:100%; aspect-ratio:1/1.3; object-fit:contain; background:var(--bg-2); }
.cred-doc-cap{ display:block; padding:var(--s-3); font-size:var(--t-label); }
.cred-doc-cap small{ display:block; color:var(--ink-2); }
.cred-list{ margin:0; display:grid; gap:var(--s-3); }
.cred-list div{ display:grid; gap:2px; padding-bottom:var(--s-3); border-bottom:1px solid var(--line-2); }
.cred-list dt{ font-size:var(--t-xs); color:var(--ink-3); }
.cred-list dd{ margin:0; font-weight:500; }
.cred-verify{
  display:flex; align-items:center; gap:var(--s-3); padding:var(--s-4); border:1px solid var(--line); border-radius:var(--r-sm); color:inherit; text-decoration:none; margin-top:var(--s-4); min-height:64px;
  transition:border-color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
.cred-verify:hover{ border-color:var(--navy); box-shadow:var(--shadow-sm); }
.cred-verify svg{ width:20px; height:20px; color:var(--navy); }
.cred-verify b{ display:block; font-family:var(--display); }
.cred-verify small{ color:var(--ink-2); }
.cred-verify .cred-verify-go{ margin-left:auto; color:var(--ink-3); }
.cred-nota{ font-size:var(--t-xs); color:var(--ink-3); margin:var(--s-3) 0 0; }
.sb-quote{
  margin:var(--s-10) 0 0; font-family:var(--display); font-size:var(--t-h2);
  font-weight:600; letter-spacing:-.03em; color:var(--ink-2); max-width:20ch; line-height:1.15;
}
.sb-quote strong{ color:var(--gold-ink); font-weight:600; }
.sb-fim{ margin-top:var(--s-7); padding:var(--s-7) var(--s-5); background:var(--bg-2); border-top:2px solid var(--gold); border-radius:var(--r); text-align:center; }
.sb-fim p{ margin:0 0 var(--s-1); color:var(--ink-2); }
.sb-fim p b{ color:var(--ink); font-size:var(--t-h4); font-family:var(--display); }
.sb-fim .btns{ justify-content:center; margin-top:var(--s-4); }

/* ============================================================
   FAVORITOS · PRIVACIDADE · 404
   ============================================================ */
.fv{ padding-block:var(--s-5) var(--s-11); }
.fv-head{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--s-3); margin-bottom:var(--s-3); }
.fv-head h1{ font-size:var(--t-h1); }
.fv-acoes{ display:flex; flex-wrap:wrap; gap:var(--s-3); margin:var(--s-5) 0 var(--s-6); }
.priv{ padding-block:var(--s-5) var(--s-11); max-width:720px; }
.priv h1{ font-size:var(--t-h1); margin-bottom:var(--s-3); }
.priv h2{ font-size:var(--t-h3); margin:var(--s-7) 0 var(--s-2); }
.priv p{ color:var(--ink-2); }
.priv b{ color:var(--ink); font-weight:600; }
.priv code{ font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:.9em; background:var(--bg-2); padding:1px 6px; border-radius:var(--r-xs); }
/* índice da página: chips que rolam até a seção */
.priv-idx{ display:flex; flex-wrap:wrap; gap:var(--s-2); margin:var(--s-2) 0 var(--s-4); }
.priv-idx a{
  display:inline-flex; align-items:center; height:36px; padding:0 var(--s-3); border-radius:var(--pill);
  border:1px solid var(--line); background:#fff; color:var(--ink-2); font-size:var(--t-label); font-weight:500; text-decoration:none;
  transition:border-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
}
.priv-idx a:hover{ border-color:var(--gold); color:var(--gold-ink); }
/* lista "dado → explicação" */
.priv-lista{ margin:0; padding:0; display:grid; gap:var(--s-3); }
.priv-lista > div{ padding:var(--s-4) var(--s-5); border:1px solid var(--line-2); border-radius:var(--r-sm); background:#fff; }
.priv-lista dt{ font-family:var(--display); font-weight:600; color:var(--ink); margin-bottom:var(--s-2); }
.priv-lista dd{ margin:0; color:var(--ink-2); font-size:var(--t-sm); line-height:1.6; }
.priv-ul{ margin:0 0 var(--s-3); padding-left:1.2em; color:var(--ink-2); display:grid; gap:var(--s-2); max-width:var(--medida); }
.priv-ul li::marker{ color:var(--gold); }
.priv-data{ margin-top:var(--s-8); padding-top:var(--s-4); border-top:1px solid var(--line-2); font-size:var(--t-label); color:var(--ink-3); }
/* tabela de cookies: rola na horizontal no celular, sem esticar a página */
.tabela-rolo{ overflow-x:auto; contain:paint; margin:0 0 var(--s-3); -webkit-overflow-scrolling:touch; }
.priv-tab{ width:100%; min-width:560px; border-collapse:collapse; font-size:var(--t-sm); color:var(--ink-2); }
.priv-tab th, .priv-tab td{ text-align:left; vertical-align:top; padding:var(--s-3) var(--s-3); border-bottom:1px solid var(--line-2); }
.priv-tab thead th{ font-size:var(--t-xs); text-transform:uppercase; letter-spacing:.08em; color:var(--ink-3); font-weight:600; border-bottom-color:var(--line); }
.priv-tab tbody th{ font-weight:600; color:var(--ink); white-space:nowrap; }
/* no celular cada linha vira um bloco: rótulo · valor, sem rolagem lateral */
@media (max-width:639px){
  .priv-tab{ min-width:0; }
  .priv-tab thead{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .priv-tab tr{ display:block; padding:var(--s-3) 0; border-bottom:1px solid var(--line-2); }
  .priv-tab tbody th, .priv-tab td{ display:block; border:0; padding:var(--s-1) 0; white-space:normal; }
  .priv-tab td{ display:grid; grid-template-columns:5.5em 1fr; gap:var(--s-2); }
  .priv-tab td::before{ content:attr(data-rotulo); font-size:var(--t-xs); text-transform:uppercase; letter-spacing:.08em; color:var(--ink-3); font-weight:600; padding-top:2px; }
}

/* caixa de consentimento dos formulários (nativa: teclado e leitor de tela de graça) */
.consent{ display:grid; grid-template-columns:auto 1fr; gap:var(--s-3); align-items:start; }
.consent input{ width:24px; height:24px; min-height:0; padding:0; border:0; margin:0; accent-color:var(--navy); cursor:pointer; }   /* desfaz a regra geral de campo */
.consent label{ display:block; font-size:var(--t-label); font-weight:400; color:var(--ink-2); line-height:1.5; cursor:pointer; }   /* .form label é grid; aqui o texto corre */
.consent label a{ font-weight:600; }
.consent input:focus, .consent input:focus-visible{ outline:2px solid var(--navy); outline-offset:2px; box-shadow:none; }

/* aviso de cookies: cartão fixo no rodapé, nunca cobre a barra fixa do imóvel (fica acima dela) */
.cookie-aviso{
  position:fixed; left:var(--s-4); right:var(--s-4); bottom:calc(var(--s-4) + env(safe-area-inset-bottom)); z-index:305;
  display:grid; gap:var(--s-4); padding:var(--s-5); background:#fff; border:1px solid var(--line); border-radius:var(--r);
  box-shadow:var(--shadow-lg); animation:toastUp var(--dur-2) var(--ease-out); max-width:720px; margin:0 auto;
}
body[data-view="imovel"] .cookie-aviso{ bottom:calc(var(--s-4) + 80px + env(safe-area-inset-bottom)); }
.cookie-txt b{ display:block; font-family:var(--display); font-weight:600; margin-bottom:var(--s-1); }
.cookie-txt p{ margin:0; font-size:var(--t-sm); color:var(--ink-2); }
.cookie-btns{ display:flex; gap:var(--s-2); }
.cookie-btns .btn{ flex:1; }

/* mapa sob clique: nada do Google carrega antes de a pessoa pedir */
.map-aviso{
  height:100%; min-height:220px; display:grid; place-content:center; justify-items:center; text-align:center;
  gap:var(--s-2); padding:var(--s-5); background:var(--bg-2); color:var(--ink-2);
  background-image:radial-gradient(var(--line) 1px, transparent 1px); background-size:18px 18px;
}
.map-aviso svg{ width:28px; height:28px; color:var(--gold); }
.map-aviso b{ font-family:var(--display); font-weight:600; color:var(--ink); }
.map-aviso p{ margin:0; font-size:var(--t-label); max-width:34ch; }
.map-aviso .btn{ margin-top:var(--s-2); }
.map-aviso small{ font-size:var(--t-xs); color:var(--ink-3); max-width:36ch; }

/* preferências de cookies (página /cookies/) */
.prefs{ display:grid; gap:var(--s-3); margin:var(--s-4) 0; }
.pref{ display:grid; grid-template-columns:auto 1fr; gap:var(--s-3); align-items:start; padding:var(--s-4) var(--s-5); border:1px solid var(--line-2); border-radius:var(--r-sm); background:#fff; }
.pref input{ width:24px; height:24px; margin:0; accent-color:var(--navy); cursor:pointer; }
.pref label{ display:grid; gap:var(--s-1); cursor:pointer; }
.pref label b{ font-family:var(--display); font-weight:600; color:var(--ink); }
.pref label span{ font-size:var(--t-sm); color:var(--ink-2); line-height:1.5; }
.pref-nota{ font-size:var(--t-label); color:var(--ink-3); margin:0; }
.pref-nota:empty{ display:none; }
.priv-404{ padding-top:var(--s-10); }
.priv-404 .btns{ margin-top:var(--s-5); }

/* ============================================================
   LIGHTBOX E AVISO
   ============================================================ */
.lightbox{ position:fixed; inset:0; z-index:300; background:rgba(0,0,0,.92); display:grid; place-items:center; animation:fadeIn var(--dur-2) var(--ease); }
.lightbox img{ max-width:94vw; max-height:86vh; max-height:86dvh; object-fit:contain; border-radius:var(--r-xs); }
.lb-close, .lb-nav{
  position:absolute; width:48px; height:48px; border-radius:50%; border:0; background:rgba(255,255,255,.16); color:#fff;
  display:grid; place-items:center; cursor:pointer; padding:0; transition:background var(--dur-1) var(--ease);
}
.lb-close:hover, .lb-nav:hover{ background:rgba(255,255,255,.28); }
.lb-close{ top:var(--s-4); right:var(--s-4); }
.lb-nav{ top:50%; transform:translateY(-50%); }
.lb-prev{ left:var(--s-3); } .lb-next{ right:var(--s-3); }
.lb-close svg, .lb-nav svg{ width:20px; height:20px; }
.lb-count{ position:absolute; bottom:var(--s-5); left:50%; transform:translateX(-50%); color:#fff; font-size:var(--t-label); opacity:.85; font-variant-numeric:tabular-nums; }

.toast{
  position:fixed; left:50%; bottom:calc(var(--s-6) + env(safe-area-inset-bottom)); transform:translateX(-50%);
  z-index:310; background:var(--ink); color:#fff; font-size:var(--t-sm); padding:var(--s-3) var(--s-5);
  border-radius:var(--pill); box-shadow:var(--shadow); max-width:calc(100vw - var(--s-8)); text-align:center;
  animation:toastUp var(--dur-2) var(--ease-out);
}
@keyframes toastUp{ from{ opacity:0; transform:translate(-50%, 10px); } to{ opacity:1; transform:translate(-50%, 0); } }

/* ============================================================
   RESPONSIVO — 640 / 900 / 1024
   ============================================================ */
@media (min-width:640px){
  .cards{ grid-template-columns:repeat(2, 1fr); }
  .cookie-aviso{ grid-template-columns:1fr auto; align-items:center; }
  .cookie-btns .btn{ flex:none; }
  .cards-scroll{ display:grid; margin:0; padding:0; contain:none; overflow-x:visible; scroll-snap-type:none; }
  .cards-scroll .card{ flex:none; }
  .card-media{ aspect-ratio:4/3; }
  /* em grade, a altura de 2 linhas fica reservada para as fichas alinharem */
  .card-title{ min-height:calc(2 * 1.35 * var(--t-sm)); }
  .sv-grid{ grid-template-columns:repeat(2, 1fr); gap:var(--s-3); border-top:0; }
  .sv{
    flex-direction:column; align-items:flex-start; gap:var(--s-2); padding:var(--s-6);
    background:#fff; border:1px solid var(--line-2); border-radius:var(--r);
  }
  .sv-ico{ margin-bottom:var(--s-1); }
  .sv-txt{ gap:var(--s-2); }
  .sv .link{ display:inline-flex; }
  .sv-go{ display:none; }
  .form-row{ grid-template-columns:1fr 1fr; }
  .search .btn{ width:auto; padding:0 var(--s-5); }
  .search .btn span{ display:inline; }
  .search .btn svg{ display:none; }
  .search-sm .btn{ width:auto; padding:0 var(--s-4); }
  .hero-media .foto{ aspect-ratio:2/1; }
  .im-specs{ grid-template-columns:repeat(4, 1fr); }
  .sim-campos{ grid-template-columns:1fr 1fr; }
  .catmap{ grid-template-columns:1.4fr 1fr; align-items:start; }
  .catmap .map{ aspect-ratio:4/3; }
  .catmap-nota{ grid-column:1/-1; }
  .catview button{ width:auto; padding:0 var(--s-3); }
  .catview button span{ display:inline; }
  .etapas li{ grid-template-columns:28px auto 1fr; align-items:baseline; }
  .etapas li::before{ grid-row:auto; }
  .etapas b{ grid-column:2; margin-right:var(--s-2); }
  .etapas span{ grid-column:3; font-size:var(--t-body); }
  .foot-grid{ grid-template-columns:1.4fr 1fr 1fr 1fr; }
  .foot-nav{ display:block; }
}

@media (min-width:900px){
  .wrap{ padding-left:max(var(--s-7), env(safe-area-inset-left)); padding-right:max(var(--s-7), env(safe-area-inset-right)); }
  .nav-links{ display:flex; }
  .nav-burger{ display:none; }
  .nav-wa{ width:auto; padding:0 var(--s-4); }
  .nav-wa span{ display:inline; }
  .brand img{ height:34px; }
  .hero{ padding:var(--s-11) 0 0; }
  .hero-media{ margin-top:var(--s-10); }
  .hero-media .foto{ aspect-ratio:2.2/1; max-height:540px; }
  .cards{ gap:var(--s-6); }
  .sv-grid{ gap:var(--s-4); }
  @media (hover:hover){ .sv:hover{ transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--line); } }
  .sobre-grid{ grid-template-columns:280px 1fr; gap:var(--s-9); align-items:center; }
  .sobre-photo{ width:100%; }
  .regiao-grid{ grid-template-columns:1fr 1.5fr; gap:var(--s-8); align-items:start; }
  .map{ aspect-ratio:16/10; }
  .contato-grid{ grid-template-columns:1fr 1fr; gap:var(--s-10); align-items:start; }
  footer{ padding-top:var(--s-10); }
  .cat{ padding-block:var(--s-7) var(--s-12); }
  /* barra de filtros numa linha só: finalidade · tipos · … · Filtros */
  .fbar{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s-3); }
  .seg{ display:inline-grid; grid-auto-flow:column; grid-auto-columns:auto; }
  .seg button{ padding:0 var(--s-4); }
  .frow{ display:contents; }
  .tchips{ display:inline-flex; }
  .tchips button{ padding:0 var(--s-4); }
  .fbtn{ margin-left:auto; }
  .fsort{ font-size:var(--t-sm); padding-left:var(--s-3); }
  .sheet{ align-items:center; padding:var(--s-6); }
  .sheet-card{ max-width:640px; border-radius:var(--r-lg); max-height:84vh; max-height:84dvh; box-shadow:var(--shadow-lg); }
  .im{ padding-block:var(--s-6) var(--s-12); }
  .im-share > span{ display:inline; }
  .im-grid{ grid-template-columns:minmax(0, 1fr) 360px; grid-template-areas:"gal cta" "head cta" "body cta"; gap:var(--s-5) var(--s-8); }
  .im-aside{ position:sticky; top:calc(var(--nav-h) + var(--s-5)); align-self:start; }
  .gal-track{ aspect-ratio:16/10; }
  .gal-nav{ display:grid; }
  .gal-thumbs{ display:grid; grid-template-columns:repeat(6, 1fr); gap:var(--s-2); margin-top:var(--s-2); }
  .gal-thumbs button{ aspect-ratio:4/3; padding:0; border:2px solid transparent; border-radius:var(--r-xs); overflow:hidden; background:var(--bg-2); cursor:pointer; transition:border-color var(--dur-1) var(--ease), opacity var(--dur-1) var(--ease); opacity:.75; }
  .gal-thumbs button:hover{ opacity:1; }
  .gal-thumbs button.on{ border-color:var(--navy); opacity:1; }
  .gal-thumbs img{ width:100%; height:100%; object-fit:cover; }
  .im-bar{ display:none; }
  body[data-view="imovel"] footer{ padding-bottom:calc(var(--s-7) + env(safe-area-inset-bottom)); }
  .sim-campos{ grid-template-columns:repeat(2, 1fr); }
  .sp-grid{ grid-template-columns:1.4fr 1fr; gap:var(--s-10); }
  .sb-grid{ grid-template-columns:280px 1fr; gap:var(--s-9); align-items:start; margin-top:var(--s-4); }
  .cred-grid{ grid-template-columns:1fr 1fr; gap:var(--s-8); }
  .sb-fim{ padding:var(--s-8); }
}

@media (min-width:1024px){
  .cards{ grid-template-columns:repeat(3, 1fr); }
  .sv-grid{ grid-template-columns:repeat(3, 1fr); }
  .catmap .map{ aspect-ratio:16/10; }
}

/* ============================================================
   FICHA DO IMÓVEL — o que sai no papel (e no "Salvar em PDF")
   ------------------------------------------------------------
   Regra de ouro: NADA depende de fundo colorido, porque o navegador
   não imprime fundo por padrão. Tudo que precisa aparecer é traço,
   borda ou texto.
   ============================================================ */
.folha-topo, .folha-pe{ display:none; }

@media print{
  @page{ margin:14mm 12mm; }
  html, body{ background:#fff !important; overflow:visible !important; }
  body{ font-size:10.5pt; line-height:1.45; color:#000; }
  a{ color:#000; text-decoration:none; }

  /* o que não vai para o papel */
  .nav, .menu, .menu-fundo, .skip, .im-bar, .toast, .lightbox,
  .sheet, .im-share, .im-sim, .sim, .gal-nav, .gal-count, .gal-thumbs,
  .crumbs, nav[aria-label="Trilha de navegação"], .back, .im-top,
  .im-links, .im-cta .btn, .im-map .map, footer,
  .fimlista, .fav, .catview, .fbar, .more, .search, #intro{ display:none !important; }

  main, .wrap, .im{ padding:0 !important; margin:0 !important; max-width:none !important; }
  .im-grid{ display:block !important; }
  .im-aside{ position:static !important; }

  /* cabeçalho e rodapé da ficha */
  .folha-topo{
    display:flex !important; align-items:center; gap:8mm;
    padding-bottom:3mm; margin-bottom:5mm; border-bottom:1.2pt solid #a8814a;
  }
  .folha-topo img{ height:12mm; width:auto; }
  .folha-quem{ flex:1; }
  .folha-quem b{ display:block; font-family:var(--display); font-size:11pt; }
  .folha-quem span{ font-size:8pt; color:#444; }
  .folha-contato{ text-align:right; font-size:8.5pt; color:#333; }
  .folha-contato span{ display:block; }
  .folha-pe{
    display:block !important; margin-top:6mm; padding-top:2.5mm;
    border-top:.6pt solid #bbb; font-size:7.5pt; color:#555;
  }
  .folha-pe span{ display:block; }

  /* fotos: a de capa grande e as três seguintes numa fileira */
  .gal{ border-radius:0 !important; background:none !important; }
  .gal-track{
    display:grid !important; grid-template-columns:repeat(3,1fr); gap:2mm;
    overflow:visible !important; aspect-ratio:auto !important;
  }
  .gal-item{ display:none !important; }
  .gal-item:nth-child(-n+4){ display:block !important; }
  .gal-item:first-child{ grid-column:1 / -1; }
  .gal-item img{ width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; }
  .gal-item:first-child img{ aspect-ratio:16/9; max-height:88mm; }

  /* título, preço e números */
  .im-head{ margin-top:5mm; }
  .im-head h1{ font-size:16pt; margin:2mm 0 1mm; }
  .im-loc{ font-size:9pt; }
  .badge{
    position:static !important; background:none !important; border:.7pt solid #666;
    color:#000 !important; font-size:7.5pt; padding:0 2mm; height:auto; line-height:1.6;
  }
  .im-cta{
    border:.8pt solid #999 !important; border-radius:0; padding:4mm; margin:4mm 0;
    box-shadow:none !important;
  }
  .im-price b{ font-size:17pt; }
  .im-taxas{ gap:8mm; }
  .im-specs{ grid-template-columns:repeat(4,1fr) !important; gap:2mm; margin-bottom:4mm; }
  .im-spec{ border:.6pt solid #999 !important; border-radius:0; padding:2.5mm; }
  .im-spec svg{ display:none; }
  .im-spec b{ font-size:11pt; }
  .im-spec span{ font-size:7.5pt; }

  /* texto corrido */
  .im-body h2{ font-size:11pt; margin:5mm 0 2mm; }
  .im-body p, .im-desc p{ color:#000 !important; max-width:none !important; }
  .im-ficha div{ padding:1.2mm 0; border-bottom:.4pt solid #ccc; }
  .im-ficha dt{ font-size:8.5pt; color:#444; }
  .im-ficha dd{ font-size:9pt; }
  .im-carac li{
    background:none !important; border:.5pt solid #999; border-radius:0;
    padding:.8mm 2mm; font-size:8pt;
  }

  /* não deixar um bloco partir no meio entre duas folhas */
  .im-desc, .im-detalhes, .im-carac, .im-cta, .im-specs{ break-inside:avoid; }
  h1, h2{ break-after:avoid; }
}

/* ============================================================
   MOVIMENTO REDUZIDO — tudo o que se mexe sozinho é desligado
   ============================================================ */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .js .rv, .js .rv .cards > *, .js .rv .sv-grid > *{ opacity:1; transform:none; transition:none; }
  .view-in, .sheet, .sheet-card, .menu, .menu-fundo, .lightbox, .toast, .faq details[open] p, .share-ok{ animation:none; }
  .intro-veil, .intro-logo, .intro-title{ transition:none; }
  .link-balanco svg{ animation:none; }
  .hero-media img{ transform:none; }
  .card:hover .card-media img{ transform:none; }
  *{ transition-duration:.01ms !important; }
}