/* Leitura confortável nos posts do blog */

.axil-post-details {
    --leitura-texto: #1f2328;
    --leitura-suave: #57606a;
    color: var(--leitura-texto);
}

/* Linha com ~70 caracteres: o olho não se perde ao voltar para o início. */
.axil-post-details .axil-post-details-content,
.axil-post-details > p,
.axil-post-details > ul,
.axil-post-details > ol {
    max-width: 720px;
}

.axil-post-details p,
.axil-post-details li {
    font-size: 19px;
    line-height: 1.7;
    color: var(--leitura-texto);
}

/* O tema usa 40px entre parágrafos: separa demais o raciocínio. */
.axil-post-details p {
    margin: 0 0 1.4em;
}

.axil-post-details ul,
.axil-post-details ol {
    margin: 0 0 1.4em;
    padding-left: 1.4em;
}

.axil-post-details li {
    margin-bottom: 0.5em;
}

/* Títulos: mais respiro antes, menos depois, para agrupar com o texto. */
.axil-post-details h2,
.axil-post-details h3,
.axil-post-details h4 {
    line-height: 1.3;
    margin: 1.8em 0 0.6em;
    color: var(--color-heading);
}

.axil-post-details h2 { font-size: 30px; }
.axil-post-details h3 { font-size: 24px; }
.axil-post-details h4 { font-size: 20px; }

/* Links visíveis sem depender só da cor (acessibilidade). */
.post-single-wrapper .axil-post-details p a,
.post-single-wrapper .axil-post-details li a {
    text-decoration: underline !important;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.post-single-wrapper .axil-post-details a:focus-visible {
    outline: 2px solid var(--color-primary) !important;
    outline-offset: 2px;
}

/* Citações e destaques */
.axil-post-details blockquote {
    border-left: 4px solid var(--color-primary);
    padding: 0.4em 0 0.4em 1.2em;
    margin: 1.6em 0;
    font-style: italic;
    color: var(--leitura-suave);
}

/* Imagens e tabelas nunca estouram a tela no celular. */
.axil-post-details img {
    max-width: 100%;
    height: auto;
}

.axil-post-details figcaption {
    font-size: 15px;
    color: var(--leitura-suave);
    text-align: center;
}

.axil-post-details table {
    display: block;
    overflow-x: auto;
    font-size: 16px;
}

@media (max-width: 767px) {
    .axil-post-details p,
    .axil-post-details li {
        font-size: 17px;
        line-height: 1.65;
    }
    .axil-post-details h2 { font-size: 24px; }
    .axil-post-details h3 { font-size: 20px; }
}