  /* ============================================================
     SII — estilos próprios. Importa shared/fs-tokens.css e usa
     as variáveis de tema sem redefini-las (ADR-002).
     ============================================================ */
  *,*::before,*::after{ box-sizing:border-box; }
  html{ -webkit-text-size-adjust:100%; }
  body{
    margin:0; background:var(--paper2); color:var(--ink);
    font-family:var(--font-sans); line-height:1.5; font-size:16px;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,h4{ font-family:var(--font-display); font-weight:var(--fw-display); color:var(--ink2); margin:0 0 .5em; line-height:1.2; }
  p{ margin:0 0 1em; }
  img,svg{ max-width:100%; display:block; }
  a{ color:var(--brass); }
  button{ font:inherit; }
  ul{ margin:0; padding:0; list-style:none; }

  :focus{ outline:none; }
  :focus-visible{ outline:3px solid var(--brass-l); outline-offset:2px; border-radius:4px; }

  .sr-only{
    position:absolute; width:1px; height:1px; padding:0; margin:-1px;
    overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
  }
  .skip-link{
    position:absolute; left:8px; top:-100px; background:var(--ink2); color:var(--paper);
    padding:.6em 1em; border-radius:var(--r); z-index:200; transition:top .2s var(--ease);
  }
  .skip-link:focus{ top:8px; }

  .wrap{ max-width:1180px; margin:0 auto; padding:0 1rem; }

  /* ---------- Header ---------- */
  .topbar{
    position:sticky; top:0; z-index:50; background:rgba(255,255,255,.94);
    backdrop-filter:blur(6px); border-bottom:1px solid var(--paper3);
  }
  .topbar .wrap{ display:flex; align-items:center; gap:1rem; padding-block:.7rem; flex-wrap:wrap; }
  .brand{ display:flex; align-items:baseline; gap:.5rem; margin-right:auto; text-decoration:none; }
  .brand-mark{ font-family:var(--font-display); font-weight:var(--fw-display); font-size:1.4rem; color:var(--ink2); letter-spacing:.02em; }
  .brand-tag{ font-size:.72rem; color:var(--gray-3); text-transform:uppercase; letter-spacing:.08em; }
  .nav-links{ display:none; gap:1.25rem; }
  .nav-links a{ color:var(--ink2); text-decoration:none; font-size:.92rem; font-weight:600; }
  .nav-links a:hover{ color:var(--brass); }
  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:.45em;
    border:1.5px solid transparent; border-radius:var(--r-pill); padding:.6em 1.2em;
    font-weight:700; font-size:.92rem; cursor:pointer; text-decoration:none;
    transition:transform .15s var(--ease), box-shadow .15s var(--ease), background .15s var(--ease);
  }
  .btn:hover{ transform:translateY(-1px); }
  .btn-primary{ background:var(--emerald); color:#fff; }
  .btn-primary:hover{ background:var(--emerald-l); }
  .btn-ghost{ background:transparent; border-color:var(--paper3); color:var(--ink2); }
  .btn-ghost:hover{ border-color:var(--brass); color:var(--brass); }
  .chip{ display:inline-flex; align-items:center; gap:8px; padding:.35em .85em; border-radius:var(--r-pill); border:1px solid var(--paper3); background:var(--paper2); font-family:var(--font-mono); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:var(--gray-3); }
  .chip::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--brass-l); flex:none; }
  .chip--dark{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.28); color:rgba(255,255,255,.8); }
  .btn-brass{ background:var(--brass); color:#fff; }
  .btn-brass:hover{ background:var(--brass-l); }
  .btn-danger{ background:transparent; border-color:var(--brick); color:var(--brick); }
  .btn-danger:hover{ background:var(--brick); color:#fff; }
  .btn-sm{ padding:.4em .85em; font-size:.8rem; }
  .btn:disabled{ opacity:.55; cursor:not-allowed; transform:none; }

  /* ---------- Hero ---------- */
  .hero{
    background:linear-gradient(155deg, var(--brass-d), var(--brass) 65%);
    color:#fff; padding-block:2.5rem 3rem;
  }
  .hero .wrap{ display:grid; gap:2rem; }
  .hero-kicker{ text-transform:uppercase; letter-spacing:.14em; font-size:.72rem; color:var(--paper3); font-weight:700; }
  .hero h1{ color:#fff; font-size:clamp(1.7rem,4vw,2.5rem); margin-top:.4rem; }
  .hero-sub{ color:var(--paper3); max-width:56ch; }
  .creci-line{ font-size:.85rem; color:var(--paper3); }
  .pill-list{ display:flex; flex-wrap:wrap; gap:.5rem; margin:1rem 0; }
  .pill{
    background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.28);
    color:#fff; border-radius:var(--r-pill); padding:.3em .85em; font-size:.8rem; font-weight:600;
  }
  .hero-cta{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.2rem; }
  .radar{ display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; }
  .radar-tile{
    background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.22);
    border-radius:var(--r-md); padding:.9rem 1rem;
  }
  .radar-tile strong{ display:block; font-size:1.35rem; font-family:var(--font-display); font-weight:var(--fw-black); }
  .radar-tile span{ font-size:.74rem; color:var(--paper3); }
  .radar-note{ grid-column:1/-1; font-size:.72rem; color:var(--paper3); opacity:.85; }

  /* ---------- Busca / filtros ---------- */
  .busca{ background:var(--paper); border-bottom:1px solid var(--paper3); padding-block:1.2rem; }
  .busca .wrap{ display:grid; gap:.75rem; }
  .campo{ display:flex; flex-direction:column; gap:.3rem; }
  .campo label{ font-size:.72rem; font-weight:700; color:var(--gray-3); text-transform:uppercase; letter-spacing:.05em; }
  .campo input, .campo select{
    border:1.5px solid var(--paper3); border-radius:var(--r); padding:.55em .7em;
    font-size:.92rem; background:var(--paper); color:var(--ink); width:100%;
  }
  .campo input:focus-visible, .campo select:focus-visible{ border-color:var(--brass); }
  /* Reserva espaço pro atalho de teclado "/" (kbd absoluto no canto do campo) —
     sem isso, com a coluna estreita da grade de 5 filtros, o placeholder colide
     e é cortado no meio do caractere. */
  #f-busca{ padding-right:1.9rem; }
  .filtros-grid{ display:grid; grid-template-columns:1fr; gap:.75rem; }
  .filtros-linha{ display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; }
  .resultado-count{ font-size:.85rem; color:var(--gray-3); font-weight:600; }
  .chk-fav{ display:flex; align-items:center; gap:.4em; font-size:.85rem; color:var(--ink2); font-weight:600; }

  /* ---------- Grid de imóveis ---------- */
  .vitrine{ padding-block:1.6rem 2.5rem; }
   /* min-height reserva espaco antes de o JS popular os cards (consulta ao
      Supabase) — sem isso a grade nasce vazia e o conteudo abaixo (rodape
      etc.) salta quando os imoveis chegam, medido em auditoria real como
      CLS 0,712 (score "ruim", turno unico de 0,676 num pulo so). */
  .grid-imoveis{ display:grid; grid-template-columns:1fr; gap:1rem; min-height:70vh; }
  .card{
    background:var(--paper); border:1px solid var(--paper3); border-radius:var(--r-md);
    overflow:hidden; box-shadow:var(--shadow-1); display:flex; flex-direction:column;
  }
  .card-thumb{
    aspect-ratio:16/10; position:relative; display:flex; align-items:center; justify-content:center;
    color:#fff; text-align:center; padding:1rem;
  }
  .card-thumb-foto{ padding:0; background:var(--paper3); }
  .card-thumb-foto img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
  .card-thumb:not(.card-thumb-foto){ background:repeating-linear-gradient(45deg, var(--paper3) 0 8px, var(--paper2) 8px 16px); color:var(--gray-2); }
  .card-thumb small{ position:absolute; bottom:.5rem; left:.6rem; right:.6rem; font-size:.62rem; text-transform:uppercase;
    letter-spacing:.06em; background:rgba(0,0,0,.32); border-radius:var(--r); padding:.2em .5em; text-align:left; }
  .card-thumb .thumb-code{ font-family:var(--font-mono); font-weight:700; font-size:1.1rem; }
  .card-body{ padding:.9rem 1rem 1rem; display:flex; flex-direction:column; gap:.5rem; flex:1; }
  .badge-row{ display:flex; gap:.4rem; flex-wrap:wrap; }
  .badge{ font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; padding:.25em .6em; border-radius:var(--r-pill); }
  .badge-venda{ background:rgba(31,111,84,.12); color:var(--emerald); }
  .badge-aluguel{ background:rgba(184,134,46,.14); color:#664D03; }
  .card-titulo{ font-family:var(--font-display); font-weight:var(--fw-display); font-size:1.05rem; color:var(--ink2); margin:0; }
  .card-local{ font-size:.82rem; color:var(--gray-3); }
  .specs-row{ display:flex; flex-wrap:wrap; gap:.6rem; font-size:.78rem; color:var(--gray-3); }
  .specs-row span{ display:inline-flex; align-items:center; gap:.3em; }
  .card-preco{ font-size:1.2rem; font-weight:var(--fw-black); color:var(--ink2); font-family:var(--font-display); margin-top:auto; }
  .card-preco small{ font-size:.68rem; font-weight:600; color:var(--gray-3); }
  .card-actions{ display:flex; align-items:center; gap:.5rem; padding-top:.4rem; border-top:1px solid var(--paper3); }
  .fav-btn{
    background:none; border:1.5px solid var(--paper3); border-radius:var(--r-pill); width:2.3rem; height:2.3rem;
    display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--brick); flex:none;
  }
  .fav-btn[aria-pressed="true"]{ background:rgba(178,58,46,.1); border-color:var(--brick); }
  .card-actions .btn{ flex:1; }
  .vazio{ text-align:center; padding:3rem 1rem; color:var(--gray-3); }

  /* ---------- Sobre ---------- */
  .sobre{ background:var(--paper); padding-block:2.5rem; border-top:1px solid var(--paper3); }
  .sobre .wrap{ display:grid; gap:1.5rem; }
  .info-card{
    background:var(--paper2); border:1px solid var(--paper3); border-radius:var(--r-md); padding:1.2rem;
    display:grid; gap:.5rem; font-size:.9rem;
  }
  .info-card dt{ font-weight:700; color:var(--gray-3); font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; margin-top:.4rem; }
  .info-card dd{ margin:0 0 .2rem; color:var(--ink2); }

  /* ---------- Dialog / modal ---------- */
  dialog.modal{
    border:none; border-radius:var(--r-lg); padding:0; width:min(720px,92vw); max-height:88vh;
    box-shadow:var(--shadow-2); background:var(--paper);
  }
  dialog.modal::backdrop{ background:rgba(10,10,10,.55); }
  .modal.is-open-fallback{ display:block; position:fixed; inset:0 auto auto 50%; transform:translate(-50%,4vh);
    width:min(720px,92vw); max-height:88vh; z-index:120; }
  .modal-scroll{ overflow-y:auto; max-height:88vh; }
  .modal-head{ position:sticky; top:0; background:var(--paper); display:flex; justify-content:space-between; gap:1rem;
    align-items:flex-start; padding:1.2rem 1.2rem .8rem; border-bottom:1px solid var(--paper3); z-index:2; }
  .modal-close{ background:var(--paper2); border:1px solid var(--paper3); border-radius:var(--r-pill); width:2.2rem; height:2.2rem; cursor:pointer; flex:none; }
  .modal-body{ padding:1rem 1.2rem 1.6rem; display:grid; gap:1.2rem; }
  /* FAB fixo no detalhe do imóvel — filho direto do <dialog> (não de
     .modal-scroll), então fica ancorado ao próprio modal (que é
     position:fixed nativo de <dialog aberto com showModal()>), sempre
     visível por cima do conteúdo rolável, sem cobrir o cabeçalho/botão
     fechar (que fica no topo). */
  .fab-whatsapp{
    position:absolute; right:16px; bottom:16px; z-index:5;
    width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center;
    background:#128C7E; color:#fff; box-shadow:var(--shadow-2); text-decoration:none;
  }
  .fab-whatsapp:hover{ background:#0C6B60; }
  .fab-whatsapp:focus-visible{ outline:3px solid var(--brass); outline-offset:2px; }
  @media (max-width:480px){ .fab-whatsapp{ width:50px; height:50px; right:10px; bottom:10px; } }
  .ficha{ display:grid; grid-template-columns:1fr 1fr; gap:.5rem 1rem; font-size:.88rem; }
  .ficha div{ display:flex; justify-content:space-between; border-bottom:1px dashed var(--paper3); padding-bottom:.3rem; }
  .ficha dt{ color:var(--gray-3); }
  .ficha dd{ margin:0; font-weight:700; color:var(--ink2); }
  .aviso{
    background:rgba(184,134,46,.1); border:1px solid var(--warn); border-radius:var(--r); padding:.7rem .9rem;
    font-size:.8rem; color:#6b4f1a; display:flex; gap:.5rem;
  }
  .sim-grid{ display:grid; grid-template-columns:1fr; gap:.7rem; }
  .sim-resultado{ background:var(--paper2); border-radius:var(--r); padding:.8rem; display:grid; gap:.35rem; font-size:.86rem; }
  .sim-resultado strong{ font-size:1.15rem; color:var(--ink2); font-family:var(--font-display); font-weight:var(--fw-black); }
  .semelhantes-grid{ display:grid; grid-template-columns:1fr; gap:.6rem; }
  .semelhante-card{ display:flex; gap:.6rem; align-items:center; border:1px solid var(--paper3); border-radius:var(--r); padding:.5rem; text-align:left; background:var(--paper); cursor:pointer; width:100%; }
  .semelhante-thumb{ width:3rem; height:3rem; border-radius:var(--r); flex:none; color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--font-mono); font-size:.65rem; font-weight:700; }

  /* ---------- Galeria estilo Airbnb + lightbox ---------- */
  .galeria{ display:grid; grid-template-columns:2fr 1fr 1fr; grid-template-rows:repeat(2,1fr); gap:.4rem; border-radius:var(--r-md); overflow:hidden; margin-bottom:1rem; height:220px; }
  .galeria button{ border:none; padding:0; margin:0; cursor:pointer; background:none; display:block; width:100%; height:100%; position:relative; }
  .galeria img{ width:100%; height:100%; object-fit:cover; display:block; }
  .galeria .g-principal{ grid-row:1/3; grid-column:1; }
  .galeria .g-ver-todas{ position:absolute; right:.5rem; bottom:.5rem; background:rgba(10,10,10,.75); color:#fff; font-size:.72rem; font-weight:700; padding:.3em .7em; border-radius:var(--r-pill); }
  .galeria-vazia{ height:220px; border-radius:var(--r-md); margin-bottom:1rem; display:flex; align-items:center; justify-content:center; color:#fff; text-align:center; padding:1rem; }
  @media (max-width:480px){ .galeria{ grid-template-columns:1fr; grid-template-rows:1fr; height:200px; } .galeria .g-principal{ grid-row:1; } .galeria button:not(.g-principal){ display:none; } }

  .lightbox{ position:fixed; inset:0; z-index:300; background:rgba(10,10,10,.94); display:none; align-items:center; justify-content:center; flex-direction:column; }
  .lightbox.is-open{ display:flex; }
  .lightbox img{ max-width:min(92vw,900px); max-height:76vh; object-fit:contain; border-radius:var(--r); }
  .lightbox-count{ color:var(--paper3); font-size:.8rem; margin-top:.7rem; font-family:var(--font-mono); }
  .lightbox-close, .lightbox-nav{ position:absolute; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.25); color:#fff; border-radius:var(--r-pill); cursor:pointer; display:flex; align-items:center; justify-content:center; }
  .lightbox-close{ top:1rem; right:1rem; width:2.4rem; height:2.4rem; font-size:1.1rem; }
  .lightbox-nav{ top:50%; transform:translateY(-50%); width:2.8rem; height:2.8rem; font-size:1.3rem; }
  .lightbox-prev{ left:1rem; } .lightbox-next{ right:1rem; }

  /* ---------- Painel do corretor ---------- */
  .painel{ background:var(--ink2); color:var(--paper2); padding-block:2.5rem; }
  .painel h2{ color:#fff; }
  .painel-gate{ max-width:360px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.15); border-radius:var(--r-md); padding:1.2rem; display:grid; gap:.7rem; }
  /* .campo label usa --gray-3 (#4A4A4A) por padrão, pensado pra fundo claro —
     nesta seção específica (login do corretor) o fundo é escuro, dando
     contraste real de 1,5 (achado por auditoria Lighthouse). */
  .painel-gate .campo label{ color:var(--gray-1); }
  .painel-gate[hidden]{ display:none; }
  .painel-gate p{ font-size:.8rem; color:var(--paper3); }

  .sii-auth-modal-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.6); display:flex; align-items:center; justify-content:center; z-index:9999; padding:20px; }
  .sii-auth-modal-backdrop[hidden]{ display:none; }
  .sii-auth-modal{ position:relative; width:100%; max-width:400px; max-height:90vh; overflow-y:auto; background:var(--ink2); color:var(--paper2); border-radius:var(--r-md); padding:28px 24px 24px; box-shadow:0 20px 60px rgba(0,0,0,.5); }
  .sii-auth-modal h3{ margin:0 0 14px; color:#fff; font-size:1.1rem; }
  .sii-auth-modal-close{ position:absolute; top:10px; right:12px; background:none; border:none; color:var(--paper3); font-size:1.5rem; line-height:1; cursor:pointer; padding:4px 8px; }
  .sii-auth-modal-close:hover{ color:#fff; }
  .tabs{ display:flex; gap:.4rem; flex-wrap:wrap; margin-bottom:1rem; border-bottom:1px solid rgba(255,255,255,.15); padding-bottom:.6rem; }
  .tab-btn{ background:none; border:1px solid rgba(255,255,255,.25); color:var(--paper3); border-radius:var(--r-pill); padding:.4em 1em; cursor:pointer; font-size:.82rem; font-weight:700; }
  .tab-btn[aria-selected="true"]{ background:#fff; color:var(--ink2); border-color:#fff; }
  .tab-panel{ display:none; }
  .tab-panel.is-active{ display:block; }
  .painel-card{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.14); border-radius:var(--r-md); padding:1rem; }
  .tabela-wrap{ overflow-x:auto; }
  table.crud{ width:100%; border-collapse:collapse; font-size:.82rem; min-width:640px; }
  table.crud th, table.crud td{ text-align:left; padding:.5em .6em; border-bottom:1px solid rgba(255,255,255,.12); color:var(--paper2); }
  table.crud th{ color:var(--paper3); text-transform:uppercase; font-size:.68rem; letter-spacing:.05em; }
  .form-grid{ display:grid; grid-template-columns:1fr; gap:.6rem; }
  .form-grid label{ display:grid; gap:.3rem; font-size:.78rem; color:var(--paper3); font-weight:700; }
  .form-grid input, .form-grid select, .form-grid textarea{
    border:1.5px solid rgba(255,255,255,.25); background:rgba(255,255,255,.06); color:#fff; border-radius:var(--r);
    padding:.55em .7em; font-size:.88rem; font-family:inherit;
  }
  /* Chrome/Windows abre o dropdown nativo com fundo claro; sem isto as <option>
     herdam o color:#fff do select e ficam invisíveis (branco no branco). */
  .form-grid select option, .form-grid select optgroup{ color:var(--ink2,#10233F); background-color:#fff; }
  .form-grid textarea{ resize:vertical; min-height:5.5rem; }
  .form-secao{ margin:.8rem 0 0; padding-top:.6rem; border-top:1px solid rgba(255,255,255,.14); color:#fff; font-size:.82rem; text-transform:uppercase; letter-spacing:.05em; }
  .form-grid .form-secao:first-child{ margin-top:0; padding-top:0; border-top:none; }
  .form-actions{ display:flex; gap:.6rem; flex-wrap:wrap; margin-top:.5rem; }

  /* ---------- Fase 2 (SII): gerenciador de fotos ---------- */
  .fotos-drop{ border:1px dashed rgba(255,255,255,.3); border-radius:var(--r-md); padding:1.1rem; text-align:center; color:var(--paper3); font-size:.82rem; margin-bottom:.8rem; }
  .fotos-drop.is-dragover{ border-color:var(--brass, #c99a4a); background:rgba(255,255,255,.06); }
  .fotos-drop.is-uploading{ opacity:.5; pointer-events:none; }
  .fotos-lista{ display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:.7rem; }
  .foto-item{ position:relative; border:1.5px solid rgba(255,255,255,.2); border-radius:var(--r); overflow:hidden; cursor:grab; background:rgba(255,255,255,.04); }
  .foto-item.is-capa{ border-color:var(--brass, #c99a4a); box-shadow:0 0 0 2px var(--brass, #c99a4a); }
  .foto-item.is-dragging{ opacity:.4; }
  .foto-item img{ display:block; width:100%; aspect-ratio:4/3; object-fit:cover; }
  .foto-item-acoes{ display:flex; flex-wrap:wrap; justify-content:center; gap:.3rem; padding:.35rem; background:rgba(0,0,0,.55); }
  .foto-item-acoes button{ font-size:.68rem; background:rgba(255,255,255,.14); border:none; color:#fff; border-radius:.4rem; padding:.25em .5em; cursor:pointer; }
  .foto-item-acoes button:disabled{ opacity:.4; cursor:default; }
  .foto-item-tag{ position:absolute; top:.3rem; left:.3rem; background:var(--brass,#c99a4a); color:#1a1a1a; font-size:.62rem; font-weight:700; padding:.15em .5em; border-radius:.3rem; text-transform:uppercase; }
  .foto-item-progresso{ position:absolute; inset:0; background:rgba(0,0,0,.55); display:flex; align-items:center; justify-content:center; color:#fff; font-size:.72rem; }
  .kanban{ display:grid; grid-template-columns:1fr; gap:.8rem; }
  .kanban-col{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.14); border-radius:var(--r-md); padding:.7rem; min-height:5rem; }
  .kanban-col h3{ color:#fff; font-size:.85rem; display:flex; justify-content:space-between; }
  .lead-card{ background:rgba(255,255,255,.08); border-radius:var(--r); padding:.6rem; margin-top:.5rem; font-size:.8rem; display:grid; gap:.35rem; }
  .lead-card.is-parado{ border:1px solid var(--warn); }
  .lead-alerta{ font-size:.68rem; font-weight:800; color:var(--warn); }
  .lead-card strong{ color:#fff; }
  .lead-card select{ font-size:.75rem; padding:.3em; border-radius:var(--r); }
  .progress{ height:.6rem; border-radius:var(--r-pill); background:rgba(255,255,255,.15); overflow:hidden; margin:.6rem 0; }
  .progress > i{ display:block; height:100%; background:var(--emerald-l); }
  .ia-nota{ font-size:.75rem; color:var(--paper3); }

  /* ---------- Chat Célia ---------- */
  .chat-toggle{
    position:fixed; right:1rem; bottom:1rem; z-index:90; background:var(--brick); color:#fff;
    border:none; border-radius:var(--r-pill); padding:.8em 1.2em; box-shadow:var(--shadow-2); cursor:pointer;
    font-weight:800; display:flex; align-items:center; gap:.5em;
  }
  /* Em telas estreitas o botão de texto cobria preço/metragem dos cards ao
     rolar a vitrine — vira ícone redondo compacto, sem o rótulo (que continua
     no aria-label pra leitor de tela). */
  @media (max-width:480px){
    .chat-toggle{
      width:3.1rem; height:3.1rem; padding:0; justify-content:center; font-size:1.2rem;
    }
    .chat-toggle-label{ display:none; }
  }
  .chat-panel{
    position:fixed; right:1rem; bottom:1rem; z-index:95; width:min(370px,94vw); max-height:min(560px,80vh);
    background:var(--paper); border-radius:var(--r-lg); box-shadow:var(--shadow-2); display:none;
    flex-direction:column; overflow:hidden; border:1px solid var(--paper3);
  }
  .chat-panel.is-open{ display:flex; }
  .chat-head{ background:var(--brass-d); color:#fff; padding:.8rem 1rem; display:flex; justify-content:space-between; align-items:center; }
  .chat-head p{ margin:0; font-size:.72rem; color:var(--paper3); }
  .chat-msgs{ flex:1; overflow-y:auto; padding:.8rem; display:grid; gap:.55rem; font-size:.86rem; }
  .msg{ padding:.55em .75em; border-radius:var(--r-md); max-width:88%; }
  .msg-ia{ background:var(--paper2); align-self:flex-start; }
  .msg-user{ background:var(--brass); color:#fff; align-self:flex-end; margin-left:auto; }
  .msg-sistema{ background:rgba(31,111,84,.12); color:var(--emerald); font-size:.78rem; text-align:center; }
  .chat-msgs{ display:flex; flex-direction:column; }
  .chat-form{ border-top:1px solid var(--paper3); padding:.6rem; display:flex; gap:.5rem; }
  .chat-form input{ flex:1; border:1.5px solid var(--paper3); border-radius:var(--r-pill); padding:.55em .9em; font-size:.86rem; }
  .chat-lead{ border-top:1px solid var(--paper3); padding:.6rem .8rem; }
  .chat-lead-form{ display:none; gap:.4rem; margin-top:.5rem; }
  .chat-lead-form.is-open{ display:grid; }
  .chat-lead-form input{ border:1.5px solid var(--paper3); border-radius:var(--r); padding:.45em .6em; font-size:.82rem; }
  .link-btn{ background:none; border:none; color:var(--brass); font-weight:700; font-size:.78rem; cursor:pointer; padding:0; text-decoration:underline; }

  /* ---------- Toast ---------- */
  .toast{
    position:fixed; left:50%; bottom:1rem; transform:translate(-50%,120%); z-index:200;
    background:var(--ink2); color:#fff; padding:.65em 1.1em; border-radius:var(--r-pill);
    font-size:.85rem; box-shadow:var(--shadow-2); transition:transform .25s var(--ease);
  }
  .toast.is-visible{ transform:translate(-50%,0); }

  /* ---------- Footer ---------- */
  footer.rodape{ background:var(--paper3); padding-block:1.6rem; font-size:.78rem; color:var(--gray-3); }
  footer.rodape .wrap{ display:grid; gap:.4rem; }
  footer.rodape strong{ color:var(--ink2); }

  @media (min-width:640px){
    .grid-imoveis{ grid-template-columns:repeat(2,1fr); }
    .filtros-grid{ grid-template-columns:repeat(3,1fr); }
    .ficha{ grid-template-columns:1fr 1fr; }
  }
  @media (min-width:768px){
    .nav-links{ display:flex; }
    .hero .wrap{ grid-template-columns:1.15fr 1fr; align-items:center; }
    .radar{ grid-template-columns:repeat(2,1fr); }
    .filtros-grid{ grid-template-columns:repeat(5,1fr); }
    .sobre .wrap{ grid-template-columns:1.3fr 1fr; }
    .kanban{ grid-template-columns:repeat(3,1fr); }
    .form-grid{ grid-template-columns:1fr 1fr; }
    .form-grid .full{ grid-column:1/-1; }
  }
  @media (min-width:1024px){
    .grid-imoveis{ grid-template-columns:repeat(3,1fr); }
    .kanban{ grid-template-columns:repeat(6,1fr); }
  }

  @media (prefers-reduced-motion:reduce){
    *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  }

  /* ============================================================
     Redesign 3D — "camadas arquitetônicas"
     A profundidade vem do próprio assunto (imóveis têm volume,
     plantas têm camadas, um skyline tem planos). Cards ganham
     espessura de ficha física; o hero ganha um skyline em
     parallax; os tiles do radar viram blocos extrudados.
     ============================================================ */
  .hero{ position:relative; overflow:hidden; perspective:900px; }
  .hero-skyline{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
  .hero-skyline .camada{
    position:absolute; left:0; right:0; bottom:0; height:60%;
    background-repeat:repeat-x; background-position:bottom;
    will-change:transform;
  }
  .hero-skyline .camada-longe{
    height:42%; opacity:.14; background-color:var(--brass-l); background-image:none;
    -webkit-mask-repeat:repeat-x; mask-repeat:repeat-x; -webkit-mask-size:auto 100%; mask-size:auto 100%;
    -webkit-mask-position:bottom; mask-position:bottom;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 100' preserveAspectRatio='none' fill='%23fff'%3E%3Crect x='0' y='40' width='24' height='60'/%3E%3Crect x='30' y='55' width='18' height='45'/%3E%3Crect x='54' y='25' width='30' height='75'/%3E%3Crect x='90' y='50' width='20' height='50'/%3E%3Crect x='116' y='35' width='26' height='65'/%3E%3Crect x='148' y='60' width='16' height='40'/%3E%3Crect x='170' y='20' width='34' height='80'/%3E%3Crect x='210' y='45' width='22' height='55'/%3E%3Crect x='238' y='58' width='18' height='42'/%3E%3Crect x='262' y='30' width='28' height='70'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 100' preserveAspectRatio='none' fill='%23fff'%3E%3Crect x='0' y='40' width='24' height='60'/%3E%3Crect x='30' y='55' width='18' height='45'/%3E%3Crect x='54' y='25' width='30' height='75'/%3E%3Crect x='90' y='50' width='20' height='50'/%3E%3Crect x='116' y='35' width='26' height='65'/%3E%3Crect x='148' y='60' width='16' height='40'/%3E%3Crect x='170' y='20' width='34' height='80'/%3E%3Crect x='210' y='45' width='22' height='55'/%3E%3Crect x='238' y='58' width='18' height='42'/%3E%3Crect x='262' y='30' width='28' height='70'/%3E%3C/svg%3E");
  }
  .hero-skyline .camada-perto{
    height:56%; opacity:.22; background-color:#ffffff; background-image:none;
    -webkit-mask-repeat:repeat-x; mask-repeat:repeat-x; -webkit-mask-size:auto 100%; mask-size:auto 100%;
    -webkit-mask-position:bottom; mask-position:bottom;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 360 140' preserveAspectRatio='none' fill='%23fff'%3E%3Crect x='0' y='30' width='40' height='110'/%3E%3Crect x='48' y='60' width='26' height='80'/%3E%3Crect x='82' y='10' width='46' height='130'/%3E%3Crect x='136' y='45' width='30' height='95'/%3E%3Crect x='174' y='70' width='24' height='70'/%3E%3Crect x='206' y='25' width='42' height='115'/%3E%3Crect x='256' y='55' width='28' height='85'/%3E%3Crect x='292' y='5' width='48' height='135'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 360 140' preserveAspectRatio='none' fill='%23fff'%3E%3Crect x='0' y='30' width='40' height='110'/%3E%3Crect x='48' y='60' width='26' height='80'/%3E%3Crect x='82' y='10' width='46' height='130'/%3E%3Crect x='136' y='45' width='30' height='95'/%3E%3Crect x='174' y='70' width='24' height='70'/%3E%3Crect x='206' y='25' width='42' height='115'/%3E%3Crect x='256' y='55' width='28' height='85'/%3E%3Crect x='292' y='5' width='48' height='135'/%3E%3C/svg%3E");
  }
  .hero .wrap{ position:relative; z-index:1; }
  .hero::before{
    content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
    background-image:repeating-linear-gradient(to bottom, transparent 0 33px, rgba(255,255,255,.05) 33px 34px);
  }
  .hero::after{
    content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
    background:radial-gradient(560px circle at 84% 92%, rgba(255,255,255,.16), transparent 60%);
  }

  .radar-tile{
    position:relative; transform-style:preserve-3d; transition:transform .18s var(--ease), box-shadow .18s var(--ease);
    box-shadow:0 1px 0 rgba(255,255,255,.18) inset, 0 10px 18px -10px rgba(0,0,0,.45), 0 2px 0 rgba(0,0,0,.35);
    border-bottom:2px solid rgba(0,0,0,.28);
  }
  @media (hover:hover) and (pointer:fine){
    .radar-tile:hover{ transform:translateY(-3px) rotateX(6deg); box-shadow:0 1px 0 rgba(255,255,255,.22) inset, 0 18px 26px -12px rgba(0,0,0,.5), 0 2px 0 rgba(0,0,0,.35); }
  }

  #grid-imoveis{ perspective:1400px; }
  .card{
    transform-style:preserve-3d; will-change:transform;
    box-shadow:0 1px 0 #fff inset, 0 1px 2px rgba(10,10,10,.06), 0 10px 22px -14px rgba(10,10,10,.28), 0 1px 0 rgba(10,10,10,.06);
    transition:transform .12s linear, box-shadow .18s var(--ease);
  }
  .card-thumb{ transform:translateZ(0); transition:transform .12s linear; }
  .card-body{ transition:transform .12s linear; }
  @media (hover:hover) and (pointer:fine){
    .card:hover{ box-shadow:0 1px 0 #fff inset, 0 1px 2px rgba(10,10,10,.06), 0 26px 38px -18px rgba(10,10,10,.38), 0 1px 0 rgba(10,10,10,.06); }
    .card.is-tilting .card-thumb{ transform:translateZ(26px); }
    .card.is-tilting .card-body > *{ transform:translateZ(12px); }
  }
  .card:active{ transition-duration:.05s; }

  dialog.modal[open], .modal.is-open-fallback{
    animation:modalErguer .32s var(--ease) both;
    transform-origin:center 30%;
  }
  @keyframes modalErguer{
    from{ opacity:0; transform:translateY(4vh) scale(.95) rotateX(8deg); }
    to{ opacity:1; transform:translateY(0) scale(1) rotateX(0); }
  }
  dialog.modal::backdrop{ animation:backdropFade .32s var(--ease) both; }
  @keyframes backdropFade{ from{ opacity:0; } to{ opacity:1; } }

  .btn{ box-shadow:0 1px 0 rgba(255,255,255,.15) inset, 0 2px 0 rgba(0,0,0,.18), 0 6px 12px -6px rgba(0,0,0,.3); }
  .btn:active{ transform:translateY(1px); box-shadow:0 1px 0 rgba(255,255,255,.1) inset, 0 1px 0 rgba(0,0,0,.18); }

  @media (prefers-reduced-motion:reduce){
    .hero-skyline .camada, .card, .card-thumb, .card-body, .radar-tile{ transform:none !important; transition:none !important; }
    dialog.modal[open], .modal.is-open-fallback, dialog.modal::backdrop{ animation:none !important; }
  }
