/* ===== v5/css/tokens.css ===== */
/* Design system do v5 (P07, 2026-09-29). Nada fora daqui define cor, tipo ou espaço.
   Paleta e tipografia aprovadas (baseline ?agora=0920c + D23/D24): navy + creme + laranja de CTA;
   Fraunces 600 estática (display) + Poppins (texto). Referência do registo «cartaz»: a abertura
   aprovada (_spike-mesa/abertura/, 2026-09-29); os valores dela estão copiados tal e qual.
   Pares de contraste medidos em reconstrucao/ferramentas/contraste.js (tabela no relatório da P07).
   Página com tudo: /_sistema/.                                                               */

@font-face{font-family:'Fraunces';src:url('/blog/fonts/fraunces/fraunces-display.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
/* a variável: só onde se anima o peso (D23), afinada em --fraunces-var */
@font-face{font-family:'Poppins';src:url('/blog/fonts/poppins/poppins-v23-latin-regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('/blog/fonts/poppins/poppins-v23-latin-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('/blog/fonts/poppins/poppins-v23-latin-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
/* As letras de recurso com as medidas da Poppins e da Fraunces (25/10, o CLS do telemóvel): a Arial (ou as gémeas dela,
   Liberation Sans, Arimo, Helvetica; a Times New Roman e a Liberation Serif para a Fraunces) aumentada até ocupar a mesma
   largura no texto do 1.º ecrã, nas três línguas (fontTools: Poppins 400 112,7 %, 500 113,8 %, 600 106,9 %; Fraunces 600
   107,9 %), com a altura das linhas da Poppins. Enquanto as fontes não chegam o texto é invisível (font-display:block no
   CSS crítico) mas já está composto com a letra de recurso: com as larguras iguais, a chegada não muda as quebras de linha.
   No PageSpeed o Chrome compunha às vezes o 1.º pinto com a letra de recurso e o apoio do hero ganhava uma linha quando a
   Poppins entrava (PT: 0,43 de CLS). Sem nenhuma destas no sistema (Android), fica o system-ui, como antes. */
@font-face{font-family:'Poppins fb';src:local('Arial'),local('ArialMT'),local('Liberation Sans'),local('LiberationSans'),local('Arimo'),local('Helvetica');font-weight:100 449;size-adjust:112.68%;ascent-override:93.18%;descent-override:31.06%;line-gap-override:8.87%}
@font-face{font-family:'Poppins fb';src:local('Arial'),local('ArialMT'),local('Liberation Sans'),local('LiberationSans'),local('Arimo'),local('Helvetica');font-weight:450 549;size-adjust:113.76%;ascent-override:92.30%;descent-override:30.77%;line-gap-override:8.79%}
@font-face{font-family:'Poppins fb';src:local('Arial Bold'),local('Arial-BoldMT'),local('Liberation Sans Bold'),local('LiberationSans-Bold'),local('Arimo Bold'),local('Helvetica Bold');font-weight:550 900;size-adjust:106.85%;ascent-override:98.27%;descent-override:32.76%;line-gap-override:9.36%}
@font-face{font-family:'Fraunces fb';src:local('Times New Roman Bold'),local('TimesNewRomanPS-BoldMT'),local('Liberation Serif Bold'),local('LiberationSerif-Bold'),local('Tinos Bold');font-weight:100 900;size-adjust:107.94%;ascent-override:90.61%;descent-override:23.62%;line-gap-override:0%}

:root{
  /* ---------- 1. Cor: a paleta (valores brutos, não usar diretamente nos componentes) ---------- */
  --navy:#04193c;          /* breu */
  --navy-2:#072250;
  --navy-3:#0b2e66;        /* a luz do navy (sobre, formulário) */
  --creme:#f4f1ea;         /* papel */
  --creme-2:#fbf9f4;       /* folha (papel por cima do papel) */
  --tinta-escura:#16150f;
  --tinta-media:#5b564b;
  --tinta-suave:#6b665a;   /* 5,07:1 no creme; a --areia-escura antiga (#8a8272) dava 3,4 e não servia para texto */
  --azul:#045cb4;          /* links sobre papel */
  --laranja:#ff6b00;       /* o traço e o CTA */
  --laranja-cta-1:#ff8124; /* gradiente do botão C (D23, exceção registada) */
  --laranja-cta-2:#f05d00;
  --laranja-tinta:#1a0f00;
  --ouro:#e2a33c;          /* estrelas */
  --zap:#25d366;
  --zap-tinta:#062b14;
  /* os tons quentes da abertura (texto sobre imagem) */
  --areia-quente:#f6d9ad;  /* 2.ª metade do título */
  --pessego:#ffd6a3;       /* strong do apoio; anel de foco no escuro */
  --ambar:#ffb46a;         /* filete do apoio, sublinhado do menu */
  --texto-imagem:#f8f2e8;  /* apoio sobre imagem */

  /* ---------- 2. Cor: papéis (claro = papel, por omissão) ---------- */
  --fundo:var(--creme);
  --fundo-2:var(--creme-2);
  --tinta:var(--tinta-escura);
  --tinta-2:var(--tinta-media);
  --suave:var(--tinta-suave);
  --acento:var(--azul);            /* texto de destaque e links; o laranja no papel nunca é texto (2,5:1) */
  --titulo:var(--navy);            /* títulos de folha */
  --cta:var(--laranja);
  --linha:var(--laranja);          /* filetes e acentos de linha (decorativo no papel: 2,5:1); o traço já não usa o laranja (D26) */
  --tinta-caneta:var(--navy);      /* o traço: a tinta da caneta navy, só no papel (D26) */
  --filete:#e2ddd1;                /* separadores (decorativos) */
  --campo-borda:rgba(22,21,15,.42);
  --anel:var(--navy);              /* foco: 15,4:1 no creme */

  /* ---------- 3. Tipo ---------- */
  --serif:'Fraunces','Fraunces fb',Georgia,'Times New Roman',serif;
  --sans:'Poppins','Poppins fb',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:ui-monospace,SFMono-Regular,'SF Mono',Menlo,Consolas,monospace;
  --fraunces-var:'opsz' 30,'SOFT' 60,'WONK' 0;
  /* registo «cartaz» (sobre imagem/filme, ecrã inteiro): Fraunces 600, -0,025em, balance */
  --cartaz-g:clamp(3rem,min(7.4vw,12.6svh),8rem);           /* o maior: formulário, obrigado, números */
  --cartaz-m:clamp(2.55rem,min(6.2vw,10.6svh),7.2rem);       /* = título da abertura (aprovado) */
  --cartaz-m-tel:clamp(2.45rem,12.2vw,3.4rem);               /* = título da abertura no telemóvel (≤ 760 px) */
  --cartaz-p:clamp(2.125rem,min(3.9vw,7svh),4.25rem);        /* legendas de capítulo sobre a cena */
  --cartaz-lh:.96;
  --cartaz-ls:-.025em;
  --cartaz-medida:11.2em;
  --apoio:clamp(1.05rem,1.28vw,1.4rem);                       /* = apoio da abertura */
  --apoio-lh:1.55;
  --apoio-medida:33rem;
  /* registo «leitura» (sobre papel: folhas, dossier, pasta, carta) */
  --leitura:clamp(1rem,.3vw + .92rem,1.1875rem);              /* 16 px a 390 → 19 px a 1440 */
  --leitura-lh:1.62;
  --leitura-medida:66ch;                                      /* dentro dos 60–72 ch */
  --leitura-titulo:clamp(1.375rem,1.1vw + 1.1rem,2rem);        /* título de folha, Fraunces */
  --leitura-titulo-lh:1.12;
  --leitura-pequena:1rem;                                     /* o mínimo no dossier e nas folhas (D22) */
  --etiqueta:.8125rem;                                        /* 13 px, Poppins 500, maiúsculas */
  --etiqueta-ls:.2em;
  --nota:.875rem;                                             /* 14 px: fonte, legendas, erro */
  --botao-t:1rem;

  /* ---------- 4. Grelha ---------- */
  --colunas:12;
  --margem:clamp(20px,4vw,72px);                              /* = abertura */
  --calha:clamp(16px,2vw,32px);
  --largo:1320px;                                             /* = faixa da abertura */
  --medio:1080px;
  --estreito:760px;

  /* ---------- 5. Espaço: escala 4/8, 10 passos ---------- */
  --e-1:4px;--e-2:8px;--e-3:12px;--e-4:16px;--e-5:24px;
  --e-6:32px;--e-7:48px;--e-8:64px;--e-9:96px;--e-10:128px;
  /* ritmo de secção: 3 tamanhos */
  --ritmo-p:clamp(48px,8svh,96px);
  --ritmo-m:clamp(80px,14svh,160px);
  --ritmo-g:clamp(120px,22svh,240px);

  /* ---------- 6. Mídia ---------- */
  --raio:0;                         /* por omissão; exceções: botões C/B (999px), menu de vidro, avatar redondo não */
  --raio-pilula:999px;
  --grao-opacidade:.055;            /* um só grão, o da abertura */
  --grao:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --papel-fibra:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='p'><feTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='4'/><feColorMatrix values='0 0 0 0 .4 0 0 0 0 .35 0 0 0 0 .25 0 0 0 .06 0'/></filter><rect width='100%' height='100%' filter='url(%23p)'/></svg>");
  /* véus: a regra do texto sobre imagem (exceção registada: gradientes de legibilidade, não decoração) */
  --veu-topo:linear-gradient(rgba(12,20,48,.62) 0%,rgba(22,24,52,.46) 26%,rgba(40,28,48,.2) 48%,transparent 64%);
  --veu-lado:linear-gradient(90deg,rgba(12,20,48,.36),transparent 62%);
  --veu-base:linear-gradient(transparent 56%,rgba(10,18,44,.22) 76%,rgba(10,18,44,.46) 100%);
  --veu-halo:radial-gradient(70% 55% at 12% 100%,rgba(6,12,32,.42),transparent 70%);
  --veu-sol:radial-gradient(55% 45% at 10% 27%,rgba(255,176,96,.26),transparent 72%);   /* o calor de sol da abertura */
  --vinheta:radial-gradient(125% 100% at 50% 45%,transparent 62%,rgba(0,0,0,.38));
  --sombra-cartaz:0 1px 3px rgba(0,0,0,.18),0 2px 30px rgba(0,0,0,.4);
  --sombra-apoio:0 1px 2px rgba(0,0,0,.4),0 2px 22px rgba(0,0,0,.6);
  --sombra-menu:0 1px 2px rgba(0,0,0,.35),0 1px 14px rgba(0,0,0,.45);
  /* uma só sombra de papel (folha pousada na mesa), nunca a sombra genérica de cartão */
  --sombra-folha:0 1px 1px rgba(40,30,15,.08),0 22px 28px -22px rgba(40,30,15,.55);
  --r-filme:16/9;--r-render:16/10;--r-foto:3/2;--r-retrato:4/5;--r-folha:210/297;--r-telemovel:9/19.5;

  /* ---------- 7. Estados e movimento (P08; espelho exato em js/movimento/tokens.js) ---------- */
  /* durações: micro (estado) / componente / título / cena (legenda, palco, objeto que pousa) */
  --d-micro:180ms;--d-componente:450ms;--d-titulo:900ms;--d-cena:1400ms;
  /* curvas: entrar (chega depressa e assenta), pousar (a da abertura: o objeto desce e assenta),
     sair (parte devagar e acelera para fora), atravessar (passagens entre palcos), tracar (a mão), scrub (linear: o scroll é o tempo) */
  --c-entrar:cubic-bezier(.16,1,.3,1);
  --c-pousar:cubic-bezier(.2,.7,.2,1);
  --c-sair:cubic-bezier(.55,0,.75,.2);
  --c-atravessar:cubic-bezier(.65,0,.35,1);
  --c-tracar:cubic-bezier(.37,0,.63,1);     /* a mão a escrever (o traço) */
  --c-scrub:linear;
  /* distâncias: perto / médio / longe; cena em % do palco */
  --m-perto:12px;--m-medio:32px;--m-longe:80px;--m-cena-perto:8%;--m-cena-longe:18%;
  /* cadência: palavra (= abertura 45 ms) / linha / letra / item */
  --s-palavra:45ms;--s-linha:90ms;--s-letra:28ms;--s-item:80ms;
  /* folga das máscaras de texto (D23: não comer as descendentes) */
  --folga-topo:.1em;--folga-base:.2em;
  /* o traço (o protagonista): espessura em em do texto a que se refere */
  --traco-peso:.055em;
  /* aliases da P07 (componentes.css): mantidos */
  --curva:var(--c-pousar);
  --curva-saida:var(--c-entrar);
  --t-rapido:.2s;--t-medio:.5s;--t-lento:.9s;
  --prima:.97;                              /* :active */
  --inativo:.45;                            /* disabled */

  /* ---------- 8. Breakpoints (para JS e documentação; nas @media usar os números) ----------
     360 / 390 / 768 / 1024 / 1280 / 1440 / 1920. Menu em hambúrguer até 1024; cartaz de telemóvel até 760. */
  --bp-1:360px;--bp-2:390px;--bp-3:768px;--bp-4:1024px;--bp-5:1280px;--bp-6:1440px;--bp-7:1920px;

  --header-h:72px;
  --barra-h:72px;          /* barra fixa de mobile (CTA da secção + WhatsApp, D15-D) */

  /* ---------- aliases do esqueleto da P06 (base.css, componentes.css antigos); a migrar na P16 ---------- */
  --breu:var(--navy);--breu-2:var(--navy-2);--papel:var(--creme);--papel-2:#ffffff;
  --areia:#bdb4a3;--areia-escura:#8a8272;--linha-breu:rgba(190,214,255,.18);
  --azul-claro:#2e8fd4;--laranja-ink:var(--laranja-tinta);
  --t--1:.78rem;--t-0:1rem;--t-1:clamp(1.06rem,.18vw + 1.02rem,1.2rem);--t-2:clamp(1.3rem,.5vw + 1.16rem,1.6rem);
  --t-3:clamp(1.6rem,1vw + 1.35rem,2.1rem);--t-4:clamp(2rem,1.9vw + 1.55rem,3rem);
  --t-5:clamp(2.5rem,6.6vw + .5rem,7.4rem);--t-6:clamp(2.8rem,7.4vw + .9rem,8rem);
}

/* Movimento reduzido (P08): só opacidade de 150 ms, sem distância, sem cadência; o traço já desenhado.
   .mov-reduzido é o mesmo estado ligado à mão (botão da /_movimento/). */
@media (prefers-reduced-motion:reduce){
  :root{--d-micro:150ms;--d-componente:150ms;--d-titulo:150ms;--d-cena:150ms;
    --c-entrar:linear;--c-pousar:linear;--c-sair:linear;--c-atravessar:linear;--c-tracar:linear;
    --m-perto:0px;--m-medio:0px;--m-longe:0px;--m-cena-perto:0%;--m-cena-longe:0%;
    --s-palavra:0ms;--s-linha:0ms;--s-letra:0ms;--s-item:0ms}
}
:root.mov-reduzido{--d-micro:150ms;--d-componente:150ms;--d-titulo:150ms;--d-cena:150ms;
  --c-entrar:linear;--c-pousar:linear;--c-sair:linear;--c-atravessar:linear;--c-tracar:linear;
  --m-perto:0px;--m-medio:0px;--m-longe:0px;--m-cena-perto:0%;--m-cena-longe:0%;
  --s-palavra:0ms;--s-linha:0ms;--s-letra:0ms;--s-item:0ms}

/* Tons de secção: redefinem os papéis. O claro é o :root. */
.tom-escuro{
  --fundo:var(--navy);--fundo-2:var(--navy-2);
  --tinta:var(--creme);--tinta-2:#c9d3e6;--suave:#9aa8c2;
  --acento:var(--ambar);--titulo:var(--creme);--linha:var(--laranja);
  --filete:rgba(190,214,255,.18);--campo-borda:rgba(244,241,234,.42);
  --anel:var(--pessego);
  background-color:var(--fundo);color:var(--tinta);
}
/* sobre imagem ou filme: o fundo é a imagem + os véus; o texto é o da abertura */
.tom-imagem{
  --tinta:var(--texto-imagem);--tinta-2:var(--texto-imagem);--suave:rgba(248,242,232,.8);
  --acento:var(--pessego);--titulo:var(--creme);--linha:var(--ambar);
  --filete:rgba(255,255,255,.16);--anel:var(--pessego);
  color:var(--tinta);
}

/* ===== v5/css/componentes.css ===== */
/* Componentes do v5 (P07). Todos os valores vêm de tokens.css.
   Parte 1: o design system (usado em /_sistema/ e, a partir da P16, no site).
   Parte 2: o esqueleto da P06 (as classes que o index.html usa hoje), alinhado com os tokens;
            a P16 migra-o para a parte 1.
   Regras: raio 0, sem gradiente, sem vidro e sem sombra genérica de cartão, exceto as registadas
   no prompt da P07 (botões C e B, menu do telemóvel em vidro, véus da abertura).
   Alvos de toque ≥ 44 px; foco visível em claro, escuro e sobre imagem.                        */

/* ======================================================================= PARTE 1 · SISTEMA */

/* ---- foco: um anel só, da cor do tom (navy no papel, pêssego no escuro e sobre imagem) ---- */
:focus-visible{outline:2px solid var(--anel);outline-offset:4px;border-radius:0}
/* P19: o «saltar para o conteúdo» à vista onde quer que a página esteja (no fim do Tab o browser volta a ele) */
.saltar:focus{position:fixed}

/* ---- contentores e grelha ---- */
.contentor{width:100%;max-width:var(--largo);margin-inline:auto;padding-inline:var(--margem)}
.contentor-medio{max-width:var(--medio)}
.contentor-estreito{max-width:var(--estreito)}
.grelha{display:grid;grid-template-columns:repeat(var(--colunas),minmax(0,1fr));column-gap:var(--calha)}
.ritmo-p{padding-block:var(--ritmo-p)}
.ritmo-m{padding-block:var(--ritmo-m)}
.ritmo-g{padding-block:var(--ritmo-g)}

/* ---- registo «cartaz»: texto sobre imagem/filme ---- */
.cartaz{font:600 var(--cartaz-m)/var(--cartaz-lh) var(--serif);letter-spacing:var(--cartaz-ls);max-width:var(--cartaz-medida);
  text-wrap:balance;color:var(--titulo);margin:0}
.cartaz-g{font-size:var(--cartaz-g)}
.cartaz-p{font-size:var(--cartaz-p);line-height:1.04;letter-spacing:-.02em}
.cartaz em{font-style:normal;color:var(--areia-quente)}
.tom-imagem .cartaz{text-shadow:var(--sombra-cartaz)}
@media (max-width:760px){.cartaz:not(.cartaz-g):not(.cartaz-p){font-size:var(--cartaz-m-tel)}}
/* máscaras com folga: nunca cortam descendentes (g, p, q, j) nem a sombra */
.m{display:inline-block;vertical-align:top;overflow:clip;padding:.1em .04em .16em;margin:-.1em -.04em -.16em}
.mascara-folga{padding:.35em;margin:-.35em}
.cartaz.mascara-folga{max-width:calc(var(--cartaz-medida) + .7em)}   /* a medida conta sem a folga (= 11,9 em da abertura) */

.apoio{max-width:var(--apoio-medida);margin:0;padding-left:1.25rem;border-left:1px solid var(--laranja);
  font:400 var(--apoio)/var(--apoio-lh) var(--sans);color:var(--tinta);text-wrap:pretty}
.apoio strong{font-weight:600;color:var(--tinta)}
.tom-escuro .apoio,.tom-imagem .apoio{border-left-color:rgba(255,180,106,.85)}
.tom-escuro .apoio strong,.tom-imagem .apoio strong{color:var(--pessego)}
.tom-imagem .apoio{text-shadow:var(--sombra-apoio)}
@media (max-width:760px){.apoio{font-size:1.02rem}}

/* ---- registo «leitura»: texto sobre papel ---- */
.leitura{font:400 var(--leitura)/var(--leitura-lh) var(--sans);color:var(--tinta);max-width:var(--leitura-medida)}
.leitura p{margin:0 0 1em;text-wrap:pretty}
.leitura strong{font-weight:600}
.leitura ul{list-style:none;margin:0 0 1em;padding:0}
.leitura li{position:relative;padding-left:1.5em;margin-bottom:.5em}
.leitura li::before{content:"";position:absolute;left:0;top:.8em;width:.85em;height:1px;background:var(--linha)}
.titulo-folha{font:600 var(--leitura-titulo)/var(--leitura-titulo-lh) var(--serif);letter-spacing:-.015em;color:var(--titulo);margin:0 0 .6em;text-wrap:balance}
.etiqueta{font:500 var(--etiqueta)/1.2 var(--sans);letter-spacing:var(--etiqueta-ls);text-transform:uppercase;color:var(--tinta-2);margin:0}
.nota{font-size:var(--nota);line-height:1.5;color:var(--suave)}

/* link: a cor do acento, sublinhado fino; o traço laranja entra no hover */
.link{color:var(--acento);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em;
  text-decoration-color:currentColor;transition:text-decoration-color var(--t-rapido),color var(--t-rapido)}
@media (hover:hover) and (pointer:fine){.link:hover{text-decoration-color:var(--linha);text-decoration-thickness:2px}}
.link:active{opacity:.75}

/* ---- botões C (principal) e B (vidro): cópia de _spike-mesa/cta/cta.css (D23) + foco, ativo e inativo ---- */
.ic{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.cta-c{position:relative;display:inline-flex;align-items:center;gap:14px;height:62px;padding:0 12px 0 30px;border:0;border-radius:var(--raio-pilula);
  text-decoration:none;color:#fff;font:500 var(--botao-t)/1 var(--sans);letter-spacing:.01em;cursor:pointer;overflow:hidden;
  background:linear-gradient(180deg,var(--laranja-cta-1),var(--laranja-cta-2));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -2px 0 rgba(0,0,0,.12),0 18px 44px -18px rgba(255,107,0,.85),0 2px 6px rgba(0,0,0,.18);
  transition:box-shadow var(--t-medio) var(--curva),transform .16s ease-out;will-change:transform}
.cta-c .rola{display:block;height:1.2em;overflow:hidden}
.cta-c .rola span{display:block;line-height:1.2em;transition:transform var(--t-medio) var(--curva)}
.cta-c .circ{position:relative;width:40px;height:40px;border-radius:50%;background:rgba(26,15,0,.18);display:grid;place-items:center;transition:transform var(--t-medio) var(--curva)}
@media (hover:hover) and (pointer:fine){.cta-c:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -2px 0 rgba(0,0,0,.12),0 26px 60px -18px rgba(255,107,0,1),0 2px 6px rgba(0,0,0,.18)}}
.cta-c:focus-visible .rola span{transform:translateY(-100%)}
@media (hover:hover) and (pointer:fine){.cta-c:hover .rola span{transform:translateY(-100%)}}
.cta-c:focus-visible .circ{transform:translateX(3px) rotate(-45deg)}
@media (hover:hover) and (pointer:fine){.cta-c:hover .circ{transform:translateX(3px) rotate(-45deg)}}
.cta-c::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;transform:translateX(-130%);mix-blend-mode:screen;
  background:linear-gradient(105deg,transparent 32%,rgba(255,255,255,.42) 47%,rgba(255,255,255,.1) 55%,transparent 68%);animation:reflexo 5.2s cubic-bezier(.45,0,.25,1) 1.4s infinite}
.cta-c .circ::after{content:"";position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(255,255,255,.7);opacity:0;animation:onda 3s var(--curva) 1.8s infinite}
/* proposta a decidir (contraste): a mesma forma com a tinta escura */
.cta-c.tinta-escura{color:var(--laranja-tinta)}
.cta-c.tinta-escura .circ{background:rgba(26,15,0,.12)}

.cta-b{--h:64px;position:relative;display:inline-flex;align-items:center;gap:22px;height:var(--h);padding:0 8px 0 30px;border:0;border-radius:var(--raio-pilula);
  color:var(--navy);text-decoration:none;font:500 var(--botao-t)/1 var(--sans);letter-spacing:.01em;cursor:pointer;
  background:rgba(4,25,60,.06);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);isolation:isolate;overflow:hidden;transition:transform .16s ease-out}
.cta-b::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;
  background:conic-gradient(from var(--ang,0deg),rgba(255,107,0,0) 0deg,rgba(255,150,80,.95) 40deg,rgba(255,107,0,0) 90deg,rgba(244,241,234,.18) 180deg,rgba(255,107,0,0) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:gira 5s linear infinite}
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
.cta-b .circ{position:relative;z-index:1;width:48px;height:48px;border-radius:50%;background:var(--laranja);display:grid;place-items:center;color:#fff;
  transition:transform .6s var(--curva);animation:respira 2.8s ease-in-out 1.2s infinite}
.cta-b .fundo{position:absolute;right:8px;top:8px;width:48px;height:48px;border-radius:var(--raio-pilula);background:var(--laranja);z-index:-1;transition:width .6s var(--curva)}
.cta-b .txt{position:relative;z-index:1;transition:color .4s}
.cta-b:focus-visible .fundo{width:calc(100% - 16px)}
@media (hover:hover) and (pointer:fine){.cta-b:hover .fundo{width:calc(100% - 16px)}}
.cta-b:focus-visible .txt{color:var(--laranja-tinta)}
@media (hover:hover) and (pointer:fine){.cta-b:hover .txt{color:var(--laranja-tinta)}}
.cta-b:focus-visible .circ{transform:rotate(-45deg)}
@media (hover:hover) and (pointer:fine){.cta-b:hover .circ{transform:rotate(-45deg)}}
.cta-b::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;transform:translateX(-130%);
  background:linear-gradient(105deg,transparent 28%,rgba(255,255,255,.06) 40%,rgba(255,255,255,.28) 47%,rgba(255,236,215,.08) 53%,transparent 66%);animation:reflexo 4.6s cubic-bezier(.45,0,.25,1) 1.6s infinite}
.tom-escuro .cta-b,.tom-imagem .cta-b{background:rgba(244,241,234,.07);color:var(--creme)}
/* WhatsApp: o B com o ícone da conversa e o círculo verde */
.cta-b.whatsapp .circ,.cta-b.whatsapp .fundo{background:var(--zap);color:var(--zap-tinta)}
.cta-b.whatsapp .circ{animation:none}
.cta-b.whatsapp:focus-visible .txt{color:var(--zap-tinta)}
@media (hover:hover) and (pointer:fine){.cta-b.whatsapp:hover .txt{color:var(--zap-tinta)}}
@media (hover:hover) and (pointer:fine){.cta-b.whatsapp:hover .circ{transform:none}}

.cta-c:active,.cta-b:active{transform:scale(var(--prima))}
.cta-c[aria-disabled=true],.cta-c:disabled,.cta-b[aria-disabled=true],.cta-b:disabled{opacity:var(--inativo);cursor:not-allowed;pointer-events:none;filter:saturate(.6)}
.cta-c[aria-disabled=true]::after,.cta-c:disabled::after,.cta-b[aria-disabled=true]::after,.cta-b:disabled::after,
.cta-c[aria-disabled=true] .circ::after,.cta-b[aria-disabled=true]::before,.cta-b[aria-disabled=true] .circ{animation:none}
@keyframes reflexo{0%{transform:translateX(-130%)}44%,100%{transform:translateX(130%)}}
@keyframes gira{to{--ang:360deg}}
@keyframes respira{0%,100%{box-shadow:0 0 0 0 rgba(255,107,0,.55)}50%{box-shadow:0 0 0 9px rgba(255,107,0,0)}}
@keyframes onda{0%{transform:scale(1);opacity:.7}70%,100%{transform:scale(1.9);opacity:0}}
.cta-c,.cta-b{flex:none;max-width:100%;white-space:nowrap}
/* ecrãs muito estreitos: o texto passa de linha em vez de sair do botão (sem o rolo do hover, que o toque não usa) */
@media (max-width:420px){
  .cta-c,.cta-b{height:auto;min-height:62px;padding-block:10px;white-space:normal;text-align:left}
  .cta-c .rola{height:auto}.cta-c .rola span{line-height:1.25}.cta-c .rola span+span{display:none}
  .cta-c .circ,.cta-b .circ{flex:none}
}
@media (prefers-reduced-motion:reduce){.cta-c::after,.cta-b::after,.cta-b::before,.cta-b .circ,.cta-c .circ::after{animation:none}}

/* ---- navegação (a da abertura): transparente sobre a imagem; hambúrguer até 1024 px de largura ----
   Container query (e não @media) para o menu do telemóvel se poder ver numa moldura; no site, a largura é a do ecrã. */
.navegacao{container:nav/inline-size;position:relative;height:var(--header-h);color:var(--creme)}
.navegacao .linha-nav{height:100%;max-width:var(--largo);margin:0 auto;padding:0 var(--margem);display:flex;align-items:center;justify-content:space-between;gap:24px}
.navegacao .marca{display:inline-flex;align-items:center;gap:12px;min-height:44px;color:inherit;text-decoration:none}
.navegacao .marca svg{flex:none;width:32px;height:32px;transition:transform 1.2s var(--curva)}
@media (hover:hover) and (pointer:fine){.navegacao .marca:hover svg{transform:rotate(45deg)}}
.navegacao .marca span{font:500 13px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase}
.navegacao .menu-nav{display:flex;gap:30px;margin:0;padding:0;list-style:none}
.navegacao .menu-nav li{margin:0}
.navegacao .menu-nav a{position:relative;display:block;min-width:44px;padding:14px 6px;margin:0 -6px;text-align:center;color:inherit;text-decoration:none;font:500 16px/1 var(--sans);text-shadow:var(--sombra-menu)}
.navegacao .menu-nav a::after{content:"";position:absolute;left:6px;right:6px;bottom:8px;height:1px;background:var(--ambar);transform:scaleX(0);transform-origin:0 50%;transition:transform var(--t-medio) var(--curva)}
.navegacao .menu-nav a:focus-visible::after,.navegacao .menu-nav a[aria-current]::after{transform:scaleX(1)}
@media (hover:hover) and (pointer:fine){.navegacao .menu-nav a:hover::after{transform:scaleX(1)}}
.navegacao .abrir-nav{display:none;flex:none;width:44px;height:44px;padding:11px 10px;border:0;background:none;color:inherit;cursor:pointer}
.navegacao .abrir-nav span{display:block;height:2px;margin:4px 0;border-radius:2px;background:currentColor}
@container nav (max-width:1024px){
  .abrir-nav{display:block!important}
  /* o menu do telemóvel: vidro muito transparente (exceção aprovada, 2026-09-29) */
  .menu-nav{position:absolute;inset:var(--header-h) 0 auto;display:none!important;flex-direction:column;gap:0!important;padding:8px var(--margem) 24px!important;
    background:linear-gradient(115deg,rgba(255,255,255,.1),rgba(255,255,255,.02) 38%,rgba(255,255,255,0) 60%,rgba(255,255,255,.05)),rgba(255,255,255,.025);
    -webkit-backdrop-filter:blur(5px) saturate(115%);backdrop-filter:blur(5px) saturate(115%);
    border-top:1px solid rgba(255,255,255,.28);border-bottom:1px solid rgba(255,255,255,.12);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 -1px 0 rgba(0,0,0,.08),0 18px 40px -28px rgba(0,0,0,.5)}
  .menu-nav[data-aberto=true]{display:flex!important}
  .menu-nav li+li{border-top:1px solid rgba(255,255,255,.16)}
  .menu-nav a{padding:14px 0!important;margin:0!important;text-align:left!important;font-size:19px!important;text-shadow:0 1px 2px rgba(0,0,0,.55),0 2px 18px rgba(0,0,0,.55)!important}
  .menu-nav a::after{left:0!important;right:0!important}
}

/* ---- superfícies ---- */
/* papel: a folha pousada (fibra do papel, uma só sombra, raio 0) */
.papel{position:relative;background:var(--creme-2) var(--papel-fibra);color:var(--tinta-escura);border-radius:var(--raio);box-shadow:var(--sombra-folha)}
/* o timbrado dos serviços: o símbolo e o nome reais, filete laranja por baixo */
.timbrado{display:flex;align-items:center;gap:12px;padding-bottom:var(--e-4);margin-bottom:var(--e-6);border-bottom:1px solid var(--laranja);color:var(--navy)}
.timbrado svg{width:28px;height:28px;flex:none}
.timbrado span{font:500 12px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase}
.folha-servico{padding:clamp(28px,4vw,56px) clamp(24px,3.6vw,52px);max-width:34rem;aspect-ratio:var(--r-folha);display:flex;flex-direction:column}
.folha-servico .leitura{max-width:none}
.folha-servico .rodape-folha{margin-top:auto;padding-top:var(--e-5);display:flex;justify-content:space-between;align-items:end;gap:var(--e-4)}
/* navy com luz e textura (sobre, formulário: D22) */
.navy-luz{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(90% 90% at 12% 110%,var(--navy-3),transparent 60%),var(--navy)}
.navy-luz::before{content:"";position:absolute;z-index:-1;width:70vw;height:70vw;left:40%;top:-35%;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(255,170,90,.2),rgba(255,120,40,.06) 55%,transparent 72%);filter:blur(24px)}
/* o grão único (o da abertura) */
.grao{position:relative;overflow:hidden}
.grao::after{content:"";position:absolute;inset:-50%;pointer-events:none;z-index:9;opacity:var(--grao-opacidade);background-image:var(--grao);animation:grao 1s steps(6) infinite}
@keyframes grao{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
@media (prefers-reduced-motion:reduce){.grao::after{animation:none}}
/* texto sobre imagem: os véus da abertura, nunca um véu na imagem toda */
.sobre-imagem{position:relative;isolation:isolate;overflow:hidden;background:#101318}
.sobre-imagem>img,.sobre-imagem>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.sobre-imagem .veus{position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--veu-topo),var(--veu-lado)}
.sobre-imagem .veus::after{content:"";position:absolute;inset:0;background:var(--vinheta),var(--veu-halo),var(--veu-base),var(--veu-sol)}

/* ---- depoimento: uma folha, sem cartão arredondado ---- */
.depoimento{padding:var(--e-6) var(--e-6) var(--e-5);max-width:30rem}
.depoimento .estrelas{display:flex;gap:3px;color:var(--ouro);margin-bottom:var(--e-4)}
.depoimento .estrelas svg{width:18px;height:18px}
.depoimento blockquote{margin:0 0 var(--e-5);font:400 var(--leitura)/var(--leitura-lh) var(--sans)}
.depoimento figcaption{display:flex;align-items:center;gap:var(--e-3);padding-top:var(--e-4);border-top:1px solid var(--filete)}
.depoimento figcaption img{width:44px;height:44px;object-fit:cover;border-radius:var(--raio)}
.depoimento figcaption b{display:block;font:600 15px/1.3 var(--sans);color:var(--navy)}

/* ---- FAQ: um item da pasta (número do separador, pergunta, resposta) ---- */
.faq-sis{max-width:44rem}
.faq-sis .item{border-top:1px solid var(--filete)}
.faq-sis .item:last-child{border-bottom:1px solid var(--filete)}
.faq-sis .q{all:unset;box-sizing:border-box;width:100%;min-height:56px;display:grid;grid-template-columns:2.25rem 1fr 20px;gap:var(--e-3);align-items:center;
  padding:var(--e-4) 0;cursor:pointer;font:500 var(--leitura)/1.4 var(--sans);color:var(--tinta)}
.faq-sis .q b{font:600 1.25rem/1 var(--serif);color:var(--suave);transition:color var(--t-rapido)}
.faq-sis .q .mais{position:relative;width:14px;height:14px;justify-self:end}
.faq-sis .q .mais::before,.faq-sis .q .mais::after{content:"";position:absolute;left:0;right:0;top:6px;height:2px;background:var(--navy);transition:transform var(--t-rapido) ease-out}
.faq-sis .q .mais::after{transform:rotate(90deg)}
@media (hover:hover) and (pointer:fine){.faq-sis .q:hover{color:var(--navy)}}
.faq-sis .q[aria-expanded=true] b{color:var(--navy)}
.faq-sis .q[aria-expanded=true] .mais::after{transform:rotate(0)}
.faq-sis .q:focus-visible{outline:2px solid var(--anel);outline-offset:4px}
.faq-sis .r{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s var(--curva)}
.faq-sis .r>div{overflow:hidden}
.faq-sis .q[aria-expanded=true]+.r{grid-template-rows:1fr}
.faq-sis .q[aria-expanded=false]+.r{visibility:hidden}
.faq-sis .r .leitura{margin:0 0 var(--e-5) calc(2.25rem + var(--e-3));padding-left:var(--e-4);border-left:1px solid var(--linha)}
@media (prefers-reduced-motion:reduce){.faq-sis .r{transition:none}}

/* ---- formulário (sobre navy): campo em linha, com erro e sucesso ---- */
.campo-sis{display:grid;gap:6px;max-width:36rem}
.campo-sis label,.grupo-sis legend{font:500 var(--nota)/1.4 var(--sans);color:var(--tinta-2);letter-spacing:.02em}
.campo-sis .linha-campo{position:relative}
.campo-sis input,.campo-sis textarea{width:100%;min-height:52px;padding:12px 36px 12px 0;border:0;border-bottom:1px solid var(--campo-borda);border-radius:0;background:transparent;
  color:var(--tinta);font:400 clamp(1.125rem,1.4vw,1.375rem)/1.35 var(--sans);caret-color:var(--laranja);outline:0}
.campo-sis textarea{min-height:120px;resize:vertical}
.campo-sis ::placeholder{color:rgba(244,241,234,.62)}
.campo-sis .linha-campo::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--laranja);transform:scaleX(0);transform-origin:0 50%;transition:transform .6s var(--curva)}
.campo-sis .linha-campo:focus-within::after{transform:scaleX(1)}
.campo-sis .estado{position:absolute;right:4px;top:50%;width:22px;height:22px;margin-top:-11px;opacity:0;transition:opacity var(--t-rapido)}
.campo-sis .erro-msg{min-height:1.4em;margin:0;font:400 var(--nota)/1.4 var(--sans);color:#ffb27a;visibility:hidden}
.campo-sis.erro .linha-campo::after{transform:scaleX(1);background:#ffb27a}
.campo-sis.erro .erro-msg{visibility:visible}
.campo-sis.ok .linha-campo::after{transform:scaleX(1);background:var(--ambar)}
.campo-sis.ok .estado{opacity:1;color:var(--ambar)}
.campo-sis input:disabled{opacity:var(--inativo);cursor:not-allowed}
/* assuntos: opções em caixa, raio 0, sem vidro */
.grupo-sis{border:0;margin:0;padding:0;min-width:0}
.grupo-sis .opcoes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:10px;margin-top:10px}
.opcao-sis{position:relative;display:flex;align-items:center;gap:14px;min-height:56px;padding:12px 16px;cursor:pointer;border:1px solid var(--filete);
  background:rgba(244,241,234,.03);font:500 15px/1.3 var(--sans);transition:border-color var(--t-rapido),background-color var(--t-rapido)}
@media (hover:hover) and (pointer:fine){.opcao-sis:hover{border-color:rgba(255,180,106,.6)}}
.opcao-sis input{position:absolute;opacity:0;pointer-events:none}
.opcao-sis .visto{flex:none;width:22px;height:22px;border:1.5px solid rgba(244,241,234,.6);display:grid;place-items:center;transition:background-color var(--t-rapido),border-color var(--t-rapido)}
.opcao-sis .visto svg{width:13px;height:13px;fill:none;stroke:var(--laranja-tinta);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24;transition:stroke-dashoffset .45s var(--curva) .05s}
.opcao-sis:has(input:checked){border-color:var(--laranja);background:rgba(255,107,0,.12)}
.opcao-sis:has(input:checked) .visto{background:var(--laranja);border-color:var(--laranja)}
.opcao-sis:has(input:checked) .visto svg{stroke-dashoffset:0}
.opcao-sis:has(input:focus-visible){outline:2px solid var(--anel);outline-offset:3px}

/* ---- dossier: uma etapa do «como funciona» (texto ≥ 16 px) ---- */
.etapa-sis{display:grid;grid-template-columns:3rem 1fr;column-gap:var(--e-4);padding-block:var(--e-5);border-top:1px solid var(--filete)}
.etapa-sis .n{grid-row:1/span 2;font:600 2.5rem/1 var(--serif);color:var(--navy)}
.etapa-sis h3{font:600 1.375rem/1.15 var(--serif);color:var(--navy);margin:.1em 0 .4em;letter-spacing:-.01em}
.etapa-sis p{margin:0;font:400 var(--leitura)/1.55 var(--sans)}

/* ================================================================= PARTE 2 · ESQUELETO P06 */

.capitulo{position:relative;padding-block:var(--ritmo-m)}
.cabeca{max-width:52rem;margin-bottom:var(--e-7)}
.cabeca-apoio{color:var(--tinta-2);font-size:var(--t-1);margin-top:var(--e-4)}
.cta-faixa{margin-top:var(--e-7)}

/* folha: o suporte de papel da direção (texto HTML real, sem perspetiva) */
.folha{background:var(--creme-2) var(--papel-fibra);border-radius:var(--raio);padding:var(--e-6);box-shadow:var(--sombra-folha)}

.estrelas{display:inline-flex;gap:2px;color:var(--ouro)}
.estrelas svg{width:16px;height:16px}

.dep-topo{display:flex;align-items:center;justify-content:space-between;gap:var(--e-5);margin-bottom:var(--e-6)}
.dep-nota{display:flex;align-items:center;gap:var(--e-3)}
.dep-nota h3{font-size:var(--t-2)}
.dep-google img{width:160px;height:auto}
.mural{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--e-6);align-items:start}
@media (max-width:900px){.mural{grid-template-columns:1fr}}
.mural-fluxo{display:grid;gap:var(--e-5)}
.dep{background:var(--creme-2) var(--papel-fibra);border-radius:var(--raio);padding:var(--e-5);box-shadow:var(--sombra-folha)}
.dep-forte .dep-foto{width:100%;max-width:300px;margin-bottom:var(--e-4)}
.dep-cab{display:flex;align-items:center;gap:var(--e-3);margin-bottom:var(--e-3)}
.dep-nome{margin:0;font-weight:600;color:var(--navy)}
.dep-txt{margin:0 0 var(--e-3)}
.dep-fonte{margin:0;color:var(--suave);font-size:var(--nota)}
.avatar{width:46px;height:46px;flex:none;object-fit:cover;border-radius:var(--raio)}
.avatar-inicial{display:grid;place-items:center;background:var(--cor,var(--navy));color:#fff;font-weight:600}
.avatar-inicial::after{content:attr(data-inicial)}

.servicos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--e-5)}
.servico h3{margin-bottom:var(--e-4)}

.vantagens{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:var(--e-5)}
.vantagem{border-top:1px solid var(--laranja);padding-top:var(--e-4)}
.vantagem h3{font-family:var(--sans);font-size:var(--t-1);letter-spacing:0;margin-bottom:var(--e-2)}

/* processo: os números 1–4 são texto da produção */
.processo{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:var(--e-6)}
.passo b{display:block;font:600 2.5rem/1 var(--serif);color:var(--navy);margin-bottom:var(--e-4)}
.passo h3{font-family:var(--sans);font-size:var(--t-1);letter-spacing:0;margin-bottom:var(--e-2)}

.sobre{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:var(--e-8);align-items:start}
@media (max-width:920px){.sobre{grid-template-columns:1fr}}
.sobre-foto{position:relative}
.sobre-selo{position:absolute;right:-12px;bottom:-12px;width:128px;height:128px;border-radius:50%;background:var(--creme-2);display:grid;place-content:center;text-align:center;box-shadow:var(--sombra-folha)}
.sobre-selo b{font-family:var(--serif);font-size:2rem;line-height:1;color:var(--navy)}
.sobre-selo span{font-size:12px;line-height:1.3}
.rotulo{font:500 var(--etiqueta)/1.2 var(--sans);letter-spacing:var(--etiqueta-ls);text-transform:uppercase;color:var(--tinta-2);margin-bottom:var(--e-3)}
.sobre-txt h2{margin-bottom:var(--e-5)}
.carta{margin-bottom:var(--e-5)}
.credenciais{display:grid;gap:var(--e-4);margin-bottom:var(--e-6)}
.credencial{display:grid;grid-template-columns:28px 1fr;gap:var(--e-3);align-items:start}
.credencial-em{font-size:1.25rem;line-height:1.2}
.credencial b{display:block;color:var(--navy)}
.credencial span:not(.credencial-em){display:block;color:var(--tinta-2);font-size:var(--nota)}

.faq-folha{max-width:60rem}
.faq-item{border-bottom:1px solid var(--filete)}
.faq-q{display:flex;width:100%;align-items:center;justify-content:space-between;gap:var(--e-4);min-height:56px;padding:var(--e-4) 0;background:none;border:0;text-align:left;font:600 var(--t-0)/1.4 var(--sans);color:var(--navy);cursor:pointer}
.faq-mais{position:relative;width:14px;height:14px;flex:none}
.faq-mais::before,.faq-mais::after{content:'';position:absolute;left:0;right:0;top:6px;height:2px;background:var(--navy);border-radius:2px;transition:transform .2s ease-out}
.faq-mais::after{transform:rotate(90deg)}
.faq-q[aria-expanded="true"] .faq-mais::after{transform:rotate(0)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s ease-out}
.faq-a > div{overflow:hidden}
.faq-q[aria-expanded="true"] + .faq-a{grid-template-rows:1fr}
.faq-q[aria-expanded="true"] + .faq-a > div{padding-bottom:var(--e-5)}
.faq-q[aria-expanded="false"] + .faq-a{visibility:hidden}
@media (prefers-reduced-motion:reduce){.faq-a{transition:none}}
.faq-ajuda{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--e-4);margin-top:var(--e-6)}
.botao-zap{background:var(--zap);color:var(--zap-tinta)}

.capitulo-fecho{background:var(--navy);color:var(--creme)}
.capitulo-fecho h2{margin-bottom:var(--e-4)}

.capitulo-formulario{background:var(--navy);color:var(--creme)}
.contacto{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:var(--e-8)}
@media (max-width:900px){.contacto{grid-template-columns:1fr}}
.formulario{display:grid;gap:var(--e-4)}
.campo{display:grid;gap:6px}
.campo label,.grupo legend{font-size:14px;font-weight:500}
.campo input,.campo textarea{width:100%;min-height:48px;padding:12px 14px;border-radius:var(--raio);border:1px solid rgba(244,241,234,.42);background:rgba(244,241,234,.06);color:var(--creme);font:inherit}
.campo textarea{min-height:120px;resize:vertical}
.campo input.erro,.campo textarea.erro{border-color:#ffb27a}
.grupo{border:0;padding:0;margin:0}
.opcoes{display:grid;gap:6px;margin-top:6px}
.opcao{display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer}
.opcao input{width:20px;height:20px;accent-color:var(--laranja)}
.erro-msg{display:none;color:#ffb27a;font-size:var(--nota)}
.erro-msg[data-ver="true"]{display:block}
.honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.obrigado{display:none}
.obrigado[data-ver="true"]{display:block}

.rodape{background:#031331;color:rgba(244,241,234,.85);padding-block:var(--e-8) var(--e-6);font-size:15px}
/* P19: o anel de foco dos fundos escuros (o navy do anel desaparecia no navy do rodapé) */
.rodape{--anel:var(--pessego)}
.rodape a{color:inherit}
.rodape h3{font-family:var(--sans);font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--creme);margin-bottom:var(--e-3)}
.rodape-grelha{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:var(--e-7)}
.rodape-lista{display:grid;gap:var(--e-2)}
.rodape-lista a,.rodape-lista p{display:flex;align-items:center;gap:8px;margin:0;min-height:44px}
.rodape-lista a{overflow-wrap:anywhere}   /* (P21: o e-mail inteiro passava 8 px do ecrã a 360) */
.rodape-lista svg{width:18px;height:18px;flex:none}
.rodape ul{list-style:none;padding:0}
.rodape ul a{display:inline-flex;align-items:center;min-height:44px;min-width:44px}   /* (P21: o «FAQ» tinha 30 px de largura) */
.rodape-fim{border-top:1px solid rgba(190,214,255,.18);margin-top:var(--e-7);padding-top:var(--e-5);font-size:13px}

.zap{position:fixed;right:20px;bottom:calc(20px - var(--ios-desvio,0px));z-index:40;width:56px;height:56px;border-radius:50%;background:var(--zap);display:grid;place-items:center;box-shadow:0 10px 24px -10px rgba(0,0,0,.5)}
.zap svg{width:30px;height:30px;color:#fff}
.subir{position:fixed;right:24px;bottom:calc(88px - var(--ios-desvio,0px));z-index:40;width:44px;height:44px;border-radius:50%;border:0;background:var(--creme-2);color:var(--navy);display:grid;place-items:center;box-shadow:0 6px 16px -8px rgba(0,0,0,.4);opacity:0;pointer-events:none;transition:opacity .2s}
.subir[data-ver="true"]{opacity:1;pointer-events:auto}
.subir svg{width:20px;height:20px}
/* P19: o anel por dentro do círculo claro (navy no creme), que se vê sobre qualquer fundo (por fora sumia no rodapé navy) */
.subir:focus-visible{outline-color:var(--navy);outline-offset:-5px}

.barra{display:none}
@media (max-width:760px){
  .barra{position:fixed;left:0;right:0;bottom:calc(0px - var(--ios-desvio,0px));z-index:45;height:var(--barra-h);display:flex;align-items:center;padding:0 80px 0 12px;background:var(--navy);transform:translateY(100%);transition:transform .25s ease-out}
  .barra[data-ver="true"]{transform:none}
  .barra .botao{flex:1;min-width:0;font-size:13px;padding:12px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* o WhatsApp por cima da barra fixa, no espaço que ela lhe guarda (padding-right: 80px); antes a barra (z 45) tapava-o */
  .zap{right:12px;bottom:calc(12px - var(--ios-desvio,0px));width:48px;height:48px;z-index:46}
  .zap svg{width:26px;height:26px}
  .subir{display:none}
  /* (21/10, o Ramiro: «em mobile há uma sobra depois do rodapé, uma barra branca na base do site») a reserva de 72 px para a
     barra no fim do body saiu: no fim do site (o Contacto e o rodapé) a barra está sempre desligada, e a reserva ficava vazia */
}
@media (max-width:760px) and (prefers-reduced-motion:reduce){.barra{transition:none}}

/* ---------- Movimento (P08): o que as primitivas e o traço precisam do CSS ---------- */
/* variáveis animadas registadas sem herança: mudar --alt na folha não recalcula os filhos a cada frame */
@property --alt{syntax:'<number>';inherits:false;initial-value:0}
@property --varre{syntax:'<number>';inherits:false;initial-value:0}
@property --filete{syntax:'<number>';inherits:true;initial-value:1}   /* herda: é lido no ::before */
/* o traço: só no papel, a navy (D26); a tinta vive no papel (um svg por suporte, atrás das letras) */
.traco-tinta{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:-1}   /* o suporte fica isolate */
.traco-forma{fill:var(--tinta-caneta)}
/* a legenda de cena: o filete desce, o texto varre da esquerda (--varre 100 → 0) */
.legenda-apoio{position:relative;padding-left:1.25rem;--varre:0;--filete:1;
  -webkit-mask-image:linear-gradient(90deg,#000 40%,transparent 60%);mask-image:linear-gradient(90deg,#000 40%,transparent 60%);
  -webkit-mask-size:260% 100%;mask-size:260% 100%;-webkit-mask-position:calc(var(--varre) * 1%) 0;mask-position:calc(var(--varre) * 1%) 0}
.legenda-apoio::before{content:"";position:absolute;left:0;top:.3em;bottom:.3em;width:1px;background:var(--tinta-caneta);transform:scaleY(var(--filete));transform-origin:50% 0}
/* sobre escuro/imagem o filete é o da abertura (âmbar/laranja do tom), não tinta */
.tom-escuro .legenda-apoio::before,.tom-imagem .legenda-apoio::before{background:var(--linha)}
/* pousar: a sombra solta quando o papel está no ar (--alt 1), justa quando assenta (--alt 0 = --sombra-folha) */
.pousavel{--alt:0;box-shadow:0 calc(1px + var(--alt) * 16px) calc(1px + var(--alt) * 42px) rgba(40,30,15,calc(.08 + var(--alt) * .12)),
  0 22px 28px -22px rgba(40,30,15,calc(.55 - var(--alt) * .35))}
/* trocar no palco: os itens ocupam a mesma célula; reduzido: em coluna, todos à vista */
.palco-troca{display:grid}.palco-troca>*{grid-area:1/1}
.palco-estatico{display:flex;flex-direction:column;gap:var(--e-7)}

/* ===== blog/css/blog.css ===== */
/* Blog (S7). Só tokens de tokens.css e classes de componentes.css (P07); nada de cor, tipo ou espaço novos.
   Concatenado por ferramentas/construir.mjs depois de tokens.css + componentes.css.
   verificação: ferramentas/verificar.mjs (nenhum valor fora dos tokens). */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--e-6)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body.blog{margin:0;background:var(--fundo);color:var(--tinta);font:400 var(--leitura)/var(--leitura-lh) var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
.blog img,.blog svg{display:block;max-width:100%}
.blog img{height:auto}
.blog p{margin:0 0 1em}
.blog h1,.blog h2,.blog h3{margin:0;font-weight:600;text-wrap:balance}
.blog ul,.blog ol{margin:0 0 1em;padding:0}
.blog a{color:var(--acento)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.saltar-blog{position:absolute;left:var(--e-3);top:calc(-1 * var(--e-9));z-index:100;padding:var(--e-3) var(--e-4);background:var(--creme-2);color:var(--navy);font:600 var(--leitura-pequena)/1.2 var(--sans)}
.saltar-blog:focus{top:var(--e-3)}

/* ---- faixa EXEMPLO ---- */
.faixa-exemplo{background:var(--laranja);color:var(--laranja-tinta);font:600 var(--nota)/1.4 var(--sans);letter-spacing:.02em;text-align:center;padding:var(--e-2) var(--margem)}

/* ---- cabeçalho: a navegação do sistema (.navegacao) em navy, sem hambúrguer ---- */
.topo-blog{position:relative}
.topo-blog .linha-nav{gap:var(--e-4)}
.topo-blog .marca{flex:none;min-width:44px;justify-content:center}
.topo-blog .corpo-nav{display:flex;align-items:center;gap:var(--e-5);margin-left:auto}
.topo-blog .links-nav{display:flex;gap:var(--e-5);margin:0;padding:0;list-style:none}
.topo-blog .links-nav li{margin:0}
.topo-blog .links-nav a,.topo-blog .idiomas a{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;color:var(--creme);text-decoration:none;font:500 var(--nota)/1 var(--sans)}
.topo-blog .links-nav a::after,.topo-blog .idiomas a::after{content:"";position:absolute;left:0;right:0;bottom:var(--e-2);height:1px;background:var(--ambar);transform:scaleX(0);transform-origin:0 50%;transition:transform var(--d-componente) var(--c-pousar)}
.topo-blog .links-nav a:hover::after,.topo-blog .links-nav a:focus-visible::after,.topo-blog a[aria-current]::after{transform:scaleX(1)}
.topo-blog .idiomas{display:flex;margin:0;padding:0;list-style:none;border-left:1px solid var(--filete);padding-left:var(--e-3)}
.topo-blog .idiomas li{margin:0}
.topo-blog .idiomas a{letter-spacing:var(--etiqueta-ls);font-size:var(--etiqueta)}
@media (max-width:760px){.topo-blog .links-nav{display:none}}
@media (max-width:440px){.topo-blog .marca span{display:none}}

/* ---- migalhas ---- */
.migalhas{padding-top:var(--e-5)}
.migalhas ol{display:flex;flex-wrap:wrap;align-items:center;gap:0 var(--e-3);margin:0;padding:0;list-style:none;font:400 var(--nota)/1.5 var(--sans);color:var(--suave)}
.migalhas li{margin:0;display:flex;gap:var(--e-3)}
.migalhas li+li::before{content:"";align-self:center;width:var(--e-3);height:1px;background:var(--linha)}
.migalhas a{display:inline-flex;align-items:center;min-height:44px;color:var(--acento);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em}
.migalhas a:hover{text-decoration-color:var(--linha);text-decoration-thickness:2px}
.migalhas [aria-current]{color:var(--tinta-2)}

/* ---- cabeça de artigo / lista ---- */
.cabeca-blog{padding-block:var(--e-6) var(--e-7)}
.cabeca-blog .etiqueta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--e-2) var(--e-4);margin-bottom:var(--e-4)}
.a-pilar{color:inherit;text-decoration:none}
.a-pilar:hover{text-decoration:underline;text-decoration-color:var(--linha);text-decoration-thickness:2px;text-underline-offset:.22em}
.selo-exemplo{display:inline-block;padding:var(--e-1) var(--e-3);background:var(--laranja);color:var(--laranja-tinta);font:600 var(--etiqueta)/1.2 var(--sans);letter-spacing:var(--etiqueta-ls)}
.blog .h1-artigo{font:600 var(--t-4)/1.06 var(--serif);letter-spacing:-.025em;color:var(--titulo);max-width:var(--estreito);margin:0 0 var(--e-5)}
.blog .h1-lista{font:600 var(--cartaz-p)/1.04 var(--serif);letter-spacing:var(--cartaz-ls);color:var(--titulo);max-width:var(--cartaz-medida);margin:0 0 var(--e-5)}
.cabeca-blog .apoio{max-width:var(--apoio-medida);font-size:var(--apoio);line-height:var(--apoio-lh);color:var(--tinta);margin-bottom:var(--e-6)}
.cabeca-blog .apoio .rot{display:block;margin-bottom:var(--e-2)}

/* imagem de abertura: «placa» de galeria, a mesma linguagem das redes (foto em margem de papel, legenda pequena) */
.placa-artigo{margin:0 0 var(--e-6);padding:0}
.placa-artigo picture,.placa-artigo img{display:block;width:100%}
.placa-artigo img{aspect-ratio:4/5;object-fit:cover;background:var(--creme-2)}
.placa-artigo figcaption{margin-top:var(--e-3);padding-top:var(--e-2);border-top:1px solid var(--filete);font:500 var(--etiqueta)/1.4 var(--sans);letter-spacing:var(--etiqueta-ls);text-transform:uppercase;color:var(--tinta-2)}
@media (min-width:1024px){
  .cabeca-blog.com-placa{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);column-gap:var(--e-9);align-items:start}
  .cabeca-blog.com-placa .cabeca-texto{grid-column:1;grid-row:1}
  .cabeca-blog.com-placa .placa-artigo{grid-column:2;grid-row:1 / span 2;margin:0}
  .cabeca-blog.com-placa .meta-artigo{grid-column:1;grid-row:2;align-self:end}
}

/* autoria + datas */
.meta-artigo{display:flex;flex-wrap:wrap;align-items:center;gap:var(--e-5) var(--e-7);padding-top:var(--e-5);border-top:1px solid var(--filete)}
.autoria{display:flex;align-items:center;gap:var(--e-4)}
.autoria-foto{flex:none;width:var(--e-8);height:var(--e-8);overflow:hidden;background:var(--creme-2)}
.autoria-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 18%}
.autoria p{margin:0}
.autoria-nome{font:600 var(--leitura)/1.3 var(--sans);color:var(--navy)}
.autoria-nome a{color:inherit;text-decoration:none}
.autoria-nome a:hover{text-decoration:underline;text-decoration-color:var(--linha);text-decoration-thickness:2px;text-underline-offset:.22em}
.autoria-ordens{font-size:var(--nota);line-height:1.45;color:var(--tinta-2)}
.datas{display:flex;flex-wrap:wrap;gap:var(--e-3) var(--e-6);margin:0}
.datas div{display:grid;gap:var(--e-1)}
.datas dt{font:500 var(--etiqueta)/1.2 var(--sans);letter-spacing:var(--etiqueta-ls);text-transform:uppercase;color:var(--tinta-2)}
.datas dd{margin:0;font:500 var(--leitura-pequena)/1.3 var(--sans);color:var(--tinta)}
.datas .forte dd{color:var(--navy);font-weight:600}

/* ---- grelha do artigo ---- */
.art-grelha{display:block;padding-bottom:var(--ritmo-p)}
.toc-lateral{display:none}
.toc-movel{margin-bottom:var(--e-6);border-top:1px solid var(--filete);border-bottom:1px solid var(--filete)}
.toc-movel summary{display:flex;align-items:center;justify-content:space-between;min-height:var(--e-7);cursor:pointer;list-style:none;font:500 var(--etiqueta)/1.2 var(--sans);letter-spacing:var(--etiqueta-ls);text-transform:uppercase;color:var(--tinta-2)}
.toc-movel summary::-webkit-details-marker{display:none}
.toc-movel summary::after{content:"";width:var(--e-3);height:var(--e-3);border-right:2px solid var(--navy);border-bottom:2px solid var(--navy);transform:rotate(45deg);transition:transform var(--d-micro) var(--c-entrar)}
.toc-movel[open] summary::after{transform:rotate(225deg)}
.toc-movel ol{margin:0 0 var(--e-4);padding:0;list-style:none}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:toc}
.toc li{margin:0;counter-increment:toc}
.toc a{display:grid;grid-template-columns:var(--e-5) 1fr;align-items:baseline;min-height:44px;padding:var(--e-2) 0;color:var(--tinta);text-decoration:none;font:400 var(--nota)/1.4 var(--sans)}
.toc a::before{content:counter(toc,decimal-leading-zero);font:600 var(--nota)/1.4 var(--serif);color:var(--suave)}
.toc a:hover{color:var(--navy);text-decoration:underline;text-decoration-color:var(--linha);text-decoration-thickness:2px;text-underline-offset:.22em}
.toc a[aria-current=true]{color:var(--navy);font-weight:600}
.toc a[aria-current=true]::before{color:var(--laranja-tinta);background:var(--laranja);padding:0 var(--e-1);width:max-content}
@media (min-width:1024px){
  .art-grelha{display:grid;grid-template-columns:repeat(var(--colunas),minmax(0,1fr));column-gap:var(--calha)}
  .toc-movel{display:none}
  .toc-lateral{display:block;grid-column:1/4;align-self:start;position:sticky;top:var(--e-6);padding-right:var(--e-4)}
  .toc-lateral .etiqueta{margin-bottom:var(--e-3)}
  .corpo-artigo{grid-column:4/13}
}

/* ---- corpo ---- */
.corpo-artigo{min-width:0}
.corpo-artigo .leitura{max-width:var(--leitura-medida)}
.corpo-artigo h2{font:600 var(--leitura-titulo)/var(--leitura-titulo-lh) var(--serif);letter-spacing:-.015em;color:var(--titulo);max-width:var(--leitura-medida);margin:var(--e-8) 0 var(--e-4)}
.corpo-artigo .leitura>h2:first-child{margin-top:0}
.corpo-artigo h3{font:600 var(--leitura)/1.35 var(--sans);color:var(--navy);margin:var(--e-6) 0 var(--e-2)}
.corpo-artigo .leitura ol{padding-left:1.5em}
.corpo-artigo .leitura ol li{padding-left:.25em}
.corpo-artigo .leitura ol li::before{content:none}
.corpo-artigo blockquote{margin:var(--e-6) 0;padding:var(--e-2) 0 var(--e-2) var(--e-5);border-left:var(--e-1) solid var(--laranja);color:var(--titulo);font:600 var(--t-1)/1.3 var(--serif);letter-spacing:-.01em;max-width:var(--leitura-medida)}
.corpo-artigo blockquote p{margin:0}
/* tabelas (markdown `| a | b |`): rolam na horizontal dentro do bloco, nunca a página */
.corpo-artigo .tabela{max-width:var(--leitura-medida);overflow-x:auto;margin:var(--e-4) 0 var(--e-6);-webkit-overflow-scrolling:touch}
.corpo-artigo table{width:100%;border-collapse:collapse;font:400 var(--leitura-pequena)/1.45 var(--sans);color:var(--tinta)}
.corpo-artigo thead th{text-align:left;font-weight:600;color:var(--navy);border-bottom:2px solid var(--linha);padding:var(--e-2) var(--e-3) var(--e-2) 0;vertical-align:bottom}
.corpo-artigo tbody th,.corpo-artigo tbody td{text-align:left;border-bottom:1px solid var(--linha);padding:var(--e-2) var(--e-3) var(--e-2) 0;vertical-align:top}
.corpo-artigo tbody th{font-weight:500;color:var(--titulo);width:58%}
.corpo-artigo tbody td{min-width:8.5em}
.corpo-artigo .leitura a{color:var(--acento);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em}
.corpo-artigo .leitura a:hover{text-decoration-color:var(--linha);text-decoration-thickness:2px}
sup.ref{font-size:var(--nota);line-height:0;margin-left:var(--e-1)}
sup.ref a{display:inline-block;min-width:var(--e-5);text-align:center;text-decoration:none}

/* ---- blocos de conformidade ---- */
.bloco{margin-top:var(--e-8);max-width:var(--leitura-medida)}
.bloco>h2{margin-top:0}
.bloco .etiqueta{margin-bottom:var(--e-3)}
.nao-garante.folha{padding:var(--e-6);border-top:2px solid var(--linha)}
.nao-garante h2{margin:0 0 var(--e-4)}
.nao-garante .etiqueta{color:var(--tinta-2)}
.nao-garante ul{margin:0}
.fontes ol{list-style:none;margin:0;padding:0}
.fontes li{display:grid;grid-template-columns:var(--e-6) 1fr;column-gap:var(--e-3);padding:var(--e-4) 0;margin:0;border-top:1px solid var(--filete)}
.fontes li:last-child{border-bottom:1px solid var(--filete)}
.fontes .n{font:600 var(--leitura-titulo)/1 var(--serif);color:var(--navy)}
.fontes .fonte-nome{display:flex;align-items:center;min-height:44px;font:500 var(--leitura)/1.4 var(--sans);overflow-wrap:anywhere}
.fontes .fonte-meta{display:block;margin-top:var(--e-1)}
.aviso{padding-top:var(--e-5);border-top:1px solid var(--filete)}
.aviso p{font-size:var(--nota);line-height:1.6;color:var(--tinta-2);margin:0}
.aviso h2{font:500 var(--etiqueta)/1.2 var(--sans);letter-spacing:var(--etiqueta-ls);text-transform:uppercase;color:var(--tinta-2);margin:0 0 var(--e-3)}
.faq-blog h2{margin-bottom:var(--e-5)}
.faq-blog .faq-sis{max-width:none}
.faq-blog .faq-sis .r .leitura{margin-left:calc(2.25rem + var(--e-3))}
noscript .faq-sis .r{grid-template-rows:1fr;visibility:visible}

/* ---- newsletter (S9; o consentimento de análise é o pop-up do site, v5/js/consentimento.js) ---- */
.newsletter-blog{padding-block:var(--ritmo-p);color:var(--tinta)}
.newsletter-blog h2{font:600 var(--t-3)/1.1 var(--serif);letter-spacing:-.02em;color:var(--titulo);margin:0 0 var(--e-4)}
.newsletter-blog .apoio{margin-bottom:var(--e-6);font-size:var(--leitura);line-height:var(--leitura-lh);max-width:var(--leitura-medida)}
.newsletter-blog+.cta-lead{border-top:1px solid var(--filete)}
.newsletter-blog .obrigado{max-width:36rem;padding:var(--e-5);border-left:2px solid var(--laranja);background:var(--fundo-2)}
.newsletter-blog .obrigado p{margin:0}

/* ---- CTA de lead ---- */
.cta-lead{padding-block:var(--ritmo-m);color:var(--tinta)}
.cta-grelha{display:grid;gap:var(--e-8);align-items:start}
.cta-lead h2{font:600 var(--t-4)/1.06 var(--serif);letter-spacing:-.025em;color:var(--titulo);margin:0 0 var(--e-5)}
.cta-lead .apoio{margin-bottom:var(--e-6);font-size:var(--leitura);line-height:var(--leitura-lh)}
.cta-lead .nota{color:var(--suave);margin-top:var(--e-5)}
.formulario-blog{display:grid;gap:var(--e-5);max-width:36rem}
.formulario-blog .campo-sis{max-width:none}
.formulario-blog .dica{margin:0;font-size:var(--nota);line-height:1.5;color:var(--suave)}
.formulario-blog .grupo-sis legend{margin-bottom:var(--e-1)}
.formulario-blog .opcoes{grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr))}
.formulario-blog .consentimento{font-weight:400;line-height:1.45}
.formulario-blog .fila{display:flex;flex-wrap:wrap;align-items:center;gap:var(--e-4)}
.formulario-blog .estado-envio{margin:0;font-size:var(--nota);line-height:1.5;color:var(--pessego)}
.formulario-blog .obrigado{padding:var(--e-5);border-left:2px solid var(--laranja);background:var(--fundo-2)}
.formulario-blog .obrigado h3{font:600 var(--leitura-titulo)/var(--leitura-titulo-lh) var(--serif);color:var(--titulo);margin:0 0 var(--e-2)}
.formulario-blog .obrigado p{margin:0}
.formulario-blog [hidden]{display:none}
@media (min-width:1024px){.cta-grelha{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--e-9)}}
.cta-lead a:not(.cta-b):not(.cta-c){color:var(--acento)}

/* ---- hub, temas e listas ---- */
.corpo-lista{padding-bottom:var(--ritmo-m)}
.sec-lista+.sec-lista{margin-top:var(--e-9)}
.sec-lista>h2{font:600 var(--leitura-titulo)/var(--leitura-titulo-lh) var(--serif);letter-spacing:-.015em;color:var(--titulo);margin:0 0 var(--e-6)}
.temas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:var(--e-6) var(--calha);margin:0;padding:0;list-style:none}
.tema{margin:0}
.tema a{display:grid;gap:var(--e-3);align-content:start;height:100%;padding-top:var(--e-4);border-top:1px solid var(--laranja);color:var(--tinta);text-decoration:none}
.tema h3{font:600 var(--leitura-titulo)/var(--leitura-titulo-lh) var(--serif);letter-spacing:-.015em;color:var(--titulo)}
.tema p{margin:0;font-size:var(--leitura-pequena);line-height:1.55;color:var(--tinta-2)}
.tema .mais{display:inline-flex;align-items:center;gap:var(--e-2);font:500 var(--nota)/1.2 var(--sans);color:var(--acento)}
.tema .mais svg{width:var(--e-4);height:var(--e-4);fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--d-componente) var(--c-pousar)}
.tema a:hover h3,.tema a:focus-visible h3{text-decoration:underline;text-decoration-color:var(--linha);text-decoration-thickness:2px;text-underline-offset:.18em}
.tema a:hover .mais svg{transform:translateX(var(--e-1))}
.lista-artigos{margin:0;padding:0;list-style:none;max-width:var(--medio)}
.item-artigo{margin:0;border-top:1px solid var(--filete)}
.item-artigo:last-child{border-bottom:1px solid var(--filete)}
.item-artigo a{display:grid;gap:var(--e-2);padding:var(--e-5) 0;color:var(--tinta);text-decoration:none}
.item-artigo .etiqueta{display:flex;flex-wrap:wrap;gap:var(--e-2) var(--e-4);align-items:center}
.item-artigo h3{font:600 var(--leitura-titulo)/var(--leitura-titulo-lh) var(--serif);letter-spacing:-.015em;color:var(--titulo);max-width:var(--leitura-medida)}
.item-artigo p{margin:0;max-width:var(--leitura-medida);font-size:var(--leitura-pequena);color:var(--tinta-2)}
.item-artigo a:hover h3,.item-artigo a:focus-visible h3{text-decoration:underline;text-decoration-color:var(--linha);text-decoration-thickness:2px;text-underline-offset:.18em}
.vazio{color:var(--suave)}

/* ---- autora ---- */
.autora-grelha{display:grid;gap:var(--e-7);align-items:start}
.autora-foto{width:100%;max-width:var(--apoio-medida);aspect-ratio:var(--r-retrato);overflow:hidden;background:var(--creme-2);box-shadow:var(--sombra-folha)}
.autora-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.autora-dados{margin:var(--e-6) 0 0;padding:0;display:grid;gap:var(--e-4)}
.autora-dados div{display:grid;gap:var(--e-1);padding-top:var(--e-3);border-top:1px solid var(--filete)}
.autora-dados dt{font:500 var(--etiqueta)/1.2 var(--sans);letter-spacing:var(--etiqueta-ls);text-transform:uppercase;color:var(--tinta-2)}
.autora-dados dd{margin:0;font:500 var(--leitura)/1.35 var(--sans);color:var(--navy)}
.autora-dados a{display:inline-flex;align-items:center;min-height:44px;color:var(--acento)}
.pendente{display:inline-block;margin-top:var(--e-6);padding:var(--e-2) var(--e-3);border:1px dashed var(--tinta-2);color:var(--tinta-2);font-size:var(--nota);line-height:1.4}
@media (min-width:1024px){.autora-grelha{grid-template-columns:repeat(var(--colunas),minmax(0,1fr));column-gap:var(--calha)}
  .autora-col-foto{grid-column:1/5}.autora-col-texto{grid-column:6/13}}

/* ---- rodapé ---- */
.rodape-blog{padding-block:var(--e-8) var(--e-6);border-top:1px solid var(--filete)}
.rodape-blog .grade{display:grid;gap:var(--e-7);grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr))}
.rodape-blog h2{font:500 var(--etiqueta)/1.2 var(--sans);letter-spacing:var(--etiqueta-ls);text-transform:uppercase;color:var(--tinta-2);margin:0 0 var(--e-3)}
.rodape-blog p,.rodape-blog li{font-size:var(--nota);line-height:1.6;color:var(--tinta-2);margin:0}
.rodape-blog ul{list-style:none;display:grid;gap:0}
.rodape-blog a{display:inline-flex;align-items:center;min-height:44px;color:var(--tinta);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em}
.rodape-blog a:hover{text-decoration-color:var(--linha);text-decoration-thickness:2px}
.rodape-blog .marca{display:inline-flex;align-items:center;gap:var(--e-3);min-height:44px;color:var(--creme);text-decoration:none;margin-bottom:var(--e-3)}
.rodape-blog .marca svg{width:var(--e-6);height:var(--e-6)}
.rodape-blog .marca span{font:500 var(--etiqueta)/1 var(--sans);letter-spacing:var(--etiqueta-ls);text-transform:uppercase}
.rodape-blog .fim{margin-top:var(--e-7);padding-top:var(--e-5);border-top:1px solid var(--filete)}
.rodape-blog .fim p{font-size:var(--nota)}

/* mensagens de erro de grupo (assuntos, consentimento): o sistema só tem as dos campos em linha */
.formulario-blog fieldset .erro-msg,.formulario-blog #consent-campo .erro-msg{display:none}
.formulario-blog fieldset .erro-msg[data-ver=true],.formulario-blog #consent-campo .erro-msg[data-ver=true]{display:block}
.formulario-blog #consent-campo.erro .opcao-sis{border-color:var(--ambar)}
