/* Guia Sénior. A lista do concelho: o nome, o telefone, a data.
   Regras em DESIGN.md. O azul orienta, o roxo age; nada abaixo de 16 px; filetes em vez de cartões. */

@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 600 800; font-display: swap; src: url('../fonts/montserrat-latin.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/poppins-400-latin.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/poppins-500-latin.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/poppins-600-latin.woff2') format('woff2'); }

:root {
  --tinta: #222222;
  --tinta-2: #555555;
  --linha: #DADADA;
  --borda: #767676;
  --pontos: #B5B5B5;
  --fundo: #FFFFFF;
  --acao: #88368C;
  --acao-escura: #6F2B73;
  --acao-fundo: #F6EEF6;
  --azul: #015C84;
  --azul-escuro: #01405C;
  --azul-marca: #008AC5;
  --roxo-marca: #954996;
  --painel: #EAF3F8;
  --verde: #1F7A3A;
  --f-tit: 'Montserrat', 'Arial Black', Arial, sans-serif;
  --f-txt: 'Poppins', 'Helvetica Neue', Arial, sans-serif;
  --margem: 20px;
  color-scheme: light;
}
@media (min-width: 900px) { :root { --margem: 40px; } }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background: var(--fundo); color: var(--tinta); font: 400 18px/1.55 var(--f-txt); }
img { max-width: 100%; height: auto; }
a { color: var(--azul); text-underline-offset: 0.15em; }
a:hover { color: var(--azul-escuro); }
:focus-visible { outline: 3px solid var(--azul-marca); outline-offset: 2px; }
h1:focus { outline: none; }
::selection { background: #D9E9F2; color: var(--tinta); }
button, input, select, textarea { font: inherit; color: inherit; }
.ico { width: 20px; height: 20px; flex: none; }
.so-leitor { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.saltar { position: absolute; left: 8px; top: -60px; z-index: 50; background: var(--tinta); color: #fff; padding: 12px 16px; text-decoration: none; }
.saltar:focus { top: 8px; color: #fff; }

.wrap { max-width: 1180px; margin: 0 auto; padding: 0 var(--margem); }
.n { font-family: var(--f-tit); font-weight: 800; color: var(--azul); }
.num { font-family: var(--f-tit); font-weight: 700; font-variant-numeric: tabular-nums; }

/* ---------------------------------------------------------------- cabeçalho */
.topo { border-bottom: 1px solid var(--linha); background: var(--fundo); }
.topo .wrap { min-height: 64px; display: flex; align-items: center; gap: 8px; padding-right: 8px; }
.topo__marca { display: flex; margin-right: auto; min-width: 0; }
.topo__marca picture { display: block; min-width: 0; }
/* sem lema a 28 px de altura; em ecrãs estreitos encolhe por inteiro para «Procurar» e «Menu» caberem com a palavra */
.topo__marca img { display: block; width: 169px; max-width: 100%; height: auto; }
.topo__nav { display: none; }
.topo__bt { min-height: 48px; padding: 0 8px; display: inline-flex; align-items: center; gap: 6px; font: 500 16px var(--f-txt); color: var(--tinta); text-decoration: none; background: none; border: 0; cursor: pointer; }
.topo__bt:hover { color: var(--azul); }
.menu { position: relative; }
.menu > summary { list-style: none; }
.menu > summary::-webkit-details-marker { display: none; }
.menu[open] > summary .ico-menu { display: none; }
.menu:not([open]) > summary .ico-fechar { display: none; }
.menu__painel { position: absolute; right: 0; top: 100%; z-index: 30; width: min(340px, calc(100vw - 32px)); background: var(--fundo); border: 1px solid var(--linha); border-top: 0; padding: 4px 20px 12px; }
.menu__painel a { display: flex; align-items: center; min-height: 52px; border-bottom: 1px solid var(--linha); color: var(--tinta); text-decoration: none; font-size: 18px; font-weight: 500; }
.menu__painel a:last-child { border-bottom: 0; }
/* a navegação por extenso só a partir de 1180 px: abaixo disso não cabe numa linha com o logótipo completo */
@media (min-width: 1180px) {
  .topo .wrap { min-height: 88px; padding-right: var(--margem); gap: 8px 24px; }
  .topo__marca img { width: 232px; }
  .topo__nav { display: flex; flex-wrap: wrap; gap: 4px 18px; }
  .topo__nav a { padding: 10px 0; color: var(--tinta); text-decoration: none; font-size: 16px; font-weight: 500; border-bottom: 3px solid transparent; }
  .topo__nav a:hover { color: var(--azul); }
  .topo__nav a[aria-current] { border-color: var(--azul-marca); }
  .menu { display: none; }
  .topo__procurar { border: 1.5px solid var(--borda); border-radius: 4px; padding: 0 16px; }
}

/* ---------------------------------------------------------------- faixa, migalhas, títulos */
.faixa { background: var(--azul); color: #fff; }
.faixa p { margin: 0 auto; max-width: 1180px; padding: 13px var(--margem); font: 700 16px/1.3 var(--f-tit); letter-spacing: 0.08em; text-transform: uppercase; }
.corpo { padding: 16px 0 48px; }
.migalhas { font-size: 16px; line-height: 1.5; color: var(--tinta-2); }
.migalhas a { color: var(--azul); }
.titulo { margin: 14px 0 0; font: 800 30px/1.15 var(--f-tit); letter-spacing: -0.01em; text-wrap: balance; }
@media (min-width: 900px) { .titulo { font-size: 44px; line-height: 1.1; letter-spacing: -0.015em; } }
.lead { margin: 12px 0 0; max-width: 62ch; font-size: 18px; line-height: 1.55; }
@media (min-width: 900px) { .lead { font-size: 20px; } }
.fonte { margin: 6px 0 0; font-size: 16px; line-height: 1.5; color: var(--tinta-2); }
.fonte a { color: var(--azul); }
.fim { margin-top: 26px; padding-top: 14px; border-top: 1px solid var(--linha); }
.h2 { margin: 34px 0 8px; font: 800 21px/1.2 var(--f-tit); text-wrap: balance; }
@media (min-width: 900px) { .h2 { font-size: 22px; } }
.texto { max-width: 68ch; }
.texto p { margin: 12px 0 0; }

/* ---------------------------------------------------------------- botões */
.bt, .bt-2 { min-height: 56px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 8px 22px; border-radius: 4px; font: 600 18px/1.25 var(--f-txt); text-align: center; text-decoration: none; cursor: pointer; }
.bt { background: var(--acao); color: #fff; border: 0; }
.bt:hover { background: var(--acao-escura); color: #fff; }
.bt-2 { background: var(--fundo); color: var(--acao); border: 2px solid var(--acao); }
.bt-2:hover { background: var(--acao-fundo); color: var(--acao); }
.bt--largo { width: 100%; }
.bt-cinza { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 14px; border: 1.5px solid var(--borda); border-radius: 4px; background: var(--fundo); color: var(--tinta); font: 500 16px var(--f-txt); cursor: pointer; text-decoration: none; }
.acao-txt { min-height: 48px; display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; background: none; color: var(--acao); font: 600 16px var(--f-txt); text-decoration: none; cursor: pointer; }
.acao-txt:hover { color: var(--acao-escura); text-decoration: underline; }
.acoes { display: flex; flex-wrap: wrap; gap: 4px 20px; margin-top: 14px; }

/* ---------------------------------------------------------------- pesquisa */
.pesquisa { margin-top: 26px; max-width: 640px; }
.pesquisa label { display: block; margin-bottom: 10px; font-size: 18px; font-weight: 600; line-height: 1.4; }
.pesquisa__linha { display: flex; flex-wrap: wrap; gap: 12px; }
.campo { width: 100%; min-height: 56px; padding: 0 16px; border: 1.5px solid var(--borda); border-radius: 4px; background: var(--fundo); font-size: 18px; }
.campo::placeholder { color: #666666; }
.pesquisa__linha .campo { flex: 1 1 260px; }
.pesquisa__linha .bt { flex: 1 1 160px; }
@media (min-width: 600px) { .pesquisa__linha .bt { flex: 0 0 auto; } }
.sugestoes { list-style: none; margin: 0; padding: 0; max-width: 640px; }
.sugestoes a { display: block; min-height: 56px; padding: 9px 4px; border-bottom: 1px solid var(--linha); color: var(--tinta); text-decoration: none; font-weight: 600; font-size: 17px; line-height: 1.35; }
.sugestoes a:hover, .sugestoes a[aria-selected="true"] { background: var(--painel); }
.sugestoes small { display: block; font-size: 15px; font-weight: 400; color: var(--tinta-2); }

/* ---------------------------------------------------------------- listas de navegação */
.navlista { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--linha); }
.navlista li { border-top: 1px solid var(--linha); }
.navlista a { min-height: 56px; display: flex; align-items: center; gap: 12px; color: var(--tinta); text-decoration: none; font-size: 18px; font-weight: 500; }
.navlista a:hover { color: var(--azul); }
.navlista span { flex: 1; }
.navlista b { font-family: var(--f-tit); font-weight: 700; color: var(--azul); font-variant-numeric: tabular-nums; }
.navlista .ico { color: var(--tinta-2); }
.indice { list-style: none; margin: 0; padding: 0; columns: 2 160px; column-gap: 32px; }
.indice li { break-inside: avoid; border-top: 1px solid var(--linha); }
.indice a { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 17px; font-weight: 500; text-decoration: none; color: var(--tinta); }
.indice a:hover { color: var(--azul); }
.indice b { font-family: var(--f-tit); font-weight: 700; color: var(--azul); font-variant-numeric: tabular-nums; }

/* ---------------------------------------------------------------- separadores e filtros */
.sep { display: flex; gap: 24px; overflow-x: auto; border-bottom: 1px solid var(--linha); margin-top: 20px; scrollbar-width: none; }
.sep::-webkit-scrollbar { display: none; }
.sep a { flex: none; max-width: 140px; padding: 8px 0 10px; border-bottom: 4px solid transparent; margin-bottom: -1px; color: var(--tinta-2); text-decoration: none; font-size: 16px; font-weight: 500; line-height: 1.3; }
.sep a b { display: block; font: 700 20px/1.3 var(--f-tit); font-variant-numeric: tabular-nums; }
.sep a[aria-current] { color: var(--tinta); font-weight: 600; border-color: var(--azul-marca); }
.sep a[aria-current] b { color: var(--azul); font-weight: 800; }
@media (min-width: 900px) { .sep a { max-width: none; } .sep a b { display: inline; margin-left: 6px; } }
.filtros { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.filtros select { flex: 1 1 100%; min-width: 0; min-height: 48px; padding: 0 10px; border: 1.5px solid var(--borda); border-radius: 4px; background: var(--fundo); font: 500 16px var(--f-txt); }
.filtros .bt-cinza { flex: 1 1 100%; }
@media (min-width: 600px) { .filtros select { flex: 1 1 200px; } .filtros .bt-cinza { flex: 0 1 auto; } }
@media (min-width: 900px) { .filtros select { flex: 0 1 auto; max-width: 280px; } }

/* ---------------------------------------------------------------- a lista do concelho */
.colunas { display: block; }
@media (min-width: 1000px) {
  .colunas { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 48px; align-items: start; margin-top: 8px; }
}
.lista { list-style: none; margin: 18px 0 0; padding: 0; border-bottom: 1px solid var(--linha); }
.linha { border-top: 1px solid var(--linha); padding: 16px 0 6px; }
.linha__nome { display: block; font-size: 19px; font-weight: 600; line-height: 1.3; color: var(--tinta); text-decoration: none; }
.linha__nome:hover { text-decoration: underline; color: var(--tinta); }
.linha__nome:visited { color: var(--roxo-marca); }
.linha__meta { margin-top: 4px; font-size: 16px; line-height: 1.45; color: var(--tinta-2); }
.linha__nota { margin-top: 6px; display: flex; gap: 8px; align-items: flex-start; font-size: 16px; line-height: 1.4; }
.linha__nota .ico { color: var(--verde); margin-top: 2px; width: 18px; height: 18px; }
.linha__vaga { margin-top: 6px; font-size: 16px; font-weight: 600; color: var(--verde); }
.linha__fim { display: flex; align-items: center; gap: 10px; }
.linha__lug { font-size: 16px; color: var(--tinta-2); white-space: nowrap; }
.pontos { flex: 1; min-width: 12px; border-bottom: 2px dotted var(--pontos); margin-top: 6px; }
.tel { min-height: 48px; display: inline-flex; align-items: center; gap: 8px; color: var(--acao); text-decoration: none; font: 700 18px var(--f-tit); font-variant-numeric: tabular-nums; white-space: nowrap; }
.tel:hover { color: var(--acao-escura); text-decoration: underline; }
.tel .ico { width: 19px; height: 19px; }
.sem-tel { font-size: 16px; color: var(--tinta-2); }
.lista__cab { display: none; }
@media (min-width: 1000px) {
  .lista__cab, .linha { display: grid; grid-template-columns: minmax(0, 1fr) 120px 110px 170px; column-gap: 20px; align-items: baseline; }
  .lista__cab { margin-top: 18px; padding: 10px 0; border-bottom: 2px solid var(--tinta); font-size: 15px; font-weight: 600; }
  .lista__cab + .lista { margin-top: 0; }
  .lista__cab + .lista .linha:first-child { border-top: 0; }
  .linha__lug .unid { display: none; }
  .linha__lug { font-family: var(--f-tit); font-weight: 600; font-variant-numeric: tabular-nums; color: var(--tinta); }
  .lista__cab span:nth-child(n+2), .linha .col-num { text-align: right; }
  .linha { padding: 12px 0; }
  .linha__principal { grid-column: 1; }
  .linha__fim { display: contents; }
  .linha__lug { grid-column: 2; text-align: right; }
  .linha .col-ocup { grid-column: 3; text-align: right; font-size: 16px; color: var(--tinta-2); font-family: var(--f-tit); font-variant-numeric: tabular-nums; }
  .linha .pontos { display: none; }
  .linha .tel, .linha .sem-tel { grid-column: 4; justify-self: end; min-height: 40px; }
}
.col-ocup { display: none; }
@media (min-width: 1000px) { .col-ocup { display: block; } }
.vazio { margin-top: 18px; padding: 18px 20px; background: var(--painel); font-size: 17px; }

/* destaque pago: por cima da lista oficial, que não muda */
.destaques { margin-top: 18px; border: 1px solid var(--linha); padding: 14px 16px 4px; }
.destaques__rotulo { margin: 0; font-size: 15px; font-weight: 600; color: var(--tinta-2); }
.destaque { display: flex; gap: 12px; padding: 12px 0; }
.destaque + .destaque { border-top: 1px solid var(--linha); }
.destaque img { flex: none; width: 84px; height: 84px; object-fit: cover; }
.destaque__corpo { flex: 1; min-width: 0; }
.destaque__vaga { display: flex; align-items: center; gap: 6px; margin-top: 4px; font-weight: 600; font-size: 16px; color: var(--verde); }
.lista-oficial { margin: 24px 0 0; font-size: 16px; font-weight: 600; color: var(--tinta-2); }

/* ---------------------------------------------------------------- painéis e lateral */
.painel { margin-top: 24px; background: var(--painel); padding: 20px 20px 22px; }
.painel h2 { margin: 0; font: 800 21px/1.2 var(--f-tit); }
.painel p { margin: 10px 0 16px; font-size: 17px; line-height: 1.55; }
.lateral > * + * { margin-top: 28px; }
.lateral .painel { margin-top: 0; }
@media (min-width: 1000px) { .lateral .h2 { margin-top: 0; } }

/* ---------------------------------------------------------------- publicidade */
.pub { margin-top: 26px; border-top: 1px solid var(--linha); border-bottom: 1px solid var(--linha); padding: 12px 0 18px; }
.pub__rotulo { margin: 0 0 10px; font-size: 15px; font-weight: 600; color: var(--tinta-2); }
.pub__img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.pub__marca { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.pub__marca img { height: 28px; width: auto; }
.pub__marca span { font-weight: 700; }
.pub h3 { margin: 10px 0 0; font-size: 19px; font-weight: 600; line-height: 1.35; }
.pub p { margin: 6px 0 0; font-size: 17px; line-height: 1.5; }
.pub__bt { margin-top: 14px; min-height: 52px; display: flex; align-items: center; justify-content: center; border: 2px solid currentColor; border-radius: 4px; font-size: 17px; font-weight: 600; text-decoration: none; }
/* O nativo decide pela largura do sítio onde está, não pela do ecrã: estreito (telemóvel,
   coluna lateral) fica empilhado; largo (coluna principal e artigos no computador) fica
   horizontal, fotografia a um terço e o botão do tamanho do texto. */
.pub { container-type: inline-size; font-size: 17px; line-height: 1.5; }
/* dentro de um artigo, o anúncio não herda as letras do texto: é igual em todas as páginas */
.pub .pub__rotulo { margin: 0 0 10px; font-size: 15px; line-height: 1.4; font-weight: 600; color: var(--tinta-2); }
.pub .pub__texto h3 { margin: 10px 0 0; font: 600 19px/1.35 var(--f-txt); letter-spacing: 0; }
.pub .pub__texto p { margin: 6px 0 0; font-size: 17px; line-height: 1.5; }
@container (min-width: 560px) {
  .pub__corpo { display: grid; grid-template-columns: minmax(200px, 36%) minmax(0, 1fr); gap: 24px; align-items: start; }
  .pub__corpo--sem-img { grid-template-columns: minmax(0, 1fr); }
  .pub__texto > .pub__marca { margin-top: 0; }
  .pub__bt { display: inline-flex; padding: 0 24px; }
}
.pub--banner { border: 0; padding: 0; }
.pub--banner a { display: block; width: 300px; max-width: 100%; }
.pub--banner img { display: block; width: 300px; height: 250px; max-width: 100%; object-fit: cover; }
.patrocinio { display: flex; gap: 12px; align-items: center; margin-top: 16px; padding: 12px 0; border-top: 1px solid var(--linha); border-bottom: 1px solid var(--linha); font-size: 16px; line-height: 1.5; }
.patrocinio img { flex: none; width: 56px; height: 56px; object-fit: contain; }

/* ---------------------------------------------------------------- ficha */
.ficha__tipos { margin: 8px 0 0; font-size: 18px; font-weight: 500; line-height: 1.45; }
.ficha__morada { margin: 4px 0 0; font-size: 17px; line-height: 1.5; color: var(--tinta-2); }
.ficha__confirmada { margin: 8px 0 0; display: flex; gap: 8px; align-items: center; font-size: 16px; }
.ficha__confirmada .ico { color: var(--verde); }
.ficha__principal { max-width: 640px; }
.fotos { display: flex; gap: 8px; overflow-x: auto; margin: 16px 0 0; scroll-snap-type: x mandatory; }
.fotos img { flex: none; width: 260px; height: 190px; object-fit: cover; scroll-snap-align: start; }
.vaga { margin-top: 16px; border: 2px solid var(--verde); padding: 14px 16px; }
.vaga strong { display: flex; align-items: center; gap: 10px; font: 800 21px var(--f-tit); color: var(--verde); }
.vaga p { margin: 4px 0 0; font-size: 17px; }
.vaga--nao { border-color: var(--linha); }
.vaga--nao strong { color: var(--tinta); }
.bt-ligar { margin-top: 18px; width: 100%; min-height: 60px; font-size: 20px; }
.bt-ligar .ico { width: 22px; height: 22px; }
.ficha__3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 8px; }
.ficha__3 a { min-height: 56px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: var(--acao); text-decoration: none; font-size: 15px; font-weight: 600; text-align: center; }
.ficha__3 a:hover { color: var(--acao-escura); text-decoration: underline; }
.liguei { margin-top: 18px; padding: 12px 0 16px; border-top: 1px solid var(--linha); border-bottom: 1px solid var(--linha); }
.liguei__caixa { min-height: 48px; display: flex; align-items: center; gap: 12px; font-size: 18px; font-weight: 600; cursor: pointer; }
.liguei input[type="checkbox"] { width: 24px; height: 24px; margin: 0; accent-color: var(--acao); }
.liguei label[for] { display: block; margin-top: 4px; font-size: 16px; color: var(--tinta-2); }
.liguei textarea { width: 100%; margin-top: 6px; padding: 12px 14px; border: 1.5px solid var(--borda); border-radius: 4px; font-size: 17px; line-height: 1.4; resize: vertical; }
.liguei textarea::placeholder { color: #666666; }
.tem { margin: 0; }
.tem > div { border-top: 1px solid var(--linha); padding: 12px 0; }
.tem dt { font-size: 18px; font-weight: 600; }
.tem dd { margin: 4px 0 0; font-size: 17px; }
.tem dd .n { font-size: 20px; }
.tem dd span { color: var(--tinta-2); }
.tem .tem__hor { margin-top: 2px; font-size: 16px; color: var(--tinta-2); }
.gere { margin: 0; font-size: 18px; font-weight: 600; line-height: 1.5; }
.outros { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--linha); }
.outros li { border-top: 1px solid var(--linha); display: flex; align-items: center; gap: 10px; min-height: 56px; }
.outros a:first-child { flex: 1; padding: 8px 0; font-size: 17px; font-weight: 500; line-height: 1.3; color: var(--tinta); text-decoration: none; }
.outros a:first-child:hover { text-decoration: underline; }
.outros a:first-child:visited { color: var(--roxo-marca); }
.outros .tel { font-size: 17px; }
.mais { display: inline-flex; min-height: 48px; align-items: center; font-size: 17px; font-weight: 500; }
.barra { margin: 0 calc(-1 * var(--margem)); position: sticky; bottom: 0; z-index: 20; display: flex; gap: 10px; padding: 10px var(--margem) calc(14px + env(safe-area-inset-bottom, 0px)); background: var(--fundo); border-top: 1px solid var(--linha); }
.barra .bt { flex: 1.3; }
.barra .bt-2 { flex: 1; }
@media (min-width: 900px) { .barra--ficha { display: none; } }

/* ---------------------------------------------------------------- tabela do distrito */
.tabela-caixa { overflow-x: auto; margin-top: 16px; }
.tabela { width: 100%; border-collapse: collapse; font-size: 17px; line-height: 1.35; }
.tabela th { padding: 8px 6px; font-size: 15px; font-weight: 600; text-align: right; border-bottom: 2px solid var(--tinta); vertical-align: bottom; }
.tabela th:first-child, .tabela td:first-child { text-align: left; padding-left: 0; }
.tabela td { padding: 12px 6px; border-bottom: 1px solid var(--linha); text-align: right; font-family: var(--f-tit); font-weight: 600; font-variant-numeric: tabular-nums; }
.tabela td:first-child { font-family: var(--f-txt); font-weight: 600; }
.tabela .forte { color: var(--azul); font-weight: 800; }

/* ---------------------------------------------------------------- perguntas frequentes */
.faq { border-bottom: 1px solid var(--linha); max-width: 68ch; }
.faq details { border-top: 1px solid var(--linha); }
.faq summary { min-height: 56px; display: flex; align-items: center; gap: 12px; padding: 10px 0; font-size: 18px; font-weight: 600; cursor: pointer; list-style: none; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; margin-left: auto; font: 700 24px var(--f-tit); color: var(--acao); }
.faq details[open] summary::after { content: '−'; }
.faq details p { margin: 0 0 16px; font-size: 17px; line-height: 1.6; }

/* ---------------------------------------------------------------- simulador */
.exemplo { margin: 12px 0 0; padding: 10px 14px; background: var(--painel); font-size: 16px; max-width: 640px; }
.sim { max-width: 640px; }
.sim-q { border-top: 1px solid var(--linha); padding: 16px 0; }
.sim-q fieldset { border: 0; margin: 0; padding: 0; }
.sim-q legend, .sim-rot { display: flex; align-items: baseline; gap: 10px; padding: 0; font-size: 18px; font-weight: 600; line-height: 1.35; }
.sim-n { flex: none; width: 18px; font: 800 18px var(--f-tit); color: var(--azul); }
.sim-opc { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.sim-opc label { display: flex; align-items: flex-start; gap: 12px; padding: 12px 14px; border: 1.5px solid var(--borda); border-radius: 4px; cursor: pointer; font-size: 17px; line-height: 1.35; }
.sim-opc label:has(input:checked) { border: 2.5px solid var(--acao); background: var(--acao-fundo); }
.sim-opc input { width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--acao); flex: none; }
.sim-opc b { display: block; font-weight: 600; }
.sim-opc small { display: block; margin-top: 2px; font-size: 15px; color: var(--tinta-2); }
.sim-eur { margin-top: 10px; display: flex; align-items: center; min-height: 56px; padding: 0 14px; border: 1.5px solid var(--borda); border-radius: 4px; background: var(--fundo); }
.sim-eur:focus-within { outline: 3px solid var(--azul-marca); outline-offset: 2px; border-color: var(--azul); }
.sim-eur input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; font: 700 20px var(--f-tit); font-variant-numeric: tabular-nums; }
.sim-eur span { font-size: 18px; color: var(--tinta-2); }
.sim-chk { display: flex; align-items: center; gap: 10px; min-height: 48px; margin-top: 6px; font-size: 17px; cursor: pointer; }
.sim-chk input { width: 22px; height: 22px; margin: 0; accent-color: var(--acao); }
.sim-rot-2 { display: block; margin-top: 10px; font-size: 16px; font-weight: 600; }
.sim-ajuda { margin: 6px 0 0; font-size: 15px; line-height: 1.45; color: var(--tinta-2); }
.sim-sel { width: 100%; min-height: 56px; margin-top: 10px; padding: 0 12px; border: 1.5px solid var(--borda); border-radius: 4px; background: var(--fundo); font-size: 18px; }
.sim-enviar { margin-top: 8px; }
.js .sim-enviar { display: none; }
.conta { margin-top: 24px; max-width: 640px; border: 1.5px solid var(--tinta); padding: 18px 18px 20px; }
.conta h2 { margin: 0; font: 800 22px var(--f-tit); }
.conta__sub { margin: 4px 0 10px; font-size: 16px; color: var(--tinta-2); }
.conta__linha { display: flex; align-items: baseline; gap: 8px; padding: 7px 0; font-size: 17px; line-height: 1.35; }
.conta__linha > span:first-child { flex: 0 1 auto; max-width: 62%; }
.conta__linha b { flex: none; font: 700 18px var(--f-tit); font-variant-numeric: tabular-nums; white-space: nowrap; }
.conta__total { margin-top: 8px; padding-top: 12px; border-top: 2px solid var(--tinta); }
.conta__total-rot { font-size: 18px; font-weight: 600; }
.conta__total-n { font: 800 46px/1.1 var(--f-tit); color: var(--azul); font-variant-numeric: tabular-nums; }
.conta__ano { margin-top: 4px; font-size: 17px; }
.conta ul { margin: 14px 0 0; padding: 0 0 0 18px; font-size: 16px; line-height: 1.5; display: grid; gap: 6px; }
.conta details { margin-top: 12px; font-size: 16px; line-height: 1.55; }
.conta summary { min-height: 44px; display: flex; align-items: center; font-weight: 600; color: var(--azul); cursor: pointer; }
.conta details p { margin: 6px 0 0; }
.barra__total { flex: 1; min-width: 0; }
.barra__total span { display: block; font-size: 15px; color: var(--tinta-2); }
.barra__total b { font: 800 24px/1.15 var(--f-tit); color: var(--azul); font-variant-numeric: tabular-nums; }
.barra .bt--auto { flex: 0 1 auto; max-width: 62%; font-size: 16px; }
@media (min-width: 900px) { .barra--sim { display: none; } }

/* ---------------------------------------------------------------- formulários (instituições) */
.form { max-width: 640px; }
.form label { display: block; margin-top: 16px; font-size: 17px; font-weight: 600; }
.form .campo { margin-top: 8px; }
.form textarea.campo { min-height: 120px; padding: 12px 16px; line-height: 1.5; }
.form .bt { margin-top: 18px; }
.aviso-ok { margin-top: 16px; padding: 14px 16px; border: 2px solid var(--verde); font-size: 17px; }
.aviso-erro { margin-top: 16px; padding: 14px 16px; border: 2px solid #B42318; font-size: 17px; }
.isco { position: absolute; left: -9999px; }
.marcas { list-style: none; margin: 0; padding: 0; }
.marcas li { display: flex; gap: 10px; padding: 12px 0; border-top: 1px solid var(--linha); font-size: 17px; line-height: 1.45; }
.marcas .ico { margin-top: 2px; }
.marcas--gratis .ico { color: var(--verde); }
.marcas--pago .ico { color: var(--acao); }
.preco { margin-top: 14px; max-width: 640px; border: 1.5px solid var(--tinta); padding: 18px; }
.preco b { display: block; font: 800 36px/1.1 var(--f-tit); color: var(--azul); }

/* ---------------------------------------------------------------- artigos */
.artigos { list-style: none; margin: 18px 0 0; padding: 0; border-bottom: 1px solid var(--linha); max-width: 820px; }
.artigos li { border-top: 1px solid var(--linha); padding: 16px 0; }
.artigos a { font-size: 19px; font-weight: 600; line-height: 1.35; color: var(--tinta); text-decoration: none; }
.artigos a:hover { text-decoration: underline; }
.artigos a:visited { color: var(--roxo-marca); }
.artigos p { margin: 6px 0 0; font-size: 16px; color: var(--tinta-2); line-height: 1.5; }
.temas { display: flex; flex-wrap: wrap; gap: 4px 20px; margin-top: 16px; }
.temas a { min-height: 44px; display: inline-flex; align-items: center; font-size: 16px; font-weight: 500; }
.temas a[aria-current] { color: var(--tinta); font-weight: 600; text-decoration: none; border-bottom: 3px solid var(--azul-marca); }
.artigo { max-width: 68ch; }
.artigo__meta { margin: 10px 0 0; font-size: 16px; color: var(--tinta-2); }
.resumo { margin-top: 18px; background: var(--painel); padding: 16px 18px; }
.resumo b { display: block; font-size: 16px; color: var(--azul); }
.resumo p { margin: 6px 0 0; font-size: 18px; }
.artigo__corpo { font-size: 18px; line-height: 1.6; }
@media (min-width: 900px) { .artigo__corpo { font-size: 20px; } }
.artigo__corpo h2, .artigo__corpo h3 { margin: 32px 0 0; font: 800 22px/1.25 var(--f-tit); }
.artigo__corpo h3 { font-size: 20px; }
.artigo__corpo p, .artigo__corpo ul, .artigo__corpo ol { margin: 14px 0 0; }
.artigo__corpo li + li { margin-top: 6px; }
.artigo__corpo img { display: block; margin: 20px 0 0; }
.artigo__imagem { margin-top: 20px; }
.artigo__imagem img { display: block; width: 100%; max-height: 420px; object-fit: cover; }
.na-pesquisa { margin-top: 24px; border: 1.5px solid var(--tinta); padding: 16px 16px 18px; }
.na-pesquisa label { font-size: 17px; font-weight: 600; }
.na-pesquisa .campo { margin-top: 10px; }

/* ---------------------------------------------------------------- rodapé */
.rodape { margin-top: 24px; border-top: 1px solid var(--linha); padding: 32px 0 calc(40px + env(safe-area-inset-bottom, 0px)); font-size: 16px; }
.rodape__grelha { display: grid; gap: 28px; }
@media (min-width: 900px) { .rodape__grelha { grid-template-columns: 2fr 1fr 1fr; } }
.rodape h2 { margin: 0 0 8px; font: 800 18px var(--f-tit); }
.rodape ul { list-style: none; margin: 0; padding: 0; }
.rodape li a { display: inline-flex; min-height: 40px; align-items: center; }
.rodape__distritos { columns: 2 150px; column-gap: 24px; }
.rodape__marca img { height: 44px; width: auto; }
.rodape__legal { margin-top: 24px; color: var(--tinta-2); line-height: 1.5; }

/* ---------------------------------------------------------------- a folha impressa */
.folha { display: none; }
@media print {
  @page { size: A4; margin: 14mm 14mm 16mm; }
  body { font-size: 11pt; }
  .topo, .faixa, .rodape, .barra, .filtros, .acoes, .pub, .patrocinio, .lateral, .sep, .painel, .destaques, .faq-sec, .vizinhos, .migalhas, .no-print, .saltar, .lista, .lista__cab, .lista-oficial, .titulo, .lead, .fonte { display: none !important; }
  .folha { display: block; color: #000; }
  .folha__cab { display: flex; align-items: center; justify-content: space-between; }
  .folha__cab img { height: 12mm; width: auto; }
  .folha__faixa { margin-top: 4mm; padding: 2mm 3mm; border: 1px solid #000; font: 700 9pt var(--f-tit); letter-spacing: 0.08em; text-transform: uppercase; }
  .folha h1 { margin: 4mm 0 0; font: 800 20pt/1.15 var(--f-tit); }
  .folha > p { margin: 1.5mm 0 0; font-size: 10pt; }
  .folha table { width: 100%; margin-top: 4mm; border-collapse: collapse; font-size: 10pt; }
  .folha th { text-align: left; font-size: 9pt; border-bottom: 1.5pt solid #000; padding: 1.5mm 2mm 1.5mm 0; }
  .folha td { border-bottom: 0.75pt solid #777; padding: 1.8mm 2mm 1.8mm 0; vertical-align: top; }
  .folha td small { display: block; font-size: 8.5pt; color: #333; }
  .folha .t { font: 700 10.5pt var(--f-tit); white-space: nowrap; }
  .folha .cx { display: inline-block; width: 4mm; height: 4mm; border: 1pt solid #000; }
  .folha tr { break-inside: avoid; }
  .folha__pe { margin-top: 5mm; padding-top: 2mm; border-top: 0.75pt solid #777; font-size: 8.5pt; color: #333; display: flex; justify-content: space-between; gap: 6mm; }
}

@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }
.js .no-js-only { display: none; }
.linha__dist { font-size: 16px; color: var(--azul); font-weight: 600; }

/* Páginas «Para instituições» e «Para anunciantes»: os exemplos ao vivo, dentro de uma moldura */
.exemplo { margin-top: 16px; padding: 16px 20px 20px; border: 1px solid var(--linha); background: var(--fundo); }
.exemplo__rotulo { margin: 0 0 4px; font: 600 15px var(--f-txt); color: var(--tinta-2); }
.exemplo--tm { width: 390px; max-width: 100%; }
.exemplo .pub, .exemplo .patrocinio, .exemplo .destaques { margin-top: 8px; }
.exemplos { display: flex; flex-wrap: wrap; gap: 20px 32px; align-items: flex-start; }
.exemplos > .exemplo { flex: 1 1 390px; min-width: 0; }
.exemplos > .exemplo--tm { flex: 0 0 390px; }
.numeros { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px 32px; margin-top: 8px; }
.numeros b { display: block; font: 800 38px/1.1 var(--f-tit); color: var(--azul); font-variant-numeric: tabular-nums; }
.numeros p { margin: 4px 0 0; font-size: 17px; line-height: 1.45; }
.tabela-precos { width: 100%; max-width: 760px; border-collapse: collapse; margin-top: 8px; }
.tabela-precos td { padding: 12px 0; border-top: 1px solid var(--linha); vertical-align: top; font-size: 17px; line-height: 1.45; }
.tabela-precos td + td { text-align: right; white-space: nowrap; padding-left: 16px; }
.tabela-precos b { font: 700 19px var(--f-tit); color: var(--azul); font-variant-numeric: tabular-nums; }
.tabela-precos small { display: block; font-size: 15px; color: var(--tinta-2); }
@media (max-width: 699px) { .exemplos > .exemplo:not(.exemplo--tm) { display: none; } }
