/* =========================================================================== ADMINISTRAÇÃO DE CONDOMÍNIOS — pages/condominios.php --------------------------------------------------------------------------- MEDIDO em 2026-09-22, no print do Sami (janela de ~1520 CSS px, escala 1,25) e na cadeia de CSS do legado (`css/styles.css` sob os dois bootstrap de lá). A PÁGINA DE LÁ É UM EMPILHADO DE QUATRO BLOCOS DO TEMA, e cada classe nossa corresponde a um deles: .condominios ........... #section-body-inner ...... respiro 40 em cima .condominios__topo ..... .houzez-module.module-title respiro 55 em cima .condominios__servicos . .module-title + .houzez-module 40 em cima, 55 no pé .condominios__texto .... .article-detail .......... caixa #fafafa, respiro 40 .condominios__bloco .... .services-module .service-block RÉGUA VERTICAL MEDIDA NO PRINT (topo do cabeçalho = 0): 92 pé do cabeçalho 187 topo do

(92 + 40 do miolo + 55 do bloco de título) 245 topo do subtítulo (187 + 38 de linha + 20 de margem) 369 o fio
(269 + 40 + 40 + 20 de margem do fio) 389 topo do parágrafo (três linhas de 24) 497,6 topo do botão azul (461 + 20 de margem + 15 de respiro) 538,4 pé do botão (41,6 de altura) 554,4 topo dos cartões (15,2 depois do botão) 652 topo dos ícones (97,6 abaixo do topo do cartão) ⚠ A CAIXA DE TEXTO É INVISÍVEL. `.article-detail` pinta #fafafa, que é exatamente o fundo da página — o que se vê é só o fio, o texto e o botão. A cor fica declarada porque é ela que está no ar; se o fundo da página mudar, a caixa aparece, como lá. ⚠ O RESPIRO DE 40 NO PÉ DA PÁGINA NÃO ESTÁ AQUI. O `#section-body-inner` do legado tem 40 em cima E embaixo; no site novo os 40 de baixo já vêm do `.site-main` (o `#section-body { padding-bottom: 40px }` que embrulha o miolo de toda página). Repetir daria 80. ÍNDICE 1. Título e subtítulo 2. A caixa de texto (fio, parágrafo, botão) 3. Os três blocos de serviço 4. Responsivo =========================================================================== */ .condominios { padding-top: 40px; } /* =========================================================================== 1. TÍTULO E SUBTÍTULO (.houzez-module.module-title) --------------------------------------------------------------------------- O respiro de 55 em cima é do `.module-title`, que vence o 55/55 do `.houzez-module` com `!important` e zera o de baixo. ⚠ A TINTA É #6c757d, o `.text-muted` do Bootstrap 4 — que está carregado DEPOIS do 3 e ganha do #777 dele. Medido no print: rgb(108,117,125) nos dois títulos. É a mesma armadilha já anotada nos cartões da home. ⚠ PESO 400, NÃO 500. O legado ESCREVE `font-weight: 500` nos dois títulos, mas o dele carrega Encode Sans Condensed do Google numa URL que traz SÓ o peso 400 (`?family=Encode+Sans+Condensed`, sem `:wght@`). Ou seja: o que chega à tela é 400. Por isso o arquivo de 400 entrou self-hosted em 2026-09-22, ao lado do 500 que já estava lá. ⚠ E ISSO VALIA PARA A LISTAGEM TAMBÉM, que declarava 500 no título da página, na régua de busca e no título do card. Corrigido em 2026-09-22, a pedido do Sami: os três agora são 400, como a tela do site no ar. =========================================================================== */ .condominios__topo { padding-top: 55px; text-align: center; } .condominios__titulo { margin: 0 0 20px; font-family: var(--fonte-titulo-condensada); font-size: 40px; font-weight: 400; line-height: 38px; letter-spacing: normal; color: #6c757d; } /* OS 29px SÃO CRAVADOS NO `style=` DO

DO LEGADO, e por isso vencem os 18px da folha dele — em qualquer largura de tela. A linha de 24 é da folha (`.module-title .sub-heading`, que ganha do `.module-title h2` por ter duas classes). */ .condominios__subtitulo { margin: 0; font-family: var(--fonte-titulo-condensada); font-size: 29px; font-weight: 400; line-height: 24px; color: #6c757d; } /* =========================================================================== 2. A CAIXA DE TEXTO (.article-detail) =========================================================================== */ .condominios__servicos { padding: 40px 0 55px; } .condominios__texto { padding: 40px; background: var(--cor-fundo-pagina); } /* MEDIDO no print: rgb(238,238,238). O `styles.css` do legado declara #e4e4e4, mas o `bootstrap.css` vem depois e repõe `border-top: 1px solid #eee`. */ .condominios__fio { margin: 20px 0; border: 0; border-top: 1px solid #eee; } /* O PARÁGRAFO É PRETO, não a tinta de texto do site: o `body` do legado não declara `color` nenhum, então o corpo cai no preto do navegador. Medido no print: rgb(0,0,0). ⚠ A CAIXA É `text-align: justify` no legado e o parágrafo é `.text-center` por cima — só o centrado chega à tela. */ .condominios__chamada { margin: 0 0 20px; font-size: 16px; font-weight: 300; line-height: 24px; color: #000; text-align: center; } /* OS 15px SÃO O `.p-4` DO BOOTSTRAP 4 — `1.5rem` com o `html { font-size: 10px }` do Bootstrap 3, que está carregado antes. São 15, não 24: o rem deste legado vale 10px, não 16. */ .condominios__acao { display: flex; justify-content: center; padding: 15px; } /* O `.btn.btn-primary` DO LEGADO. O `.btn` do `styles.css` vem depois do framework e manda: respiro 11x15 (não 6x12), SEM BORDA — então a `border-color: #d43f3a` do `.btn-danger` não desenha nada — peso 500 e linha de 1,42857, que com 14px fecha os 42px de altura medidos no print (41,6). ⚠ O HOVER É VERMELHO (#B61217), não um azul mais escuro. É o que está no ar. `line-height` e `font-size` explícitos porque o corpo do site novo é 14/1,5 e o do legado 16/1,42857 — herdar daria outra altura de botão. */ .condominios__botao { padding: 11px 15px; border-radius: 4px; background: #3333ff; font-size: 14px; font-weight: 500; line-height: 1.42857; color: var(--cor-branco); transition: background-color var(--transicao); } .condominios__botao:hover { background: #b61217; color: var(--cor-branco); } /* =========================================================================== 3. OS TRÊS BLOCOS DE SERVIÇO (.services-module .service-block) --------------------------------------------------------------------------- TRÊS COLUNAS COLADAS, SEM GOTEIRA: as colunas do legado levam `.no-padding` (`padding: 0 !important`) e a fileira leva `.no-margin`, então cada cartão fecha 380 (um terço dos 1140 de dentro do container) e um encosta no outro. Medido no print: a borda do primeiro cartão em x=190 e a do segundo em 570. =========================================================================== */ .condominios__grade { display: flex; flex-wrap: wrap; } .condominios__bloco { position: relative; z-index: 2; flex: 0 0 33.3333%; max-width: 33.3333%; padding: 0 30px 30px; background: var(--cor-branco); box-shadow: 0 0 3px rgba(0, 0, 0, .15); text-align: center; transition: transform .2s ease-out, box-shadow .2s ease-out; } /* O CARTÃO SOBE 10px E GANHA UMA SOMBRA ENORME (0 70px 70px a 20%) no hover. O legado escreve `scale(1.01)` e `translate(0,-10px)` na mesma regra — a segunda apaga a primeira, então o que acontece é só a subida. Replicado assim: escrever as duas seria copiar a linha morta. */ .condominios__bloco:hover { z-index: 100; box-shadow: 0 70px 70px rgba(0, 0, 0, .2); transform: translate(0, -10px); } /* ⚠ OS 98px DO TOPO SÃO MEDIDOS, NÃO DECLARADOS. O legado escreve `padding: 80px 0 70px` nesta caixa, mas ela também leva `font-size: 60px` e o lá é INLINE — a caixa de texto que isso cria em volta da imagem empurra o ícone mais para baixo. No print o topo do ícone está 97,6 abaixo do topo do cartão, e é esse número que vale: aqui o `img` é `display: block` (regra global do site), então o respiro medido entra direto no padding. O 70 do pé é o declarado — o print corta no meio dos ícones e não dá para medir o que vem depois. Se um print da página inteira mostrar diferença, é esta linha. */ .condominios__icone { padding: 98px 0 70px; } .condominios__icone img { margin-inline: auto; } /* MEDIDO na folha do legado (`.services-module .service-block h3`, que vence o h3 global): 20/24, peso 400, margem de 8 embaixo. ⚠ NÃO É CONDENSADO, AO CONTRÁRIO DOS DOIS TÍTULOS DO TOPO. A regra de lá não declara família, e o `h1,h2,h3,h4,h5,h6 { font-family: inherit }` do `bootstrap.css` — que carrega DEPOIS do `styles.css` — apaga o `'Encode Sans Condensed'` que a folha do tema pôs nos títulos. Os do topo escapam porque `.module-title h1/h2` declara a família de novo, com especificidade maior. ⚠ A TINTA TAMBÉM: o `color: inherit` do mesmo `h1,h2,...` do bootstrap apaga o `color: #000` da folha do tema — mas o corpo desta página é preto de qualquer jeito (o `body` do legado não declara cor), então dá no mesmo. */ .condominios__nome { margin: 0 0 8px; font-size: 20px; font-weight: 400; line-height: 24px; letter-spacing: normal; color: #000; } .condominios__linha { margin: 0 0 10px; font-size: 17px; font-weight: 300; line-height: 22px; color: #636363; } /* =========================================================================== 4. RESPONSIVO — os degraus são os do legado (Bootstrap 3 + as media queries do `styles.css` dele). NÃO FORAM MEDIDOS: o print do Sami é de desktop. ≥ 1200 .... três cartões por fileira, título do bloco 20/24 992–1199 .. três cartões, título do bloco 18/22 768–991 ... DOIS cartões (`col-sm-6`), ícone com 40 de respiro ≤ 767 ..... um cartão por fileira, tudo menor =========================================================================== */ @media (min-width: 992px) and (max-width: 1199px) { .condominios__nome { font-size: 18px; line-height: 22px; } } @media (max-width: 991px) { .condominios__bloco { flex-basis: 50%; max-width: 50%; } /* `padding: 40px 0` no legado — o respiro de baixo cai de 70 para 40. */ .condominios__icone { padding: 40px 0; } } /* MEDIDO na folha do legado: abaixo de 768 o corpo do site inteiro encolhe (12px), o parágrafo vira 14/20 com 10 de margem e a caixa de texto perde metade do respiro. */ @media (max-width: 767px) { .condominios__topo { padding-top: 35px; } .condominios__titulo { margin-bottom: 10px; font-size: 28px; line-height: 34px; } /* O corpo do subtítulo NÃO MUDA (os 29px estão cravados no `style=` de lá); só a entrelinha, que vai a 30. */ .condominios__subtitulo { line-height: 30px; } .condominios__servicos { padding: 20px 0 35px; } .condominios__texto { padding: 20px; } .condominios__chamada { margin-bottom: 10px; font-size: 14px; line-height: 20px; } .condominios__bloco { flex-basis: 100%; max-width: 100%; } .condominios__icone { padding: 30px 0; } /* O ícone encolhe para 40 abaixo de 768 (`.block-icon img { width: 40px }`). */ .condominios__icone img { width: 40px; height: auto; } .condominios__nome { font-size: 16px; line-height: 20px; } .condominios__linha { font-size: 12px; line-height: 20px; } } /* ABAIXO DE 482 o título cai para 20/24 (`.module-title h1`). */ @media (max-width: 481px) { .condominios__titulo { font-size: 20px; line-height: 24px; } }