/*
Theme Name: Astra Child (Evalco Corretor)
Theme URI: https://casaimmobili.com.br
Description: Tema filho do Astra para site de corretor com blog - prioridade total no style.css
Author: Evalco Carvalho
Author URI: https://casaimmobili.com.br
Template: astra
Version: 1.0.0
Text Domain: astra-child
*/

/* ===== SEUS ESTILOS AQUI - PRIORIDADE TOTAL ===== */
/* Exemplo: esconder elementos indesejados do template */
/*
.hero-section, 
.call-to-action {
    display: none;
}
*/

/* Personalize com suas próprias cores, fontes, espaçamentos */
body {
    /* Exemplo: fonte mais legível */
    font-family: 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
}

.meu-blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}


/* Qualquer regra aqui vai sobrescrever o tema pai e o Customizer */

/* Força espaçamento superior global para páginas de post */
.single-post .ast-container {
    margin-top: 0;
    padding-top: 0;
}

.single-post .entry-header {
    margin-top: 0;
}



/* Grid de 3 colunas para o Display Posts */
.meu-grid-personalizado {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin: 40px auto;
    max-width: 1200px;
    padding: 0 20px;
}

/* Estilo dos cards */
.meu-grid-personalizado .listing-item {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
    transition: transform 0.2s, box-shadow 0.2s;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.meu-grid-personalizado .listing-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.12);
}

/* Imagem */
.meu-grid-personalizado img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
}

/* Conteúdo */
.meu-grid-personalizado .listing-item > div {
    padding: 20px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

/* Título */
.meu-grid-personalizado .title {
    margin: 0 0 10px;
    font-size: 1.25rem;
    line-height: 1.3;
}
.meu-grid-personalizado .title a {
    color: #0a2b3e;
    text-decoration: none;
}
.meu-grid-personalizado .title a:hover {
    color: #f5b042;
}

/* Data */
.meu-grid-personalizado .meu-data {
    font-size: 0.8rem;
    color: #64748b;
    margin-bottom: 12px;
}

/* Resumo */
.meu-grid-personalizado .excerpt {
    color: #334155;
    font-size: 0.9rem;
    line-height: 1.5;
    margin-bottom: 20px;
    flex-grow: 1;
}

/* Botão Leia Mais (o plugin adiciona automaticamente um parágrafo com link) */
.meu-grid-personalizado .excerpt + p {
    margin: 0;
    text-align: right;
}
.meu-grid-personalizado .excerpt + p a {
    display: inline-block;
    background: #f5b042;
    color: #0a2b3e;
    padding: 6px 18px;
    border-radius: 40px;
    text-decoration: none;
    font-size: 0.8rem;
    font-weight: 600;
    transition: background 0.2s;
}
.meu-grid-personalizado .excerpt + p a:hover {
    background: #e09d2c;
}

/* Responsivo */
@media (max-width: 992px) {
    .meu-grid-personalizado {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }
}
@media (max-width: 576px) {
    .meu-grid-personalizado {
        grid-template-columns: 1fr;
    }
}


/* Wrapper com espaçamento lateral e superior/inferior de 20px */
.meus-cards-wrapper {
    max-width: 1400px;
    margin: 40px auto;
    padding: 0 20px;
}

/* Grid responsivo */
.meus-cards-grid {
    display: grid;
    gap: 30px;
}
.grid-3 {
    grid-template-columns: repeat(3, 1fr);
}
.grid-2 {
    grid-template-columns: repeat(2, 1fr);
}
.grid-4 {
    grid-template-columns: repeat(4, 1fr);
}

/* Card premium */
.card-premium {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 10px 25px -8px rgba(0,0,0,0.1);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    display: flex;
    flex-direction: column;
}
.card-premium:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 35px -12px rgba(0,0,0,0.2);
}

/* Imagem */
.card-img {
    height: 200px;
    background-size: cover;
    background-position: center;
    transition: transform 0.4s ease;
}
.card-premium:hover .card-img {
    transform: scale(1.03);
}

/* Conteúdo */
.card-content {
    padding: 20px 20px 25px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.card-title {
    font-size: 1.35rem;
    font-weight: 800;
    margin: 0 0 10px;
    color: #0a2b3e;
    line-height: 1.3;
}
.card-excerpt {
    font-size: 0.9rem;
    color: #4a627a;
    line-height: 1.5;
    margin: 0 0 20px;
    flex: 1;
}
.card-btn {
    align-self: flex-start;
    background: transparent;
    border: 2px solid #f5b042;
    border-radius: 40px;
    padding: 8px 22px;
    font-weight: bold;
    font-size: 0.85rem;
    color: #f5b042;
    text-decoration: none;
    transition: all 0.3s ease;
}
.card-btn:hover {
    background: #f5b042;
    color: #0a2b3e;
}

/* Responsivo */
@media (max-width: 992px) {
    .grid-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 768px) {
    .meus-cards-wrapper {
        padding: 0 15px;
    }
    .grid-3, .grid-2, .grid-4 {
        grid-template-columns: 1fr;
    }
    .card-img {
        height: 180px;
    }
}


/* ===== AJUSTE GERAL PARA CELULAR ===== */
@media (max-width: 768px) {
    
    /* Ajusta padding horizontal das seções que usam 1rem (como seu hero) */
    section, 
    div[style*="padding: 8rem 1rem"],
    div[style*="padding: 10rem 2rem"],
    div[style*="padding: 12rem 1rem"],
    div[style*="padding: 14rem 1rem"] {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    /* Reduz padding vertical dos heróis */
    section {
        padding-top: 5rem !important;
        padding-bottom: 4rem !important;
    }

    /* Ajusta tamanho dos títulos principais (h1) */
    h1 {
        font-size: 2.2rem !important;
        letter-spacing: 0.05em !important;
    }

    /* Ajusta subtítulos (h2) */
    h2 {
        font-size: 1.5rem !important;
    }

    /* Ajusta parágrafos de descrição */
    p, .descricao {
        font-size: 1rem !important;
        line-height: 1.4 !important;
    }

    /* Botões: um abaixo do outro, com texto centralizado */
    div[style*="display: flex; gap:"],
    div[style*="display: flex; gap: 1.5rem"] {
        flex-direction: column !important;
        align-items: center !important;
        gap: 1rem !important;
    }
    
    a[style*="padding: 1rem 2rem"] {
        width: 90% !important;
        text-align: center !important;
    }

    /* Estatísticas (ficam empilhadas) */
    div[style*="justify-content: center; gap: 3rem"] {
        flex-direction: column !important;
        gap: 1.5rem !important;
    }

    /* Cards do shortcode: já estão no grid com media query dentro do CSS que você fez. 
       Mas se algo falhar, força o empilhamento */
    .meus-cards-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
    .meus-cards-wrapper {
        margin: 30px auto !important;
        padding: 0 15px !important;
    }
    
    /* Imagens dentro de cards não estouram */
    .card-img {
        height: 180px !important;
    }

    /* Ajusta badges de localização */
    p[style*="background: rgba(0,0,0,0.5); display: inline-block;"] {
        font-size: 0.8rem !important;
        padding: 0.3rem 1rem !important;
    }
}



/* ===== AJUSTES EXCLUSIVOS PARA O FOOTER NO CELULAR ===== */
@media (max-width: 768px) {
    /* Força o grid do footer a ter 1 coluna */
    div[style*="max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 40px;"] {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
        text-align: center; /* centraliza o conteúdo das colunas, opcional */
    }
    
    /* Ajusta o espaçamento dos títulos h3 dentro do footer */
    div[style*="background: #0a2b3e; color: #cbd5e1; padding: 50px 20px 30px;"] h3 {
        margin-bottom: 10px !important;
        font-size: 1.3rem !important;
    }
    
    /* Remove bullets e padding das listas */
    div[style*="background: #0a2b3e; color: #cbd5e1; padding: 50px 20px 30px;"] ul {
        padding-left: 0 !important;
        text-align: center !important;
    }
    
    /* Links ficam com espaçamento vertical */
    div[style*="background: #0a2b3e; color: #cbd5e1; padding: 50px 20px 30px;"] li {
        margin-bottom: 8px !important;
    }
    
    /* Barra de navegação do meio (links) – quebra em linhas */
    div[style*="text-align: center; margin-top: 40px; padding-top: 20px; border-top: 1px solid #1e293b; display: flex; justify-content: center; gap: 30px; flex-wrap: wrap;"] {
        flex-direction: column !important;
        gap: 12px !important;
        align-items: center !important;
    }
    
    /* Ajusta padding geral do footer para telas pequenas */
    div[style*="background: #0a2b3e; color: #cbd5e1; padding: 50px 20px 30px;"] {
        padding: 40px 15px 20px !important;
    }
}






/* ===== AJUSTES GLOBAIS PARA HERO NO CELULAR ===== */
@media (max-width: 768px) {
    
    /* 
       Seleciona qualquer section que tenha padding inline (comum nos heróis)
       e também divs que atuam como container principal do hero
    */
    section[style*="padding:"],
    div[style*="background: linear-gradient"][style*="text-align: center"] {
        padding-top: calc(80px + 2rem) !important;
        padding-bottom: 3rem !important;
    }
    
    /* 
       Caso o hero use div interna com padding (como o que você fez em algumas páginas)
       Ex: <div style="padding: 14rem 1rem...">
    */
    div[style*="padding-top:"][style*="text-align: center"],
    div[style*="padding: 14rem"][style*="text-align: center"],
    div[style*="padding: 12rem"][style*="text-align: center"],
    div[style*="padding: 10rem"][style*="text-align: center"] {
        padding-top: calc(80px + 2rem) !important;
        padding-bottom: 3rem !important;
    }
    
    /* Ajuste de fontes para todos os títulos dentro de heróis */
    section h1, div[style*="text-align: center"] h1,
    section h2, div[style*="text-align: center"] h2,
    section p, div[style*="text-align: center"] p {
        max-width: 100% !important;
    }
    
    section h1, div[style*="text-align: center"] h1 {
        font-size: 2.2rem !important;
    }
    
    section h2, div[style*="text-align: center"] h2 {
        font-size: 1.4rem !important;
    }
    
    section p, div[style*="text-align: center"] p {
        font-size: 1rem !important;
        line-height: 1.4 !important;
    }
    
    /* Botões dentro de heróis: empilhar e centralizar */
    section div[style*="display: flex"][style*="gap"], 
    div[style*="text-align: center"] div[style*="display: flex"][style*="gap"] {
        flex-direction: column !important;
        align-items: center !important;
        gap: 1rem !important;
    }
    
    section a[style*="padding: 1rem 2rem"],
    div[style*="text-align: center"] a[style*="padding: 1rem 2rem"] {
        width: 90% !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }
}


/* Ajusta o tamanho da logo no celular */
@media (max-width: 768px) {
    .custom-logo {
        max-width: 50px !important;
        height: auto !important;
    }
}



/* Estilização do novo texto */
.mobile-title {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    color: #f5b042;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Exibe o texto apenas em dispositivos móveis */
@media (min-width: 768px) {
    .mobile-title {
        display: none;
    }
}

/* --- Ajustes finos de centralização (se necessário) --- */
/* Para telas muito pequenas, reduz o tamanho da fonte */
@media (max-width: 480px) {
    .mobile-title {
        font-size: 1rem;
    }
}


/* Container das tags */
.custom-tags-container {
    margin: 40px 0 20px;
    padding: 15px 0;
    clear: both;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px; /* espaçamento horizontal e vertical entre linhas */
    row-gap: 20px; /* espaçamento vertical entre linhas quando quebra */
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}

/* Rótulo "Tags:" */
.custom-tags-label {
    font-weight: bold;
    color: #0a2b3e;
    background: #f1f5f9;
    padding: 6px 14px;
    border-radius: 40px;
    font-size: 0.85rem;
    display: inline-block;
}

/* Cada tag individual */
.custom-tags-container a {
    display: inline-block;
    background: #f5b04220;
    color: #0a2b3e;
    padding: 8px 18px; /* um pouco mais de padding interno */
    border-radius: 40px;
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: 500;
    transition: all 0.2s ease;
    border: 1px solid #f5b04240;
    margin: 0; /* reset */
}

.custom-tags-container a:hover {
    background: #f5b042;
    color: #0a2b3e;
    border-color: #f5b042;
}

@media (max-width: 768px) {
    .custom-tags-container {
        gap: 12px;
        row-gap: 16px;
        justify-content: center; /* centraliza os balões em telas pequenas */
    }
    .custom-tags-container a {
        padding: 6px 14px;
        font-size: 0.8rem;
    }
}


/* Ajustes para o single-imovel */
.single-imovel .hero-imovel {
    position: relative;
    width: 100%;
    height: 60vh;
    min-height: 400px;
    max-height: 700px;
    overflow: hidden;
    background: #0a2b3e;
}

/* Responsividade para o hero em telas menores */
@media (max-width: 768px) {
    .single-imovel .hero-imovel {
        height: 50vh;
        min-height: 300px;
    }
}

/* Ícones e cards de dados técnicos - já estão inline, mas pode ajustar */



/* ==========================================
   SINGLE IMÓVEL - MELHORIAS DE LAYOUT
   ========================================== */

/* Container principal do conteúdo */
.single-imovel #imovel-conteudo {
    max-width: 1000px; /* centraliza e limita a largura para melhor leitura */
    padding: 30px 20px;
}

/* Cards de dados técnicos */
.single-imovel .dados-tecnicos {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    margin-bottom: 40px;
}

.single-imovel .dados-tecnicos .card-dado {
    flex: 0 0 auto;
    min-width: 140px;
    background: #f8fafc;
    padding: 20px 24px;
    border-radius: 16px;
    text-align: center;
    border: 1px solid #e2e8f0;
    transition: 0.2s;
}

.single-imovel .dados-tecnicos .card-dado:hover {
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    border-color: #f5b042;
}

.single-imovel .dados-tecnicos .card-dado .icone {
    font-size: 2rem;
    line-height: 1.2;
}

.single-imovel .dados-tecnicos .card-dado .valor {
    font-weight: 700;
    color: #0a2b3e;
    font-size: 1.3rem;
}

.single-imovel .dados-tecnicos .card-dado .rotulo {
    color: #4a627a;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Preço principal */
.single-imovel .preco-destaque {
    text-align: center;
    margin-bottom: 30px;
}

.single-imovel .preco-destaque .valor {
    font-size: 2.2rem;
    font-weight: 700;
    color: #f5b042;
}

.single-imovel .preco-destaque .finalidade {
    font-size: 1rem;
    color: #4a627a;
    margin-left: 10px;
    text-transform: uppercase;
}

/* Descrição */
.single-imovel #imovel-descricao {
    font-size: 1.05rem;
    line-height: 1.8;
    color: #2d3e5a;
    margin-bottom: 30px;
    padding: 0 10px;
}

.single-imovel #imovel-descricao img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    margin: 20px 0;
}

/* Tags (características, tipo, bairro) */
.single-imovel .tags-wrapper {
    margin-bottom: 30px;
}

.single-imovel .tags-wrapper h3 {
    color: #0a2b3e;
    font-size: 1.2rem;
    margin-bottom: 12px;
    font-weight: 600;
}

.single-imovel .tags-wrapper .tag {
    display: inline-block;
    padding: 5px 16px;
    border-radius: 30px;
    font-size: 0.9rem;
    margin-right: 8px;
    margin-bottom: 8px;
    border: 1px solid #e2e8f0;
    background: #f1f5f9;
    color: #0a2b3e;
}

.single-imovel .tags-wrapper .tag-tipo {
    background: #f5b04220;
    border-color: #f5b042;
    color: #f5b042;
}

.single-imovel .tags-wrapper .tag-bairro {
    background: #e2e8f0;
    border-color: #cbd5e1;
}

/* Botões de contato */
.single-imovel .botoes-contato {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
    margin-top: 30px;
    padding-top: 25px;
    border-top: 2px solid #f0f2f5;
}

.single-imovel .botoes-contato .btn-wpp {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #25d366;
    color: #fff;
    padding: 12px 28px;
    border-radius: 40px;
    text-decoration: none;
    font-weight: 600;
    font-size: 1rem;
    box-shadow: 0 4px 14px rgba(37,211,102,0.25);
    transition: 0.2s;
}

.single-imovel .botoes-contato .btn-wpp:hover {
    transform: scale(1.02);
    box-shadow: 0 6px 20px rgba(37,211,102,0.35);
}

.single-imovel .botoes-contato .btn-email {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #0a2b3e;
    color: #fff;
    padding: 12px 28px;
    border-radius: 40px;
    text-decoration: none;
    font-weight: 600;
    font-size: 1rem;
    transition: 0.2s;
}

.single-imovel .botoes-contato .btn-email:hover {
    transform: scale(1.02);
    background: #1a3b4e;
}

.single-imovel .botoes-contato .btn-voltar {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    color: #0a2b3e;
    padding: 12px 28px;
    border-radius: 40px;
    text-decoration: none;
    font-weight: 600;
    font-size: 1rem;
    border: 2px solid #0a2b3e;
    transition: 0.2s;
}

.single-imovel .botoes-contato .btn-voltar:hover {
    background: #0a2b3e;
    color: #fff;
}

/* Responsividade */
@media (max-width: 768px) {
    .single-imovel .dados-tecnicos .card-dado {
        min-width: 120px;
        padding: 15px 18px;
    }
    .single-imovel .preco-destaque .valor {
        font-size: 1.8rem;
    }
    .single-imovel #imovel-descricao {
        font-size: 0.95rem;
        padding: 0 5px;
    }
    .single-imovel .botoes-contato {
        flex-direction: column;
        align-items: center;
    }
    .single-imovel .botoes-contato a {
        width: 100%;
        max-width: 300px;
        justify-content: center;
    }
}




/* Centraliza a descrição e as seções de tags */
.single-imovel #imovel-descricao {
    text-align: center;
}

.single-imovel .tags-wrapper {
    text-align: center;
}

.single-imovel .tags-wrapper .tag-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}

/* Centraliza os títulos das seções (Características, Tipo, Bairro) */
.single-imovel .tags-wrapper h3 {
    text-align: center;
}

/* Se quiser centralizar também o conteúdo do post (the_content) */
.single-imovel .entry-content {
    text-align: center;
}

/* Mas para parágrafos longos, é melhor manter o alinhamento à esquerda para legibilidade.
   Se preferir, comente a linha abaixo para centralizar tudo. */
.single-imovel #imovel-descricao p {
    text-align: left; /* ou center, se quiser centralizar */
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}



#imovel-descricao img,
#imovel-descricao figure,
#imovel-descricao .wp-block-image {
    max-width: 100% !important;
    height: auto !important;
}



/* Container das tags – boxed e com padding vertical de 20px */
.custom-tags-container {
    max-width: 900px;
    margin: 0 auto;
    padding: 20px 0;
    border-top: 2px solid #f0f2f5;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

/* Label das tags */
.custom-tags-label {
    font-weight: 600;
    color: #0a2b3e;
    font-size: 0.95rem;
}

/* Wrapper que envolve os links */
.custom-tags-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* Cada link de tag – sem sublinhado */
.custom-tags-wrapper a,
.custom-tags-wrapper a:link,
.custom-tags-wrapper a:visited,
.custom-tags-wrapper a:hover,
.custom-tags-wrapper a:active {
    background: #f8fafc;
    color: #0a2b3e;
    padding: 4px 14px;
    border-radius: 30px;
    font-size: 0.8rem;
    text-decoration: none !important;
    border: 1px solid #e2e8f0;
    transition: 0.2s;
    border-bottom: none !important;
}

.custom-tags-wrapper a:hover {
    background: #f5b042;
    color: #0a2b3e;
    border-color: #f5b042;
}


/* Container principal (rótulo + tags) */
.custom-tags-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px 24px; /* vertical 16px, horizontal 24px */
    margin-top: 30px;
    padding: 16px 0;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}

/* Rótulo "📌 Tags:" */
.custom-tags-label {
    font-weight: 700;
    color: #0a2b3e;
    font-size: 1rem;
    white-space: nowrap;
}

/* Wrapper das tags (flex para espaçamento) */
.custom-tags-wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 18px; /* vertical 10px, horizontal 18px – AUMENTE AQUI */
}

/* Cada tag individual */
.custom-tag-item {
    background: #f1f5f9;
    color: #0a2b3e;
    padding: 6px 16px;
    border-radius: 30px;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    transition: 0.2s;
    border: 1px solid #e2e8f0;
    white-space: nowrap;
}

.custom-tag-item:hover {
    background: #f5b042;
    color: #0a2b3e;
    border-color: #f5b042;
    transform: translateY(-1px);
}


/* ============================================================
   BLOCO – SIMULADOS / QUESTÕES INTERATIVAS (CERTO/ERRADO)
   ============================================================
   Este bloco estiliza o módulo de 10 questões no final de cada post.

   CLASSES PRESENTES:
   .questao-wrap        – card de cada questão
   .cabecalho           – cabeçalho (badge + título)
   .badge               – etiqueta amarela (ex: SIMULADO 01)
   .titulo              – nome do tópico da questão
   .enunciado           – texto da pergunta
   .opcoes              – agrupamento das opções
   .opcao               – cada opção (Certo/Errado) com hover e estados
   .btn-verificar       – botão para conferir a resposta
   .feedback            – área que exibe acertou/errou + justificativa
   ============================================================ */


        .questao-wrap {
            background: #fff;
            border: 1px solid #e0e7ef;
            border-radius: 20px;
            padding: 30px 35px;
            margin: 25px 0;
            box-shadow: 0 8px 30px rgba(0,0,0,0.06);
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        }
        .questao-wrap .cabecalho {
            display: flex;
            align-items: center;
            gap: 14px;
            margin-bottom: 20px;
        }
        .questao-wrap .badge {
            background: #f5b042;
            color: #0a2b3e;
            font-weight: 900;
            font-size: 1.3rem;
            padding: 4px 16px;
            border-radius: 50px;
            flex-shrink: 0;
        }
        .questao-wrap .titulo {
            font-weight: 700;
            color: #1b4a6b;
            font-size: 1.15rem;
            border-left: 3px solid #f5b042;
            padding-left: 12px;
        }
        .questao-wrap .enunciado {
            font-size: 1.05rem;
            line-height: 1.6;
            color: #1e2f3f;
            margin-bottom: 22px;
            font-weight: 500;
        }
        .questao-wrap .opcoes {
            display: flex;
            flex-direction: column;
            gap: 10px;
            margin-bottom: 28px;
        }
        .questao-wrap .opcao {
            display: flex;
            align-items: flex-start;
            gap: 12px;
            background: #fafcff;
            border: 2px solid #e9edf4;
            border-radius: 12px;
            padding: 14px 18px;
            cursor: pointer;
            transition: all 0.2s;
            font-size: 1rem;
            color: #1e2f3f;
        }
        .questao-wrap .opcao:hover {
            background: #f2f6fe;
            border-color: #b8cbe0;
            transform: translateX(4px);
        }
        .questao-wrap .opcao input[type="radio"] {
            appearance: none;
            -webkit-appearance: none;
            width: 18px;
            height: 18px;
            border: 2px solid #b0c4de;
            border-radius: 50%;
            margin-top: 2px;
            flex-shrink: 0;
            transition: 0.2s;
            cursor: pointer;
        }
        .questao-wrap .opcao input[type="radio"]:checked {
            border-color: #1b4a6b;
            background-color: #1b4a6b;
            box-shadow: inset 0 0 0 4px #fff, 0 0 0 1px #1b4a6b;
        }
        .questao-wrap .opcao .letra {
            font-weight: 700;
            color: #1b4a6b;
            flex-shrink: 0;
        }
        .questao-wrap .opcao.correta {
            border-color: #2a9d8f;
            background: #eaf9f5;
        }
        .questao-wrap .opcao.errada {
            border-color: #e76f51;
            background: #fdeeea;
        }
        .questao-wrap .opcao.marcada {
            border-color: #1b4a6b;
            background: #e2edfb;
        }
        .questao-wrap .btn-verificar {
            background: #1b4a6b;
            color: #fff;
            border: none;
            padding: 12px 32px;
            border-radius: 40px;
            font-weight: 700;
            font-size: 1rem;
            cursor: pointer;
            transition: all 0.3s;
            box-shadow: 0 4px 8px rgba(27,74,107,0.25);
            display: inline-flex;
            align-items: center;
            gap: 8px;
        }
        .questao-wrap .btn-verificar:hover {
            background: #0d3349;
            transform: scale(1.02);
        }
        .questao-wrap .feedback {
            margin-top: 22px;
            padding: 18px 22px;
            border-radius: 12px;
            font-size: 1rem;
            line-height: 1.6;
            display: none;
            border: 1px solid #e0e7ef;
            border-left-width: 6px;
        }
        .questao-wrap .feedback.visivel {
            display: block;
            animation: fadeSlide 0.3s ease;
        }
        .questao-wrap .feedback.acertou {
            border-left-color: #2a9d8f;
            background: #f0fbf8;
        }
        .questao-wrap .feedback.errou {
            border-left-color: #e76f51;
            background: #fdf6f3;
        }
        .questao-wrap .feedback .status {
            font-weight: 700;
            font-size: 1.05rem;
            margin-bottom: 4px;
        }
        .questao-wrap .feedback .status.certo { color: #2a9d8f; }
        .questao-wrap .feedback .status.errado { color: #e76f51; }
        .questao-wrap .feedback .justificativa { color: #1e2f3f; margin-top: 4px; }
        .questao-wrap .feedback .gabarito { font-weight: 600; color: #1b4a6b; }
        @keyframes fadeSlide {
            0% { opacity:0; transform:translateY(-10px); }
            100% { opacity:1; transform:translateY(0); }
        }
        @media (max-width:600px) {
            .questao-wrap { padding: 20px 16px; }
            .questao-wrap .cabecalho { flex-wrap: wrap; }
            .questao-wrap .opcao { padding: 12px 14px; font-size: 0.95rem; }
            .questao-wrap .btn-verificar { width: 100%; justify-content: center; }
        }



/* ============================================================
   BLOCO – TAGS / MINHAS TAGS (SHORTCODE)
   ============================================================
   Este bloco estiliza o shortcode de tags que aparece no final
   do post, exibindo os links para as categorias/tags relacionadas.

   CLASSES PRESENTES:
   .minhas-tags-container – container principal com margem e fundo
   .minhas-tags-label     – rótulo "📚 Direito Penal:" etc.
   .minhas-tags-list      – lista inline de tags
   .tag-link              – cada balão/tag clicável com hover
   ============================================================ */


/* Container principal com margem inferior de 50px */
.minhas-tags-container {
    max-width: 1000px;
    margin: 30px auto 50px auto; !important;  /* 50px de distância do rodapé */
    padding: 20px 25px;
    background: #f8f9fa;
    border-left: 5px solid #007cba;
    border-radius: 8px;
    font-size: 0.95em;
    line-height: 1.8;  /* altura da linha para dar espaço vertical */
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}





/* Rótulo */
.minhas-tags-label {
    font-weight: 700;
    color: #1e1e1e;
    display: inline-block;
    margin-right: 8px;
}

/* Lista de tags */
.minhas-tags-list {
    display: inline;
}

/* Cada balão (tag) */
.tag-link {
    display: inline-block;
    background: #e9ecef;
    padding: 8px 20px;           /* mais espaço interno */
    margin: 8px 12px !important;  /* espaçamento horizontal E vertical entre os balões */
    border-radius: 20px;
    color: #007cba;
    text-decoration: none !important;
    font-size: 0.9em;
    transition: all 0.2s;
    line-height: 1.4;            /* evita que o texto fique colado internamente */
}




.tag-link:hover {
    background: #007cba;
    color: #fff;
    text-decoration: none !important;
}

/* Para tags sem link (se usar link="false") */
.tag-nome {
    display: inline-block;
    background: #e9ecef;
    padding: 6px 16px;
    margin: 4px 6px !important;
    border-radius: 20px;
    color: #333;
    font-size: 0.9em;
    line-height: 1.4;
}



/* ============================================================
   BLOCO – ESTRUTURA GERAL DO POST / WRAPPER
   ============================================================
   Este bloco estiliza o container principal do post e todos
   os elementos de conteúdo (herói, títulos, blocos, dicas,
   conclusão, botões de chamada, etc.).

   CLASSES PRESENTES:
   .simulados-wrapper   – container principal do post
   .simulados-hero      – área do herói/introdução
   .hero-badge          – etiqueta do herói (ex: "Direito Penal")
   .hero-title          – título principal com gradiente
   .hero-sub            – subtítulo
   .hero-dica           – dica rápida no herói
   .simulados-bloco     – blocos de conteúdo internos
   .bloco-header        – cabeçalho de cada bloco
   .bloco-icon          – ícone do bloco
   .bloco-header h2     – título do bloco
   .bloco-count         – contador (ex: "10 questões")
   .simulados-cta       – área de chamada para ação (CTA)
   .btn-ver-categoria   – botão grande de navegação
   ============================================================ */



   .simulados-wrapper {
        max-width: 1000px;
        margin: 2.5rem auto;
        padding: 2rem 2.5rem;
        background: #ffffff;
        border-radius: 32px;
        box-shadow: 0 20px 60px -12px rgba(0, 20, 50, 0.12), 0 8px 24px -6px rgba(0, 0, 0, 0.02);
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
        position: relative;
        overflow: hidden;
        border-top: 6px solid transparent;
        border-image: linear-gradient(135deg, #2563eb, #7c3aed) 1;
    }
    .simulados-wrapper::before {
        content: '';
        position: absolute;
        top: -120px;
        right: -120px;
        width: 400px;
        height: 400px;
        background: radial-gradient(circle, rgba(37, 99, 235, 0.04) 0%, transparent 70%);
        border-radius: 50%;
        pointer-events: none;
        z-index: 0;
    }
    .simulados-wrapper::after {
        content: '';
        position: absolute;
        bottom: -80px;
        left: -80px;
        width: 300px;
        height: 300px;
        background: radial-gradient(circle, rgba(124, 58, 237, 0.04) 0%, transparent 70%);
        border-radius: 50%;
        pointer-events: none;
        z-index: 0;
    }
    .simulados-hero {
        position: relative;
        z-index: 1;
        margin-bottom: 2.5rem;
        padding-bottom: 1.5rem;
        border-bottom: 2px solid #f1f4f9;
    }
    .hero-badge {
        display: inline-block;
        background: linear-gradient(135deg, #1a3a5c, #2563eb);
        color: #fff;
        font-size: 0.7rem;
        font-weight: 700;
        letter-spacing: 0.08em;
        padding: 0.25rem 1rem;
        border-radius: 40px;
        text-transform: uppercase;
        margin-bottom: 0.75rem;
    }
    .hero-title {
        font-size: 2.6rem;
        font-weight: 800;
        margin: 0 0 0.4rem 0;
        background: linear-gradient(135deg, #0b1a33 0%, #2563eb 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        letter-spacing: -0.02em;
    }
    .hero-sub {
        font-size: 1.1rem;
        line-height: 1.7;
        color: #334155;
        margin: 0.5rem 0 0 0;
    }
    .hero-sub .highlight {
        background: linear-gradient(135deg, #2563eb, #7c3aed);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        font-weight: 600;
    }
    .hero-dica {
        margin-top: 1rem;
        padding: 0.9rem 1.4rem;
        background: #f8fafc;
        border-radius: 14px;
        border-left: 5px solid #2563eb;
        color: #1e293b;
        font-size: 0.98rem;
        box-shadow: inset 0 1px 3px rgba(0,0,0,0.02);
    }
    .simulados-bloco {
        position: relative;
        z-index: 1;
        margin-top: 2.8rem;
        padding-top: 0.2rem;
    }
    .bloco-header {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 0.6rem 1rem;
        margin-bottom: 1.2rem;
    }
    .bloco-icon {
        font-size: 1.8rem;
        line-height: 1;
    }
    .bloco-header h2 {
        font-size: 1.5rem;
        font-weight: 700;
        color: #0f172a;
        margin: 0;
        letter-spacing: -0.01em;
    }
    .bloco-count {
        background: #eef2ff;
        color: #2563eb;
        font-size: 0.7rem;
        font-weight: 600;
        padding: 0.15rem 0.8rem;
        border-radius: 40px;
        letter-spacing: 0.02em;
        margin-left: auto;
    }
    .bloco-penal .bloco-count {
        background: #f3e8ff;
        color: #7c3aed;
    }
    .simulados-cta {
        position: relative;
        z-index: 1;
        margin-top: 3.5rem;
        padding-top: 2rem;
        text-align: center;
        border-top: 2px solid #f1f4f9;
    }
    .btn-ver-categoria {
        display: inline-block;
        background: linear-gradient(135deg, #0b1a33 0%, #1a3a5c 100%);
        color: #ffffff;
        padding: 0.9rem 2.8rem;
        border-radius: 60px;
        font-weight: 700;
        font-size: 1.1rem;
        text-decoration: none;
        transition: all 0.3s ease;
        box-shadow: 0 8px 24px -6px rgba(11, 26, 51, 0.25);
        letter-spacing: 0.01em;
        border: 1px solid rgba(255,255,255,0.06);
    }
    .btn-ver-categoria:hover {
        transform: translateY(-3px);
        box-shadow: 0 16px 40px -10px rgba(11, 26, 51, 0.35);
        background: linear-gradient(135deg, #142b4a 0%, #1f4a72 100%);
    }
    .simulados-cta .obs {
        margin-top: 0.8rem;
        color: #64748b;
        font-size: 0.9rem;
    }
    @media (max-width: 768px) {
        .simulados-wrapper {
            padding: 1.5rem;
            margin: 1.5rem 0.8rem;
            border-radius: 24px;
        }
        .hero-title {
            font-size: 2rem;
        }
        .hero-sub {
            font-size: 1rem;
        }
        .bloco-header h2 {
            font-size: 1.2rem;
        }
        .bloco-count {
            font-size: 0.6rem;
            padding: 0.1rem 0.6rem;
        }
        .btn-ver-categoria {
            padding: 0.7rem 1.8rem;
            font-size: 1rem;
        }
    }
    @media (max-width: 480px) {
        .hero-title {
            font-size: 1.6rem;
        }
        .simulados-wrapper {
            padding: 1rem;
        }
    }
    


/* Remove o espaçamento superior dos containers que antecedem o hero */
.single-post .site-content,
.single-post .ast-container,
.single-post .site-main,
.single-post .entry-header,
.single-post .entry-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* Se ainda houver um pequeno gap, ajuste o hero para subir */
.single-post .entry-content .hero-contato {
    margin-top: -60px !important; /* ajuste o valor conforme necessário (ex: -15px, -25px) */
}

/* Mantém o full-width do hero (seu código) */
.single-post .entry-content .hero-contato {
    width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    max-width: 100vw !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}


.sumario-disciplina {
    max-width: 100%;
    padding: 2rem;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
    font-family: "Segoe UI", Roboto, sans-serif;
}

.sumario-header {
    margin-bottom: 1.5rem;
    border-bottom: 3px solid #f5b042;
    padding-bottom: 0.8rem;
}

.sumario-titulo {
    color: #0a2b3e;
    font-size: 1.8rem;
    font-weight: 700;
    margin: 0 0 0.2rem 0;
}

.sumario-subtitulo {
    color: #6b7a8a;
    font-size: 1rem;
    margin: 0;
}

.sumario-lista {
    list-style: none;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem 2rem;
}

@media (max-width: 768px) {
    .sumario-lista {
        grid-template-columns: 1fr;
    }
}

.sumario-item {
    padding: 0.5rem 0;
    border-bottom: 1px dashed #eef2f7;
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.sumario-numero {
    font-weight: 700;
    color: #f5b042;
    font-size: 0.85rem;
    min-width: 35px;
}

.sumario-link {
    color: #0a2b3e;
    text-decoration: none;
    font-weight: 500;
    font-size: 1rem;
    transition: color 0.2s;
}

.sumario-link:hover {
    color: #f5b042;
    text-decoration: underline;
}

.sumario-contagem {
    font-size: 0.8rem;
    color: #8a9aa9;
    font-weight: normal;
}

.sumario-descricao {
    color: #6b7a8a;
    font-size: 0.85rem;
    margin: 0.1rem 0 0 35px;
    font-style: italic;
}


/* ============================================ */
/* AULA - CRIMINOLOGIA */
/* ============================================ */

.aula-header-inline {
    text-align: center;
    border-bottom: 3px solid #1b4a6b;
    padding-bottom: 20px;
    margin-bottom: 28px;
}

.badge-aula {
    display: inline-block;
    background: #1b4a6b;
    color: #fff;
    font-size: 0.85rem;
    font-weight: 700;
    padding: 6px 24px;
    border-radius: 30px;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 12px;
}

.aula-titulo-principal {
    font-size: 2.2rem;
    color: #0b1a33;
    margin-bottom: 6px;
}

.visao-geral-box {
    background: #f0f4fa;
    padding: 16px 24px;
    border-radius: 10px;
    border-left: 6px solid #f5b042;
    text-align: left;
    font-size: 1.05rem;
    line-height: 1.8;
    color: #2c3e50;
    margin-top: 6px;
}

.visao-geral-box strong {
    color: #1b4a6b;
}

.aula-content h2 {
    font-size: 1.5rem;
    color: #1b4a6b;
    margin-top: 32px;
    margin-bottom: 14px;
    padding-left: 14px;
    border-left: 5px solid #1b4a6b;
}

.aula-content h3 {
    font-size: 1.2rem;
    color: #2c3e50;
    margin-top: 22px;
    margin-bottom: 8px;
}

.aula-content h4 {
    font-size: 1.1rem;
    color: #1b4a6b;
    margin-top: 18px;
    margin-bottom: 6px;
}

.aula-content p {
    font-size: 1.05rem;
    line-height: 1.8;
    margin-bottom: 14px;
    color: #2c3e50;
}

.aula-content ul {
    padding-left: 28px;
    margin-bottom: 16px;
}

.aula-content ul li {
    font-size: 1.02rem;
    line-height: 1.8;
    margin-bottom: 4px;
    color: #2c3e50;
}

.grid-comparativo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin: 16px 0 22px 0;
}

.card-comparativo {
    background: #f8fafc;
    border: 1px solid #dce3ec;
    border-radius: 10px;
    padding: 18px 22px;
}

.card-comparativo h4 {
    font-size: 1.05rem;
    color: #1b4a6b;
    border-bottom: 2px solid #dce3ec;
    padding-bottom: 8px;
    margin-bottom: 10px;
}

.card-comparativo ul {
    padding-left: 20px;
    margin-bottom: 0;
}

.card-comparativo ul li {
    font-size: 0.98rem;
}

.tabela-criminologia {
    width: 100%;
    border-collapse: collapse;
    margin: 16px 0 24px 0;
    font-size: 0.95rem;
}

.tabela-criminologia th {
    background: #1b4a6b;
    color: #fff;
    padding: 10px 16px;
    text-align: left;
    font-weight: 600;
}

.tabela-criminologia td {
    padding: 10px 16px;
    border-bottom: 1px solid #e8ecf1;
    vertical-align: top;
}

.tabela-criminologia tr:nth-child(even) {
    background: #f8fafc;
}

.tabela-criminologia tr:hover {
    background: #eef3f9;
}

.box-perguntas {
    background: #f4f7fc;
    border-left: 5px solid #1b4a6b;
    padding: 14px 20px;
    border-radius: 8px;
    margin: 14px 0 20px 0;
}

.box-perguntas strong {
    color: #1b4a6b;
}

.mapa-mental {
    background: #f4f7fc;
    border-radius: 12px;
    padding: 20px 24px;
    border: 1px solid #dce3ec;
    font-size: 0.95rem;
    line-height: 1.9;
    overflow-x: auto;
}

.mapa-mental pre {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    white-space: pre-wrap;
    margin: 0;
    color: #1e2f3f;
}

.faq-item {
    background: #f4f7fc;
    border-radius: 10px;
    padding: 14px 20px;
    border-left: 5px solid #f5b042;
    margin-bottom: 12px;
}

.faq-pergunta {
    font-weight: 700;
    color: #1b4a6b;
    margin-bottom: 2px;
}

.faq-resposta {
    margin-bottom: 0;
}

.box-fique-atento {
    background: #eaf7ef;
    border-radius: 10px;
    padding: 14px 22px;
    border-left: 5px solid #2a7a3a;
    margin: 18px 0;
}

.box-fique-atento strong {
    color: #1e7a3a;
    display: block;
    margin-bottom: 4px;
}

.box-fique-atento ul {
    margin-bottom: 0;
    padding-left: 22px;
}

.exercicio-item {
    background: #f8fafc;
    border: 1px solid #dce3ec;
    border-radius: 10px;
    padding: 16px 22px;
    margin-bottom: 16px;
}

.exercicio-item p:first-child {
    font-weight: 700;
    color: #1b4a6b;
}

.exercicio-item p em {
    font-style: italic;
}

.aula-footer {
    margin-top: 32px;
    padding-top: 16px;
    border-top: 2px solid #dce3ec;
    text-align: center;
    font-size: 0.9rem;
    color: #5a6f82;
}

@media (max-width: 768px) {
    .grid-comparativo {
        grid-template-columns: 1fr;
    }
    .aula-titulo-principal {
        font-size: 1.6rem;
    }
    .tabela-criminologia {
        font-size: 0.85rem;
    }
    .tabela-criminologia th,
    .tabela-criminologia td {
        padding: 6px 10px;
    }
    .aula-content {
        padding: 0 10px;
    }
}




/* ============================================ */
/* AULA 02 - CRIMINOLOGIA */
/* ============================================ */

.box-sumario {
    background: #f4f7fc;
    border: 1px solid #dce3ec;
    border-radius: 10px;
    padding: 16px 24px;
    margin: 20px 0 28px 0;
}

.box-sumario p {
    font-weight: 700;
    color: #1b4a6b;
    margin-bottom: 6px;
}

.box-sumario ul {
    margin-bottom: 0;
    padding-left: 24px;
}

.box-sumario ul li {
    font-size: 1rem;
    line-height: 1.8;
    color: #2c3e50;
}

/* Demais estilos já estão no CSS da Aula 01 */



 .aulas-wrapper {
        max-width: 1000px;
        margin: 2.5rem auto;
        padding: 2rem 2.5rem;
        background: #ffffff;
        border-radius: 32px;
        box-shadow: 0 20px 60px -12px rgba(0, 20, 50, 0.12), 0 8px 24px -6px rgba(0, 0, 0, 0.02);
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
        position: relative;
        overflow: hidden;
        border-top: 6px solid transparent;
        border-image: linear-gradient(135deg, #2563eb, #7c3aed) 1;