/* ==========================================================================
   Identidade visual Gov Hub, modo sóbrio (2026-09-30).
   Carregado por último em todas as páginas: tokens da skill
   govhub-visual-identity (references/tokens.css) e os ajustes que trocam
   gradientes, brilhos e contornos pelas formas oficiais sólidas.
   Paleta: roxo #613EFF (assinatura), navy #0A005A, claro #F2F1F6,
   #BE006E só em detalhe. Reddit Sans em tudo.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Reddit+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

:root {
    --primary-purple: #613EFF;
    --dark-navy: #0A005A;
    --bg-soft: #F2F1F6;
    --accent-rose: #BE006E;
    --purple-600: #5235D9;
    --purple-700: #3F28A6;
    --text-strong: #202020;
    --text-body: #2D3748;
    --text-on-navy: #D9D4FF;
    --border-soft: #E9DFFF;
    --font-family-base: 'Reddit Sans', 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

    /* Bootstrap 5 */
    --bs-body-font-family: var(--font-family-base);
    --bs-primary: #613EFF;
    --bs-primary-rgb: 97, 62, 255;
    --bs-link-color: #3F28A6;
    --bs-link-color-rgb: 63, 40, 166;
    --bs-link-hover-color: #5235D9;

    /* Formas oficiais (SVG sólidos da paleta) */
    --gh-quarto-roxo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='%23613EFF' d='M100 0H0a100 100 0 0 0 100 100z'/%3E%3C/svg%3E");
    --gh-anel-claro: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='%23F2F1F6' fill-rule='evenodd' d='M50 0a50 50 0 1 0 0 100a50 50 0 1 0 0-100zM50 25.6a24.4 24.4 0 1 1 0 48.8a24.4 24.4 0 1 1 0-48.8z'/%3E%3C/svg%3E");
    --gh-ponto-rosa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='50' fill='%23BE006E'/%3E%3C/svg%3E");
}

body,
button, input, select, textarea,
h1, h2, h3, h4, h5, h6, p, a, li, span, small, label, th, td {
    font-family: var(--font-family-base);
}
code, pre, kbd, samp { font-family: 'Roboto Mono', ui-monospace, SFMono-Regular, Menlo, monospace; }

body { -webkit-font-smoothing: antialiased; }

/* Chamadas: Reddit Sans 800, caixa alta e baixa */
h1, h2, h3 { letter-spacing: -0.025em; }

/* Brilhos desfocados atrás de letras e imagens: fora (formas são sempre sólidas) */
.blur-letter > span,
.govhub-image-container::before,
.govhub-image-container::after,
.glow-circle-3 { display: none !important; }

/* ---------- Banner das páginas internas: navy + formas oficiais ---------- */
/* .ipea-hero e .header-section são os heros das páginas da Demo */
.hero-section, .ipea-hero, .header-section {
    background: var(--gh-quarto-roxo) right top / auto 100% no-repeat,
                var(--gh-anel-claro) right 30vw bottom -70px / 170px no-repeat,
                var(--gh-ponto-rosa) right 38vw top 34% / 22px no-repeat,
                var(--dark-navy) !important;
}
/* os heros da Demo eram faixas finas: altura mínima para as formas caberem */
.ipea-hero, .header-section { min-height: 300px !important; }
.hero-section h1, .ipea-hero-title, .header-title { font-weight: 800 !important; letter-spacing: -0.025em; }
.hero-section .animated-circles { display: none !important; }
@media (max-width: 768px) {
    .hero-section, .ipea-hero, .header-section {
        background: var(--gh-quarto-roxo) right top / auto 70% no-repeat,
                    var(--gh-anel-claro) right 6vw bottom -50px / 110px no-repeat,
                    var(--dark-navy) !important;
    }
}

/* ---------- Hero da home: navy + formas, cartão claro ---------- */
.interactive-section {
    background: var(--gh-quarto-roxo) right top / auto 72% no-repeat,
                var(--gh-anel-claro) left 4vw bottom -90px / 220px no-repeat,
                var(--dark-navy) !important;
}
.interactive-bg { display: none !important; }
.glass-container {
    background: var(--bg-soft) !important;
    backdrop-filter: none !important;
    box-shadow: 0 8px 30px rgba(10, 0, 90, 0.16);
}
.glass-title { color: var(--dark-navy) !important; font-weight: 800 !important; }
.hero-mobile,
.hero-mobile-bg {
    background: var(--dark-navy) !important;
    opacity: 1 !important;
}

/* ---------- Logo oficial (horizontal branca): proporção 4,3:1 ---------- */
.logo-img,
a.logo img {
    height: 30px !important;
    max-height: 30px !important;
    width: auto !important;
}
@media (max-width: 480px) {
    .logo-img, a.logo img { height: 26px !important; max-height: 26px !important; }
}

/* ---------- Rodapé navy ---------- */
.footer { background: var(--dark-navy) !important; }

/* Foco visível (WCAG 2.4.7) */
:focus-visible { outline: 3px solid var(--purple-700); outline-offset: 2px; }
header :focus-visible, .hero-section :focus-visible, .interactive-section :focus-visible, .footer :focus-visible { outline-color: #fff; }

/* ---------- Cards de projetos e publicações: padrão da página Sobre ---------- */
/* mesma altura na fileira: a coluna do Bootstrap estica e o card ocupa tudo */
.publication-card {
    height: 100%;
    min-height: 0 !important;
    display: flex;
    flex-direction: column;
    background: #F2F1F6 !important;
    border-radius: 16px !important;
    box-shadow: none !important;
}
.publication-card:hover { box-shadow: 0 8px 30px rgba(10,0,90,0.12) !important; }
.publication-content { flex: 1; display: flex; flex-direction: column; }
.publication-title { color: #0A005A !important; font-weight: 800 !important; letter-spacing: -0.015em; }
.publication-caption { color: #2D3748 !important; }
.publication-arrow { margin-top: auto; color: #0A005A !important; }
/* faixa dos cards em claro, para contrastar com o hero branco; cards brancos */
.publications-page-section { background-color: #F2F1F6 !important; padding-top: clamp(48px, 6vw, 80px) !important; }
.publications-page-section .publication-card { background: #fff !important; }
/* todas as fileiras com a altura da mais alta */
.row:has(> [class*="col"] > .publication-card) {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-rows: 1fr;
    gap: 24px;
    margin-inline: 0;
}
.row:has(> [class*="col"] > .publication-card) > [class*="col"] {
    width: auto; max-width: none; padding: 0; margin: 0 !important;
}
@media (max-width: 991.98px) {
    .row:has(> [class*="col"] > .publication-card) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
    .row:has(> [class*="col"] > .publication-card) { grid-template-columns: 1fr; grid-auto-rows: auto; }
}

/* ---------- Home: tipografia da página Sobre (navy, 800 com 400) ---------- */
.govhub-title, .system-info-title, .partners-title, .publications-title {
    color: #0A005A !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em;
    line-height: 1.06 !important;
    font-size: clamp(30px, 3.8vw, 48px) !important;
    margin-bottom: 24px !important;
    text-wrap: balance;
}
.govhub-title .l, .system-info-title .l, .partners-title .l, .publications-title .l { font-weight: 400; }
.govhub-description, .system-info-description, .publications-description { color: #2D3748 !important; }
.govhub-feature-text { color: #0A005A; font-weight: 600; }
/* faixas alternadas: branco, claro, branco, claro */
.govhub-section { background: #fff !important; }
.system-info-section { background: #F2F1F6 !important; }
.partners-section { background: #fff !important; }
.publications-section { background: #F2F1F6 !important; }
.publications-section .publication-card { background: #fff !important; }
.partners-bold-text {
    display: flex; align-items: center; gap: 10px;
    font-size: 13px !important; font-weight: 700 !important; letter-spacing: .12em;
    text-transform: uppercase; color: #3F28A6 !important; margin: 0 !important; white-space: nowrap;
}
/* logos alinhados: rótulo e espaçador com a mesma altura, logo centrado numa caixa fixa */
.partners-initiative-text, .partners-support-text, .partners-spacer {
    height: 24px; display: flex; align-items: center; margin: 32px 0 12px;
}
.partners-spacer p { margin: 0 !important; line-height: 1; }
.partners-logo-section { height: 90px; padding-left: 0 !important; }
/* botão alinhado à esquerda, com os cards */
.publications-button-container { text-align: left !important; margin-top: 32px; padding-left: 0 !important; }
.partners-bold-text::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: #BE006E; flex: none; }
/* MinC sozinho na terceira fileira: sem o espaçador de rótulo */
.partners-content:last-child .partners-spacer { display: none; }
.partners-content:last-child { margin-top: 8px; }

/* ---------- Rodapé: logos de parceiros com o mesmo tamanho e espaçamento da home ---------- */
.footer .footer-logo-section { height: 90px; margin-bottom: 0; }
.footer .footer-logo-section img {
    height: 90px !important;
    max-height: 90px;
    width: auto;
    max-width: 220px;
    object-fit: contain;
}
.footer .footer-column { gap: 0; }
.footer .footer-middle { margin-bottom: 0; }
.footer .footer-initiative-text p, .footer .footer-support-text p {
    display: flex; align-items: center; gap: 10px;
    font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
    color: #fff; margin: 32px 0 12px; white-space: nowrap;
}
.footer .footer-initiative-text p::before, .footer .footer-support-text p::before {
    content: ""; width: 9px; height: 9px; border-radius: 50%; background: #BE006E; flex: none;
}
/* links do rodapé descolados dos logos */
.footer .row:has(.footer-nav) { margin-top: 48px; }
/* card gerado pelo hook publicacoes_cards.py: mesma imagem na home e em Publicações
   (o CSS da home esperava outra marcação e deixava a imagem esticar com a largura) */
.publication-card > .publication-image {
    position: relative; flex: none;
    width: 100%; height: 200px !important; overflow: hidden;
}
.publication-card > .publication-image > .card-image {
    display: block; width: 100%; height: 100%; object-fit: cover; transform: none;
}
@media (max-width: 575.98px) { .publication-card > .publication-image { height: 180px !important; } }
/* card de artigo em PDF com capa: a folha sobre fundo branco, com sombra de papel,
   cortada embaixo pela faixa da imagem, que faz sombra no texto */
.publication-card--capa > .publication-image { background: #fff; }
.publication-card--capa > .publication-image > .cover-image {
    position: absolute; top: 20px; left: 50%; transform: translateX(-50%);
    display: block; height: 372px; width: auto; border-radius: 2px;  /* folha com ~290 px de largura */
    box-shadow: 0 1px 3px rgba(10,0,90,0.12), 0 10px 24px rgba(10,0,90,0.18);
}
.publication-card--capa > .publication-content {
    position: relative; z-index: 1; background: inherit; box-shadow: 0 -10px 24px rgba(10,0,90,0.08);
}