/* ==== apoios.css · só em body[data-css~="apoios"] ==== */
/* =====================================================================
   rendaacessivel.pt · apoios.css (só a página dos apoios à renda)
   O resto vem do base.css. Nenhum font-size fora de var(--t-*).
   ===================================================================== */

:where(body[data-css~="apoios"]) /* a secção única: migalhas, :where(body[data-css~="apoios"]) e por baixo a grelha (título e pergunta à esquerda, lista à direita) */
.apoios-sec{ padding-block:0 var(--e-7); }
:where(body[data-css~="apoios"]) .apoios-heroi{ padding-block:var(--abre) var(--e-5); }   /* sem migalhas (1.º nível, decisão do dono 27/09): abre como as outras */
:where(body[data-css~="apoios"]) .apoios-heroi .heroi-sub{ max-width:38ch; }
:where(body[data-css~="apoios"]) .apoios-heroi .prova{ margin-top:var(--e-4); }

:where(body[data-css~="apoios"]) .apoios-grelha{ display:grid; gap:var(--e-6); grid-template-columns:minmax(0,1fr); }

/* ---------- o cartão das perguntas ---------- */
:where(body[data-css~="apoios"]) .descobre .pergunta{ padding:var(--e-5) 20px; }
:where(body[data-css~="apoios"]) .descobre .progresso span{ width:18px; }
:where(body[data-css~="apoios"]) .descobre .pergunta-dica{ max-width:38ch; }
:where(body[data-css~="apoios"]) .descobre .opcoes{ grid-template-columns:1fr; }
:where(body[data-css~="apoios"]) .descobre .opcoes-sn{ grid-template-columns:1fr 1fr; }
:where(body[data-css~="apoios"]) .descobre .terras .chip{ min-height:var(--alvo); }
:where(body[data-css~="apoios"]) .descobre .pergunta-pes .lig{ min-height:var(--alvo); }
:where(body[data-css~="apoios"]) /* o toque escolhido fica marcado a oliva, :where(body[data-css~="apoios"]) com visto, :where(body[data-css~="apoios"]) meio segundo antes de avançar */
.descobre .opcao:has(input:checked){ background:var(--oliva); border-color:var(--oliva); color:#fff; gap:10px; }
:where(body[data-css~="apoios"]) .descobre .opcao:has(input:checked)::before{ content:""; flex:none; width:8px; height:14px; border-right:2.5px solid currentColor; border-bottom:2.5px solid currentColor; transform:rotate(45deg) translate(-2px,-2px); }
:where(body[data-css~="apoios"]) .descobre .escolhido .opcao:not(:has(input:checked)){ opacity:.55; }
:where(body[data-css~="apoios"]) .descobre-intro{ display:flex; gap:var(--e-3); align-items:flex-start; margin-top:var(--e-4); font-size:var(--t-apoio); color:var(--tinta-2); }
:where(body[data-css~="apoios"]) .descobre-intro .i{ width:20px; height:20px; margin-top:3px; color:var(--oliva); flex:none; }
:where(body[data-css~="apoios"]) .descobre .entrada-ic{ margin-top:var(--e-3); }
:where(body[data-css~="apoios"]) .sugestoes{ list-style:none; margin:var(--e-2) 0 0; padding:0; border:1.5px solid var(--linha-forte); border-radius:var(--r-campo); background:var(--branco); overflow:hidden; }
:where(body[data-css~="apoios"]) .sugestoes button{ display:flex; width:100%; align-items:center; min-height:var(--alvo); padding:0 var(--e-4); border:0; border-top:1px solid var(--linha); background:var(--branco); text-align:left; font-weight:600; }
:where(body[data-css~="apoios"]) .sugestoes li:first-child button{ border-top:0; }
:where(body[data-css~="apoios"]) .sugestoes button:hover,:where(body[data-css~="apoios"]) .sugestoes button[aria-selected="true"]{ background:var(--cal); }

:where(body[data-css~="apoios"]) /* o cartão já respondido: «Feito» em vez da barra, :where(body[data-css~="apoios"]) e um resumo que se muda com um toque */
.feito-marca{ display:inline-flex; align-items:center; gap:6px; font-size:var(--t-apoio); font-weight:600; color:var(--oliva); }
:where(body[data-css~="apoios"]) .feito-marca .i{ width:18px; height:18px; }
:where(body[data-css~="apoios"]) .feito-resumo h2{ font-size:var(--t-3); }
:where(body[data-css~="apoios"]) .feito-resumo .respostas{ margin-top:var(--e-4); }
:where(body[data-css~="apoios"]) .feito-resumo .resposta{ text-align:left; }
:where(body[data-css~="apoios"]) .resumo-frase{ margin-top:var(--e-2); color:var(--tinta-2); font-size:var(--t-apoio); }
:where(body[data-css~="apoios"]) .feito-resumo .respostas{ display:none; }
:where(body[data-css~="apoios"]) .feito-resumo.aberto .respostas{ display:flex; }
:where(body[data-css~="apoios"]) .feito-resumo .respostas .pergunta-dica{ flex-basis:100%; margin:0; }
:where(body[data-css~="apoios"]) .feito-resumo .pergunta-pes{ justify-content:space-between; flex-wrap:wrap; }

/* ---------- a lista dos apoios ---------- */
:where(body[data-css~="apoios"]) .lista-cab h2{ font-size:var(--t-2); }
:where(body[data-css~="apoios"]) .lista-cab > p{ color:var(--tinta-2); margin-top:var(--e-2); max-width:44ch; }
:where(body[data-css~="apoios"]) .lista-cab .faixa{ margin-top:var(--e-4); }
:where(body[data-css~="apoios"]) .lista-cab .faixa + .faixa{ margin-top:var(--e-3); }
:where(body[data-css~="apoios"]) .grupo{ margin-top:var(--e-6); }
:where(body[data-css~="apoios"]) .grupo:first-of-type{ margin-top:var(--e-5); }
:where(body[data-css~="apoios"]) /* o título do grupo e, :where(body[data-css~="apoios"]) por baixo, :where(body[data-css~="apoios"]) uma frase simples (nada de metadados à direita) */
.grupo-cab{ padding-bottom:var(--e-3); border-bottom:1px solid var(--linha); }
:where(body[data-css~="apoios"]) .grupo-cab h3{ font-size:var(--t-3); }
:where(body[data-css~="apoios"]) .grupo-cab p{ margin-top:2px; font-size:var(--t-apoio); color:var(--tinta-2); }
:where(body[data-css~="apoios"]) .grupo-urgente .grupo-cab h3{ color:var(--telha-esc); }
:where(body[data-css~="apoios"]) .grupo-camara .grupo-cab h3{ color:var(--oliva); }

:where(body[data-css~="apoios"]) .apoios{ list-style:none; margin:var(--e-4) 0 0; padding:0; display:grid; gap:var(--e-3); }

:where(body[data-css~="apoios"]) /* um apoio: o número por cima do título, :where(body[data-css~="apoios"]) e o «até» sempre na mesma linha do número */
li.apoio{
  position:relative; display:flex; flex-direction:column; gap:var(--e-3);
  padding:20px; background:var(--branco); border:1px solid var(--linha); border-radius:var(--r-cartao);
  transition:border-color var(--dur);
}
:where(body[data-css~="apoios"]) li.apoio:hover{ border-color:var(--linha-forte); }
:where(body[data-css~="apoios"]) .apoio-num{ font-family:var(--serifa); font-size:var(--t-2); line-height:1.1; font-weight:500; letter-spacing:-.015em; color:var(--tinta); }
:where(body[data-css~="apoios"]) .apoio-num .ant{ font-family:var(--letra); font-size:var(--t-rotulo); font-weight:600; letter-spacing:0; color:var(--tinta-2); margin-right:6px; }
:where(body[data-css~="apoios"]) .apoio-num small{ display:block; margin-top:4px; font-family:var(--letra); font-size:var(--t-apoio); font-weight:400; line-height:1.35; letter-spacing:0; color:var(--tinta-2); }
:where(body[data-css~="apoios"]) li.apoio.camara .apoio-num{ color:var(--oliva); }
:where(body[data-css~="apoios"]) .apoio-corpo{ display:flex; flex-direction:column; gap:6px; min-width:0; }
:where(body[data-css~="apoios"]) .apoio-corpo h4{ font-family:var(--serifa); font-size:var(--t-3); line-height:1.22; font-weight:500; }
:where(body[data-css~="apoios"]) .apoio-corpo h4 a{ color:var(--tinta); text-decoration:none; }
:where(body[data-css~="apoios"]) .apoio-corpo h4 a::after{ content:""; position:absolute; inset:0; z-index:1; border-radius:var(--r-cartao); }
:where(body[data-css~="apoios"]) .apoio-corpo h4 a:focus-visible{ outline:0; box-shadow:none; }
:where(body[data-css~="apoios"]) li.apoio:has(h4 a:focus-visible){ outline:3px solid var(--tinta); outline-offset:3px; }
:where(body[data-css~="apoios"]) li.apoio:hover h4 a{ color:var(--telha-esc); }
:where(body[data-css~="apoios"]) .apoio-faz{ color:var(--tinta); }
:where(body[data-css~="apoios"]) .apoio-confirma{ display:flex; gap:8px; align-items:flex-start; font-size:var(--t-apoio); color:var(--tinta); }
:where(body[data-css~="apoios"]) .apoio-confirma .i{ width:18px; height:18px; margin-top:3px; color:var(--oliva); flex:none; }
:where(body[data-css~="apoios"]) .apoio-nota{ font-size:var(--t-apoio); color:var(--tinta-2); }
:where(body[data-css~="apoios"]) .apoio-pe{ display:flex; flex-direction:column; align-items:flex-start; gap:var(--e-1); margin-top:var(--e-2); padding-top:var(--e-3); border-top:1px solid var(--linha); font-size:var(--t-apoio); color:var(--tinta-2); }
:where(body[data-css~="apoios"]) .apoio-pe b{ color:var(--tinta); font-weight:600; }
:where(body[data-css~="apoios"]) .apoio-pe .ver{ display:inline-flex; align-items:center; gap:6px; font-weight:600; color:var(--telha-esc); }
:where(body[data-css~="apoios"]) li.apoio .chip{ align-self:flex-start; }
/* o botão do site oficial fica por cima da ligação do cartão inteiro */
:where(body[data-css~="apoios"]) .apoio-pedir{ position:relative; z-index:2; align-self:flex-start; margin-top:var(--e-2); gap:8px; }
:where(body[data-css~="apoios"]) .apoio-pedir .i{ width:18px; height:18px; }

:where(body[data-css~="apoios"]) /* a razão: «Serve-te» a oliva e firme; «Talvez» mais leve, :where(body[data-css~="apoios"]) só a palavra a madeira; «Não te serve» em tinta 2 */
li.apoio .cartao-razao{ margin-top:2px; align-items:flex-start; }
:where(body[data-css~="apoios"]) li.apoio .cartao-razao .i{ width:18px; height:18px; margin-top:3px; flex:none; }
:where(body[data-css~="apoios"]) li.apoio .cartao-razao b{ font-weight:700; }
:where(body[data-css~="apoios"]) li.apoio .cartao-razao.talvez{ color:var(--tinta-2); font-weight:400; }
:where(body[data-css~="apoios"]) li.apoio .cartao-razao.talvez b{ color:var(--madeira-esc); }
:where(body[data-css~="apoios"]) li.apoio .cartao-razao.talvez .i{ color:var(--madeira-esc); }
:where(body[data-css~="apoios"]) li.apoio .cartao-razao.nao{ color:var(--tinta-2); font-weight:400; }
:where(body[data-css~="apoios"]) li.apoio .cartao-razao.nao b{ color:var(--tinta); }
/* não serve: o texto fica inteiro e legível; só muda o fundo */
:where(body[data-css~="apoios"]) li.apoio.nao-serve{ background:var(--cal); }

/* nenhum serve: nunca um beco */
:where(body[data-css~="apoios"]) .apoios-vazio .enquanto{ margin-top:var(--e-5); }

:where(body[data-css~="apoios"]) /* o certificado do PAA não é um apoio: uma nota em faixa, :where(body[data-css~="apoios"]) sem contorno */
.nota-paa{ margin-top:var(--e-6); padding:var(--e-4) 20px; background:var(--cal-2); border-radius:var(--r-cartao); font-size:var(--t-apoio); color:var(--tinta-2); }
:where(body[data-css~="apoios"]) .nota-paa b{ color:var(--tinta); font-weight:700; }
:where(body[data-css~="apoios"]) .nota-paa .lig{ display:inline-flex; align-items:center; gap:6px; margin-top:var(--e-2); font-weight:600; }

/* a fonte: um só bloco */
:where(body[data-css~="apoios"]) .fonte-apoios{ display:flex; gap:var(--e-3); align-items:flex-start; margin-top:var(--e-5); font-size:var(--t-apoio); color:var(--tinta-2); max-width:var(--larg-texto); }
:where(body[data-css~="apoios"]) .fonte-apoios .i{ width:20px; height:20px; margin-top:3px; color:var(--oliva); flex:none; }

/* partilhar */
:where(body[data-css~="apoios"]) .apoios-fim-sec{ padding-top:0; }
:where(body[data-css~="apoios"]) .partilhar-apoios{ background:var(--branco); border:1px solid var(--linha); border-radius:var(--r-cartao); padding:var(--e-5) 20px; }
:where(body[data-css~="apoios"]) .partilhar-apoios h2{ font-size:var(--t-3); }
:where(body[data-css~="apoios"]) .partilhar-apoios p{ color:var(--tinta-2); margin-top:var(--e-2); max-width:48ch; }
:where(body[data-css~="apoios"]) .partilhar-apoios .alternar{ margin-top:var(--e-4); }
:where(body[data-css~="apoios"]) .partilhar-apoios .partilha-previa{ color:var(--tinta); background:var(--cal); max-width:48ch; }
:where(body[data-css~="apoios"]) .partilhar-apoios .partilha{ margin-top:var(--e-4); }

@media (min-width:640px){
  :where(body[data-css~="apoios"]) li.apoio{ padding:var(--e-5); }
  :where(body[data-css~="apoios"]) .apoio-num small{ display:inline; margin:0 0 0 8px; }
  :where(body[data-css~="apoios"]) .apoio-pe{ flex-direction:row; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:var(--e-1) var(--e-3); }
  :where(body[data-css~="apoios"]) .descobre .pergunta{ padding:var(--e-6); }
  :where(body[data-css~="apoios"]) .partilhar-apoios{ padding:var(--e-6); display:grid; grid-template-columns:1fr auto; gap:var(--e-5); align-items:end; }
  :where(body[data-css~="apoios"]) .partilhar-apoios .partilha{ margin-top:0; flex-direction:column; align-items:stretch; }}
@media (min-width:1024px){
  :where(body[data-css~="apoios"]) .apoios-grelha{ grid-template-columns:420px minmax(0,1fr); gap:var(--e-7); align-items:stretch; }
  :where(body[data-css~="apoios"]) .apoios-heroi{ padding-block:var(--abre) var(--e-5); }
  :where(body[data-css~="apoios"]) .col-esq{ min-width:0; }
  :where(body[data-css~="apoios"]) .descobre{ position:sticky; top:calc(var(--topo) + 24px); }
  :where(body[data-css~="apoios"]) .lista{ padding-top:calc(var(--abre) + 10px); align-self:start; }   /* o h2 da lista na linha do h1 */
  :where(body[data-css~="apoios"]) .feito-resumo .respostas{ display:flex; }
  :where(body[data-css~="apoios"]) .feito-resumo .resumo-frase,:where(body[data-css~="apoios"]) .feito-resumo .mudar-bt{ display:none; }
  :where(body[data-css~="apoios"]) .descobre .pergunta{ padding:var(--e-5); }}
@media print{
  :where(body[data-css~="apoios"]) .descobre,:where(body[data-css~="apoios"]) .partilhar-apoios{ display:none !important; }
  :where(body[data-css~="apoios"]) li.apoio{ break-inside:avoid; }}

:where(body[data-css~="apoios"]) /* a faixa da terra, :where(body[data-css~="apoios"]) quando desce para depois da Porta de Entrada */
#na-terra .faixa{ margin-top:var(--e-4); }
:where(body[data-css~="apoios"]) #na-terra .faixa + .faixa{ margin-top:var(--e-3); }

:where(body[data-css~="apoios"]) /* o rodapé cola ao último bloco, :where(body[data-css~="apoios"]) que já traz o seu espaço (estava num style="" no HTML) */
.rodape{ margin-top:0; }

/* ---------- as páginas de cada apoio também carregam este ficheiro (css=["apoio","apoios"]):
   por isso os cartões acima são li.apoio, e o invólucro div.apoio da página fica de fora.
   No telemóvel, a grelha do fim não pode crescer com a ligação da pré-visualização
   (em /apoios/porta65mais.html passava a 421 px num ecrã de 390). ---------- */
@media (max-width:1023.98px){
  :where(body[data-css~="apoios"]) .fim-grelha{ grid-template-columns:minmax(0,1fr); }}
:where(body[data-css~="apoios"]) .fim-grelha .partilha-previa{ overflow-wrap:anywhere; }
/* a lista das quatro câmaras no «Quanto dá» do subsídio municipal */
:where(body[data-css~="apoios"]) .camaras-apoio{ margin-block:var(--e-4); }
:where(body[data-css~="apoios"]) .camaras-apoio .cam-aberta{ color:var(--oliva); font-weight:600; }
:where(body[data-css~="apoios"]) .camaras-apoio .cam-fechada{ color:var(--tinta-2); }
/* o «Quanto dá» com dois campos (renda e rendimento) */
:where(body[data-css~="apoios"]) .conta-campos{ display:grid; gap:var(--e-4); }
:where(body[data-css~="apoios"]) .apoio-aviso{ margin-top:var(--e-4); max-width:var(--larg-texto); }
:where(body[data-css~="apoios"]) .accao-texto{ margin-top:var(--e-3); color:var(--tinta-2); font-size:var(--t-apoio); }
:where(body[data-css~="apoios"]) .ver-todos{ margin-top:var(--e-4); }
:where(body[data-css~="apoios"]) .accao > .chip{ margin-top:var(--e-3); }   /* o chip que não é «aberto» (Depende da câmara, Pede-se na câmara) também respira */

/* cabeçalho a 375 px: o Menu passava 3 px da margem (remendo igual ao das legais; o defeito é do _base.css, ver PEDIDOS) */
@media (max-width:400px){
  :where(body[data-css~="apoios"]) .topo .caixa{ gap:6px; }
  :where(body[data-css~="apoios"]) .marca{ flex:0 1 auto; min-width:0; gap:8px; }
  :where(body[data-css~="apoios"]) .marca > span{ min-width:0; }
  :where(body[data-css~="apoios"]) .marca-desc{ overflow:hidden; text-overflow:ellipsis; }}