/* ============================================================
   layout-fix.css — correcoes de layout do site Gaiacasas
   ------------------------------------------------------------
   Ficheiro NOVO. NAO altera o site.min.css (261 KB, minificado,
   que na verdade sao 4 folhas de estilo coladas umas as outras).

   Carregar SEMPRE depois do site.min.css e do blog.min.css,
   para ganhar na cascata.

   Diagnostico feito em 2026-08-01, medido no browser.
   Para reverter tudo: apagar o <link> do _Layout.cshtml.
   ============================================================ */


/* ------------------------------------------------------------
   1. A BARRA PRETA NO TOPO DO HOME
   ------------------------------------------------------------
   CAUSA: o site.min.css tem esta regra, com seletor de ELEMENTO:

       nav { position:fixed; top:0; left:0; right:0; z-index:100;
             background:rgba(10,10,10,0.9); backdrop-filter:blur(20px); }

   Como se aplica a QUALQUER <nav>, apanhava tambem o
   <nav class="my-pagination"> da paginacao de imoveis: arrancava-o
   do sitio dele, colava-o ao topo do ecra (1534x113) e pintava-o
   de preto a 90% por cima do hero.

   Medido: elementsFromPoint(770,60) devolvia
   "nav.my-pagination | bg=rgba(10,10,10,0.9) | box=0,0 1534x113"

   O :not(#mainNav) da especificidade (1,0,1) — vence o "nav"
   (0,0,1) e nao toca na barra principal.
   ------------------------------------------------------------ */
nav:not(#mainNav) {
  position: static;
  top: auto; left: auto; right: auto; bottom: auto;
  z-index: auto;
  background: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom: 0;
  padding: 0;
}


/* ------------------------------------------------------------
   2. NAVBAR LIMPA NO TOPO DO HOME
   ------------------------------------------------------------
   O #mainNav so declara "background", por isso o backdrop-filter
   e a border-bottom da regra "nav" global passavam a mesma.
   Sobre a imagem do hero isso dava uma barra baca com corte nitido.
   ------------------------------------------------------------ */
#mainNav {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom-color: transparent;
}


/* ------------------------------------------------------------
   3. A CLASSE .solid NAO PODE PINTAR NADA
   ------------------------------------------------------------
   O _Layout.cshtml faz:
       class="@(ViewData["NavSolid"] != null ? "solid" : "")"

   Varias Views definem ViewData["NavSolid"] (Contactos, Comprar,
   Premium, FAQ, Sobre Nos...). Mas TODAS as paginas deste site
   tem um hero de imagem inteira no topo:

       /comprar-casa  ->  section.hero com imagem, 736px
       /contactos     ->  section.hero com imagem, 843px

   Ou seja, uma barra opaca tapa a imagem. A navbar deve ser
   transparente em todo o lado no topo, e so ganhar corpo com
   o scroll (ponto 4).

   Fica declarado explicitamente como transparente para o caso
   de alguma outra folha (blog.min.css) tentar pintar .solid.
   ------------------------------------------------------------ */
#mainNav.solid {
  background-color: transparent;
  box-shadow: none;
}


/* ------------------------------------------------------------
   4. NAVBAR AO FAZER SCROLL
   ------------------------------------------------------------
   O script.js ja adiciona .scrolled acima dos 50px. Aqui
   devolve-se-lhe o corpo que o ponto 2 tirou ao estado de topo.
   ------------------------------------------------------------ */
#mainNav.scrolled {
  background-color: #0a0a0a;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom-color: rgba(200, 168, 86, 0.18);
}


/* ------------------------------------------------------------
   5. BOTAO HAMBURGER
   ------------------------------------------------------------
   O HTML existe no _Layout e o JavaScript do script.js funciona
   (faz toggle da classe .open). Faltava so o CSS: os tres <span>
   nao tinham tamanho nem cor, logo eram invisiveis.
   ------------------------------------------------------------ */
.nav-hamburger {
  display: none;              /* so aparece em ecras pequenos */
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 28px;
  height: 22px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  z-index: 1002;
}

.nav-hamburger span {
  display: block;
  width: 100%;
  height: 2px;
  background: #c8a856;
  transition: transform 0.3s ease, opacity 0.2s ease;
}

/* As tres barras viram um X com o menu aberto */
.nav-hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2) { opacity: 0; }
.nav-hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }


/* ------------------------------------------------------------
   6. MENU EM TELEMOVEL
   ------------------------------------------------------------
   O site.min.css escondia .nav-links abaixo dos 900px mas nao
   havia forma de o voltar a mostrar. O menu ficava inacessivel.
   "#mainNav .nav-links.open" tem especificidade (1,2,0), suficiente
   para vencer o display:none original.
   ------------------------------------------------------------ */
@media (max-width: 900px) {

  .nav-hamburger { display: flex; }

  #mainNav .nav-links.open {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    right: 0;
    width: min(78vw, 320px);
    height: 100vh;
    height: 100dvh;
    margin: 0;
    padding: 6rem 2rem 2rem;
    gap: 1.6rem;
    background: #0a0a0a;
    border-left: 1px solid rgba(200, 168, 86, 0.25);
    overflow-y: auto;
    z-index: 1001;
  }

  #mainNav .nav-links.open a {
    font-size: 0.78rem;
    letter-spacing: 0.16em;
  }
}


/* ------------------------------------------------------------
   7. FONTE BASE
   ------------------------------------------------------------
   O CSS do redesign nunca declara font-family no <body>. Os
   titulos e o menu tem fonte propria, mas o texto corrido caia
   no serifado por omissao do browser (Times New Roman).

   Medido em 2026-08-01, tanto em localhost como em producao:
       getComputedStyle(document.body).fontFamily -> "Times New Roman"

   Poppins ja e carregada pelo layout a partir do Google Fonts.
   ------------------------------------------------------------ */
body {
  font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}


/* ------------------------------------------------------------
   8. UMA SO FAMILIA TIPOGRAFICA: POPPINS
   ------------------------------------------------------------
   Decisao do cliente em 2026-08-02.

   O site.min.css declarava 'Cormorant Garamond' (serifada) em
   tres seletores. Passam todos a Poppins, para o site ter uma
   unica familia do topo ao rodape.

   O _LayoutNovo.cshtml deixou de carregar Cormorant Garamond,
   Montserrat e Great Vibes — as duas ultimas nunca chegaram a
   ser usadas em regra nenhuma, eram dois downloads por visita
   para nada.

   Nota sobre a regra do body no site.min.css:

       body { * { font-family:'Poppins', sans-serif; } }

   Isto e aninhamento de CSS. O "*" apanha os FILHOS do body,
   nao o body. Era por isso que o texto solto caia em
   Times New Roman. O ponto 7 acima corrige-o.
   ------------------------------------------------------------ */
.gc-story-card__num,
.gc-story-card__title,
.gc-stories__cta p {
  font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}


/* ------------------------------------------------------------
   9. BARRA DE ORDENACAO DOS RESULTADOS
   ------------------------------------------------------------
   O #services-order-by vinha estilizado pelo style.css antigo,
   que o _searchResults.cshtml carregava dentro do <body>. Essa
   folha foi removida (punha o site todo em Roboto), por isso o
   seletor precisa de estilo proprio.

   O id NAO pode mudar — o JavaScript da ordenacao le-o.
   ------------------------------------------------------------ */
.gc-results {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 2rem 4rem;
}

.gc-results-bar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 2rem;
}

#services-order-by.date-select {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 1px solid rgba(200, 168, 86, 0.35);
  color: #c8a856;
  font-family: inherit;
  font-size: 0.62rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 0.7rem 2.4rem 0.7rem 1.2rem;
  cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, #c8a856 50%),
                    linear-gradient(135deg, #c8a856 50%, transparent 50%);
  background-position: calc(100% - 18px) 52%, calc(100% - 13px) 52%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  transition: border-color 0.3s;
}

#services-order-by.date-select:hover { border-color: #c8a856; }
#services-order-by.date-select option { background: #0a0a0a; color: #f0ece4; }

@media (max-width: 640px) {
  .gc-results { padding: 0 1rem 3rem; }
  .gc-results-bar { justify-content: stretch; }
  #services-order-by.date-select { width: 100%; }
}


/* ------------------------------------------------------------
   10. TIPOLOGIA — radios com aspeto de pill
   ------------------------------------------------------------
   O _menuSearch.cshtml voltou a usar a estrutura original:

       .room-filter-pagi > .bf-item > input[type=radio] + label

   E o que o site.min.js sabe ler. A versao redesenhada usava
   <button class="tipo-pill" data-tipo="T1">, que o JS desconhece
   por completo — a pesquisa por tipologia nao filtrava nada.

   Aqui o radio e escondido e o <label> recebe o aspeto de pill.
   O comportamento fica igual ao original; muda so a pintura.
   ------------------------------------------------------------ */
.room-filter-pagi {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.room-filter-pagi .bf-item {
  position: relative;
  margin: 0;
}

/* escondido mas ainda focavel pelo teclado */
.room-filter-pagi input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}

.room-filter-pagi label {
  display: inline-block;
  margin: 0;
  padding: 0.6rem 1.05rem;
  border: 1px solid rgba(200, 168, 86, 0.3);
  color: #c8a856;
  font-size: 0.6rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1;
  cursor: pointer;
  user-select: none;
  transition: background 0.25s, color 0.25s, border-color 0.25s;
}

.room-filter-pagi label:hover {
  border-color: #c8a856;
  background: rgba(200, 168, 86, 0.1);
}

/* seleccionado */
.room-filter-pagi input[type="radio"]:checked + label {
  background: #c8a856;
  border-color: #c8a856;
  color: #0a0a0a;
}

/* acessibilidade: contorno visivel ao navegar por teclado */
.room-filter-pagi input[type="radio"]:focus-visible + label {
  outline: 2px solid #c8a856;
  outline-offset: 2px;
}


/* ------------------------------------------------------------
   11. DROPDOWNS "nice-select" NO TEMA ESCURO
   ------------------------------------------------------------
   O jquery.nice-select.min.js (carregado pelo layout, herdado de
   producao) substitui cada <select> por:

       <div class="nice-select"><span class="current">…</span>
         <ul class="list"><li class="option">…</li></ul></div>

   e esconde o <select> original com display:none. O JS da pesquisa
   continua a ler o <select> escondido, por isso o mecanismo esta
   correto — o que faltava era pintura.

   As regras que o estilizavam viviam no style.css antigo, que o
   _searchResults.cshtml injetava no <body>. Ao remover essa folha
   (punha o site todo em Roboto), os dropdowns passaram a aparecer
   como listas com marcadores. Medido em /comprar-casa a 2026-08-02:
   4 .nice-select criados, nice-select.css ausente.

   Aqui vao no tema escuro e dourado do site, em vez de se trazer
   de volta a folha antiga inteira.
   ------------------------------------------------------------ */
.nice-select {
  position: relative;
  display: block;
  width: 100%;
  box-sizing: border-box;
  background: transparent;
  border: 1px solid rgba(200, 168, 86, 0.3);
  color: #f0ece4;
  font-family: inherit;
  font-size: 0.74rem;
  line-height: 1.2;
  padding: 0.78rem 2.2rem 0.78rem 1rem;
  cursor: pointer;
  outline: none;
  user-select: none;
  transition: border-color 0.25s;
}

.nice-select:hover,
.nice-select.open { border-color: #c8a856; }

/* seta */
.nice-select::after {
  content: '';
  position: absolute;
  right: 15px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1px solid #c8a856;
  border-bottom: 1px solid #c8a856;
  transform: translateY(-70%) rotate(45deg);
  transition: transform 0.25s;
  pointer-events: none;
}
.nice-select.open::after { transform: translateY(-30%) rotate(-135deg); }

.nice-select .current {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* o painel de opcoes */
.nice-select .list {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  margin: 0;
  padding: 0.3rem 0;
  list-style: none;          /* mata os marcadores que apareciam */
  background: #111111;
  border: 1px solid rgba(200, 168, 86, 0.25);
  max-height: 300px;
  overflow-y: auto;
  z-index: 1200;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.6);
}

.nice-select.open .list {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.nice-select .option {
  list-style: none;
  display: block;
  margin: 0;
  padding: 0.58rem 1rem;
  font-size: 0.74rem;
  color: #b9b4ab;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.nice-select .option::marker { content: none; }

.nice-select .option:hover,
.nice-select .option.focus,
.nice-select .option.selected.focus {
  background: rgba(200, 168, 86, 0.14);
  color: #f0ece4;
}

.nice-select .option.selected { color: #c8a856; font-weight: 500; }
.nice-select .option.disabled { color: #5a5a5a; cursor: default; background: none; }

/* barra de scroll discreta dentro do painel */
.nice-select .list::-webkit-scrollbar { width: 6px; }
.nice-select .list::-webkit-scrollbar-track { background: #0a0a0a; }
.nice-select .list::-webkit-scrollbar-thumb { background: rgba(200, 168, 86, 0.35); }

/* ============================================================
   12. ESTADO VAZIO DA PESQUISA
   Mostrado pelo _searchResults.cshtml quando a pesquisa
   devolve zero imoveis. Antes a area ficava em branco.
   ============================================================ */
.gc-empty{
  text-align:center;
  padding:5rem 1.5rem;
  max-width:520px;
  margin:0 auto;
}
.gc-empty__icon{
  font-size:3rem;
  line-height:1;
  color:#c8a856;
  opacity:.55;
  margin-bottom:1.4rem;
}
.gc-empty__title{
  font-family:'Poppins',sans-serif;
  font-size:1.15rem;
  font-weight:600;
  letter-spacing:.04em;
  color:#f2f2f2;
  margin:0 0 .9rem;
}
.gc-empty__text{
  font-family:'Poppins',sans-serif;
  font-size:.85rem;
  font-weight:300;
  line-height:1.75;
  color:rgba(242,242,242,.62);
  margin:0 0 2rem;
}
.gc-empty__btn{
  display:inline-block;
  padding:.85rem 2.1rem;
  border:1px solid #c8a856;
  color:#c8a856;
  background:transparent;
  font-family:'Poppins',sans-serif;
  font-size:.6rem;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
  transition:background-color .25s ease,color .25s ease;
}
.gc-empty__btn:hover,
.gc-empty__btn:focus{
  background:#c8a856;
  color:#0a0a0a;
  text-decoration:none;
}

/* ============================================================
   13. PAGINA CREDITO
   Classes usadas pelo Simulator.cshtml que nao existem no
   site-novo.min.css. Tudo o resto da pagina (o simulador,
   os cartoes, o FAQ, o formulario) reutiliza classes que ja
   la estavam.
   ============================================================ */

/* texto dos 3 cartoes "Como funciona" — o CSS novo so tinha
   .bh-card-list (lista); estes cartoes levam paragrafo */
.bh-card-text{
  font-family:'Poppins',sans-serif;
  font-size:.8rem;
  font-weight:300;
  line-height:1.9;
  color:rgba(242,242,242,.6);
  margin:1rem 0 0;
}

/* lista de argumentos com visto dourado */
.cred-vantagens{
  list-style:none;
  padding:0;
  margin:2.5rem auto 0;
  max-width:560px;
  text-align:left;
}
.cred-vantagens li{
  position:relative;
  padding:.75rem 0 .75rem 2rem;
  font-family:'Poppins',sans-serif;
  font-size:.85rem;
  font-weight:300;
  color:rgba(242,242,242,.75);
  border-bottom:1px solid rgba(200,168,86,.12);
}
.cred-vantagens li:last-child{border-bottom:none}
.cred-vantagens li::before{
  content:"\2713";
  position:absolute;
  left:0;
  top:.75rem;
  color:#c8a856;
  font-size:.9rem;
}

/* faixa dos parceiros bancarios */
.cred-parceiros{margin-top:3.5rem;text-align:center}
.cred-parceiros-label{
  display:block;
  font-family:'Poppins',sans-serif;
  font-size:.56rem;
  font-weight:600;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:#c8a856;
  margin-bottom:1.6rem;
}
.cred-parceiros-logos{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:3rem;
  flex-wrap:wrap;
}
.cred-parceiros-logos img{
  height:auto;
  max-width:180px;
  opacity:.75;
  filter:grayscale(1);
  transition:opacity .25s ease,filter .25s ease;
}
.cred-parceiros-logos img:hover{opacity:1;filter:grayscale(0)}

/* aviso legal junto ao formulario */
.cred-legal{
  margin-top:2.2rem;
  font-family:'Poppins',sans-serif;
  font-size:.62rem;
  font-weight:300;
  line-height:1.9;
  color:rgba(242,242,242,.38);
}

@media (max-width:700px){
  .cred-parceiros-logos{gap:1.8rem}
  .cred-parceiros-logos img{max-width:130px}
}

/* ============================================================
   14. PAGINA SOBRE NOS
   Classes proprias do SobreNos.cshtml. Tudo o resto da pagina
   (hero, .cards-grid, #sobre, .counters, .gc-stories) reutiliza
   o que ja existe no site-novo.min.css.
   ============================================================ */

/* a grelha de cartoes do CSS novo e de 3 colunas; aqui sao 2 */
.cards-grid--2{grid-template-columns:repeat(2,1fr)}
@media (max-width:900px){ .cards-grid--2{grid-template-columns:1fr} }

/* botao dentro dos cartoes de servico */
.sn-card-btn{margin-top:1.6rem;display:inline-block}

/* ---- Processo imobiliario ---- */
.sn-processo{padding:7rem 4rem;background:var(--dark,#0f0f0f)}
.sn-processo__inner{
  max-width:1300px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5rem;
  align-items:center;
}
.sn-processo__lead{
  font-family:'Poppins',sans-serif;
  font-size:.86rem;
  font-weight:300;
  line-height:2;
  color:rgba(242,242,242,.62);
  margin:2rem 0 0;
  max-width:520px;
}
.sn-pontos{list-style:none;padding:0;margin:2.5rem 0 0}
.sn-pontos li{
  position:relative;
  padding:.85rem 0 .85rem 2.2rem;
  font-family:'Poppins',sans-serif;
  font-size:1rem;
  font-weight:400;
  color:#f2f2f2;
  border-bottom:1px solid rgba(200,168,86,.12);
}
.sn-pontos li:last-child{border-bottom:none}
.sn-pontos li::before{
  content:"\279A";
  position:absolute;left:0;top:.8rem;
  color:#c8a856;font-size:1rem;
}
.sn-processo__img img{width:100%;height:auto;display:block}
@media (max-width:900px){
  .sn-processo{padding:4rem 1.5rem}
  .sn-processo__inner{grid-template-columns:1fr;gap:3rem}
}

/* ---- Testemunhos (versao estatica, 2 cartoes) ----
   O .tcard do CSS novo esta preso ao #testemunhos e ao carrossel.
   Estes sao independentes.                                        */
.sn-test-section{padding:7rem 4rem;background:var(--black,#0a0a0a)}
.sn-test-inner{max-width:1100px;margin:0 auto}
.sn-test-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:1.5rem;
}
.sn-tcard{
  background:#111111;
  border:1px solid rgba(200,168,86,.16);
  padding:2.5rem;
  display:flex;
  flex-direction:column;
}
.sn-t-stars{color:#c8a856;letter-spacing:.25em;font-size:.85rem;margin-bottom:1.4rem}
.sn-t-text{
  font-family:'Poppins',sans-serif;
  font-size:.85rem;
  font-weight:300;
  line-height:2;
  color:rgba(242,242,242,.72);
  margin:0 0 2rem;
  flex:1;
}
.sn-t-hl{color:#c8a856}
.sn-t-author{display:flex;align-items:center;gap:1rem;border-top:1px solid rgba(200,168,86,.12);padding-top:1.5rem}
.sn-t-author img{width:56px;height:56px;object-fit:cover;border-radius:50%;flex-shrink:0}
.sn-t-name{
  font-family:'Poppins',sans-serif;
  font-size:.85rem;font-weight:600;color:#f2f2f2;
}
.sn-t-role{
  font-family:'Poppins',sans-serif;
  font-size:.66rem;font-weight:300;color:rgba(242,242,242,.45);margin-top:.2rem;
}
.sn-test-cta{text-align:center;margin-top:3.5rem}
@media (max-width:900px){
  .sn-test-section{padding:4rem 1.5rem}
  .sn-tcard{padding:1.8rem}
}

/* ---- A equipa (secao propria; ver comentario no SobreNos.cshtml) ---- */
.sn-equipa{padding:7rem 4rem;background:var(--dark,#0f0f0f)}
.sn-equipa__inner{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);
  gap:5rem;align-items:center;
}
.sn-equipa__foto{position:relative;padding:0 0 1.5rem 1.5rem}
.sn-equipa__foto img{
  display:block;width:100%;height:auto;
  aspect-ratio:449/756;object-fit:cover;object-position:center top;
  border:1px solid rgba(200,168,86,.18);
}
/* assinatura ancorada ao FUNDO da foto, nao a um top fixo */
.sn-equipa__assinatura{
  position:absolute;right:1rem;bottom:2.6rem;
  font-family:'Poppins',sans-serif;font-size:1.5rem;font-weight:300;font-style:italic;
  color:#f2cf63;text-shadow:0 2px 10px rgba(0,0,0,.55);
  pointer-events:none;
}
/* selo dentro do padding do wrapper — nao sai da janela */
.sn-equipa__selo{
  position:absolute;left:0;bottom:0;
  background:#c8a856;color:#0a0a0a;
  padding:1.1rem 1.5rem;text-align:center;line-height:1;
}
.sn-equipa__selo-num{display:block;font-family:'Poppins',sans-serif;font-size:1.6rem;font-weight:600}
.sn-equipa__selo-lbl{
  display:block;margin-top:.35rem;
  font-family:'Poppins',sans-serif;font-size:.52rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;
}
.sn-equipa__cargo{
  font-family:'Poppins',sans-serif;font-size:.6rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:#c8a856;
  margin:1.6rem 0 1.8rem;
}
.sn-equipa__body{
  font-family:'Poppins',sans-serif;font-size:.86rem;font-weight:300;
  line-height:2;color:rgba(242,242,242,.66);margin:0 0 1.2rem;max-width:560px;
}
.sn-counters{
  display:grid;grid-template-columns:repeat(3,1fr);
  border:1px solid rgba(200,168,86,.18);margin-top:3rem;
}
.sn-cnt{padding:1.8rem 1.2rem;text-align:center;border-right:1px solid rgba(200,168,86,.18)}
.sn-cnt:last-child{border-right:none}
.sn-counters .cnt-num{
  font-family:'Poppins',sans-serif;font-size:1.9rem;font-weight:300;color:#c8a856;line-height:1;
}
.sn-cnt-lbl{
  margin-top:.7rem;font-family:'Poppins',sans-serif;font-size:.56rem;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:rgba(242,242,242,.5);
}
@media (max-width:900px){
  .sn-equipa{padding:4rem 1.5rem}
  .sn-equipa__inner{grid-template-columns:1fr;gap:3rem}
  .sn-counters{grid-template-columns:1fr}
  .sn-cnt{border-right:none;border-bottom:1px solid rgba(200,168,86,.18)}
  .sn-cnt:last-child{border-bottom:none}
}

/* ============================================================
   15. SOBRE NOS — faixa de numeros (#stats)

   O site-novo.min.css define .stat-item TRES vezes. A ultima
   declaracao a aparecer no ficheiro e "padding: 0 2rem", e e
   essa que ganha na cascata — as celulas ficam sem altura e os
   numeros colados ao topo. Medido em 2026-08-02.

   Aqui a regra e reposta com #stats a frente, que tem mais
   especificidade (1,0,1) do que .stat-item (0,1,0), e este
   ficheiro carrega depois do site-novo.min.css.
   ============================================================ */
#stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
  padding:6rem 4rem;
  /* a cor de fundo da grelha e o que se ve nas linhas do gap */
  background-color:rgba(200,168,86,.18);
}
#stats .stat-item{
  background:#0a0a0a;
  padding:3.2rem 1.5rem;
  text-align:center;
  border-right:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:180px;
}
#stats .stat-num{
  font-family:'Poppins',sans-serif;
  font-size:3rem;
  font-weight:300;
  color:#c8a856;
  line-height:1;
  margin:0;
}
#stats .stat-label{
  font-family:'Poppins',sans-serif;
  font-size:.6rem;
  font-weight:500;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:rgba(242,242,242,.5);
  margin:1.1rem 0 0;
}
@media (max-width:900px){
  #stats{grid-template-columns:1fr 1fr;padding:3rem 1.5rem}
  #stats .stat-item{padding:2.2rem 1rem;min-height:140px}
  #stats .stat-num{font-size:2.2rem}
}

/* ============================================================
   16. PAGINA CONTACTOS — formulario

   O redesign da pagina Contactos usa uma familia de classes
   .c-form-* que NAO existe no site-novo.min.css. Medido em
   2026-08-03: 13 classes sem uma unica regra, entre elas
   .c-form-input (16 utilizacoes) e .c-form-label (19).
   Resultado: o formulario aparecia com as caixas brancas por
   omissao do browser e as etiquetas em linha.

   As regras abaixo seguem as do formulario da pagina Vender
   (.vyh-*), que ja estava desenhado, para os dois ficarem iguais.
   ============================================================ */

.c-form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
  margin-bottom:1rem;
}
.c-form-field{
  display:flex;
  flex-direction:column;
  gap:.5rem;
  margin-bottom:1rem;
}
.c-form-label{
  font-family:'Poppins',sans-serif;
  font-size:.58rem;
  font-weight:500;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:rgba(242,242,242,.5);
}
.c-form-input,
.c-form-select{
  width:100%;
  background:#0f0f0f;
  border:1px solid rgba(200,168,86,.18);
  color:#f2f2f2;
  padding:.9rem 1rem;
  font-family:'Poppins',sans-serif;
  font-size:.82rem;
  font-weight:300;
  outline:none;
  transition:border-color .2s ease;
}
.c-form-input::placeholder{color:rgba(242,242,242,.28)}
.c-form-input:focus,
.c-form-select:focus{border-color:#c8a856}
textarea.c-form-input{min-height:130px;resize:vertical}
.c-form-select{
  appearance:none;
  cursor:pointer;
  /* seta desenhada em SVG, para nao depender de imagem nenhuma */
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23c8a856' stroke-width='1.4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 1rem center;
  padding-right:2.6rem;
}
.c-form-select option{background:#111111;color:#f2f2f2}

/*  Consentimento: o markup tem .c-form-check no <div> E no
    <input>. A regra de flex so pode valer para o <div>.  */
div.c-form-check{
  display:flex;
  align-items:flex-start;
  gap:.8rem;
  margin:1.5rem 0;
}
input.c-form-check{
  width:16px;height:16px;
  margin-top:.15rem;
  flex-shrink:0;
  accent-color:#c8a856;
  cursor:pointer;
}
.c-form-check-label{
  font-family:'Poppins',sans-serif;
  font-size:.72rem;
  font-weight:300;
  line-height:1.7;
  color:rgba(242,242,242,.6);
}
.c-form-check-label a{color:#c8a856;text-decoration:underline}

.recaptcha-wrap{margin:1.2rem 0}

.c-form-submit{
  width:100%;
  background:#c8a856;
  color:#0a0a0a;
  border:none;
  padding:1.1rem;
  font-family:'Poppins',sans-serif;
  font-size:.62rem;
  font-weight:600;
  letter-spacing:.25em;
  text-transform:uppercase;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  transition:background-color .3s ease,color .3s ease;
}
.c-form-submit:hover{background:#f2cf63}

/*  Mensagens de estado. O site.min.js mostra-as com .show() do
    jQuery, que repoe display:block — por isso basta escondê-las
    por omissao no markup; aqui so se lhes da forma.  */
#formContact .alert{
  padding:1rem 1.2rem;
  margin-bottom:1.2rem;
  font-family:'Poppins',sans-serif;
  font-size:.78rem;
  font-weight:300;
  line-height:1.6;
  border:1px solid rgba(200,168,86,.3);
  background:rgba(200,168,86,.08);
  color:#f2f2f2;
}
#formContact #errorMsg{
  border-color:rgba(224,85,85,.4);
  background:rgba(224,85,85,.08);
  color:#e9a0a0;
}

/*  etiqueta das barras de estatistica desta pagina  */
.stat-bar-label{
  font-family:'Poppins',sans-serif;
  font-size:.6rem;
  font-weight:500;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(242,242,242,.5);
}

@media (max-width:700px){
  .c-form-row{grid-template-columns:1fr;gap:0}
}

/* ============================================================
   17. FAQ — separador de categoria ativo

   O site-novo.min.css define .cat-tab mas NAO define
   .cat-tab.active — o separador escolhido ficava igual aos
   outros e nao se percebia em que categoria se estava.
   (.sidebar-link.active ja existia e esta correto.)
   ============================================================ */
.cat-tab.active{
  color:#c8a856;
  border-bottom-color:#c8a856;
}
.cat-tab{background:none;border-top:none;border-left:none;border-right:none;font-family:'Poppins',sans-serif;font-weight:600}

/* ============================================================
   18. FAQ — largura do formulario "Faca a sua pergunta"

   O site-novo.min.css define .form-inner TRES vezes. A primeira
   monta a grelha de duas colunas com max-width:1100px; a ultima
   a aparecer no ficheiro poe max-width:700px e NAO redefine as
   colunas. Ganha a ultima no max-width e a primeira nas colunas
   — e as duas colunas ficam espremidas em 700px.

   Medido em 2026-08-03: .form-box com 315px e cada campo do
   .form-row com 101px ("O seu nome" aparecia cortado).

   Corrige-se apenas nesta pagina, pela seccao #pergunta, para
   nao mexer nos formularios das outras.
   ============================================================ */
#pergunta .form-inner{
  max-width:1100px;
  grid-template-columns:1fr 1.2fr;
  gap:5rem;
  align-items:start;
}
@media (max-width:900px){
  #pergunta .form-inner{grid-template-columns:1fr;gap:3rem}
  #pergunta .form-row{grid-template-columns:1fr;gap:0}
}

/* ============================================================
   19. PAGINA DE DETALHE DO IMOVEL — texto legivel

   A pagina nova reutiliza tres parciais antigas, escritas para o
   site claro. Lidas em 2026-08-03, o que trazem:

     _properties          -> <table class="property-table table">
                             e <div class="name-property">
     _propertyContactForm -> um modal Bootstrap com #formPropertyContact,
                             .form-control e .input-group-text
     _shareProperty       -> outro modal Bootstrap

   O culpado principal e o .table do Bootstrap, que define
   color:#212529 — cinzento quase preto sobre fundo preto. Dai a
   ficha tecnica do imovel nao se ver.

   Corrige-se por classe, sem !important onde nao e preciso.
   ============================================================ */

/* --- ficha tecnica (parcial _properties) ---

   Cada <td> traz, seguidos e sem estrutura:
       Label  +  <span class="name-property">Name</span>  +  <i class="icon ...">

   O Label e um no de texto solto, sem elemento proprio — por isso
   estiliza-se no <td> e desfaz-se depois no .name-property.
   Fica: etiqueta pequena em maiusculas por cima, valor grande por
   baixo, uma celula por caracteristica.

   Os <i class="icon ... flaticon-xxx"> ficam escondidos: a fonte
   dos icones (flaticon.css) nao e carregada pelo _LayoutNovo e o
   browser substituia-os por emojis. Para os ter de volta bastaria
   acrescentar o flaticon.css ao layout.
   --------------------------------------------------------------- */
.property-table{width:100%}
.property-table table{
  width:100%;
  border-collapse:collapse;
  margin:0;
}
.property-table td{
  width:33.333%;
  padding:1.3rem 1.4rem;
  vertical-align:top;
  border:1px solid rgba(200,168,86,.12);
  background:transparent;
  /* isto estiliza o Label, que e texto solto dentro do <td> */
  font-family:'Poppins',sans-serif;
  font-size:.56rem;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(242,242,242,.45);
  line-height:1.4;
}
.property-table td:empty{border-color:transparent}

/* o valor: desfaz o que foi posto no <td> */
.property-table .name-property,
.name-property{
  display:block;
  margin-top:.55rem;
  font-family:'Poppins',sans-serif;
  font-size:1rem;
  font-weight:300;
  letter-spacing:0;
  text-transform:none;
  color:#ffffff;
}

/*  Icones da ficha tecnica.
    O _LayoutNovo passou a carregar o flaticon.css (2026-08-03),
    por isso os <i class="flaticon-..."> ja desenham o simbolo
    certo em vez de um emoji. Ficam a dourado, alinhados com a
    etiqueta, sem o fundo vermelho que o tema antigo lhes dava
    atraves do bg-gradient-danger.  */
.property-table .icon,
.popular-room-features .icon{
  display:inline-block;
  float:right;
  width:auto;height:auto;
  margin:0;
  background:none;
  box-shadow:none;
  color:#c8a856;
  opacity:.85;
  line-height:1;
}
.property-table .icon:before,
.popular-room-features .icon:before{font-size:22px}

@media (max-width:700px){
  .property-table td{display:block;width:100%}
  .property-table td:empty{display:none}
}

/* --- descricao vinda da base de dados ---
   Este HTML costuma trazer style="color:..." dentro do proprio
   texto; so o !important o alcanca. Os links ficam dourados.  */
.prop-description-body,
.prop-description-body *{color:#ffffff !important}
.prop-description-body a{color:#c8a856 !important}

/* --- modais: contacto do imovel e partilha --- */
#formPropertyContact .modal-content,
.shared-property .modal-content,
.modal-content{
  background:#111111;
  border:1px solid rgba(200,168,86,.2);
  color:#ffffff;
}
.modal-header,
.modal-body,
.modal-title{
  color:#ffffff;
  border-color:rgba(200,168,86,.14);
}
.modal-header .close{color:#c8a856;opacity:1;text-shadow:none}

#formPropertyContact .form-control,
.modal-content .form-control{
  background:#0f0f0f;
  border:1px solid rgba(200,168,86,.18);
  color:#ffffff;
}
#formPropertyContact .form-control::placeholder,
.modal-content .form-control::placeholder{color:rgba(242,242,242,.3)}
#formPropertyContact .form-control:focus,
.modal-content .form-control:focus{
  border-color:#c8a856;
  box-shadow:none;
  background:#0f0f0f;
  color:#ffffff;
}
.input-group-text{
  background:#161616;
  border:1px solid rgba(200,168,86,.18);
  color:#c8a856;
}
/*  os icones do formulario vinham .text-info (azul)  */
.modal-content .text-info{color:#c8a856 !important}

/*  botao de submeter do formulario do imovel  */
#btnContact,
.btn-submit .btn{
  background:#c8a856;
  border-color:#c8a856;
  color:#0a0a0a;
  font-family:'Poppins',sans-serif;
  font-size:.62rem;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
}
#btnContact:hover,
.btn-submit .btn:hover{background:#f2cf63;border-color:#f2cf63;color:#0a0a0a}

/*  botoes de partilha  */
.shared-property .btn-outline-dark{
  border-color:rgba(200,168,86,.3);
  color:#ffffff;
}

/* ============================================================
   20. GALERIA DO IMOVEL — sem a moldura do flexslider

   O flexslider.css traz, por omissao:
       .flexslider{background:#fff;border:4px solid #fff;
                   border-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,.2)}
   Sobre o fundo escuro isso desenha uma moldura branca a toda a
   volta das fotos. Aqui e tudo posto a zero.
   ============================================================ */
.flexslider,
.slider .flexslider{
  background:transparent;
  border:none;
  border-radius:0;
  box-shadow:none;
  margin-bottom:0;
}
.flexslider .slides img{
  border:none;
  border-radius:0;
  display:block;
  width:100%;
  height:auto;
}
/*  as miniaturas do carrossel tambem herdavam a moldura  */
.flex-control-thumbs img{border:none;border-radius:0}
.flex-viewport{border:none;background:transparent}

/* ============================================================
   21. CABECALHO DO IMOVEL — layout 1c

   Estilos do cabecalho da pagina de detalhe. Vieram do mock do
   Victor; a unica alteracao e o white-space do titulo, trocado
   por text-wrap:balance — com nowrap os titulos mais compridos
   da base de dados saiam fora da caixa.

   Uma so familia tipografica: herda a do corpo (Poppins). A
   hierarquia faz-se por peso, tamanho e letter-spacing.
   ============================================================ */
.imovel-heading{
  background:#111110;
  border:1px solid #232323;
  border-radius:4px;
  padding:56px 56px 52px;
  /* 8rem de folga no topo: a navbar e fixa e esta pagina nao tem
     hero, por isso o cabecalho comecava por baixo do logotipo */
  margin:8rem 4rem 3rem;
  font-family:inherit;
  color:#f2efe9;
}

/* --- breadcrumb --- */
/*  as tres primeiras linhas sao defesas: se alguma regra global
    para nav/header voltar a apanhar este bloco, ele fica na mesma
    dentro do cabecalho e nao colado ao topo da janela  */
.ih-crumbs{
  position:static;
  width:auto;
  background:none;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:9px;
  font-size:12.5px;
  color:#7d7669;
  margin:22px 0 0;
  flex-wrap:wrap;
}
.ih-crumbs a{color:#a9a19a;text-decoration:none;transition:color .2s ease}
.ih-crumbs a:hover{color:#e0bd6a}
.ih-sep{color:#4a463f}
.ih-current{color:#c9a24a}

/* --- titulo --- */
/*  grelha de duas colunas: titulo a esquerda, cartao a direita  */
.ih-body{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:3.5rem;
  align-items:end;
}
.ih-titleblock{max-width:900px;margin:0}
.ih-badge{display:inline-flex;align-items:center;gap:11px;margin-bottom:22px}
.ih-badge-text{font-size:10.5px;font-weight:700;letter-spacing:.26em;color:#c9a24a;text-transform:uppercase}
.ih-badge-rule{width:22px;height:1px;background:#4b3d1c}

.ih-title{
  font-size:34px;
  font-weight:500;
  line-height:1.2;
  letter-spacing:-.018em;
  color:#f7f5f0;
  margin:0 0 20px;
  /* o mock tinha white-space:nowrap; ver comentario no topo */
  text-wrap:balance;
}
.ih-title-accent{font-weight:600;color:#c9a24a}
.ih-location{font-size:15.5px;color:#a9a19a}

/* --- cartao de preco --- */
.ih-cardwrap{display:flex;justify-content:flex-end}
.ih-card{
  display:flex;
  align-items:stretch;
  background:#0b0b0b;
  border:1px solid #2c2519;
  border-radius:4px;
  overflow:hidden;
}
.ih-cell{padding:18px 28px;display:flex;flex-direction:column;justify-content:center;gap:6px}
.ih-divider{width:1px;background:#2c2519}
.ih-label{font-size:9.5px;font-weight:700;letter-spacing:.22em;color:#7d7669;text-transform:uppercase}

.ih-price{display:flex;align-items:baseline;gap:5px}
.ih-price-value{
  font-size:30px;font-weight:600;line-height:1;letter-spacing:-.025em;
  color:#f7f5f0;font-variant-numeric:tabular-nums;
}
/* "Sob consulta" nao e numero: mesmo tamanho, peso mais leve */
.ih-price-text{font-weight:500;letter-spacing:0}
.ih-price-currency{font-size:19px;font-weight:500;color:#c9a24a}
.ih-ref{font-size:18px;font-weight:500;color:#fff;font-variant-numeric:tabular-nums}

.ih-action{
  display:flex;align-items:center;padding:0 26px;
  background:#c9a24a;color:#0b0b0b;text-decoration:none;
  font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  cursor:pointer;
  transition:background .18s ease;
}
.ih-action:hover,
.ih-action:focus{background:#e0bd6a;color:#0b0b0b;text-decoration:none}

@media (max-width:900px){
  .imovel-heading{padding:28px 20px;margin:0 1.5rem 2rem}
  .imovel-heading{margin-top:6rem}
  .ih-crumbs{margin-top:18px}
  .ih-title{font-size:26px;text-wrap:normal}
  .ih-body{grid-template-columns:1fr;gap:2rem}
  .ih-cardwrap{justify-content:flex-start}
  .ih-card{flex-direction:column}
  .ih-divider{width:100%;height:1px}
  .ih-action{padding:16px;justify-content:center}
}

/* ============================================================
   22. DESCRICAO DO IMOVEL — "Ver mais"

   A caixa da descricao usa o collapse do Bootstrap:
       <div class="collapse prop-description-body" id="...">
       <button class="prop-description-toggle">
         <a class="collapsed aref" data-toggle="collapse" data-target="#...">

   O _LayoutNovo carrega o bootstrap.min.js mas NAO o bootstrap.css.
   Sem o CSS, o .collapse nao esconde nada: a descricao aparecia
   sempre aberta e o "Ver mais" nao tinha efeito visivel.

   Aqui repoe-se so o comportamento do collapse, e so nesta caixa
   — carregar o Bootstrap inteiro colidiria com o design novo.
   ============================================================ */
/*  Fechada NAO quer dizer escondida: entra com cerca de dois
    paragrafos a vista e o resto cortado, com um esbatimento
    para o fundo da caixa (--card e #161616).
    O .show tira o limite; o .collapsing e a fase de animacao
    do Bootstrap, que mexe na altura por style inline.  */
.prop-description-body.collapse{
  display:block;
  max-height:11.5em;      /* ~2 paragrafos */
  overflow:hidden;
  position:relative;
}
.prop-description-body.collapse:not(.show)::after{
  content:'';
  position:absolute;
  left:0;right:0;bottom:0;
  height:4.5em;
  background:linear-gradient(rgba(22,22,22,0), #161616);
  pointer-events:none;
}
.prop-description-body.collapse.show{max-height:none}
.prop-description-body.collapsing{
  display:block;
  max-height:none;
  overflow:hidden;
  transition:height .35s ease;
}

/* --- botao "Ver mais", a dourado --- */
.prop-description-toggle{
  display:inline-block;
  margin-top:1.5rem;
  padding:.85rem 2.1rem;
  background:transparent;
  border:1px solid #c8a856;
  border-radius:0;
  cursor:pointer;
  transition:background-color .25s ease;
}
.prop-description-toggle .aref,
.prop-description-toggle a{
  color:#c8a856;
  text-decoration:none;
  font-family:'Poppins',sans-serif;
  font-size:.6rem;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
  cursor:pointer;
}
.prop-description-toggle:hover{background:#c8a856}
.prop-description-toggle:hover .aref,
.prop-description-toggle:hover a{color:#0a0a0a}

/* ============================================================
   23. TITULOS DAS SECCOES DA PAGINA DE DETALHE

   "Caracteristicas da Propriedade", "Descricao" e "Casas
   Similares" vinham a 0.65rem — pequenos de mais para o peso que
   tem na pagina. Passam a 0.85rem. Tudo o resto (espacamento
   entre letras, maiusculas, cor dourada, tracos) fica igual.
   ============================================================ */
.prop-specs-title,
.prop-description-title,
.similares-title{
  font-size:.85rem;
}

/* ============================================================
   24. CARTOES DE IMOVEL — legibilidade e botao

   Medido no site-novo.min.css, os textos de apoio dos cartoes
   usam --gray, que numa das folhas vale #777. Sobre o cartao
   escuro isso da um contraste baixissimo: a referencia, as
   etiquetas (AREA, TIPOLOGIA, WC, GARAGEM) e o rotulo "Preco"
   quase nao se liam.

   Aqui sobem-se as cores e o botao "Ver imovel" passa a dourado.
   Estas regras valem em todo o site — os cartoes sao os mesmos
   nas listagens, na Home e nos imoveis similares.
   ============================================================ */

/* referencia e tipo de negocio, por cima do titulo */
.prop-ref{color:rgba(242,242,242,.68)}

/* valores e etiquetas da barra de caracteristicas */
.prop-spec-val{color:#ffffff}
.prop-spec-label{color:rgba(242,242,242,.62);font-size:.54rem}

/* rotulo "Preco" / "Renda" por cima do valor */
.prop-price small{color:rgba(242,242,242,.62)}

/* separadores da barra, um pouco mais presentes */
.prop-specs{border-top-color:rgba(200,168,86,.16);border-bottom-color:rgba(200,168,86,.16)}

/* --- botao "Ver imovel" a dourado --- */
.prop-btn{
  background:transparent;
  border:1px solid #c8a856;
  color:#c8a856;
  font-weight:600;
  transition:background-color .25s ease,color .25s ease;
}
.prop-btn:hover,
.prop-btn:focus{
  background:#c8a856;
  color:#0a0a0a;
  border-color:#c8a856;
}

/* --- titulo "Casas Similares" --- */
.similares-title{font-size:1.3rem;letter-spacing:.12em}

/* ============================================================
   25. "AS 4 ETAPAS" — numeros a dourado e texto legivel

   O .step-num usava var(--border) — rgba(255,255,255,.07). E uma
   cor de LINHA, nao de texto: os numeros 01 a 04 ficavam quase
   invisiveis. O .step-text usava --gray-light (#aaa numa das
   folhas), tambem fraco sobre o fundo preto.

   Estas classes sao usadas na pagina de detalhe do imovel e em
   qualquer outra que reutilize o bloco "process-steps".
   ============================================================ */
.step-num{
  color:#c8a856;
  opacity:.55;          /* dourado presente, sem competir com o titulo */
  font-weight:300;
}
.process-step:hover .step-num{opacity:1;transition:opacity .25s ease}

.step-title{color:#ffffff}
.step-text{color:rgba(242,242,242,.72)}

/* a linha que separa as etapas ganha um toque de dourado */
.process-step{border-left-color:rgba(200,168,86,.18)}

/* ============================================================
   26. SECCAO "MAIS CASAS" (sugestoes) na pagina de detalhe

   Substitui o style inline que a seccao tinha, e forca tres
   colunas: sao sempre 3 imoveis, nunca mais.
   ============================================================ */
.sugestoes-section{
  padding:6rem 4rem;
  background:#0a0a0a;
  border-top:1px solid rgba(200,168,86,.14);
}
.sugestoes-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:2rem;
  margin-top:3rem;
}
@media (max-width:1000px){ .sugestoes-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:700px){
  .sugestoes-section{padding:3.5rem 1.5rem}
  .sugestoes-grid{grid-template-columns:1fr}
}

/* ============================================================
   27. POPUP "NOS ENTRAMOS EM CONTACTO CONSIGO"

   A parcial _propertyContactForm e markup Bootstrap 4: usa
   .input-group / .input-group-prepend / .input-group-text,
   .form-check, .btn-block, .btn-info, .close e .alert.

   O _LayoutNovo NAO carrega o bootstrap.css. O .modal ate existe
   no site-novo.min.css, mas nenhuma destas classes existe — por
   isso o icone caia para cima do campo em vez de ficar ao lado,
   os campos ficavam com o aspeto por omissao do browser e o botao
   "Enviar" ficava do tamanho do texto.

   Aqui reescreve-se so o que esta em falta, no visual do site.
   ============================================================ */

/* --- caixa do popup --- */
.modal-dialog{max-width:560px}
.modal-content{background:#111111;border:1px solid rgba(200,168,86,.22)}
.modal-header{
  display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;
  padding:1.6rem 1.8rem;
  border-bottom:1px solid rgba(200,168,86,.14);
}
.modal-title{
  font-family:'Poppins',sans-serif;
  font-size:1rem;font-weight:600;color:#ffffff;margin:0;text-align:left;
}
.modal-header .close{
  background:none;border:none;line-height:1;
  font-size:1.6rem;color:#c8a856;opacity:1;cursor:pointer;padding:0;
}
.modal-header .close:hover{color:#f2cf63}
.modal-body{padding:1.8rem}
.modal-body > p,
#modalBody p{
  font-family:'Poppins',sans-serif;
  font-size:.82rem;font-weight:300;line-height:1.8;
  color:rgba(242,242,242,.7);margin:0 0 1.6rem;
}

/* --- campo com icone ao lado (input-group do Bootstrap) --- */
#formPropertyContact .form-group{margin-bottom:.9rem}
#formPropertyContact .input-group{
  display:flex;
  align-items:stretch;
  width:100%;
}
#formPropertyContact .input-group-prepend{display:flex}
#formPropertyContact .input-group-text{
  display:flex;align-items:center;justify-content:center;
  min-width:46px;
  padding:0 .9rem;
  background:#161616;
  border:1px solid rgba(200,168,86,.18);
  border-right:none;
  color:#c8a856;
}
#formPropertyContact .input-group-text .fa{color:#c8a856}
#formPropertyContact .form-control{
  flex:1 1 auto;
  min-width:0;
  background:#0f0f0f;
  border:1px solid rgba(200,168,86,.18);
  color:#ffffff;
  padding:.85rem 1rem;
  font-family:'Poppins',sans-serif;
  font-size:.82rem;font-weight:300;
  outline:none;
  transition:border-color .2s ease;
}
#formPropertyContact textarea.form-control{min-height:110px;resize:vertical}
#formPropertyContact .form-control::placeholder{color:rgba(242,242,242,.3)}
#formPropertyContact .form-control:focus{border-color:#c8a856}

/* --- consentimento --- */
.privacy-policy-consent{margin:1.2rem 0}
.privacy-policy-consent .form-check{
  display:flex;align-items:flex-start;gap:.7rem;
}
.form-check-input{
  width:16px;height:16px;margin:.15rem 0 0;flex-shrink:0;
  accent-color:#c8a856;cursor:pointer;
}
.form-check-label{
  font-family:'Poppins',sans-serif;
  font-size:.72rem;font-weight:300;line-height:1.6;
  color:rgba(242,242,242,.62);
}
/*  o link tem style="color:#e318d0" no markup da parcial;
    so o !important o tira do cor-de-rosa  */
.form-privacy-policy a{color:#c8a856 !important;text-decoration:underline}

/* --- botao Enviar --- */
.btn-submit{margin-top:1.2rem}
#btnContact{
  display:block;width:100%;
  background:#c8a856;border:1px solid #c8a856;border-radius:0;
  color:#0a0a0a;
  padding:1rem;
  font-family:'Poppins',sans-serif;
  font-size:.62rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  cursor:pointer;
  transition:background-color .25s ease;
}
#btnContact:hover{background:#f2cf63;border-color:#f2cf63;color:#0a0a0a}

/* --- mensagens de estado dentro do popup --- */
.modal-content .alert{
  padding:1rem 1.2rem;margin-bottom:1rem;
  font-family:'Poppins',sans-serif;font-size:.78rem;font-weight:300;line-height:1.6;
  border:1px solid rgba(200,168,86,.3);
  background:rgba(200,168,86,.08);
  color:#f2f2f2;
}
.modal-content .alert-warning{
  border-color:rgba(224,85,85,.4);background:rgba(224,85,85,.08);color:#e9a0a0;
}
.modal-content .alert .close{
  float:right;background:none;border:none;color:inherit;opacity:.7;cursor:pointer;font-size:1.2rem;
}

@media (max-width:600px){
  .modal-dialog{max-width:100%;padding:.5rem}
  .modal-body{padding:1.2rem}
  #formPropertyContact .input-group-text{min-width:40px;padding:0 .6rem}
}

/* ============================================================
   28. BLOG — paginacao por links e estado vazio

   A paginacao passou de botoes AJAX para <a href="/blog/N">.
   As classes .page-btn e .blog-pagination ja existiam no
   blog.min.css para os botoes; aqui garante-se que funcionam
   tambem como links.
   ============================================================ */
.blog-pagination{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:3rem}
.blog-pagination .page-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:42px;height:42px;padding:0 .8rem;
  border:1px solid rgba(200,168,86,.22);
  color:rgba(242,242,242,.7);
  font-family:'Poppins',sans-serif;font-size:.72rem;
  text-decoration:none;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease;
}
.blog-pagination .page-btn:hover{border-color:#c8a856;color:#c8a856}
.blog-pagination .page-btn.active{background:#c8a856;border-color:#c8a856;color:#0a0a0a;font-weight:600}

.sidebar-recent a{text-decoration:none;display:block}
.sidebar-recent a:hover .sidebar-recent-title{color:#c8a856}

.blog-vazio{
  font-family:'Poppins',sans-serif;font-size:.85rem;font-weight:300;
  color:rgba(242,242,242,.6);padding:3rem 0;
}

/* ============================================================
   29. UMA SO FAMILIA TIPOGRAFICA EM TODO O SITE

   Levantadas todas as declaracoes font-family das folhas
   carregadas pelo _LayoutNovo. Alem do Poppins, apareciam:

     blog.min.css      Cormorant Garamond  x6
                       Tangerine, cursive  x5
                       Ubuntu, sans-serif  x2
                       icomoon             x4  (so em ::before)
     site-novo.min.css Cormorant Garamond  x3  (ja tratadas na 8)

   Aqui apanham-se os seletores que faltavam, um a um. Nao se usa
   !important nem um seletor universal: cada regra abaixo tem a
   mesma especificidade da original e este ficheiro carrega
   depois, por isso ganha na cascata.

   O icomoon e o Flaticon NAO sao tocados: sao fontes de icones e
   estao aplicados em ::before, que estas regras nao alcancam.
   ============================================================ */

/* --- blog.min.css: Cormorant Garamond --- */
.blog-featured-title,
.blog-grid-title,
.blog-card-title,
.sidebar-title,
.blog-destaque-card-num,
.blog-destaque-card-title,
/* --- blog.min.css: Tangerine --- */
.site-heading h3,
.article-opinion-section h2,
.box-pop-up h2,
/* --- blog.min.css: Ubuntu --- */
.single-blog-banner-area h3{
  font-family:'Poppins',sans-serif;
}

/*  O "01/02/03" dos cartoes de destaque perde o ar de serifa;
    para nao ficar demasiado pesado, alivia-se o peso.  */
.blog-destaque-card-num{font-weight:300}

/*  Rede de seguranca: qualquer elemento que ainda declare uma
    familia herdada de folhas antigas passa a herdar a do corpo.
    Exclui-se explicitamente quem carrega fontes de icones.  */
.post-full-content,
.post-full-content p,
.post-full-content li,
.post-full-content h1,
.post-full-content h2,
.post-full-content h3,
.post-full-content h4{
  font-family:'Poppins',sans-serif;
}

/* ============================================================
   30. BLOG — barra lateral fixa ao rolar

   Com a caixa da newsletter removida, sobra so os "Artigos
   recentes". Passa a acompanhar o scroll enquanto houver grelha
   de artigos ao lado.

   O top:110px e a altura da navbar fixa mais uma folga; sem isso
   o titulo da caixa ficava escondido por baixo do menu.

   O position:sticky so funciona se o elemento pai NAO tiver
   overflow escondido e se o item da grelha nao estiver esticado —
   dai o align-self:start.
   ============================================================ */
.blog-sidebar{
  position:sticky;
  top:110px;
  align-self:start;
  max-height:calc(100vh - 130px);
  overflow-y:auto;
  /* barra de scroll discreta, se a lista crescer */
  scrollbar-width:thin;
  scrollbar-color:rgba(200,168,86,.35) transparent;
}
.blog-sidebar::-webkit-scrollbar{width:6px}
.blog-sidebar::-webkit-scrollbar-thumb{background:rgba(200,168,86,.35)}
.blog-sidebar::-webkit-scrollbar-track{background:transparent}

/* em ecras baixos ou estreitos nao vale a pena colar nada */
@media (max-width:900px){
  .blog-sidebar{position:static;max-height:none;overflow:visible}
}

/* ============================================================
   31. BLOG — UMA SO FAMILIA, SEM EXCECOES

   A seccao 29 corrige as classes uma a uma, mas o blog.min.css
   tem declaracoes espalhadas por media queries e estados que e
   facil deixar escapar. Como esta pagina NAO usa nenhuma fonte
   de icones — verificado: zero classes fa/flaticon/icomoon no
   markup, os tres icones sao SVG inline — pode-se varrer tudo
   de uma vez sem risco.

   Nota sobre o blog.min.css: cinco regras la dentro tem
       font-family: 'Poppins', sans-serif', sans-serif
   com uma plica a mais. E invalido, e o browser deita a
   declaracao fora. Nao se corrige la para nao mexer numa folha
   partilhada; esta regra cobre o caso.
   ============================================================ */
.blog-hero, .blog-hero *,
.blog-main-section, .blog-main-section *,
.blog-destaque-section, .blog-destaque-section *,
.blog-sidebar, .blog-sidebar *{
  font-family:'Poppins',sans-serif !important;
}

/* ============================================================
   32. BLOG — o cartao sozinho na ultima linha

   O controlador devolve 22 artigos por pagina e a grelha tem 3
   colunas: sobra sempre um sozinho no fim (22 = 7x3 + 1).

   Nao se corta a lista para um multiplo de 3: o artigo cortado
   ficaria inalcancavel, porque a pagina seguinte comeca no 23.

   Em vez disso, quando o ultimo cartao e o unico da sua linha,
   ocupa a largura toda — passa a parecer um destaque de fecho.
   O :nth-child(3n+1) so e verdade para o primeiro de cada linha;
   combinado com :last-child, identifica exatamente o orfao.
   ============================================================ */
.blog-grid > :last-child:nth-child(3n + 1){
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:minmax(0,420px) minmax(0,1fr);
  align-items:stretch;
}
.blog-grid > :last-child:nth-child(3n + 1) .blog-card-img{height:100%}
.blog-grid > :last-child:nth-child(3n + 1) .blog-card-img img{
  width:100%;height:100%;object-fit:cover;
}
.blog-grid > :last-child:nth-child(3n + 1) .blog-card-body{
  display:flex;flex-direction:column;justify-content:center;
}
.blog-grid > :last-child:nth-child(3n + 1) .blog-card-title{
  font-size:1.35rem;
}

/*  Se sobrarem DOIS na ultima linha, alargam-se a meias em vez
    de deixarem um buraco a direita.  */
.blog-grid > :nth-last-child(2):nth-child(3n + 1),
.blog-grid > :nth-last-child(2):nth-child(3n + 1) ~ :last-child{
  grid-column:span 1;
}
.blog-grid > :nth-last-child(2):nth-child(3n + 1){grid-column-start:1}

@media (max-width:900px){
  .blog-grid > :last-child:nth-child(3n + 1){grid-template-columns:1fr}
  .blog-grid > :last-child:nth-child(3n + 1) .blog-card-title{font-size:1.05rem}
}

/* ============================================================
   33. BLOG — numeros dos cartoes de destaque

   O .blog-destaque-card-num vinha praticamente invisivel sobre o
   cartao escuro. Passa a dourado, com o mesmo tratamento que se
   deu aos numeros das "4 etapas" na pagina de detalhe: presente,
   mas sem competir com o titulo do cartao.
   ============================================================ */
.blog-destaque-card-num{
  color:#c8a856;
  opacity:.55;
  font-weight:300;
  transition:opacity .25s ease;
}
.blog-destaque-card:hover .blog-destaque-card-num{opacity:1}

/* os icones a par dos numeros */
.blog-destaque-card-icon{color:#c8a856}

/* ============================================================
   34. BLOG — titulos dos "Artigos recentes" a branco
   ============================================================ */
.sidebar-recent-title{color:#ffffff}
.sidebar-recent a .sidebar-recent-title{color:#ffffff}
.sidebar-recent a:hover .sidebar-recent-title{color:#c8a856}

/* ============================================================
   35. BLOG — titulo da caixa "Artigos recentes" a dourado
   ============================================================ */
.blog-sidebar .sidebar-title{color:#c8a856}