/* ==== concurso.css · só em body[data-css~="concurso"] ==== */ :where(body[data-css~="concurso"]) /* ===================================================================== rendaacessivel.pt · concurso.css (v3.1, 27/09/2026) Só o que é da página do concurso e não está no base.css. Regras do base.css valem aqui: font-size só com var(--t-*), :where(body[data-css~="concurso"]) cores só com os tokens, :where(body[data-css~="concurso"]) sem sombra em repouso, :where(body[data-css~="concurso"]) telha só na acção e no prazo. ===================================================================== */ /* ---------- ordem no telemóvel ---------- .concurso-principal é display:contents no telemóvel: os filhos dele entram na coluna da grelha. O base.css põe a acção em 1 e a galeria em 2; o resto da página vem depois de ambas. */ .concurso-cab{ order:0; padding-top:var(--e-2); } :where(body[data-css~="concurso"]) .concurso-grelha .factos{ order:0; } :where(body[data-css~="concurso"]) .concurso-resto{ order:3; } :where(body[data-css~="concurso"]) .concurso-cab .heroi-sub{ max-width:44ch; text-wrap:pretty; } :where(body[data-css~="concurso"]) .concurso-cab .carimbo{ text-wrap:pretty; } :where(body[data-css~="concurso"]) .concurso-cab .fonte{ margin-top:var(--e-4); } /* a folha de factos da página leva a renda em linha própria sem cortar */ :where(body[data-css~="concurso"]) .concurso-grelha .factos{ margin-bottom:0; } /* ---------- galeria: as fotografias são botões que abrem a folha ---------- */ :where(body[data-css~="concurso"]) .galeria .foto{ display:block; width:100%; padding:0; border:0; cursor:zoom-in; } :where(body[data-css~="concurso"]) .galeria .foto:focus-visible{ outline-offset:-3px; box-shadow:inset 0 0 0 5px var(--branco); } :where(body[data-css~="concurso"]) .galeria-pe .etiqueta a{ color:var(--tinta-2); } :where(body[data-css~="concurso"]) .galeria-pe .lig{ min-height:var(--alvo); } :where(body[data-css~="concurso"]) button.lig{ font:inherit; font-weight:600; cursor:pointer; } :where(body[data-css~="concurso"]) /* ---------- blocos da página, :where(body[data-css~="concurso"]) separados por filetes ---------- */ .bloco{ margin-top:var(--e-6); padding-top:var(--e-6); border-top:1px solid var(--linha); } :where(body[data-css~="concurso"]) .bloco > h2{ margin-bottom:var(--e-4); } :where(body[data-css~="concurso"]) .bloco > .t-apoio:first-of-type{ margin-top:calc(var(--e-2) * -1); margin-bottom:var(--e-4); } :where(body[data-css~="concurso"]) .bloco h3{ margin-bottom:var(--e-3); } :where(body[data-css~="concurso"]) .bloco-duplo{ display:grid; gap:0; } :where(body[data-css~="concurso"]) .concurso-resto > .alerta{ margin-top:var(--e-6); } /* ---------- «Serve-me?»: as três perguntas num só cartão ---------- */ :where(body[data-css~="concurso"]) .serve .respostas{ margin-bottom:var(--e-4); } :where(body[data-css~="concurso"]) .serve.passo-a-passo fieldset + fieldset{ margin-top:0; padding-top:0; border-top:0; } :where(body[data-css~="concurso"]) .serve legend:focus{ outline:0; box-shadow:none; } :where(body[data-css~="concurso"]) .serve fieldset + fieldset{ margin-top:var(--e-5); padding-top:var(--e-5); border-top:1px solid var(--linha); } :where(body[data-css~="concurso"]) .serve legend{ font-size:var(--t-corpo); font-family:var(--letra); font-weight:700; line-height:1.35; } :where(body[data-css~="concurso"]) .serve .opcoes{ margin-top:var(--e-3); } :where(body[data-css~="concurso"]) .opcoes-sn{ grid-template-columns:1fr 1fr; } :where(body[data-css~="concurso"]) .serve .pergunta-dica{ margin-top:0; } :where(body[data-css~="concurso"]) .serve-resultado{ margin-top:var(--e-4); } :where(body[data-css~="concurso"]) .serve-resultado:empty{ display:none; } :where(body[data-css~="concurso"]) .serve-espera{ font-size:var(--t-apoio); color:var(--tinta-2); margin-top:var(--e-4); } :where(body[data-css~="concurso"]) .veredicto .lig{ display:inline-flex; } :where(body[data-css~="concurso"]) .veredicto .saidas{ display:flex; flex-wrap:wrap; gap:0 var(--e-4); margin-top:var(--e-1); } :where(body[data-css~="concurso"]) .veredicto .saidas a{ font-size:var(--t-apoio); font-weight:600; } :where(body[data-css~="concurso"]) /* ---------- as regras de quem pode, :where(body[data-css~="concurso"]) com um visto ---------- */ .regras{ list-style:none; margin:0; padding:0; display:grid; gap:var(--e-3); } :where(body[data-css~="concurso"]) .regras li{ display:grid; grid-template-columns:22px 1fr; gap:var(--e-3); align-items:start; } :where(body[data-css~="concurso"]) .regras .i{ width:20px; height:20px; color:var(--oliva); margin-top:4px; } :where(body[data-css~="concurso"]) .nota-edital p + p{ margin-top:var(--e-2); } :where(body[data-css~="concurso"]) .nota-edital{ margin-top:var(--e-4); font-size:var(--t-apoio); color:var(--tinta-2); padding-left:var(--e-4); border-left:3px solid var(--madeira); } :where(body[data-css~="concurso"]) /* ---------- as casas, :where(body[data-css~="concurso"]) uma a uma (Quanto vais pagar) ---------- */ .casas{ list-style:none; margin:var(--e-4) 0 0; padding:0; border-top:1px solid var(--linha); } :where(body[data-css~="concurso"]) .casa{ display:grid; grid-template-columns:88px minmax(0,1fr); gap:var(--e-3) var(--e-4); align-items:center; padding-block:var(--e-4); border-bottom:1px solid var(--linha); } :where(body[data-css~="concurso"]) .casa.sem-miniatura{ grid-template-columns:minmax(0,1fr); } :where(body[data-css~="concurso"]) .casa-mini{ display:block; width:88px; aspect-ratio:1; padding:0; border:0; border-radius:var(--r-campo); overflow:hidden; background:var(--cal-2); cursor:zoom-in; } :where(body[data-css~="concurso"]) .casa-mini img{ width:100%; height:100%; object-fit:cover; } :where(body[data-css~="concurso"]) .casa-txt{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px var(--e-3); align-items:baseline; } :where(body[data-css~="concurso"]) .casa-tipo{ font-family:var(--serifa); font-size:var(--t-3); line-height:1.2; font-weight:500; } :where(body[data-css~="concurso"]) .casa-renda{ font-family:var(--serifa); font-size:var(--t-3); font-weight:520; white-space:nowrap; text-align:right; } :where(body[data-css~="concurso"]) .casa-renda small{ font-family:var(--letra); font-size:var(--t-apoio); font-weight:400; color:var(--tinta-2); } :where(body[data-css~="concurso"]) .casa-onde{ grid-column:1 / -1; font-size:var(--t-apoio); color:var(--tinta); } :where(body[data-css~="concurso"]) .casa-min{ grid-column:1 / -1; font-size:var(--t-apoio); color:var(--tinta-2); } :where(body[data-css~="concurso"]) .casa-marca{ grid-column:1 / -1; display:none; align-items:center; gap:6px; margin-top:var(--e-1); font-size:var(--t-apoio); font-weight:600; } :where(body[data-css~="concurso"]) .casa-marca .i{ width:18px; height:18px; } :where(body[data-css~="concurso"]) .casa[data-estado="sim"] .casa-marca{ display:flex; color:var(--oliva); } :where(body[data-css~="concurso"]) .casa[data-estado="talvez"] .casa-marca{ display:flex; color:var(--madeira-esc); } :where(body[data-css~="concurso"]) .casa[data-estado="nao"] .casa-marca{ display:flex; color:var(--tinta-2); } :where(body[data-css~="concurso"]) .casa[data-estado="nao"] .casa-mini img{ filter:grayscale(1); } :where(body[data-css~="concurso"]) .casas-pe{ margin-top:var(--e-4); font-size:var(--t-apoio); color:var(--tinta-2); } /* ---------- papéis: o pé com as duas acções ---------- */ :where(body[data-css~="concurso"]) .papeis-pe{ display:flex; flex-wrap:wrap; gap:0 var(--e-5); margin-top:var(--e-2); } :where(body[data-css~="concurso"]) .papeis + .ajuda{ margin-top:var(--e-3); } :where(body[data-css~="concurso"]) .papel b{ font-weight:600; } /* ---------- datas: uma frase do edital sem posição ---------- */ :where(body[data-css~="concurso"]) .tempo .frase{ font-weight:400; color:var(--tinta-2); white-space:normal; text-align:right; max-width:14rem; } :where(body[data-css~="concurso"]) /* ---------- o botão outra vez, :where(body[data-css~="concurso"]) no fim dos papéis ---------- */ .outra-vez{ margin-top:var(--e-6); padding:var(--e-5) 20px; background:var(--branco); border:1px solid var(--linha); border-radius:var(--r-cartao); display:grid; gap:var(--e-3); justify-items:start; } :where(body[data-css~="concurso"]) .outra-vez > p:first-child{ font-family:var(--serifa); font-size:var(--t-3); line-height:1.25; } :where(body[data-css~="concurso"]) .outra-vez .bt-nota{ margin-top:0; } /* ---------- partilha ---------- */ :where(body[data-css~="concurso"]) #partilha .alternar{ margin-top:var(--e-1); display:flex; flex-direction:column; align-items:stretch; border-radius:24px; } :where(body[data-css~="concurso"]) #partilha .alternar button{ justify-content:flex-start; } :where(body[data-css~="concurso"]) #partilha .partilha{ margin-top:var(--e-3); } :where(body[data-css~="concurso"]) .copiado{ font-size:var(--t-apoio); color:var(--oliva); font-weight:600; min-height:1.5em; margin-top:var(--e-2); } /* ---------- fontes e contactos ---------- */ :where(body[data-css~="concurso"]) .fontes-bloco p{ font-size:var(--t-apoio); color:var(--tinta-2); max-width:var(--larg-texto); } :where(body[data-css~="concurso"]) .fontes-bloco p + p{ margin-top:var(--e-3); } :where(body[data-css~="concurso"]) .fontes-bloco b{ color:var(--tinta); } /* ---------- cartão de acção: entrega ao balcão e fechado ---------- */ :where(body[data-css~="concurso"]) .accao-onde{ margin-top:var(--e-4); padding-top:var(--e-4); border-top:1px solid var(--linha); font-size:var(--t-apoio); color:var(--tinta-2); } :where(body[data-css~="concurso"]) .accao-onde b{ display:block; color:var(--tinta); font-size:var(--t-corpo); } :where(body[data-css~="concurso"]) .accao-onde p + p{ margin-top:var(--e-2); } :where(body[data-css~="concurso"]) .accao-fechou h2{ font-size:var(--t-3); } :where(body[data-css~="concurso"]) .accao-fechou p{ font-size:var(--t-apoio); color:var(--tinta-2); margin-top:var(--e-2); } :where(body[data-css~="concurso"]) .accao-fechou .bt-contorno{ margin-top:var(--e-4); width:100%; } /* ---------- a folha das fotografias (dialog) ---------- */ :where(body[data-css~="concurso"]) dialog.fotos-folha{ position:fixed; inset:0; width:100%; max-width:none; height:100%; max-height:none; margin:0; border:0; padding:0; background:var(--cal); color:var(--tinta); overflow-y:auto; z-index:70; } :where(body[data-css~="concurso"]) dialog.fotos-folha::backdrop{ background:rgba(38,33,28,.5); } :where(body[data-css~="concurso"]) .fotos-topo{ position:sticky; top:0; z-index:2; background:var(--cal); border-bottom:1px solid var(--linha); } :where(body[data-css~="concurso"]) .fotos-topo .caixa{ display:flex; align-items:center; justify-content:space-between; gap:var(--e-3); min-height:var(--topo); } :where(body[data-css~="concurso"]) .fotos-topo h2{ font-size:var(--t-3); } :where(body[data-css~="concurso"]) .fotos-topo .fechar{ display:inline-flex; align-items:center; gap:6px; min-height:var(--alvo); padding:0 14px; border:1.5px solid var(--linha-forte); border-radius:var(--r-pilula); background:var(--branco); font-weight:600; font-size:var(--t-apoio); } :where(body[data-css~="concurso"]) .fotos-grupo{ padding-block:var(--e-5); } :where(body[data-css~="concurso"]) .fotos-grupo + .fotos-grupo{ border-top:1px solid var(--linha); } :where(body[data-css~="concurso"]) .fotos-grupo h3{ font-size:var(--t-3); } :where(body[data-css~="concurso"]) .fotos-grupo > p{ font-size:var(--t-apoio); color:var(--tinta-2); margin-top:var(--e-1); } :where(body[data-css~="concurso"]) .fotos-grelha{ display:grid; gap:var(--e-3); margin-top:var(--e-4); } :where(body[data-css~="concurso"]) .fotos-grelha figure{ margin:0; } :where(body[data-css~="concurso"]) .fotos-grelha img{ width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:var(--r-campo); background:var(--cal-2); } :where(body[data-css~="concurso"]) .fotos-grelha figcaption{ font-size:var(--t-apoio); color:var(--tinta-2); margin-top:6px; } :where(body[data-css~="concurso"]) .fotos-credito{ padding-block:var(--e-4) var(--e-7); font-size:var(--t-apoio); color:var(--tinta-2); } /* ---------- a legenda de cada fotografia: de que casa é ---------- */ :where(body[data-css~="concurso"]) .galeria figcaption{ font-size:var(--t-apoio); color:var(--tinta-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } /* ---------- números que não partem ao meio ---------- */ :where(body[data-css~="concurso"]) main a[href^="tel:"],:where(body[data-css~="concurso"]) .casa-renda,:where(body[data-css~="concurso"]) .accao-quando,:where(body[data-css~="concurso"]) .sem-partir{ white-space:nowrap; hyphens:manual; } /* os contactos no texto corrido (telefone, email, a página da entidade) com alvo de toque de 44 px (auditoria do telemóvel, 27/09); um email comprido parte dentro da ligação e não alarga a página */ :where(body[data-css~="concurso"]) main a[href^="tel:"],:where(body[data-css~="concurso"]) main a[href^="mailto:"],:where(body[data-css~="concurso"]) .fontes-bloco p a,:where(body[data-css~="concurso"]) .accao-onde a{ display:inline-flex; align-items:center; min-height:44px; max-width:100%; } :where(body[data-css~="concurso"]) main a[href^="mailto:"],:where(body[data-css~="concurso"]) .fontes-bloco p a{ overflow-wrap:anywhere; } :where(body[data-css~="concurso"]) .opcoes-2 .opcao{ white-space:nowrap; } :where(body[data-css~="concurso"]) /* ---------- «Quanto vais pagar», :where(body[data-css~="concurso"]) dentro de «Quem pode concorrer» ---------- */ .pagar-t{ margin-top:var(--e-6); } :where(body[data-css~="concurso"]) .pagar-t + p{ max-width:var(--larg-texto); } :where(body[data-css~="concurso"]) /* ---------- o que faz perder: o verbo a negro, :where(body[data-css~="concurso"]) um traço telha escura ---------- */ .perder,:where(body[data-css~="concurso"]) .traco{ list-style:none; margin:0; padding:0; display:grid; gap:var(--e-3); } :where(body[data-css~="concurso"]) .perder li,:where(body[data-css~="concurso"]) .traco li{ position:relative; padding-left:22px; } :where(body[data-css~="concurso"]) .perder li::before,:where(body[data-css~="concurso"]) .traco li::before{ content:""; position:absolute; left:0; top:.72em; width:12px; height:2px; background:var(--telha-esc); } :where(body[data-css~="concurso"]) .traco li::before{ background:var(--linha-forte); } :where(body[data-css~="concurso"]) .perder b{ font-weight:600; } :where(body[data-css~="concurso"]) .cuidado-t{ margin-top:var(--e-5); font-size:var(--t-corpo); font-family:var(--letra); font-weight:700; } :where(body[data-css~="concurso"]) .bloco .traco{ margin-top:var(--e-3); } :where(body[data-css~="concurso"]) .bloco .traco + p{ margin-top:var(--e-3); } :where(body[data-css~="concurso"]) .bloco .recolher{ margin-top:var(--e-4); } /* ---------- papéis: os de toda a gente e os de «só se for o teu caso» ---------- */ :where(body[data-css~="concurso"]) .papeis-sub{ font-size:var(--t-corpo); font-family:var(--letra); font-weight:700; } :where(body[data-css~="concurso"]) .papeis-caso{ margin-top:var(--e-4); } :where(body[data-css~="concurso"]) .papeis-caso .papeis{ margin-top:var(--e-2); } :where(body[data-css~="concurso"]) /* ---------- cartão de acção ao balcão: ligar e o edital, :where(body[data-css~="concurso"]) em texto ---------- */ .accao-ligs{ display:flex; flex-wrap:wrap; gap:0 var(--e-4); margin-top:var(--e-2); } :where(body[data-css~="concurso"]) .accao-ligs .lig{ font-size:var(--t-apoio); } /* ---------- o «não» do Serve-me? acaba com o passo seguinte ---------- */ :where(body[data-css~="concurso"]) .serve-enquanto{ margin-top:var(--e-3); } :where(body[data-css~="concurso"]) .serve-enquanto h3{ margin-bottom:0; } :where(body[data-css~="concurso"]) .serve-enquanto li a{ color:var(--telha-esc); text-decoration-color:var(--madeira); text-underline-offset:4px; } :where(body[data-css~="concurso"]) .serve-enquanto li p{ margin-top:2px; } /* ---------- partilha: o visto do premido não cola ao texto ---------- */ :where(body[data-css~="concurso"]) #partilha .alternar button[aria-pressed="true"]::before{ margin-right:4px; } /* ---------- a partir de 640 px ---------- */ @media (min-width:640px){ :where(body[data-css~="concurso"]) .casa{ grid-template-columns:112px minmax(0,1fr); } :where(body[data-css~="concurso"]) .casa-mini{ width:112px; aspect-ratio:4/3; } :where(body[data-css~="concurso"]) .fotos-grelha{ grid-template-columns:repeat(2,1fr); } :where(body[data-css~="concurso"]) #partilha .alternar{ display:inline-flex; flex-direction:row; border-radius:var(--r-pilula); } :where(body[data-css~="concurso"]) .serve .opcoes:not(.opcoes-2):not(.opcoes-sn){ grid-template-columns:repeat(auto-fill,minmax(13.5rem,1fr)); } :where(body[data-css~="concurso"]) .outra-vez{ grid-template-columns:1fr auto; align-items:center; padding:var(--e-5) var(--e-6); } :where(body[data-css~="concurso"]) .outra-vez .bt-nota{ grid-column:1 / -1; }} /* ---------- a partir de 1024 px ---------- */ @media (min-width:1024px){ :where(body[data-css~="concurso"]) .concurso-grelha{ padding-top:var(--e-3); } :where(body[data-css~="concurso"]) .concurso-cab{ padding-top:0; } :where(body[data-css~="concurso"]) .bloco{ margin-top:var(--e-7); padding-top:var(--e-7); } :where(body[data-css~="concurso"]) .concurso-resto > .alerta,:where(body[data-css~="concurso"]) .outra-vez{ margin-top:var(--e-7); } :where(body[data-css~="concurso"]) .bloco-duplo{ grid-template-columns:1fr 1fr; gap:var(--e-6); } :where(body[data-css~="concurso"]) .fotos-grelha{ grid-template-columns:repeat(3,1fr); } /* o subtítulo acompanha o título; as datas não fogem 770 px dos rótulos */ :where(body[data-css~="concurso"]) .concurso-cab .heroi-sub{ max-width:56ch; } :where(body[data-css~="concurso"]) .tempo{ max-width:560px; } :where(body[data-css~="concurso"]) .galeria figcaption{ margin-top:4px; } :where(body[data-css~="concurso"]) /* a galeria da página: a grande mais alta, :where(body[data-css~="concurso"]) para a casa se ver */ .galeria{ aspect-ratio:16/9; }} /* ---------- impressão: a folha do concurso ---------- */ @media print{ :where(body[data-css~="concurso"]) .concurso-grelha{ display:block; } :where(body[data-css~="concurso"]) .concurso-principal{ display:block; } :where(body[data-css~="concurso"]) #serve,:where(body[data-css~="concurso"]) #partilha,:where(body[data-css~="concurso"]) .outra-vez,:where(body[data-css~="concurso"]) .alerta,:where(body[data-css~="concurso"]) .casa-mini,:where(body[data-css~="concurso"]) .fotos-folha,:where(body[data-css~="concurso"]) .papeis-pe,:where(body[data-css~="concurso"]) .accao-sec,:where(body[data-css~="concurso"]) .migalhas{ display:none !important; } :where(body[data-css~="concurso"]) .accao{ border:1.5px solid #000; margin-block:12pt; } :where(body[data-css~="concurso"]) .casa{ grid-template-columns:1fr; }} /* ===================================================================== v3 no gerador (27/09): o que a passagem para os dados pediu a mais. ===================================================================== */ /* ---------- a barra fixa esconde-se quando o «Já tens tudo?» se vê ---------- */ body:where([data-css~="concurso"]).barra-fim .barra-fixa{ display:none; } /* ---------- galeria com 1 ou 2 fotografias (a maqueta só tinha 15) ---------- */ :where(body[data-css~="concurso"]) .galeria.n1 figure{ flex-basis:100%; } :where(body[data-css~="concurso"]) .galeria .foto img{ display:block; } @media (min-width:1024px){ :where(body[data-css~="concurso"]) .galeria.n1{ display:block; aspect-ratio:auto; } :where(body[data-css~="concurso"]) .galeria.n1 .foto{ aspect-ratio:16/8; } :where(body[data-css~="concurso"]) .galeria.n2{ grid-template-columns:1fr 1fr; grid-template-rows:1fr; aspect-ratio:16/6; } :where(body[data-css~="concurso"]) .galeria.n2 figure:first-child{ grid-row:auto; }} :where(body[data-css~="concurso"]) /* ---------- a lupa: uma fotografia em grande, :where(body[data-css~="concurso"]) anterior e seguinte ---------- */ dialog.lupa{ position:fixed; inset:0; width:100%; max-width:none; height:100%; max-height:none; margin:0; border:0; padding:var(--e-3) var(--gutter,16px) var(--e-4); background:var(--tinta); color:var(--branco); z-index:80; display:none; flex-direction:column; gap:var(--e-3); } :where(body[data-css~="concurso"]) dialog.lupa[open]{ display:flex; } :where(body[data-css~="concurso"]) dialog.lupa::backdrop{ background:rgba(38,33,28,.85); } :where(body[data-css~="concurso"]) .lupa-topo{ display:flex; align-items:center; justify-content:space-between; gap:var(--e-3); } :where(body[data-css~="concurso"]) .lupa-conta{ font-size:var(--t-apoio); font-weight:600; } :where(body[data-css~="concurso"]) .lupa .fechar{ display:inline-flex; align-items:center; gap:6px; min-height:var(--alvo); padding:0 14px; border:1.5px solid var(--branco); border-radius:var(--r-pilula); background:transparent; color:var(--branco); font-weight:600; font-size:var(--t-apoio); cursor:pointer; } :where(body[data-css~="concurso"]) .lupa .fechar .i{ width:18px; height:18px; } :where(body[data-css~="concurso"]) .lupa-fig{ flex:1; min-height:0; margin:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--e-2); } :where(body[data-css~="concurso"]) .lupa-fig img{ max-width:100%; max-height:calc(100% - 3em); object-fit:contain; border-radius:var(--r-campo); } :where(body[data-css~="concurso"]) .lupa-fig figcaption{ font-size:var(--t-apoio); text-align:center; max-width:var(--larg-texto); } :where(body[data-css~="concurso"]) .lupa-nav{ display:flex; justify-content:center; gap:var(--e-3); } :where(body[data-css~="concurso"]) .lupa-nav .bt-contorno{ background:transparent; color:var(--branco); border-color:var(--branco); } :where(body[data-css~="concurso"]) .lupa-nav .bt-contorno .i{ width:18px; height:18px; } :where(body[data-css~="concurso"]) .fotos-grelha .foto{ display:block; width:100%; padding:0; border:0; background:none; cursor:zoom-in; } /* ---------- cartão de acção: conta a criar e as ligações ---------- */ :where(body[data-css~="concurso"]) .accao-conta{ margin-top:var(--e-3); font-size:var(--t-apoio); color:var(--tinta-2); } :where(body[data-css~="concurso"]) .accao-aberto > .accao-faltam[hidden]{ display:none; } /* ---------- «Como se escolhe» sozinho quando o edital não traz avisos ---------- */ @media (min-width:1024px){ :where(body[data-css~="concurso"]) .bloco-duplo.so-um{ grid-template-columns:1fr; }} /* ---------- o «não» do Serve-me? traz o bloco «Enquanto não abre nada» ---------- */ :where(body[data-css~="concurso"]) .serve-enquanto[hidden]{ display:none; } :where(body[data-css~="concurso"]) .serve-enquanto h3{ font-size:var(--t-3); } /* ---------- casas: a renda por extenso quando não é um número ---------- */ :where(body[data-css~="concurso"]) .casa-renda small:only-child{ font-size:var(--t-apoio); } /* ---------- o concurso FECHADO ---------- */ :where(body[data-css~="concurso"]) .fechado .concurso-cab .chip{ margin-bottom:var(--e-3); } :where(body[data-css~="concurso"]) .accao-fechou h2{ margin-top:4px; } :where(body[data-css~="concurso"]) .accao-fechou .bt{ margin-top:var(--e-4); } :where(body[data-css~="concurso"]) .fechado .aviso{ margin-top:0; } :where(body[data-css~="concurso"]) .fontes-fechado{ margin-top:var(--e-6); font-size:var(--t-apoio); color:var(--tinta-2); } :where(body[data-css~="concurso"]) .factos-fechado{ grid-template-columns:1fr 1fr; } @media (min-width:640px){ :where(body[data-css~="concurso"]) .factos-fechado{ grid-template-columns:repeat(4,1fr); } :where(body[data-css~="concurso"]) .factos-fechado .facto:not(:first-child){ padding-left:var(--e-4); border-left:1px solid var(--linha); } :where(body[data-css~="concurso"]) .factos-fechado .facto{ border-bottom:0; }} @media print{ :where(body[data-css~="concurso"]) .lupa{ display:none !important; }} /* uma fotografia pequena (menos de 800 px) não se estica: mostra-se no tamanho dela */ :where(body[data-css~="concurso"]) .galeria.estreita{ max-width:var(--larg); } @media (min-width:1024px){ :where(body[data-css~="concurso"]) .galeria.n1.estreita .foto{ aspect-ratio:auto; } :where(body[data-css~="concurso"]) .galeria.n1.estreita .foto img{ height:auto; }} :where(body[data-css~="concurso"]) /* o preço do Vigia (cobrança do v3 ligada): o número em serifa, :where(body[data-css~="concurso"]) a frase em letra de apoio (o .aviso-preco do base punha o parágrafo inteiro em letra de título; pedido no PEDIDOS.md) */ .aviso .antes-do-botao.aviso-preco{ font-family:var(--letra); font-size:var(--t-apoio); line-height:1.5; color:var(--tinta-2); } :where(body[data-css~="concurso"]) .aviso .antes-do-botao.aviso-preco b{ font-family:var(--serifa); font-size:var(--t-3); font-weight:500; color:var(--tinta); } /* ===================================================================== 3.ª passagem (27/09): o que o revisor mediu no telemóvel. ===================================================================== */ /* ---------- cabeçalho a 375 px: a marca encolhe, o Menu não sai da margem ---------- (o .marca{flex:none} do base empurrava o Menu 3 px para fora: scrollWidth 378. Remendo desta página até o _base.css o fazer, como nas legais e no «Posso»: PEDIDOS.md) */ @media (max-width:439.98px){ :where(body[data-css~="concurso"]) .topo .menu-bt .menu-bt-txt{ display:none; }} @media (max-width:400px){ :where(body[data-css~="concurso"]) .topo .caixa{ gap:6px; min-width:0; } :where(body[data-css~="concurso"]) .topo .marca{ flex:0 1 auto; min-width:0; gap:8px; } :where(body[data-css~="concurso"]) .topo .marca > span{ min-width:0; } :where(body[data-css~="concurso"]) .topo .marca-desc{ overflow:hidden; text-overflow:ellipsis; }} /* 27/09: a regra que escondia «guia independente» abaixo de 380 px saiu: com o nome rendaacessivel.pt tem de se ver */ /* ---------- barra fixa: em linha de 360 px para cima (cerca de 68 px, não 118) ---------- A ESPEC só a empilha abaixo de 360 px. */ @media (min-width:360px){ :where(body[data-css~="concurso"]) .barra-fixa{ flex-wrap:nowrap; padding-block:8px; padding-bottom:max(8px, env(safe-area-inset-bottom)); } :where(body[data-css~="concurso"]) .barra-fixa-data{ flex:1 1 auto; } :where(body[data-css~="concurso"]) .barra-fixa .bt{ flex:0 0 auto; padding:0 16px; } :where(body[data-css~="concurso"]) .com-barra{ padding-bottom:88px; }} /* ---------- recolhidos: «Cuidado com isto» e «De onde vem isto» ---------- */ :where(body[data-css~="concurso"]) .bloco .recolher.cuidado{ margin-top:var(--e-5); } :where(body[data-css~="concurso"]) .recolher.cuidado summary{ color:var(--tinta); font-weight:700; } :where(body[data-css~="concurso"]) .fontes-bloco .recolher{ border-top:0; } :where(body[data-css~="concurso"]) .fontes-bloco .recolher summary h2{ margin:0; color:var(--tinta); } :where(body[data-css~="concurso"]) .fontes-bloco .recolher + p{ margin-top:var(--e-4); } /* ---------- a conta a criar leva a ligação ao guia ---------- */ :where(body[data-css~="concurso"]) .accao-conta a{ color:var(--telha-esc); font-weight:600; } :where(body[data-css~="concurso"]) /* ---------- a nota do rendimento, :where(body[data-css~="concurso"]) recolhida (o facto do topo já dá o número) ---------- */ .recolher.nota-rend{ margin-top:var(--e-4); } :where(body[data-css~="concurso"]) .recolher.nota-rend .nota-edital{ margin-top:0; } /* ---------- telemóvel: blocos mais juntos (a ficha abaixo de 9 ecrãs, ESPEC 2) ---------- */ @media (max-width:639.98px){ :where(body[data-css~="concurso"]) .bloco{ margin-top:var(--e-5); padding-top:var(--e-5); } :where(body[data-css~="concurso"]) .concurso-resto > .alerta,:where(body[data-css~="concurso"]) .outra-vez{ margin-top:var(--e-5); }} :where(body[data-css~="concurso"]) .recolher.escolha-mais{ margin-top:var(--e-3); } /* ---------- partilha no telemóvel: WhatsApp numa linha, Copiar e Outras formas lado a lado ---------- */ @media (max-width:639.98px){ :where(body[data-css~="concurso"]) #partilha .partilha{ display:grid; grid-template-columns:1fr 1fr; } :where(body[data-css~="concurso"]) #partilha .partilha [data-wa]{ grid-column:1 / -1; } :where(body[data-css~="concurso"]) #partilha .partilha .bt-contorno{ justify-content:center; padding:0 10px; }} @media (max-width:639.98px){ :where(body[data-css~="concurso"]) .papel{ padding-block:10px; } :where(body[data-css~="concurso"]) .papel b{ line-height:1.35; } :where(body[data-css~="concurso"]) .papel small,:where(body[data-css~="concurso"]) .casa-onde,:where(body[data-css~="concurso"]) .casa-min,:where(body[data-css~="concurso"]) .accao-onde,:where(body[data-css~="concurso"]) .fontes-bloco p{ line-height:1.45; }} @media (max-width:639.98px){ :where(body[data-css~="concurso"]) .bloco > h2{ margin-bottom:var(--e-3); } :where(body[data-css~="concurso"]) .regras{ gap:var(--e-2); }} /* 27/09 · o prazo no primeiro ecrã do telemóvel (o cartão de acção desce abaixo dos 1024 px) */ :where(body[data-css~="concurso"]) .prazo-movel{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--e-2) var(--e-3); margin:var(--e-2) 0 0; } @media (min-width:1024px){ :where(body[data-css~="concurso"]) .prazo-movel{ display:none; }}