/* =====================================================================
   Blog IA da Loteria - visual de revista (referência: GameZone) com a
   identidade do site: azul-marinho, laranja e fonte Inter.
   Todas as classes usam o prefixo bl-.
   ===================================================================== */

:root {
    --bl-navy: #1e3a5f;
    --bl-navy-escuro: #0f2238;
    --bl-navy-claro: #2c5282;
    --bl-laranja: #ff7b54;
    --bl-laranja-escuro: #e8603a;
    --bl-texto: #1f2d3d;
    --bl-suave: #64748b;
    --bl-borda: #e6eaf0;
    --bl-fundo: #f4f6f9;
    --bl-raio: 12px;
    --bl-sombra: 0 8px 24px rgba(15, 34, 56, 0.08);
    --bl-sombra-forte: 0 18px 40px rgba(15, 34, 56, 0.2);
    --bl-altura-cabecalho: 70px;
    --bl-grade: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="g" width="10" height="10" patternUnits="userSpaceOnUse"><path d="M 10 0 L 0 0 0 10" fill="none" stroke="rgba(255,255,255,0.06)" stroke-width="1"/></pattern></defs><rect width="100" height="100" fill="url(%23g)"/></svg>');
}

/* ---- Menu do topo ---- */
.bl-nav-ativo {
    color: var(--bl-laranja) !important;
    font-weight: 600;
}

/* ---- Selo de categoria (etiqueta inclinada) ---- */
.bl-selo {
    display: inline-block;
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    line-height: 1.2;
    padding: 0.38rem 1.1rem 0.38rem 0.8rem;
    clip-path: polygon(0 0, 100% 0, calc(100% - 9px) 100%, 0 100%);
    text-decoration: none;
    position: relative;
    z-index: 2;
}

/* Sem a cor de uma loteria (classe bg-*), o selo é laranja. */
.bl-selo:not([class*="bg-"]) {
    background-color: var(--bl-laranja);
}

a.bl-selo:hover {
    color: #fff;
    filter: brightness(1.08);
}

/* ---- Data, tempo de leitura, autor ---- */
.bl-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 1rem;
    font-size: 0.8rem;
    color: var(--bl-suave);
}

.bl-meta i {
    margin-right: 0.3rem;
    opacity: 0.85;
}

.bl-meta-clara {
    color: rgba(255, 255, 255, 0.85);
}

/* ---- Títulos de seção com a barra "\" ---- */
.bl-secao {
    padding: 3.5rem 0;
}

.bl-secao-titulo {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--bl-texto);
    letter-spacing: -0.02em;
    margin: 0 0 1.5rem;
}

.bl-barra {
    color: var(--bl-laranja);
    margin-left: 0.4rem;
}

.bl-secao-cabecalho {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    flex-wrap: wrap;
}

.bl-ver-todos {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--bl-laranja-escuro);
    text-decoration: none;
}

.bl-ver-todos:hover {
    color: var(--bl-navy);
}

/* Link que cobre o card inteiro (o card precisa de position: relative). */
.bl-link-card::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
}

/* ---- Faixa de categorias (logo abaixo do cabeçalho fixo) ---- */
.bl-categorias {
    position: relative;
    z-index: 3;
    background: rgba(10, 25, 45, 0.6);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(6px);
}

.bl-categorias-lista {
    display: flex;
    justify-content: center;
    gap: 0.25rem;
    overflow-x: auto;
    scrollbar-width: none;
}

.bl-categorias-lista::-webkit-scrollbar {
    display: none;
}

.bl-categoria-link {
    color: rgba(255, 255, 255, 0.78);
    padding: 0.85rem 1rem 0.75rem;
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
    text-decoration: none;
    border-bottom: 3px solid transparent;
    transition: color 0.2s, border-color 0.2s;
}

.bl-categoria-link:hover,
.bl-categoria-link.ativo {
    color: #fff;
    border-bottom-color: var(--bl-laranja);
}

/* ---- Topo da primeira página: post principal em destaque ---- */
.bl-hero {
    position: relative;
    padding-top: var(--bl-altura-cabecalho);
    min-height: 600px;
    display: flex;
    flex-direction: column;
    color: #fff;
    background: linear-gradient(135deg, var(--bl-navy), var(--bl-navy-claro));
    overflow: hidden;
}

.bl-hero-sem-capa::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--bl-grade);
}

.bl-hero-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.bl-hero-sombra {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 34, 56, 0.45) 0%, rgba(15, 34, 56, 0.55) 40%, rgba(15, 34, 56, 0.93) 100%);
}

.bl-hero-sem-capa .bl-hero-sombra {
    background: radial-gradient(circle at 80% 10%, rgba(255, 123, 84, 0.18), transparent 45%);
}

.bl-hero .bl-hero-conteudo {
    position: relative;
    z-index: 2;
    margin-top: auto;
    max-width: 920px;
    padding: 4rem 1rem 8.5rem;
    text-align: center;
}

.bl-hero-marca {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.72);
    margin: 0 0 1.1rem;
}

.bl-hero-titulo {
    font-size: clamp(1.9rem, 4.4vw, 3.4rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.025em;
    margin: 1rem 0 0.9rem;
}

.bl-hero-titulo a {
    color: #fff;
    text-decoration: none;
}

.bl-hero-titulo a:hover {
    color: #ffd9cc;
}

.bl-hero-resumo {
    font-size: 1.1rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.85);
    max-width: 700px;
    margin: 0 auto 1rem;
}

.bl-hero .bl-meta {
    justify-content: center;
}

.bl-hero-botao {
    margin-top: 1.5rem;
}

/* ---- Três destaques sobrepostos ao pé do topo ---- */
.bl-destaques {
    position: relative;
    z-index: 4;
    margin-top: -100px;
}

.bl-destaque {
    position: relative;
    height: 230px;
    border-radius: var(--bl-raio);
    overflow: hidden;
    box-shadow: var(--bl-sombra-forte);
    background: var(--bl-navy);
}

.bl-destaque .bl-capa-img,
.bl-destaque .bl-capa-vazia {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.bl-destaque:hover .bl-capa-img,
.bl-destaque:hover .bl-capa-vazia {
    transform: scale(1.07);
}

.bl-destaque-sombra {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 34, 56, 0.05) 20%, rgba(15, 34, 56, 0.9) 100%);
}

.bl-destaque-texto {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 1.25rem 1.35rem;
}

.bl-destaque-titulo {
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.01em;
    margin: 0.65rem 0 0.4rem;
}

.bl-destaque-titulo a {
    color: #fff;
    text-decoration: none;
}

/* ---- Capa sem imagem ---- */
.bl-capa-img {
    display: block;
}

.bl-capa-vazia {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    color: #fff;
    text-align: center;
    background-image: radial-gradient(circle at 18% 22%, rgba(255, 255, 255, 0.18), transparent 45%), linear-gradient(135deg, rgba(255, 255, 255, 0.06), rgba(0, 0, 0, 0.2));
}

.bl-capa-vazia:not([class*="bg-"]) {
    background-color: var(--bl-navy);
}

.bl-capa-marca {
    background-image: var(--bl-grade), radial-gradient(circle at 80% 20%, rgba(255, 123, 84, 0.35), transparent 50%);
}

.bl-capa-vazia-logo {
    width: 68px;
    height: auto;
    filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.3));
}

.bl-capa-vazia-titulo {
    font-weight: 800;
    font-size: 1.35rem;
    letter-spacing: -0.01em;
}

.bl-capa-vazia-sub {
    font-size: 0.85rem;
    opacity: 0.85;
}

/* ---- Card da grade ---- */
.bl-card {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: var(--bl-raio);
    overflow: hidden;
    box-shadow: var(--bl-sombra);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.bl-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--bl-sombra-forte);
}

.bl-card-capa {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--bl-fundo);
}

.bl-card-capa .bl-capa-img,
.bl-card-capa .bl-capa-vazia {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.bl-card:hover .bl-card-capa .bl-capa-img,
.bl-card:hover .bl-card-capa .bl-capa-vazia {
    transform: scale(1.06);
}

.bl-card-capa .bl-selo {
    position: absolute;
    left: 0;
    bottom: 0;
}

.bl-card-corpo {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    padding: 1.15rem 1.3rem 1.3rem;
}

.bl-card-titulo {
    font-size: 1.12rem;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -0.01em;
    margin: 0;
}

.bl-card-titulo a {
    color: var(--bl-texto);
    text-decoration: none;
    transition: color 0.2s;
}

.bl-card:hover .bl-card-titulo a {
    color: var(--bl-laranja-escuro);
}

.bl-card-resumo {
    margin: 0;
    color: var(--bl-suave);
    font-size: 0.9rem;
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.bl-card .bl-meta {
    margin-top: auto;
    padding-top: 0.35rem;
}

/* ---- Item da barra lateral ---- */
.bl-mini {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 0.8rem 0;
    border-bottom: 1px solid var(--bl-borda);
}

.bl-mini:last-child {
    border-bottom: 0;
    padding-bottom: 0.2rem;
}

.bl-mini-capa {
    flex: 0 0 88px;
    height: 66px;
    border-radius: 8px;
    overflow: hidden;
}

.bl-mini-capa .bl-capa-img,
.bl-mini-capa .bl-capa-vazia {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.bl-mini .bl-capa-vazia-titulo {
    font-size: 0.72rem;
}

.bl-mini .bl-capa-vazia-sub {
    display: none;
}

.bl-mini .bl-capa-vazia-logo {
    width: 30px;
}

.bl-mini-titulo {
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.32;
    margin: 0 0 0.3rem;
}

.bl-mini-titulo a {
    color: var(--bl-texto);
    text-decoration: none;
}

.bl-mini:hover .bl-mini-titulo a {
    color: var(--bl-laranja-escuro);
}

/* ---- Análises automáticas (cor de cada loteria) ---- */
.bl-secao-analises {
    padding-bottom: 0;
}

.bl-analises {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 1rem;
}

.bl-analise {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-height: 130px;
    padding: 1rem 1.15rem;
    color: #fff;
    border-radius: var(--bl-raio);
    box-shadow: var(--bl-sombra);
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.bl-analise:not([class*="bg-"]) {
    background-color: var(--bl-navy);
}

.bl-analise::before {
    content: '';
    position: absolute;
    right: -34px;
    top: -34px;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.13);
}

.bl-analise:hover {
    transform: translateY(-3px);
    box-shadow: var(--bl-sombra-forte);
}

.bl-analise-loteria {
    font-weight: 800;
    font-size: 1.05rem;
}

.bl-analise-concurso {
    font-size: 0.85rem;
    opacity: 0.92;
}

.bl-analise-data {
    font-size: 0.75rem;
    opacity: 0.75;
}

.bl-analise-link {
    margin-top: auto;
    padding-top: 0.6rem;
    color: #fff;
    font-size: 0.8rem;
    font-weight: 700;
    text-decoration: none;
}

.bl-analise-link:hover {
    color: #fff;
}

/* ---- Barra lateral ---- */
/* Sem position: sticky: a barra é mais alta que a tela e os blocos de baixo ficariam escondidos durante a leitura. */
.bl-sidebar {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.bl-widget {
    background: #fff;
    border: 1px solid var(--bl-borda);
    border-radius: var(--bl-raio);
    padding: 1.3rem 1.4rem;
    box-shadow: 0 2px 10px rgba(15, 34, 56, 0.04);
}

.bl-widget-titulo {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--bl-texto);
    letter-spacing: -0.01em;
    margin: 0 0 0.6rem;
}

.bl-widget-cta {
    text-align: center;
    color: #fff;
    border: 0;
    background: var(--bl-grade), linear-gradient(135deg, var(--bl-navy), var(--bl-navy-claro));
}

.bl-widget-cta h2 {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 800;
    line-height: 1.3;
    margin: 0 0 0.5rem;
}

.bl-widget-cta p {
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.9rem;
    margin-bottom: 1rem;
}

.bl-widget-cta .btn {
    justify-content: center;
}

.bl-widget-cta-logo {
    width: 58px;
    margin-bottom: 0.6rem;
}

.bl-lista-categorias {
    list-style: none;
    padding: 0;
    margin: 0;
}

.bl-lista-categorias a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.62rem 0;
    border-bottom: 1px dashed var(--bl-borda);
    color: var(--bl-texto);
    font-weight: 500;
    text-decoration: none;
    transition: color 0.2s, padding 0.2s;
}

.bl-lista-categorias li:last-child a {
    border-bottom: 0;
}

.bl-lista-categorias a:hover,
.bl-lista-categorias a.ativo {
    color: var(--bl-laranja-escuro);
    padding-left: 0.3rem;
}

.bl-contador {
    min-width: 28px;
    text-align: center;
    background: var(--bl-fundo);
    border-radius: 999px;
    padding: 0 0.55rem;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.6rem;
    color: var(--bl-suave);
}

/* ---- Widget "Últimos resultados" (barra lateral do post; bolas em resultados-lista.css) ---- */
.bl-resultado {
    padding: 0.85rem 0;
    border-bottom: 1px solid var(--bl-borda);
}

.bl-resultado:last-of-type {
    border-bottom: 0;
}

.bl-resultado-cabecalho {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.55rem;
    color: var(--bl-texto);
    text-decoration: none;
}

.bl-resultado-cabecalho strong {
    font-size: 0.95rem;
    font-weight: 700;
}

.bl-resultado-cabecalho small {
    margin-left: auto;
    font-size: 0.78rem;
    color: var(--bl-suave);
    white-space: nowrap;
}

.bl-resultado-cabecalho:hover strong {
    color: var(--bl-laranja-escuro);
}

/* Bolinha com a cor da loteria (classe bg-*) */
.bl-resultado-cor {
    flex: 0 0 10px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.bl-resultado-cor:not([class*="bg-"]) {
    background-color: var(--bl-navy);
}

.bl-widget-resultados .rl-bolas {
    gap: 5px;
}

.bl-widget-resultados .rl-bolas-pequenas .rl-bola {
    width: 28px;
    height: 28px;
    font-size: 0.72rem;
}

.bl-widget-resultados .rl-posicional {
    font-size: 0.9rem;
}

.bl-widget-resultados .rl-complemento {
    margin-top: 0.45rem;
    font-size: 0.8rem;
}

.bl-widget-resultados .bl-ver-todos {
    display: inline-block;
    margin-top: 0.6rem;
}

/* ---- Topo das demais páginas (categoria, página N, post) ---- */
.bl-topo {
    position: relative;
    padding-top: var(--bl-altura-cabecalho);
    color: #fff;
    background: linear-gradient(135deg, var(--bl-navy), var(--bl-navy-claro));
    overflow: hidden;
}

.bl-topo::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--bl-grade), radial-gradient(circle at 85% 0%, rgba(255, 123, 84, 0.2), transparent 45%);
}

.bl-topo .bl-topo-conteudo {
    position: relative;
    z-index: 1;
    max-width: 940px;
    padding: 2.75rem 1rem 3.25rem;
    text-align: center;
}

.bl-topo-titulo {
    color: #fff;
    font-size: clamp(1.8rem, 3.8vw, 2.8rem);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.025em;
    margin: 0.85rem 0 0.8rem;
}

.bl-topo-descricao {
    color: rgba(255, 255, 255, 0.82);
    font-size: 1.05rem;
    line-height: 1.6;
    max-width: 680px;
    margin: 0 auto;
}

.bl-topo-post .bl-meta {
    justify-content: center;
    margin-top: 0.4rem;
}

.bl-trilha {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 1rem;
}

.bl-trilha a {
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
}

.bl-trilha a:hover {
    color: #fff;
}

.bl-trilha i {
    font-size: 0.55rem;
    opacity: 0.6;
}

.bl-trilha span[aria-current] {
    color: #fff;
    max-width: 42ch;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---- Artigo ---- */
.bl-artigo-capa {
    margin: 0 0 1.75rem;
    border-radius: var(--bl-raio);
    overflow: hidden;
    box-shadow: var(--bl-sombra);
}

.bl-artigo-capa img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1200 / 630;
    object-fit: cover;
}

.bl-artigo-lead {
    font-size: 1.2rem;
    line-height: 1.6;
    font-weight: 500;
    color: var(--bl-texto);
    border-left: 4px solid var(--bl-laranja);
    padding-left: 1rem;
    margin-bottom: 1.75rem;
}

.bl-conteudo {
    font-size: 1.06rem;
    line-height: 1.8;
    color: #334155;
    overflow-wrap: break-word;
}

.bl-conteudo h2 {
    font-size: 1.6rem;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.015em;
    color: var(--bl-texto);
    margin: 2.25rem 0 1rem;
}

.bl-conteudo h3 {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--bl-texto);
    margin: 1.75rem 0 0.75rem;
}

.bl-conteudo h4 {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--bl-texto);
    margin: 1.5rem 0 0.6rem;
}

.bl-conteudo p {
    margin: 0 0 1.25rem;
}

.bl-conteudo a {
    color: var(--bl-laranja-escuro);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.bl-conteudo ul,
.bl-conteudo ol {
    padding-left: 1.4rem;
    margin: 0 0 1.25rem;
}

.bl-conteudo li {
    margin-bottom: 0.4rem;
}

.bl-conteudo ul li::marker {
    color: var(--bl-laranja);
}

.bl-conteudo blockquote {
    margin: 1.75rem 0;
    padding: 1.2rem 1.5rem;
    background: #fff5f1;
    border-left: 4px solid var(--bl-laranja);
    border-radius: 0 var(--bl-raio) var(--bl-raio) 0;
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--bl-texto);
}

.bl-conteudo blockquote p:last-child {
    margin-bottom: 0;
}

.bl-conteudo img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
}

.bl-conteudo figure {
    margin: 1.75rem 0;
}

.bl-conteudo figcaption {
    font-size: 0.85rem;
    color: var(--bl-suave);
    text-align: center;
    margin-top: 0.5rem;
}

.bl-conteudo table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    border-collapse: collapse;
    margin: 1.5rem 0;
    font-size: 0.95rem;
}

.bl-conteudo th,
.bl-conteudo td {
    border: 1px solid var(--bl-borda);
    padding: 0.6rem 0.85rem;
    text-align: left;
}

.bl-conteudo th {
    background: var(--bl-navy);
    color: #fff;
    font-weight: 600;
}

.bl-conteudo tr:nth-child(even) td {
    background: var(--bl-fundo);
}

.bl-conteudo hr {
    border: 0;
    border-top: 1px solid var(--bl-borda);
    margin: 2rem 0;
}

/* ---- Compartilhar ---- */
.bl-compartilhar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 2rem;
    padding: 1.2rem 0;
    border-top: 1px solid var(--bl-borda);
    border-bottom: 1px solid var(--bl-borda);
}

.bl-compartilhar-rotulo {
    font-weight: 700;
    color: var(--bl-texto);
    margin-right: 0.25rem;
}

.bl-compartilhar-botao {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 0;
    color: #fff;
    font-size: 1rem;
    text-decoration: none;
    transition: transform 0.2s ease;
}

.bl-compartilhar-botao:hover {
    color: #fff;
    transform: translateY(-2px);
}

.bl-whatsapp { background: #25d366; }
.bl-facebook { background: #1877f2; }
.bl-x { background: #111; }
.bl-telegram { background: #229ed9; }
.bl-copiar { background: var(--bl-suave); }

.bl-x-logo {
    font-weight: 700;
    font-size: 1rem;
    line-height: 1;
}

/* ---- Caixas no fim do artigo ---- */
.bl-caixa-resultado {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.5rem;
    padding: 1rem 1.3rem;
    color: #fff;
    border-radius: var(--bl-raio);
    text-decoration: none;
    transition: filter 0.2s;
}

.bl-caixa-resultado:not([class*="bg-"]) {
    background-color: var(--bl-navy);
}

.bl-caixa-resultado:hover {
    color: #fff;
    filter: brightness(1.08);
}

.bl-caixa-resultado small {
    display: block;
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.8;
}

.bl-caixa-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    margin-top: 1.5rem;
    padding: 1.75rem;
    color: #fff;
    border-radius: var(--bl-raio);
    background: var(--bl-grade), linear-gradient(135deg, var(--bl-navy), var(--bl-navy-claro));
}

.bl-caixa-cta h2 {
    color: #fff;
    font-size: 1.35rem;
    font-weight: 800;
    margin: 0 0 0.35rem;
}

.bl-caixa-cta p {
    margin: 0;
    color: rgba(255, 255, 255, 0.8);
}

.bl-caixa-cta .btn {
    flex-shrink: 0;
}

.bl-responsavel {
    margin: 1.25rem 0 0;
    font-size: 0.85rem;
    color: var(--bl-suave);
}

.bl-responsavel i {
    margin-right: 0.3rem;
}

.bl-relacionados {
    margin-top: 3rem;
}

/* ---- Paginação ---- */
.bl-paginacao {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 2.75rem;
}

.bl-pagina {
    min-width: 42px;
    height: 42px;
    padding: 0 0.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid var(--bl-borda);
    border-radius: 10px;
    color: var(--bl-texto);
    font-weight: 600;
    text-decoration: none;
    transition: border-color 0.2s, color 0.2s;
}

.bl-pagina:hover {
    border-color: var(--bl-laranja);
    color: var(--bl-laranja-escuro);
}

.bl-pagina.ativa {
    background: var(--bl-laranja);
    border-color: var(--bl-laranja);
    color: #fff;
}

.bl-pagina-reticencias {
    border: 0;
    background: transparent;
}

/* ---- Estado vazio / não encontrado ---- */
.bl-vazio {
    text-align: center;
    padding: 3rem 1.5rem;
    background: var(--bl-fundo);
    border-radius: var(--bl-raio);
}

.bl-vazio i {
    display: block;
    font-size: 2.6rem;
    color: var(--bl-suave);
    margin-bottom: 1rem;
}

.bl-vazio p {
    color: var(--bl-suave);
    margin-bottom: 1.25rem;
}

.bl-vazio .btn {
    margin: 0.25rem;
}

.bl-vazio .btn-outline {
    color: var(--bl-navy);
}

.bl-vazio .btn-outline:hover {
    color: #fff;
}

/* ---- Responsivo ---- */
@media (max-width: 991px) {
    .bl-hero {
        min-height: 520px;
    }
}

@media (max-width: 767px) {
    .bl-secao {
        padding: 2.25rem 0;
    }

    .bl-secao-titulo {
        font-size: 1.35rem;
    }

    .bl-hero .bl-hero-conteudo {
        padding: 2.5rem 1rem 7rem;
    }

    .bl-hero-resumo {
        font-size: 1rem;
    }

    .bl-destaques {
        margin-top: -80px;
    }

    .bl-destaque {
        height: 200px;
    }

    .bl-categorias-lista {
        justify-content: flex-start;
    }

    .bl-topo .bl-topo-conteudo {
        padding: 2rem 1rem 2.4rem;
    }

    .bl-conteudo {
        font-size: 1rem;
    }

    .bl-caixa-cta {
        flex-direction: column;
        text-align: center;
    }

    .bl-analises {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ===========================================================
   Análise do concurso (página do resultado, PD-2 opção A)
   O texto vem do post automático (h3, p, figure com o gráfico,
   aviso e link do histórico); a tipografia é a do .bl-conteudo.
   =========================================================== */
.rs-analise .bl-analise {
    /*max-width: 820px;*/
    margin: 0 auto;
    background: #fff;
    border: 1px solid var(--bl-borda);
    border-radius: var(--bl-raio);
    box-shadow: var(--bl-sombra);
    padding: 2.5rem 3rem;
}

.rs-analise .bl-analise-cabecalho {
    margin-bottom: 1.5rem;
}

.rs-analise .bl-analise-rotulo {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--bl-laranja-escuro);
    background: rgba(255, 123, 84, 0.12);
    padding: 0.35rem 0.8rem;
    border-radius: 999px;
}

.rs-analise .bl-analise .bl-analise-titulo {
    font-size: 1.9rem;
    font-weight: 800;
    line-height: 1.25;
    color: var(--bl-navy-escuro);
    margin: 0.9rem 0 0.6rem;
}

.rs-analise .bl-analise-meta {
    font-size: 0.9rem;
    color: var(--bl-suave);
}

.rs-analise .bl-conteudo h3 {
    color: var(--bl-navy);
}

/* Gráfico em duas versões (picture): web horizontal (3:2) na largura do texto; celular retrato (4:5) na largura
   da tela. A largura vem do max-width de cada tela e a altura acompanha (height: auto). */
.rs-analise .bl-conteudo .bl-analise-grafico {
    max-width: 720px;
    margin: 2rem auto;
}

.rs-analise .bl-conteudo .bl-analise-grafico picture {
    display: block;
}

.rs-analise .bl-conteudo .bl-analise-grafico img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    border: 1px solid var(--bl-borda);
}

@media (max-width: 767px) {
    .rs-analise .bl-conteudo .bl-analise-grafico {
        max-width: 100%;
        margin: 1.5rem 0;
    }
}

/* Conteúdo padrão (sem IA): as dezenas em bolas. */
.rs-analise .bl-conteudo .bl-analise-bolas {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0;
    margin: 0.5rem 0 1.25rem;
}

.rs-analise .bl-conteudo .bl-analise-bolas li {
    width: 2.6rem;
    height: 2.6rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--bl-navy);
    color: #fff;
    font-weight: 700;
    margin: 0;
}

.rs-analise .bl-conteudo .bl-analise-bolas li::marker {
    content: none;
}

.rs-analise .bl-conteudo .bl-analise-aviso {
    font-size: 0.9rem;
    color: var(--bl-suave);
    border-top: 1px solid var(--bl-borda);
    padding-top: 1rem;
    margin-top: 2rem;
}

.rs-analise .bl-conteudo .bl-analise-links {
    margin-bottom: 0;
}

.rs-analise .bl-conteudo .bl-analise-links a {
    font-weight: 600;
}

@media (max-width: 767px) {
    .rs-analise .bl-analise {
        padding: 1.5rem 1.1rem;
        border-radius: 0;
        border-left: 0;
        border-right: 0;
    }

    .rs-analise .bl-analise .bl-analise-titulo {
        font-size: 1.45rem;
    }
}