/* Revista Madapress, linha "Editorial Premium". Rodada 3 (2026-10-23, .claude/tasks/2026-10-21-revista-padrao-respostas.md):
   volta ao estilo da edição Morada (o layout anterior a 2026-10-20): papel único claro, margens largas, muito respiro,
   uma foto forte por imóvel, filetes finos e o WhatsApp como link sublinhado. Mantém da rodada 2 as fontes e os
   tamanhos de letra; no máximo 2 imóveis por página.
   Página A4 (210 × 297 mm) lida no celular a ~0,47× (1pt do A4 ≈ 0,62px na tela de 390px).
   Pisos (medidos pelo gerador no Chrome, erro abaixo deles): texto corrido 22pt, ficha/preço/CTA 20pt,
   rótulos/legendas 18pt, fólio e indicadores 14pt, código do imóvel e crédito 12pt. Área de toque dos links
   ≥ 25 × 25 mm (44px no celular), transparente.
   Fontes: Newsreader (serifa com tamanho óptico) + Libre Franklin, OFL, hospedadas (nunca Google Fonts).
   Cores do cliente: o gerador acrescenta um bloco :root com --marca, --destaque e --destaque-texto no fim deste
   arquivo na saída. Fonte de verdade do visual (design/principios.md §6.4). */
@page { size: A4; margin: 0; }

:root {
  --tinta: #1C2B3A;          /* títulos e números (Morada) */
  --texto: #33414F;          /* texto corrido */
  --tinta-suave: #5A6673;    /* secundário: 5,6:1 sobre o papel */
  --papel: #FBF8F3;          /* papel único (Morada) */
  --filete: #DDD5C8;
  --marca: #1C2B3A;          /* selo "Alugado" */
  --destaque: #A9501C;       /* só detalhes: filetes, números do sumário, capitular, sublinhado dos links */
  --destaque-texto: #8E4318; /* texto pequeno na cor do cliente: ≥ 4,5:1 sobre o papel */
  --vinho: #7A2E3A;          /* "Vendido" */
  --serifa: "Newsreader", Georgia, serif;
  --sans: "Libre Franklin", "Helvetica Neue", Arial, sans-serif;
  --margem: 18mm;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { background: #8A8F94; }
/* A fonte fica na .pagina (não no body): no leitor do site este CSS é carregado junto com a interface. */
body { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
img { display: block; width: 100%; height: 100%; object-fit: cover; }
figure { overflow: hidden; min-height: 0; position: relative; }
em { font-style: italic; }

.pagina {
  width: 210mm; height: 297mm; position: relative; overflow: hidden;
  background: var(--papel); margin: 0 auto 24px; break-after: page;
  display: flex; flex-direction: column;
  font: 400 22pt/1.45 var(--serifa); font-variation-settings: "opsz" 12;
  color: var(--tinta); text-align: left;
}
@media print { html { background: none; } .pagina { margin: 0; } .so-leitor { display: none !important; } } /* .so-leitor: só no leitor do site (ex.: aviso de ampliar fotos) */

/* Área de conteúdo: termina 20mm acima da borda (o fólio fica embaixo). O gerador acusa estouro em toda .limite. */
.corpo { flex: 1; min-height: 0; overflow: hidden; padding: 16mm var(--margem) 0; margin-bottom: 20mm; display: flex; flex-direction: column; }
.limite { overflow: hidden; }

/* Rótulo (Morada): caixa alta espaçada, pequeno, na cor do cliente, sem enfeite. */
.rotulo { font: 600 18pt/1.3 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--destaque-texto); margin-bottom: 3mm; }
h1, h2, h3 { font-weight: 300; }
.indicador, .rotulo.indicador { font: 700 14pt/1.4 var(--sans); letter-spacing: .18em; text-transform: uppercase; }
/* Código do imóvel: identificação interna, bem pequeno, no canto esquerdo da foto. */
.codigo { position: absolute; top: 3mm; left: 3mm; z-index: 2; padding: .5mm 1.8mm; background: rgb(28 43 58 / .9); color: #fff; font: 600 12pt/1.4 var(--sans); letter-spacing: .06em; }
h2 { font: 300 34pt/1.08 var(--serifa); font-variation-settings: "opsz" 72; letter-spacing: -.01em; margin-bottom: 6mm; }
h2 em, h3 em { font-style: italic; color: var(--italico, inherit); } /* cor 2 da paleta, quando houver */
.texto p { color: var(--texto); margin-bottom: 4mm; }
.legenda { font: italic 300 18pt/1.3 var(--serifa); color: var(--tinta-suave); margin-top: 2mm; }
.credito-foto { font: 400 18pt/1.3 var(--sans); color: var(--tinta-suave); margin-top: 1.5mm; }
.capitular::first-letter { float: left; font: 400 66pt/.82 var(--serifa); font-variation-settings: "opsz" 72; color: var(--destaque); margin: 1.8mm 2.8mm 0 0; }

/* Ornamento: filete fino na cor do cliente com um losango no meio (contracapa). */
.ornamento { display: flex; align-items: center; gap: 4mm; flex: none; }
.ornamento::before, .ornamento::after { content: ""; flex: 1; border-top: .25mm solid var(--moldura, var(--destaque)); }
.ornamento span { width: 2.4mm; height: 2.4mm; border: .3mm solid var(--moldura, var(--destaque)); transform: rotate(45deg); }

/* Fólio (Morada): sem filete, letra pequena espaçada; revista e mês à esquerda, página à direita. */
.folio {
  position: absolute; left: var(--margem); right: var(--margem); bottom: 9mm; display: flex; justify-content: space-between; gap: 6mm;
  font: 500 14pt/1.45 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-suave);
}

/* Links (Morada): texto sublinhado na cor do cliente + seta. A área de toque (≥ 25 × 25 mm) é transparente. */
.link, .botao {
  display: inline-flex; align-items: center; align-self: flex-start; flex: none; min-height: 25mm; min-width: 25mm;
  padding: 0 3mm; margin-left: -3mm; text-decoration: none;
}
.link { font: 500 20pt/1.25 var(--sans); color: var(--tinta); }
.link--discreto { font: 400 18pt/1.3 var(--sans); color: var(--tinta-suave); }
.link span, .botao__forma > span { border-bottom: .3mm solid var(--destaque); padding-bottom: .6mm; }
.link svg, .botao__forma > svg { flex: none; width: 5mm; height: 5mm; margin-left: 2mm; color: var(--destaque-texto); }
/* WhatsApp do imóvel: o mesmo link sublinhado; o ícone (em até 5 imóveis) fica antes do texto. */
.botao__forma { display: inline-flex; align-items: center; white-space: nowrap; font: 500 20pt/1.25 var(--sans); color: var(--tinta); }
.botao__forma .icone { width: 5.4mm; height: 5.4mm; margin: 0 2mm 0 0; color: var(--destaque-texto); }

/* Foto com texto por cima (capa): gradiente escuro em cima e embaixo. */
.sobre-foto { position: relative; flex: none; overflow: hidden; background: #3A3631; }
.sobre-foto::after { content: ""; position: absolute; inset: 0; }

/* ---------- 1. Capa (Morada): foto inteira, topo centrado, manchete e três chamadas embaixo ---------- */
.capa { background: #3A3631; color: #fff; }
.capa__foto { position: absolute; inset: 0; }
.capa__foto::after { background: linear-gradient(180deg, rgb(15 22 30 / .55) 0%, rgb(15 22 30 / .12) 24%, rgb(15 22 30 / 0) 34%, rgb(15 22 30 / 0) 48%, rgb(15 22 30 / .7) 70%, rgb(15 22 30 / .88) 100%); }
.capa__topo { position: absolute; top: 14mm; left: var(--margem); right: var(--margem); z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; }
.capa__data { margin-bottom: 5mm; opacity: .95; }
/* Nome da edição (2026-10-27): grande, em versal espaçada, no lugar da logo; embaixo, à direita, "por <imobiliária>"
   em itálico menor. A capa não leva logo (a logo fica na contracapa). */
.capa__titulo { display: inline-flex; flex-direction: column; align-items: flex-end; text-shadow: 0 .3mm 1.5mm rgb(0 0 0 / .3); }
.capa__edicao { font: 400 58pt/1 var(--serifa); letter-spacing: .22em; margin-right: -.22em; text-transform: uppercase; }
.capa__por { margin-top: 2.5mm; font: italic 400 20pt/1.2 var(--serifa); letter-spacing: .02em; opacity: .95; }
.capa__base { position: absolute; left: var(--margem); right: var(--margem); bottom: 11mm; z-index: 1; }
.capa__destaque { margin-bottom: 3mm; }
.capa__manchete { font: 300 48pt/1.03 var(--serifa); font-variation-settings: "opsz" 72; letter-spacing: -.01em; margin-bottom: 7mm; }
/* Chamadas no rodapé: no máximo 2 linhas cada (o que passar é cortado e a verificação de layout acusa). */
.capa__chamadas { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 7mm; border-top: .25mm solid rgb(255 255 255 / .55); padding-top: 3.5mm; }
.capa__chamadas small { display: block; margin-bottom: 1mm; }
.capa__chamadas span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font: 400 18pt/1.25 var(--serifa); font-variation-settings: "opsz" 24; }

/* Variações da capa (2026-10-23, capa_layout no edicao.csv). */
.capa__selo { display: inline-block; margin-bottom: 4mm; padding: 1.4mm 3.4mm; border: .3mm solid currentColor; }
/* moldura: foto emoldurada sobre o papel; logo e textos na tinta, como um cartão */
.capa--moldura { background: var(--papel); color: var(--tinta); }
.capa--moldura .capa__foto { inset: auto; top: 48mm; left: var(--margem); right: var(--margem); height: 116mm; outline: .3mm solid var(--destaque); outline-offset: 2.4mm; }
.capa--moldura .capa__foto::after { display: none; }
.capa--moldura .capa__data { opacity: 1; color: var(--tinta-suave); }
.capa--moldura .capa__selo, .capa--moldura .capa__destaque { color: var(--destaque-texto); }
.capa--moldura .capa__manchete { font-size: 42pt; margin-bottom: 6mm; }
.capa--moldura .capa__chamadas { border-top-color: var(--filete); }
.capa--moldura .capa__chamadas small { color: var(--destaque-texto); }
/* dividida: foto no alto (sangrada), manchete e chamadas no papel */
.capa--dividida { background: var(--papel); color: var(--tinta); }
.capa--dividida .capa__foto { inset: 0 0 auto; height: 178mm; }
.capa--dividida .capa__foto::after { background: linear-gradient(180deg, rgb(15 22 30 / .6) 0%, rgb(15 22 30 / .1) 30%, rgb(15 22 30 / 0) 45%); }
.capa--dividida .capa__topo { color: #fff; }
.capa--dividida .capa__selo, .capa--dividida .capa__destaque { color: var(--destaque-texto); }
.capa--dividida .capa__manchete { font-size: 42pt; margin-bottom: 6mm; }
.capa--dividida .capa__chamadas { border-top-color: var(--filete); }
.capa--dividida .capa__chamadas small { color: var(--destaque-texto); }

/* ---------- 2. Carta (Morada): foto larga no topo, legenda à direita ---------- */
.carta__foto { flex: none; height: 74mm; }
.carta .legenda { padding: 0 var(--margem); text-align: right; flex: none; }
.carta .corpo { padding-top: 10mm; }
.carta h2 { font-size: 36pt; }
.carta .texto > p:not([class]), .carta .texto > .capitular { font-size: 24pt; }
.assinatura { font: italic 300 26pt/1.2 var(--serifa); color: var(--tinta); margin-top: 2mm; }
.carta .link { margin-top: auto; }
.carta__dica { display: flex; align-items: center; gap: 2.5mm; margin-top: 3mm; font: 400 18pt/1.3 var(--sans); color: var(--tinta-suave); }
.carta__dica .icone { flex: none; width: 6mm; height: 6mm; color: var(--destaque-texto); }

/* ---------- 3. Nesta edição + mercado (Morada) ---------- */
.sumario-pagina .corpo { padding-top: 24mm; }
.sumario ol { list-style: none; border-top: .25mm solid var(--filete); }
.sumario li { display: grid; grid-template-columns: 18mm 1fr; align-items: baseline; padding: 3.4mm 0; border-bottom: .25mm solid var(--filete); font: 400 24pt/1.3 var(--serifa); }
.sumario li span { font: 300 28pt/1 var(--serifa); color: var(--destaque-texto); }
.mercado { margin-top: auto; padding-top: 5mm; border-top: .4mm solid var(--tinta); }
.mercado .rotulo { margin-bottom: 5mm; }
.mercado ul { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6mm 8mm; }
.mercado ul:has(> li:nth-child(4):last-child), .mercado ul:has(> li:nth-child(2):last-child) { grid-template-columns: repeat(2, 1fr); }
.mercado li { font: 400 18pt/1.25 var(--sans); color: var(--tinta-suave); }
.mercado strong { display: block; font: 300 38pt/1.05 var(--serifa); font-variation-settings: "opsz" 72; color: var(--tinta); margin-bottom: 1mm; }
.mercado__fonte { font: italic 300 18pt/1.3 var(--serifa); color: var(--tinta-suave); margin-top: 5mm; }

/* Miniaturas (Morada): duas fotos pequenas com borda de papel, no canto inferior direito da foto principal. */
.minis { position: absolute; right: var(--margem); bottom: -13mm; z-index: 2; display: grid; grid-auto-flow: column; grid-auto-columns: 40mm; gap: 3mm; }
.minis figure { height: 34mm; border: 2.5mm solid var(--papel); background: var(--papel); }
.minis--3 { grid-auto-columns: 35mm; }
.minis--3 figure { height: 30mm; }

/* ---------- 4. Imóvel do mês (Morada): abertura com foto de ponta a ponta + "A casa" ---------- */
.destaque__topo { position: relative; flex: none; }
.destaque__foto { height: 150mm; }
.destaque__foto .codigo { top: 9mm; left: var(--margem); }
.destaque .corpo { padding-top: 20mm; }
.destaque h2 { font-size: 46pt; line-height: 1.04; margin-bottom: 5mm; }
.lead { font: italic 300 24pt/1.4 var(--serifa); font-variation-settings: "opsz" 24; color: var(--tinta-suave); }
.historia .figura { flex: 1 1 auto; min-height: 40mm; max-height: 96mm; margin-top: 2mm; }
.historia .ficha { margin-top: 5mm; padding-top: 4mm; border-top: .25mm solid var(--filete); }
.historia .preco-linha { margin-top: auto; }

/* Ficha em linha e preço (Morada): ficha discreta; preço em serifa; o link do WhatsApp ao lado ou embaixo. */
.ficha { font: 400 20pt/1.35 var(--sans); color: var(--tinta-suave); margin-bottom: 2mm; }
.preco-linha { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 5mm; flex: none; }
.preco-linha > div { flex: 1 1 auto; padding-top: 2mm; }
.preco { white-space: nowrap; font: 400 26pt/1.1 var(--serifa); font-variation-settings: "opsz" 24; color: var(--tinta); }
.preco--destaque { font-size: 32pt; }
.preco__extra { white-space: pre-line; font: 400 20pt/1.3 var(--sans); color: var(--tinta-suave); margin-top: .8mm; }
.chamada { color: var(--texto); margin-bottom: 3mm; }

/* ---------- 5. A serra este mês (notícias, intercaladas com os imóveis) ---------- */
.noticia__foto { flex: none; height: 82mm; }
.noticia .credito-foto { padding: 0 var(--margem); text-align: right; flex: none; }
.noticia .corpo { padding-top: 10mm; }
.noticia h2 { margin-bottom: 4mm; }
.noticia__secao, .noticia__meta { font: 700 18pt/1.3 var(--sans); letter-spacing: .02em; text-transform: none; }
.noticia__meta { color: var(--tinta-suave); margin-bottom: 2mm; }
.noticia h3 { font: 300 32pt/1.12 var(--serifa); font-variation-settings: "opsz" 60; margin-bottom: 4mm; }
.noticia__fonte { font: 400 18pt/1.3 var(--sans); color: var(--tinta-suave); margin-top: auto; padding-top: 3mm; border-top: .25mm solid var(--filete); }

/* ---------- 6. Seleção do mês ---------- */
.grupo-topo { flex: none; margin-bottom: 8mm; }
.grupo-topo .rotulo { margin-bottom: 2mm; }
.grupo-topo__rotulo { font-size: 16pt; }
.grupo-topo h2 { font: 300 36pt/1.15 var(--serifa); font-variation-settings: "opsz" 72; margin: 0; }
.item { display: flex; flex-direction: column; min-height: 0; }
.item h3 { font: 300 30pt/1.1 var(--serifa); font-variation-settings: "opsz" 48; margin: 0 0 2mm; }
.item .rotulo { margin: 5mm 0 2mm; }
.item .preco-linha { margin-top: 1mm; border-top: .25mm solid var(--filete); }

/* 1 imóvel (Morada, "item grande"): a foto ocupa o espaço que sobra; miniaturas no canto; texto embaixo. */
.item__topo { position: relative; flex: 1 1 auto; min-height: 70mm; }
.item__topo .item__foto { height: 100%; }
.inteira .item { flex: none; padding-top: 10mm; }
.inteira .item__topo:has(.minis) + .item { padding-top: 18mm; }
.inteira .item .rotulo { margin-top: 0; }
.inteira .item h3 { font-size: 38pt; }
.inteira .minis { right: 6mm; }

/* 2 imóveis (Morada, "dupla"): duas colunas, foto em cima, texto embaixo; colunas alinhadas pelo pé. */
.dupla { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 9mm; }
.dupla .item__foto { flex: none; height: 100mm; }
.dividida--abre .dupla .item__foto { height: 78mm; }
.dupla .preco-linha { flex-direction: column; align-items: flex-start; margin-top: auto; }
/* Na coluna estreita o texto do link pode quebrar: tudo em linha, com a seta logo depois da última palavra. */
.dupla .botao__forma { display: inline; white-space: normal; }
.dupla .botao__forma > svg { display: inline-block; vertical-align: middle; }
.dupla .preco-linha > div { flex: none; }

/* Vendido / alugado: selo discreto no canto da foto (vinho no vendido), sem preço nem botão. */
.selo {
  position: absolute; top: 4mm; right: 4mm; z-index: 2; padding: 2.4mm 4mm; background: var(--vinho); color: #fff;
  font: 600 18pt/1 var(--sans); letter-spacing: .2em; text-transform: uppercase;
  outline: .25mm solid rgb(255 255 255 / .75); outline-offset: -1.4mm;
}
.selo--alugado { background: var(--marca); }
.fechado { font: italic 300 26pt/1.2 var(--serifa); color: var(--vinho); padding-top: 3mm; border-top: .25mm solid var(--filete); }
.fechado--alugado { color: var(--tinta-suave); }

/* ---------- 7. Contracapa: papel, moldura fina na cor do cliente e uma foto do imóvel do mês bem esmaecida ---------- */
.contracapa::before, .contracapa::after { content: ""; position: absolute; pointer-events: none; border: .3mm solid var(--moldura, var(--destaque)); /* cor 5 da paleta, quando houver */ z-index: 1; }
.contracapa::before { inset: 9mm; }
.contracapa::after { inset: 10.6mm; border-width: .15mm; }
.contracapa__fundo { position: absolute; inset: 0; opacity: .1; filter: grayscale(.5) sepia(.25); }
.contracapa .corpo { position: relative; z-index: 1; padding: 0 24mm; margin: 14mm 0 34mm; justify-content: center; align-items: center; text-align: center; }
.contracapa .logo { width: 74mm; height: auto; }
.contracapa__nome { font: 300 40pt/1.1 var(--serifa); }
.contracapa .ornamento { width: 60mm; margin: 12mm 0 16mm; }
.contracapa__convite { font: 300 30pt/1.18 var(--serifa); font-variation-settings: "opsz" 60; margin-bottom: 7mm; }
.contracapa__convite em { color: var(--destaque-texto); }
.contracapa__endereco { font: 400 18pt/1.35 var(--sans); color: var(--texto); margin-bottom: 2mm; }
.contracapa__contatos { list-style: none; display: flex; justify-content: center; gap: 0 6mm; }
.contato { display: inline-flex; align-items: center; justify-content: center; min-height: 25mm; min-width: 25mm; color: var(--destaque-texto); text-decoration: none; }
.contato .icone { width: 11mm; height: 11mm; }
.contracapa .link { align-self: center; margin: 0; }
.contracapa__info { font: 400 18pt/1.4 var(--sans); color: var(--tinta-suave); margin-top: 1mm; }
.contracapa .credito {
  position: absolute; left: 50%; bottom: 12mm; z-index: 2; transform: translateX(-50%); display: inline-flex; align-items: center; justify-content: center;
  min-height: 25mm; min-width: 25mm; padding: 0 5mm; white-space: nowrap;
  font: 700 12pt/1.4 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--tinta); text-decoration: none;
}

/* ---------- Temas sazonais (2026-10-23, "tema" no edicao.csv): papel, filetes e cor dos detalhes da edição ----------
   Vão na própria .pagina (vencem o :root, inclusive o bloco de cores do cliente que o gerador acrescenta). */
.tema-jardim    { --papel: #F6F8F1; --filete: #D3DBC8; --destaque: #5E7F4E; --destaque-texto: #46633A; }
.tema-natal     { --papel: #FBF6EE; --filete: #E6D4C1; --destaque: #A3242F; --destaque-texto: #8C1F28; }
.tema-verao     { --papel: #F5F9FA; --filete: #CBDDE3; --destaque: #2C7DA0; --destaque-texto: #1D5E7E; }
.tema-vindima   { --papel: #FAF5F5; --filete: #E3D1D7; --destaque: #6B2D5C; --destaque-texto: #5E2751; }
.tema-pascoa    { --papel: #FBF4EA; --filete: #E8D4BB; --destaque: #8A5530; --destaque-texto: #6A3F23; }
.tema-outono    { --papel: #FAF2E6; --filete: #E6D1B3; --destaque: #B5541C; --destaque-texto: #923F14; }
.tema-maes      { --papel: #FBF5F4; --filete: #EBD7D6; --destaque: #A8566B; --destaque-texto: #8B4157; }
.tema-aconchego { --papel: #F7F2EA; --filete: #DED1BF; --destaque: #8A5A44; --destaque-texto: #6F4636; }
.tema-inverno   { --papel: #F3F5F7; --filete: #D2DAE2; --destaque: #3D5A80; --destaque-texto: #33507A; }
.tema-primavera { --papel: #FCF7F6; --filete: #EBD9DB; --destaque: #C0566E; --destaque-texto: #9C3A53; }
/* cinema (agosto, Festival de Gramado): papel escuro, texto claro, detalhes em vermelho-cortina */
.tema-cinema {
  --papel: #16181C; --filete: #3A3D44; --tinta: #F3EEE6; --texto: #DCD6CC; --tinta-suave: #ABA59C;
  --destaque: #C8323A; --destaque-texto: #E8858A; --vinho: #9E2A35;
}
.tema-cinema .contracapa__fundo { opacity: .16; filter: grayscale(.6); }

/* Imóvel do mês, 3ª página (só quando o total daria ímpar): duas fotos empilhadas (2026-10-26) */
.destaque-fotos .figura { flex: 1 1 0; min-height: 0; margin-top: 4mm; }
.destaque-fotos .legenda { margin-top: 1.5mm; }

/* Cores e fontes de Mada Negócios Imobiliários (cliente.csv), validadas pelo gerador. */
:root { --destaque: #C9A46A; --destaque-texto: #816944; --marca: #0D2340; --italico: #0D2340; --filete: #E7E1DA; --tinta: #0D2340; --moldura: #C9A46A; --serifa: "EB Garamond", Georgia, serif; --sans: "Lato", "Helvetica Neue", Arial, sans-serif; }

