/* Shared article styles. These do not depend on Tailwind Typography or JavaScript. */
.article-content,
.post-content {
    color: #374151;
    font-size: clamp(1.0625rem, 1rem + 0.2vw, 1.125rem);
    line-height: 1.72;
    margin-inline: auto;
    max-width: 72ch;
    overflow-wrap: anywhere;
}

.article-content > :first-child,
.post-content > :first-child { margin-top: 0; }

.article-content > :last-child,
.post-content > :last-child { margin-bottom: 0; }

.article-content h2,
.article-content h3,
.article-content h4,
.article-content h5,
.article-content h6,
.post-content h2,
.post-content h3,
.post-content h4,
.post-content h5,
.post-content h6 {
    color: #111827;
    font-weight: 700;
    line-height: 1.25;
    scroll-margin-top: 6rem;
    text-wrap: balance;
}

.article-content h2,
.post-content h2 {
    font-size: clamp(1.65rem, 1.4rem + 1vw, 2.25rem);
    margin: 3rem 0 1rem;
}

.article-content h3,
.post-content h3 {
    font-size: clamp(1.35rem, 1.2rem + 0.65vw, 1.75rem);
    margin: 2.4rem 0 0.8rem;
}

.article-content h4,
.post-content h4 {
    font-size: clamp(1.15rem, 1.08rem + 0.35vw, 1.4rem);
    margin: 2rem 0 0.65rem;
}

.article-content h5,
.article-content h6,
.post-content h5,
.post-content h6 {
    font-size: 1.05rem;
    margin: 1.75rem 0 0.6rem;
}

.article-content p,
.post-content p { margin: 0 0 1.35rem; }

.article-content ul,
.article-content ol,
.post-content ul,
.post-content ol {
    margin: 0 0 1.5rem;
    padding-left: 1.6rem;
}

.article-content ul,
.post-content ul { list-style: disc; }

.article-content ol,
.post-content ol { list-style: decimal; }

.article-content li,
.post-content li {
    margin: 0.45rem 0;
    padding-left: 0.2rem;
}

.article-content li::marker,
.post-content li::marker {
    color: #486581;
    font-weight: 700;
}

.article-content li > ul,
.article-content li > ol,
.post-content li > ul,
.post-content li > ol { margin: 0.5rem 0 0; }

.article-content a,
.post-content a {
    color: #0369a1;
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.16em;
}

.article-content a:hover,
.post-content a:hover { color: #0c4a6e; }

.article-content strong,
.post-content strong {
    color: #1f2937;
    font-weight: 700;
}

.article-content blockquote,
.post-content blockquote {
    background: #f0f7ff;
    border-left: 0.25rem solid #486581;
    border-radius: 0 0.5rem 0.5rem 0;
    color: #334155;
    margin: 2rem 0;
    padding: 1.2rem 1.35rem;
}

.article-content blockquote > :last-child,
.post-content blockquote > :last-child { margin-bottom: 0; }

.article-content hr,
.post-content hr {
    border: 0;
    border-top: 1px solid #d9e2ec;
    margin: 2.5rem 0;
}

.article-content :not(pre) > code,
.post-content :not(pre) > code {
    background: #f1f5f9;
    border-radius: 0.3rem;
    color: #243b53;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.88em;
    padding: 0.15em 0.35em;
}

.article-content pre,
.post-content pre {
    background: #111827;
    border-radius: 0.75rem;
    color: #f8fafc;
    margin: 1.75rem 0;
    max-width: 100%;
    overflow-x: auto;
    padding: 1.25rem;
    white-space: pre;
}

.article-content pre code,
.post-content pre code {
    background: transparent;
    color: inherit;
    padding: 0;
}

.article-content table,
.post-content table {
    border: 1px solid #d9e2ec;
    border-collapse: collapse;
    border-radius: 0.65rem;
    display: block;
    font-size: 0.92rem;
    line-height: 1.5;
    margin: 2rem 0;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    width: 100%;
}

.article-content th,
.article-content td,
.post-content th,
.post-content td {
    border-bottom: 1px solid #d9e2ec;
    min-width: 8.5rem;
    padding: 0.8rem 0.9rem;
    text-align: left;
    vertical-align: top;
}

.article-content th,
.post-content th {
    background: #102a43;
    color: #fff;
    font-weight: 700;
}

.article-content tbody tr:nth-child(even),
.post-content tbody tr:nth-child(even) { background: #f8fafc; }

.article-content tbody tr:last-child td,
.post-content tbody tr:last-child td { border-bottom: 0; }

.article-content img,
.article-content video,
.article-content iframe,
.post-content img,
.post-content video,
.post-content iframe {
    height: auto;
    margin: 2rem auto;
    max-width: 100%;
}

.article-content img,
.post-content img { border-radius: 0.75rem; }

.article-content figure,
.post-content figure {
    margin: 2rem 0;
    max-width: 100%;
}

.article-content figcaption,
.post-content figcaption {
    color: #64748b;
    font-size: 0.9rem;
    margin-top: 0.6rem;
    text-align: center;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid #0ea5e9;
    outline-offset: 3px;
}

#contactModal { overflow-y: auto; }

#contactModal > * {
    max-height: calc(100dvh - 2rem);
    overflow-y: auto;
}

@media (max-width: 480px) {
    .article-content,
    .post-content {
        font-size: 1.0625rem;
        line-height: 1.68;
    }

    .article-content blockquote,
    .post-content blockquote { padding: 1rem; }

    .article-content th,
    .article-content td,
    .post-content th,
    .post-content td {
        min-width: 7.5rem;
        padding: 0.7rem;
    }
}

@media (max-width: 640px) {
    .whatsapp-float.whatsapp-mobile-hidden {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

@media print {
    .article-content,
    .post-content {
        color: #000;
        font-size: 11pt;
        max-width: none;
    }

    .article-content table,
    .post-content table {
        display: table;
        overflow: visible;
    }
}

/* Shared scope notice: one wording across the request journey. */
.consulta-alcance { font-size: 1rem; line-height: 1.65; }
.consulta-alcance p + p { margin-top: 1rem; }
