/* Energisa: apresentação pública. Paleta institucional herdada de tokens.css. */
.envolvente { width: min(100% - 3rem, var(--container)); }
main:focus { outline: none; }
.barra-topo { font-size: 0.84rem; }
.barra-topo__interior { padding-block: 0.55rem; }
.cabecalho__interior { min-height: 92px; padding-block: 1rem; }
.logotipo img { height: 48px; max-width: 185px; object-fit: contain; }
.logotipo { background: var(--brand-paper); padding: 7px 10px; border-radius: 4px; }
.navegacao { gap: 1.4rem; }
.navegacao a:not(.botao) { font-size: 0.9rem; }
.navegacao .botao { padding: 0.8rem 1rem; }
.botao { border-radius: 5px; min-height: 46px; padding-inline: 1.4rem; }
/* O teal-900 sobre o laranja dava 5,32:1 e ja era uma correccao; --on-accent
   da 6,76:1 e e o mesmo valor em todo o lado. O :hover devolvia o branco, que
   sobre o laranja escurecido da 3,80:1 -- por isso tambem leva tinta escura. */
.botao--primario { color: var(--on-accent); }
.botao--primario:hover { color: var(--on-accent); }
.sobretitulo { display: block; color: var(--brand); font-size: 0.75rem; letter-spacing: 0.17em; font-weight: 600; line-height: 1.8; }
.ponto-marca { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--accent); vertical-align: middle; }
.heroi-institucional { background: var(--bg); color: var(--text); padding-block: 64px 56px; border-bottom: 0; }
.heroi-institucional__grelha { display: grid; grid-template-columns: 1.05fr 1fr; gap: 56px; align-items: center; }
.heroi-institucional h1 { font-size: clamp(2.8rem, 4.4vw, 4.1rem); line-height: 1.08; letter-spacing: -0.045em; color: var(--brand); margin: 22px 0; max-width: 620px; }
.heroi-institucional h1 em { color: var(--brand-bright); font-style: normal; }
.heroi-institucional .heroi__entrada { color: var(--text-quiet); font-size: 1.11rem; line-height: 1.9; max-width: 480px; margin-bottom: 26px; }
.heroi-institucional .heroi__accoes { margin-top: 0; gap: 24px; align-items: center; }
.heroi-institucional .heroi__nota { color: var(--text-faint); font-size: 0.76rem; margin: 24px 0 0; max-width: 480px; }
.ligacao-editorial { font-size: 0.9rem; font-weight: 600; text-decoration: none; color: var(--brand); }
.ligacao-editorial span { margin-left: 8px; color: var(--accent-text); }
.ligacao-editorial:hover { text-decoration: underline; text-underline-offset: 5px; }
.energia-visual { background: var(--bg-raised); border: 1px solid var(--line); margin: 0; padding: 24px; border-radius: 8px; position: relative; }
.energia-visual__cabeca { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 0.75rem; letter-spacing: 0.15em; color: var(--text-quiet); }
.energia-visual__cabeca span:last-child { font-size: 26px; line-height: 1; color: var(--accent-text); }
.energia-visual svg { width: 100%; height: auto; display: block; margin-block: 14px; }
.energia-visual figcaption { font-family: var(--font-display); font-size: 1.06rem; font-weight: 500; color: var(--brand); border-top: 1px solid var(--line); padding-top: 20px; }
.energia-visual figcaption small { display: block; font-family: var(--font-body); font-size: 0.75rem; color: var(--text-faint); font-weight: 400; margin-top: 7px; }
.energia-visual__ponto { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); margin-right: 8px; }
.faixa-metodo { display: grid; grid-template-columns: 1.6fr repeat(4, 1fr); gap: 24px; padding-block: 25px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); align-items: center; }
.faixa-metodo p { font-size: 0.88rem; color: var(--text-quiet); margin: 0; line-height: 1.8; }
.faixa-metodo strong { color: var(--brand); font-weight: 600; }
.faixa-metodo > span { font-size: 0.9rem; border-left: 1px solid var(--line); padding-left: 25px; }
.faixa-metodo b { display: block; font-size: 0.77rem; letter-spacing: 0.04em; font-weight: 500; color: var(--accent-text); margin-bottom: 5px; }
.seccao { padding-block: 62px; }
.seccao--calma { background: var(--teal-050); }
.cabeca-seccao { max-width: 760px; margin-bottom: 32px; }
.cabeca-seccao h2 { color: var(--brand); font-size: clamp(1.8rem, 2.5vw, 2.3rem); letter-spacing: -0.035em; margin: 10px 0 14px; }
.cabeca-seccao p { color: var(--text-quiet); font-size: 1.02rem; line-height: 1.8; }
.cartao { border-radius: 6px; box-shadow: none; padding: 27px; border-color: var(--line); }
.cartao h3 { font-size: 1.2rem; line-height: 1.35; letter-spacing: -0.025em; color: var(--brand); }
.cartao p { font-size: 0.95rem; line-height: 1.85; }
.cartao--ligacao:hover { box-shadow: var(--shadow-sm); transform: translateY(-3px); border-color: var(--teal-400); }
.linhas-institucionais { gap: 20px; }
.linhas-institucionais .cartao { display: flex; flex-direction: column; align-items: flex-start; }
.linha-numero { display: flex; align-items: center; justify-content: space-between; width: 100%; color: var(--accent-text); font-size: 0.79rem; margin-bottom: 34px; }
.linha-numero span { font-size: 20px; }
.linhas-institucionais .lista-marcada { font-size: 0.88rem; color: var(--text-quiet); line-height: 1.9; padding-left: 18px; margin-bottom: 22px; }
.linha-descobrir { margin-top: auto; font-size: 0.84rem; font-weight: 600; color: var(--brand); padding-top: 14px; }
.linha-descobrir span { color: var(--accent-text); margin-left: 8px; }
.etiqueta { border-radius: 3px; font-size: 0.75rem; letter-spacing: 0.02em; }
.convite-institucional { background: var(--bg); padding-top: 24px; padding-bottom: 0; }
.convite-institucional__interior { display: flex; justify-content: space-between; align-items: center; gap: 40px; background: var(--brand-surface); border-radius: 8px; padding: 44px; }
.convite-institucional h2 { color: var(--surface-warm); font-size: 2rem; letter-spacing: -0.035em; margin: 14px 0; }
.convite-institucional .sobretitulo { color: var(--orange-200); }
.convite-institucional p { font-size: 0.95rem !important; max-width: 460px; }
.convite-institucional .heroi__accoes { flex-shrink: 0; display: flex; flex-direction: column; gap: 12px; margin: 0; }
.convite-institucional .botao { min-width: 190px; justify-content: center; }
.rodape { margin-top: 72px; padding-top: 0; }
.rodape-marca { display: flex; align-items: center; gap: 30px; padding-block: 34px; border-bottom: 1px solid var(--teal-800); margin-bottom: 38px; }
.rodape-marca__logo { background: var(--brand-paper); border-radius: 4px; padding: 12px 18px; flex-shrink: 0; }
.rodape-marca__logo img { height: 46px; width: 158px; object-fit: contain; }
.rodape-marca .sobretitulo { color: var(--orange-200); font-size: 0.75rem; letter-spacing: 0.12em; }
.rodape-marca p { margin: 7px 0 0; color: var(--on-brand); font-size: 0.87rem; }
.rodape-marca__contacto { margin-left: auto; white-space: nowrap; border-bottom: 1px solid var(--accent); padding-block: 10px; }
.rodape-marca__contacto span { color: var(--orange-200); padding-left: 12px; font-size: 20px; }
.rodape .grelha--4 { grid-template-columns: 1.1fr 1fr 0.85fr 1.35fr; gap: 34px; }
.rodape h4 { text-transform: none; letter-spacing: 0; font-size: 0.96rem; }
.rodape li { margin-bottom: 8px; }
.rodape a { font-size: 0.86rem; }
.rodape-contactos address { font-style: normal; font-size: 0.85rem; line-height: 1.85; margin-bottom: 16px; }
.rodape-contactos address strong { display: block; color: var(--orange-200); font-size: 0.81rem; font-weight: 500; margin-bottom: 4px; }
.rodape-contactos > a { display: block; padding-block: 4px; overflow-wrap: anywhere; }
.rodape__base { font-size: 0.75rem; padding-top: 22px; margin-top: 34px; }
@media (max-width: 1080px) {
  .alternar-menu { display: block; }
  .cabecalho__interior { position: relative; min-height: 80px; }
  .navegacao { display: none; position: absolute; inset-inline: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; background: var(--bg-raised); border: 1px solid var(--line); padding: 16px; box-shadow: var(--shadow); }
  .navegacao[data-aberto="true"] { display: flex; }
  .navegacao a { padding: 12px; border-bottom: 1px solid var(--line); font-size: 1.02rem; }
  .heroi-institucional__grelha { gap: 30px; }
  .heroi-institucional h1 { font-size: 3.1rem; }
  .heroi-institucional .heroi__accoes { gap: 16px; }
  .rodape-marca { flex-wrap: wrap; }
  .rodape-marca__contacto { margin-left: 0; }
}
@media (max-width: 760px) {
  .envolvente { width: calc(100% - 40px); }
  .barra-topo__interior { gap: 6px; font-size: 0.75rem; }
  .barra-topo__interior > span:last-child { overflow-wrap: anywhere; }
  .logotipo img { height: 42px; }
  .heroi-institucional { padding-block: 36px; }
  .heroi-institucional__grelha { grid-template-columns: 1fr; gap: 32px; }
  .heroi-institucional h1 { font-size: clamp(2.6rem, 8vw, 3.5rem); }
  .heroi-institucional .heroi__entrada { font-size: 1.02rem; }
  .energia-visual { padding: 20px; }
  .energia-visual figcaption { font-size: 0.98rem; }
  .faixa-metodo { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding-block: 22px; }
  .faixa-metodo p { grid-column: 1 / -1; margin-bottom: 6px; }
  .faixa-metodo > span { padding-left: 10px; font-size: 0.76rem; }
  .faixa-metodo > span:nth-child(2) { border-left: 0; padding-left: 0; }
  .seccao { padding-block: 40px; }
  .cabeca-seccao h2 { font-size: 1.8rem; }
  .grelha--2, .grelha--3 { grid-template-columns: 1fr; }
  .grelha--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cartao { padding: 24px; min-width: 0; }
  .convite-institucional__interior { width: calc(100% - 40px); flex-direction: column; align-items: flex-start; padding: 28px; gap: 24px; }
  .convite-institucional h2 { font-size: 1.7rem; }
  .convite-institucional .heroi__accoes { align-items: stretch; width: 100%; }
  .rodape { margin-top: 40px; }
  .rodape-marca { gap: 20px; padding-block: 30px; }
  .rodape-marca > div { flex-basis: 100%; }
  .rodape-marca__contacto { width: 100%; display: flex; justify-content: space-between; }
  .rodape .grelha--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 22px; }
  .rodape__base { gap: 14px; }
}
@media (max-width: 380px) {
  .grelha--4, .rodape .grelha--4 { grid-template-columns: 1fr; }
  .faixa-metodo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .energia-visual figcaption small { font-size: 0.75rem; }
}
@media (prefers-reduced-motion: reduce) {
  .cartao--ligacao:hover { transform: none; }
}
/* Mantém contraste nos elementos sobre fundo de marca também em modo escuro. */
@media (prefers-color-scheme: dark) {
  .convite-institucional h2 { color: var(--ink-900); }
  .convite-institucional p, .rodape, .rodape a, .rodape-marca p { color: var(--ink-600) !important; }
}
:root[data-theme="dark"] .convite-institucional h2 { color: var(--ink-900); }
:root[data-theme="dark"] .convite-institucional p,
:root[data-theme="dark"] .rodape,
:root[data-theme="dark"] .rodape a,
:root[data-theme="dark"] .rodape-marca p { color: var(--ink-600) !important; }

/* Loja: pesquisa em destaque, navegação por categorias e grelha de produtos. */
.migalhas { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: 0.81rem; color: var(--text-faint); margin-bottom: 28px; }
.migalhas a { text-decoration: none; }
.loja-abertura { padding-block: 30px; background: var(--teal-050); border-bottom: 1px solid var(--line); }
.loja-abertura__grelha { display: grid; grid-template-columns: 1.4fr 1fr; align-items: center; gap: 70px; }
.loja-abertura h1 { font-size: 2.5rem; letter-spacing: -0.04em; color: var(--brand); margin: 12px 0 16px; line-height: 1.2; }
.loja-abertura h1 em { color: var(--brand-bright); font-style: normal; }
.loja-abertura p { font-size: 0.96rem; color: var(--text-quiet); line-height: 1.9; max-width: 540px; }
.loja-empresas { border-left: 2px solid var(--accent); padding-left: 26px; }
.loja-empresas h2 { font-size: 1.2rem; color: var(--brand); margin: 12px 0; }
.loja-empresas a { font-size: 0.88rem; text-decoration: none; font-weight: 600; }
.loja-pesquisa { display: grid; grid-template-columns: minmax(0, 1fr) 175px 170px auto; gap: 16px; align-items: end; background: var(--bg-raised); border: 1px solid var(--line); border-radius: 6px; padding: 22px; margin-top: 26px; }
.loja-pesquisa label { display: block; font-size: 0.77rem; color: var(--text-quiet); margin-bottom: 7px; }
.loja-pesquisa input, .loja-pesquisa select { width: 100%; border: 1px solid var(--line); border-radius: 4px; background: var(--bg-raised); color: var(--text); min-height: 46px; font-family: inherit; font-size: 0.86rem; padding: 10px 12px; }
.loja-pesquisa__campo > div { display: flex; align-items: center; position: relative; }
.loja-pesquisa__campo svg { position: absolute; left: 12px; color: var(--brand); pointer-events: none; }
.loja-pesquisa__campo input { padding-left: 42px; }
.loja-pesquisa .botao { height: 46px; justify-content: center; }
.loja-grelha { display: grid; grid-template-columns: 215px minmax(0, 1fr); gap: 32px; align-items: start; }
.loja-conteudo { padding-top: 38px; }
.loja-categorias { border: 1px solid var(--line); background: var(--bg-raised); border-radius: 5px; overflow: hidden; }
.loja-categorias summary { font-size: 0.93rem; font-weight: 600; padding: 18px; color: var(--brand); cursor: pointer; display: flex; justify-content: space-between; list-style: none; }
.loja-categorias summary::-webkit-details-marker { display: none; }
.loja-categorias nav { padding: 0 12px 12px; }
.loja-categorias nav a { display: flex; justify-content: space-between; gap: 10px; padding: 11px 7px; border-top: 1px solid var(--line); font-size: 0.84rem; text-decoration: none; color: var(--text-quiet); }
.loja-categorias nav a[aria-current="page"] { color: var(--brand); font-weight: 600; }
.loja-categorias nav a span { color: var(--accent-text); }
.loja-ajuda { background: var(--teal-050); border-radius: 5px; padding: 20px; margin-top: 20px; }
.loja-ajuda h3 { font-size: 1rem; color: var(--brand); }
.loja-ajuda p { font-size: 0.85rem; color: var(--text-quiet); line-height: 1.8; }
.loja-ajuda a { font-size: 0.84rem; font-weight: 600; text-decoration: none; }
.loja-resultados__cabeca { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.loja-resultados__cabeca h2 { font-size: 1.45rem; color: var(--brand); margin: 8px 0 0; letter-spacing: -0.03em; overflow-wrap: anywhere; }
.loja-resultados__cabeca > span { font-size: 0.85rem; color: var(--text-quiet); white-space: nowrap; padding-bottom: 4px; }
.loja-produtos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.cartao-produto { border-radius: 5px; min-width: 0; }
.cartao-produto__imagem { text-decoration: none; background: var(--surface-sunk); aspect-ratio: 1.2; }
.cartao-produto__imagem img { object-fit: contain; padding: 18px; }
.produto-sem-foto { display: flex; align-items: center; flex-direction: column; gap: 10px; text-align: center; padding: 20px; color: var(--brand-bright); }
.produto-sem-foto > span { font-family: var(--font-display); font-size: 0.96rem; color: var(--brand); }
.produto-sem-foto small { font-size: 0.75rem; color: var(--text-faint); }
.cartao-produto__corpo { padding: 18px; gap: 8px; }
.cartao-produto__categoria { font-size: 0.75rem; letter-spacing: 0.04em; }
.cartao-produto__nome { font-size: 1.03rem; line-height: 1.5; color: var(--brand); overflow-wrap: anywhere; }
.cartao-produto__sob-consulta { font-size: 0.95rem; font-weight: 600; color: var(--brand); margin-top: 6px; }
.loja-disponibilidade { font-size: 0.77rem; color: var(--text-quiet); }
.cartao-produto__accoes .botao { font-size: 0.81rem; padding-inline: 10px; }
.loja-subcategorias { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 24px; }
.loja-subcategorias a { font-size: 0.85rem; text-decoration: none; padding: 9px 12px; border: 1px solid var(--line); border-radius: 4px; }
.produto-detalhe { align-items: start; }
.produto-detalhe__imagem-vazia { background: var(--surface-sunk); border: 1px solid var(--line); border-radius: 6px; min-height: 360px; display: flex; align-items: center; justify-content: center; }
@media (max-width: 1080px) {
  .loja-abertura__grelha { gap: 30px; }
  .loja-abertura h1 { font-size: 2rem; }
  .loja-grelha { grid-template-columns: 190px minmax(0, 1fr); gap: 20px; }
  .loja-produtos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .loja-pesquisa { grid-template-columns: minmax(0, 1fr) 150px 145px auto; gap: 12px; padding: 18px; }
}
@media (max-width: 760px) {
  .loja-abertura { padding-top: 24px; }
  .loja-abertura__grelha { grid-template-columns: 1fr; gap: 20px; }
  .loja-abertura h1 { font-size: 1.9rem; }
  .loja-empresas { padding-left: 18px; }
  .loja-empresas .sobretitulo { font-size: 0.75rem; }
  .loja-empresas p { margin-bottom: 8px; }
  .loja-pesquisa { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .loja-pesquisa__campo, .loja-pesquisa > button { grid-column: 1 / -1; }
  .loja-grelha { grid-template-columns: 1fr; gap: 24px; }
  .loja-ajuda { display: none; }
  .loja-resultados__cabeca { align-items: flex-start; gap: 12px; flex-direction: column; }
  .loja-resultados__cabeca h2 { font-size: 1.35rem; }
  .loja-produtos { gap: 12px; }
  .cartao-produto__corpo { padding: 13px; }
  .cartao-produto__nome { font-size: 0.95rem; }
  .cartao-produto__accoes .botao { font-size: 0.75rem; width: 100%; }
  .produto-sem-foto { padding: 18px 10px; gap: 8px; }
  .produto-sem-foto > span { font-size: 0.85rem; }
  .produto-sem-foto small { font-size: 0.75rem; }
}
@media (max-width: 350px) {
  .loja-produtos { grid-template-columns: 1fr; }
}

/* ===========================================================================
   Página inicial — composição própria

   O que havia antes: oito secções, cada uma com rótulo em maiúsculas, título e
   grelha de cartões iguais. Essa igualdade é o que faz uma página parecer
   gerada — trabalho humano decide que uma coisa importa mais do que outra e
   trata-a de outra maneira. Aqui cada secção tem a forma que o conteúdo pede:
   um índice numerado para as áreas, uma lista datada para as notícias, etiquetas
   para os fornecimentos, e cartões só onde há mesmo três coisas comparáveis.
   =========================================================================== */

.abertura { background: var(--bg); padding-block: 72px 60px; }
.abertura__grelha {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 64px;
  align-items: start;
}
.abertura h1 {
  font-size: clamp(2.8rem, 4.4vw, 4.1rem);
  line-height: 1.08;
  letter-spacing: -0.045em;
  color: var(--brand);
  margin: 0 0 24px;
  max-width: 620px;
}
.abertura h1 em { color: var(--brand-bright); font-style: normal; }
.abertura__entrada {
  color: var(--text-quiet);
  font-size: 1.05rem;
  line-height: 1.85;
  max-width: 480px;
  margin: 0 0 30px;
}
.abertura__accoes { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; }
.ligacao-simples {
  font-weight: 600;
  color: var(--brand);
  text-decoration: underline;
  text-underline-offset: 5px;
  text-decoration-thickness: 1px;
}

/* A ficha: um bloco de papel timbrado, não um cartão. Sem sombra, sem cantos
   redondos, sem caixa — um filete forte em cima e informação alinhada. */
.ficha { border-top: 3px solid var(--brand); padding-top: 22px; }
.ficha__nome {
  font-family: var(--font-display);
  font-size: 1.02rem;
  font-weight: 600;
  color: var(--brand);
  line-height: 1.4;
  margin: 0 0 18px;
}
.ficha__dados { margin: 0 0 26px; }
.ficha__dados > div {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding-block: 9px;
  border-top: 1px solid var(--line);
  font-size: 0.9rem;
}
.ficha__dados dt { color: var(--text-quiet); margin: 0; }
.ficha__dados dd {
  margin: 0;
  color: var(--text);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.ficha__rubrica {
  font-family: var(--font-display);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--brand);
  margin: 0 0 10px;
}
.ficha__locais { list-style: none; margin: 0 0 26px; padding: 0; }
.ficha__locais li {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-block: 9px;
  border-top: 1px solid var(--line);
  font-size: 0.9rem;
}
.ficha__locais li span:first-child { color: var(--text); font-weight: 600; }
.ficha__locais li span + span { color: var(--text-quiet); }
.ficha__horario { font-size: 0.9rem; color: var(--text-quiet); margin: 0; }

/* Cabeças de secção: sem rótulo em maiúsculas por cima. */
.cabeca { max-width: 760px; margin-bottom: 36px; }
.cabeca--estreita { max-width: 620px; }
.cabeca h2 {
  color: var(--brand);
  font-size: clamp(1.8rem, 2.5vw, 2.3rem);
  letter-spacing: -0.035em;
  margin: 0 0 14px;
}
.cabeca p { color: var(--text-quiet); font-size: 0.98rem; line-height: 1.8; margin: 0; }

/* O índice das áreas: numeração que significa alguma coisa e filetes a separar.
   Nenhuma seta decorativa — o nome é a ligação e isso chega. */
.indice { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--line); }
.indice__linha { border-top: 1px solid var(--line); }
.indice__linha a {
  display: grid;
  grid-template-columns: 3.4rem 1fr 1.3fr;
  gap: 28px;
  align-items: baseline;
  padding-block: 22px;
  text-decoration: none;
  transition: background-color 0.12s ease;
}
.indice__linha a:hover { background: var(--teal-050); }
.indice__numero {
  font-family: var(--font-display);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--accent-text);
  font-variant-numeric: tabular-nums;
}
.indice__nome {
  font-family: var(--font-display);
  font-size: 1.22rem;
  font-weight: 600;
  color: var(--brand);
  letter-spacing: -0.02em;
}
.indice__linha a:hover .indice__nome { text-decoration: underline; text-underline-offset: 4px; }
.indice__texto { color: var(--text-quiet); font-size: 0.95rem; line-height: 1.75; }
.indice__servicos {
  grid-column: 2 / -1;
  color: var(--text-faint);
  font-size: 0.9rem;
  line-height: 1.7;
  margin-top: 6px;
}

/* Sectores: quatro frases curtas separadas por filete, não quatro cartões. */
.sectores { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin: 0; }
.sectores > div { padding: 0 26px; border-left: 1px solid var(--line); }
.sectores > div:first-child { padding-left: 0; border-left: 0; }
.sectores dt { margin: 0 0 10px; }
.sectores dt a {
  font-family: var(--font-display);
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--brand);
  text-decoration: none;
  letter-spacing: -0.02em;
}
.sectores dt a:hover { text-decoration: underline; text-underline-offset: 4px; }
.sectores dd { margin: 0; color: var(--text-quiet); font-size: 0.92rem; line-height: 1.8; }

/* Cursos: a duração e o local decidem, por isso vêm antes da apresentação. */
.cursos { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--line); }
.cursos li { border-top: 1px solid var(--line); }
.cursos li a { display: block; padding-block: 24px; text-decoration: none; }
.cursos li a:hover h3 { text-decoration: underline; text-underline-offset: 4px; }
.cursos h3 { margin: 0 0 6px; font-size: 1.22rem; color: var(--brand); letter-spacing: -0.02em; }
.cursos__dados {
  margin: 0 0 10px;
  color: var(--accent-text);
  font-size: 0.9rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.cursos li p:last-child { margin: 0; color: var(--text-quiet); font-size: 0.95rem; line-height: 1.75; max-width: 70ch; }

/* Fornecimentos: oito nomes de uma palavra são uma lista, não oito cartões. */
.etiquetas-ligacao { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; }
.etiquetas-ligacao a {
  display: inline-block;
  padding: 11px 18px;
  border: 1px solid var(--ink-200);
  border-radius: 4px;
  background: var(--bg-raised);
  color: var(--brand);
  font-size: 0.95rem;
  font-weight: 500;
  text-decoration: none;
}
.etiquetas-ligacao a:hover { border-color: var(--brand); }

/* Notícias: uma lista datada, como num jornal. */
.noticias { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--line); }
.noticias li { border-top: 1px solid var(--line); }
.noticias li a { display: block; padding-block: 22px; text-decoration: none; }
.noticias time { display: block; color: var(--text-faint); font-size: 0.88rem; margin-bottom: 6px; }
.noticias h3 { margin: 0 0 6px; font-size: 1.15rem; color: var(--brand); letter-spacing: -0.02em; }
.noticias li a:hover h3 { text-decoration: underline; text-underline-offset: 4px; }
.noticias p { margin: 0; color: var(--text-quiet); font-size: 0.95rem; line-height: 1.75; max-width: 75ch; }

/* O cartão de projecto: o número medido primeiro, que é o que prova. */
.cartao--projecto .cartao__medida {
  margin: 0 0 14px;
  color: var(--accent-text);
  font-size: 0.95rem;
  font-variant-numeric: tabular-nums;
}
.cartao--projecto .cartao__medida strong {
  display: block;
  font-family: var(--font-display);
  font-size: 1.9rem;
  font-weight: 600;
  color: var(--brand);
  line-height: 1.1;
  letter-spacing: -0.03em;
}
.cartao--projecto .cartao__local { color: var(--text-faint); font-size: 0.9rem; }
.depois-da-grelha { margin-top: 32px; }

/* O convite: um filete e uma pergunta, em vez de uma caixa escura a imitar
   um anúncio. */
.convite { padding-block: 56px 72px; }
.convite__interior {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 48px;
  border-top: 3px solid var(--brand);
  padding-top: 34px;
}
.convite h2 {
  color: var(--brand);
  font-size: clamp(1.7rem, 2.4vw, 2.2rem);
  letter-spacing: -0.035em;
  margin: 0 0 10px;
}
.convite p { margin: 0; color: var(--text-quiet); font-size: 1rem; }
.convite__accoes { display: flex; gap: 12px; flex-shrink: 0; }

@media (max-width: 1080px) {
  .abertura__grelha { grid-template-columns: 1fr; gap: 40px; }
  .abertura h1 { font-size: 3.1rem; }
  .indice__linha a { grid-template-columns: 3rem 1fr; gap: 20px; }
  .indice__texto { grid-column: 2 / -1; }
  .sectores { grid-template-columns: repeat(2, 1fr); row-gap: 28px; }
  .sectores > div:nth-child(odd) { padding-left: 0; border-left: 0; }
}

@media (max-width: 760px) {
  .abertura { padding-block: 40px 36px; }
  .abertura h1 { font-size: clamp(2.6rem, 8vw, 3.5rem); }
  .abertura__accoes { gap: 18px; }
  .indice__linha a { grid-template-columns: 2.6rem 1fr; gap: 14px; padding-block: 18px; }
  .indice__nome { font-size: 1.1rem; }
  .sectores { grid-template-columns: 1fr; row-gap: 22px; }
  .sectores > div { padding: 0; border-left: 0; }
  .convite__interior { flex-direction: column; align-items: flex-start; gap: 24px; }
  .convite__accoes { width: 100%; flex-direction: column; }
}

/* O lema do rodapé era um rótulo em maiúsculas espaçadas — o tique mais
   repetido do site. Agora é a frase, lida do campo `tagline`, numa só fonte. */
.rodape-marca__lema {
  font-family: var(--font-display);
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--on-brand-strong);
  margin: 0 0 4px;
  letter-spacing: -0.01em;
}

/* A linha com o ponto da marca por cima do título. Era um rótulo em versaletes
   espaçadas — o tique mais reconhecível de uma página gerada. Fica o ponto, que
   é a marca, e o texto passa a caixa normal. */
.marca-local {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 18px;
  font-family: var(--font-display);
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--text-quiet);
}

/* Ícones nos cartões. Vêm do Lucide, inseridos no HTML e desenhados a traço
   com `currentColor`, por isso seguem a cor da marca e invertem-se sozinhos
   em modo escuro. */
.icone {
  width: 1em;
  height: 1em;
  display: inline-block;
  vertical-align: -0.125em;
  flex-shrink: 0;
}
.icone-cartao {
  display: inline-grid;
  place-items: center;
  width: 46px;
  height: 46px;
  margin-bottom: 18px;
  border-radius: 10px;
  background: var(--teal-050);
  color: var(--brand);
  font-size: 23px;
}
.cartao--com-icone h3 { margin-top: 0; }

/* Contactos: o formulário e os contactos directos lado a lado. */
.contactos-grelha {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 48px;
  align-items: start;
}
.formulario-nota { color: var(--text-quiet); font-size: 0.95rem; margin: 0 0 24px; }
.contactos-lista { list-style: none; margin: 0 0 28px; padding: 0; }
.contactos-lista li {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding-block: 14px;
  border-top: 1px solid var(--line);
  font-size: 0.95rem;
}
.contactos-lista .icone { font-size: 20px; color: var(--brand); margin-top: 2px; }
.contactos-lista span { display: flex; flex-direction: column; gap: 2px; }
.contactos-lista strong { color: var(--text-quiet); font-size: 0.86rem; font-weight: 500; }
.contactos-lista a { font-weight: 500; }
.campo-escondido { display: none; }

@media (max-width: 900px) {
  .contactos-grelha { grid-template-columns: 1fr; gap: 36px; }
}

/* Mapas dos escritórios. O botão ocupa o mesmo espaço que o mapa vai ocupar,
   para a página não saltar quando ele entra. */
.cartao--local { display: flex; flex-direction: column; }
.cartao__cidade { color: var(--text-quiet); }
.cartao__accoes { margin-top: auto; padding-top: 14px; }
.cartao__accoes a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: 0.95rem;
}
.mapa { margin-block: 16px; }
.mapa iframe {
  display: block;
  width: 100%;
  height: 220px;
  border: 1px solid var(--line);
  border-radius: 6px;
}
.mapa__abrir { width: 100%; justify-content: center; gap: 8px; }

/* ===========================================================================
   O sinal de que algo é uma ligação

   Era uma seta. Catorze setas, em ligações que não saem do site nenhum.
   Uma seta repetida em todo o lado não avisa de nada, e leva `aria-hidden`,
   por isso para quem usa leitor de ecrã a ligação era só texto azul — cor
   sozinha, que a WCAG 1.4.1 não aceita como único indício.

   Agora: sublinhado sempre visível nas ligações, e a seta fica só onde
   significa mesmo alguma coisa — «isto sai do site» (WhatsApp, Google Maps).
   Nos cartões o alvo é o cartão inteiro, por isso basta o título sublinhar-se
   ao passar o rato, em cima do realce da borda que já lá estava.
   =========================================================================== */

.linha-descobrir,
.ligacao-editorial,
.rodape-marca__contacto,
.loja-empresas a,
.loja-ajuda a,
.contactos-lista a,
.cartao__accoes a {
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}
.ligacao-editorial,
.rodape-marca__contacto { text-underline-offset: 5px; }

/* O cartão todo é a ligação: o título confirma-o ao passar o rato. */
.cartao--ligacao:hover h3 { text-decoration: underline; text-underline-offset: 4px; }

/* As categorias da loja são uma lista de navegação, não texto corrido: aí o
   sublinhado permanente seria ruído. Marca-se a actual e sublinha-se no rato. */
.loja-categorias nav a:hover { text-decoration: underline; text-underline-offset: 3px; }
.loja-subcategorias a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* O número tinha 34px de margem para acomodar a seta que estava à direita.
   Com o ícone por baixo, essa folga ficou a sobrar. */
.linha-numero + .icone-cartao { margin-top: -20px; }
.cartao__capa {
  display: block;
  width: calc(100% + 54px);
  margin: -27px -27px 20px;
  height: 170px;
  object-fit: cover;
  border-radius: 6px 6px 0 0;
}