/* ═══════════════════════════════════════════════════════════════════════════ post-modules.css — polimento SÓ-VISUAL dos módulos pós-artigo das country pages (2026-07-20, founder: "feito por uma criança" + sem emojis). Marca a página com e carrega ESTA folha POR ÚLTIMO. REGRA DE SEGURANÇA: NÃO altera larguras, margens nem posições (o layout base das country pages é inconsistente e um breakout centraria no eixo errado). Só toca em fundo / borda / raio / tipografia / o filete e rótulo do key-takeaway. Assim eleva o visual sem desalinhar nada. Sem emojis. ═══════════════════════════════════════════════════════════════════════════ */ /* ---- KEY TAKEAWAY elevado (era a caixa "DIRECT ANSWER"/"Key Takeaway" pobre: border-left grosseiro + texto). Agora cartão editorial: filete de accent, rótulo mono, resposta legível. Mantém a largura/margem que já tinha. --- */ .pm .key-takeaway{position:relative!important; background:linear-gradient(180deg,#FBFAF7,#F7F6F1)!important; border:1px solid #E7E5DE!important;border-left:0!important;border-radius:12px!important; padding:20px 24px 20px 28px!important;overflow:hidden} .pm .key-takeaway::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px; background:linear-gradient(180deg,var(--primary,#1A5C50),var(--accent,#B5521F))} .pm .key-takeaway > strong:first-child,.pm .key-takeaway .kt-label{ display:inline-block!important;font:600 12px/1 var(--font-data,'DM Mono',monospace)!important; letter-spacing:.14em!important;text-transform:uppercase!important;color:var(--primary,#1A5C50)!important; margin:0 0 10px!important;padding:0!important;background:none!important} .pm .key-takeaway p{font:450 15.5px/1.6 var(--font-body,Inter,system-ui,sans-serif)!important; color:var(--ink,#0C2E2B)!important;margin:0!important;text-wrap:pretty} /* ---- Caixas de módulo: superfície/borda/raio uniformes (largura intacta) --- */ .pm .ymyl-sources,.pm .wte-related-col,.pm .post-aside{ background:#fff!important;border:1px solid #E7E5DE!important;border-radius:12px!important; box-shadow:0 1px 2px rgba(12,46,43,.03)!important} /* título interno uniforme (mono, maiúsculas) — só tipografia */ .pm .ymyl-sources > h2:first-child,.pm .ymyl-sources > h3:first-child, .pm .wte-related-col > h2:first-child,.pm .wte-related-col > h3:first-child{ font:600 12px/1 var(--font-data,'DM Mono',monospace)!important;letter-spacing:.12em!important; text-transform:uppercase!important;color:var(--primary,#1A5C50)!important;margin:0 0 12px!important} /* ---- largura/respiro dos módulos migrados do style INLINE (2026-07-20) ------- Antes vinham com style="max-width:720px;margin:48px auto 0;padding:24px" inline (1.301 countries + 757 compare = as "ilhas" do teto do guarda). Agora a classe central dá a MESMA medida de leitura (760, à esquerda, mesmo eixo da prosa) a hubs (.pm) e sub-páginas (.pm.elev). Sem style inline = deixa de ser "ilha". */ .pm .post-aside{max-width:760px!important;margin:40px 0 0!important;padding:22px 26px!important} .pm .wte-tools-links{max-width:760px!important;margin:20px auto!important;padding:12px 16px!important; font-size:14px!important;background:#fff!important;border:1px solid #E7E5DE!important; border-radius:10px!important;box-shadow:0 1px 2px rgba(12,46,43,.03)!important} /* nas sub-páginas .elev a coluna é main#main > * (traz id, 0,1,3,1) → igualar */ .pm.elev main#main .post-aside,.pm.elev main#main .wte-tools-links{max-width:760px!important} /* ---- CTAs em pílula: cor de texto conforme o FUNDO (nunca invisível) -------- Pílula de fundo ESCURO/LARANJA → texto branco. Pílula de fundo BRANCO → texto VERDE (senão fica branco-sobre-branco). A regra ampla exclui o branco; uma regra dedicada (esp. 0,0,4,1, carrega por último) força o verde nas pílulas brancas, batendo o country-redesign que as pintava de laranja/branco. */ .pm .article-cta a[style*="background"], .pm a[href][style*="background"][style*="border-radius"]:not([style*="background:#fff"]):not([style*="background: #fff"]):not([style*="background:#FFF"]):not([style*="rgba(255,255,255,0.15)"]):not([style*="rgba(255, 255, 255, 0.15)"]){color:#fff!important} .pm a[href][style*="background:#fff"][style*="border-radius"], .pm a[href][style*="background: #fff"][style*="border-radius"]{color:var(--primary,#1A5C50)!important} /* Botão-fantasma (rgba branca 0.15, feito p/ fundo ESCURO): num bloco de fundo CLARO ficava branco-sobre-creme (invisível, ex.: «€10» mid-artigo). Por defeito dá-se-lhe contorno+texto accent (visível em fundo claro); DENTRO dos blocos escuros (report-cta/article-cta) mantém-se o fantasma branco elegante. */ .pm a[href][style*="background:rgba(255,255,255,0.15)"], .pm a[href][style*="background:rgba(255, 255, 255, 0.15)"]{ background:transparent!important;border-color:var(--accent,#A84A20)!important;color:var(--accent,#A84A20)!important} .pm .report-cta a[href][style*="background:rgba(255,255,255,0.15)"], .pm .article-cta a[href][style*="background:rgba(255,255,255,0.15)"]{ border-color:rgba(255,255,255,0.35)!important;color:#fff!important} /* ═══ ELEVAÇÃO ESTRUTURAL (country sub-pages, .pm.elev) ══════════════════════ 1) COLUNA ÚNICA: tudo o que está no main alinha a UMA largura (780) e ao mesmo eixo — resolve as 4 larguras que "não casavam". 2) HERO verde full-bleed no topo (como os hubs), inserido pelo transform. Só se ativa com para não afetar os hubs (que já têm o seu próprio hero d59). ══════════════════════════════════════════════════ */ /* Coluna à largura do HUB (1072) para a tabela de comparação respirar. Prosa e caixas de leitura ficam numa medida legível (760), alinhadas à ESQUERDA da coluna; os elementos de DADOS (tabela, score cards, fontes, CTA) enchem os 1072. Tudo partilha o mesmo eixo/esquerda → casa. */ .pm.elev main#main{max-width:1120px!important;margin:0 auto!important;padding:0 24px!important} .pm.elev main#main > *:not(.c-hero){max-width:100%!important;margin-left:0!important;margin-right:0!important;box-sizing:border-box} /* caixas de leitura (texto) a 760, à esquerda; o corpo enche 1072 mas a sua PROSA (p/li/headings) fica a 760 — assim as TABELAS dentro do corpo respiram. */ .pm.elev .ymyl-disclaimer,.pm.elev .key-takeaway{max-width:760px!important;margin-left:0!important;margin-right:0!important} .pm.elev .article-body{max-width:100%!important} .pm.elev .article-body > p,.pm.elev .article-body > ul,.pm.elev .article-body > ol, .pm.elev .article-body > h2,.pm.elev .article-body > h3,.pm.elev .article-body > h4{max-width:760px} /* tabelas de dados (comparação/vistos) respiram à largura toda */ .pm.elev table,.pm.elev .visa-table,.pm.elev .comparison,.pm.elev .comparison-table{max-width:100%!important;width:100%!important} /* hero full-bleed */ .pm.elev .c-hero{position:relative;width:100vw;margin-left:calc(50% - 50vw); background:radial-gradient(58% 52% at 82% -10%,rgba(196,93,44,.12),transparent 60%),var(--ink,#0C2E2B); color:#fff;padding:46px 0 42px;margin-bottom:34px;overflow:hidden} .pm.elev .c-hero__in{max-width:1120px;margin:0 auto;padding:0 24px} .pm.elev .c-hero__eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 12px/1 var(--font-data,'DM Mono',monospace);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-on-dark,#FFB37A);margin-bottom:18px} .pm.elev .c-hero__eyebrow::before{content:"";width:22px;height:1px;background:var(--accent-on-dark,#FFB37A);opacity:.6} .pm.elev .c-hero h1{font-family:var(--font-display,'Fraunces',Georgia,serif)!important;font-weight:500!important;font-size:clamp(32px,4.6vw,54px)!important;line-height:1.04!important;letter-spacing:-.02em!important;color:#fff!important;margin:0!important;max-width:20ch;text-wrap:balance} .pm.elev .c-hero p.c-hero__meta,.pm.elev .c-hero__meta{margin:18px 0 0!important;font:500 13.5px/1.5 var(--font-data,monospace)!important;color:rgba(255,255,255,.9)!important} /* a antiga tag/h1/meta foram para o hero → escondê-las se sobrarem */ .pm.elev .article-header__tag,.pm.elev .article-header > h1,.pm.elev .article-header__meta{display:none!important} @media(max-width:640px){.pm.elev main#main{padding:0 20px!important}.pm.elev .c-hero__in{padding:0 20px}} /* fim-de-página countries (founder screenshot 2026-07-21): os 3 módulos finais alinham TODOS à mesma coluna centrada de 760px — antes cada um tinha a sua. */ .pm .wte-verified-date{max-width:760px;margin:20px auto!important} .pm .wte-hub-link{max-width:760px;margin:24px auto 0!important}