/* Shared article blocks: accessible preset backgrounds and text colours. */
.article-body,
.tiptap {
    font-family: "Segoe UI", Arial, sans-serif;
}
.article-body blockquote,
.tiptap blockquote,
.article-callout {
    --block-bg: #fcf0ef;
    --block-text: #613633;
    --block-edge: #b70101;
    background: var(--block-bg);
    color: var(--block-text);
    border: 0;
    border-left: 4px solid var(--block-edge);
    border-radius: 0 10px 10px 0;
    padding: 22px 26px;
    margin: 28px 0;
    font-family: "Segoe UI", Arial, sans-serif;
    font-size: 19px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.7;
}
[data-tone="sage"] {
    --block-bg: #eef4eb;
    --block-text: #344b36;
    --block-edge: #557852;
}
[data-tone="blue"] {
    --block-bg: #edf3fc;
    --block-text: #294663;
    --block-edge: #4274aa;
}
[data-tone="sand"] {
    --block-bg: #faf2e4;
    --block-text: #634d2e;
    --block-edge: #aa7f39;
}
[data-tone="neutral"] {
    --block-bg: #f2f3f5;
    --block-text: #41434a;
    --block-edge: #757a85;
}
.article-body [data-tone="sage"],
.tiptap [data-tone="sage"] {
    --block-bg: #eef4eb;
    --block-text: #344b36;
    --block-edge: #557852;
}
.article-body [data-tone="blue"],
.tiptap [data-tone="blue"] {
    --block-bg: #edf3fc;
    --block-text: #294663;
    --block-edge: #4274aa;
}
.article-body [data-tone="sand"],
.tiptap [data-tone="sand"] {
    --block-bg: #faf2e4;
    --block-text: #634d2e;
    --block-edge: #aa7f39;
}
.article-body [data-tone="neutral"],
.tiptap [data-tone="neutral"] {
    --block-bg: #f2f3f5;
    --block-text: #41434a;
    --block-edge: #757a85;
}
.article-body blockquote p,
.tiptap blockquote p,
.article-callout p {
    color: inherit;
    font-size: inherit;
    line-height: inherit;
}
.article-callout {
    border-left: 0;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 400;
}
.article-callout h2,
.article-callout h3 {
    font-family: inherit;
    color: inherit;
    font-style: normal;
}
.article-callout > :first-child,
blockquote > :first-child {
    margin-top: 0;
}
.article-callout > :last-child,
blockquote > :last-child {
    margin-bottom: 0;
}
@media (max-width: 760px) {
    .article-body blockquote,
    .tiptap blockquote,
    .article-callout {
        padding: 20px;
        font-size: 17px;
    }
}

a.article-attachment {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .8rem;
    margin: 1.25rem 0;
    padding: .9rem 1rem;
    border: 1px solid #cdd8e6;
    border-radius: .65rem;
    background: #f4f7fb;
    color: #203554;
    text-decoration: none;
}
.article-attachment strong { flex: 1 1 9rem; overflow-wrap: anywhere; }
.attachment-type { background: #dee8f6; padding: .35rem .55rem; border-radius: .3rem; font: 700 .75rem/1.5 system-ui; overflow-wrap: anywhere; }
.attachment-open { color: #345b91; font-size: .85rem; }
a.article-attachment:hover { background: #eaf0f8; }
a.article-attachment:focus-visible { outline: 2px solid #315da0; outline-offset: 3px; }