.article {
    hyphens: auto;
}

.article a {
    color: var(--color-text);

    text-decoration: none;
    border-bottom: 1px solid var(--color-link);
}

.article a:hover {
    border-bottom: 2px solid var(--color-text);
}

.article a:active {
    border-width: 2px;
}

.article h1 {
    margin-bottom: var(--size-l);
}

.article h2 {
    margin-top: var(--size-xl);
    margin-bottom: var(--size-l);
}

.article ul {
    margin-left: var(--size-s);
    margin-bottom: var(--size-m);

    list-style: disc;
}

.article ol {
    margin-left: var(--size-s);
    margin-bottom: var(--size-m);
}

.article li {
    margin-bottom: var(--size-s);
    line-height: var(--article-line-height);
    max-width: var(--text-max-width);
}

.article p {
    margin-bottom: var(--size-m);
    line-height: var(--article-line-height);
    max-width: var(--text-max-width);
}

.article blockquote {
    padding: var(--size-m);
    font-size: var(--font-size-accent);
}

.article cite {
    display: block;
    font-size: var(--font-size-default);
    text-align: right;

    margin-top: var(--size-m);
}

.article hr {
    border: 1px solid var(--color-text);
    margin-top: var(--size-m);
    margin-bottom: var(--size-m);
}

@media (max-width: 31.25em){
    .article blockquote {
        padding: 0
    }
}