/*
 * Page content
 * Template: page.php
 * Auto-enqueued by functions.php after css/theme.css.
 *
 * The single reading column page.php uses for editor content on pages
 * with no Page Builder rows (privacy policy, terms and the like).
 * Measure and heading rhythm follow the Knowledge Hub resource body
 * (single-kh-resource.css); the rules below cover the elements the
 * classic editor produces that the base stylesheet does not style.
 */

.page-content {
    --section-pad: var(--space-2xl);
}

.page-content__prose {
    max-width: 44rem;
    margin-inline: auto;
    font-weight: var(--font-light);
    overflow-wrap: anywhere;
}

.page-content__prose > :first-child {
    margin-block-start: 0;
}

.page-content__prose > :last-child {
    margin-block-end: 0;
}

.page-content__prose h2,
.page-content__prose h3,
.page-content__prose h4 {
    margin-block: var(--space-lg) var(--space-sm);
}

.page-content__prose h2 {
    font-size: var(--text-2);
}

.page-content__prose h3 {
    font-size: var(--text-1);
}

.page-content__prose h4 {
    font-size: var(--text-0);
}

.page-content__prose p,
.page-content__prose ul,
.page-content__prose ol {
    margin-block: 0 var(--space-md);
}

.page-content__prose ul,
.page-content__prose ol {
    padding-inline-start: var(--space-md);
}

.page-content__prose li + li {
    margin-block-start: var(--space-2xs);
}

.page-content__prose a {
    color: var(--color-secondary);
    text-decoration: underline;
    transition: color 0.3s ease-in-out;
}

.page-content__prose a:hover {
    color: var(--color-primary);
}

.page-content__prose strong {
    font-weight: var(--font-regular);
}

.page-content__prose blockquote {
    margin: 0 0 var(--space-md);
    padding-inline-start: var(--space-md);
    border-inline-start: 4px solid var(--color-contrast);
}

.page-content__prose img {
    max-width: 100%;
    height: auto;
    border-radius: .5rem;
}

.page-content__prose table {
    width: 100%;
    margin-block: 0 var(--space-md);
    border-collapse: collapse;
    font-size: var(--text--1);
}

.page-content__prose th,
.page-content__prose td {
    padding: var(--space-2xs) var(--space-xs);
    text-align: left;
    vertical-align: top;
    border-bottom: 2px solid var(--color-contrast);
}

.page-content__prose th {
    font-weight: var(--font-regular);
    color: var(--color-primary);
}

.page-content__prose hr {
    margin-block: var(--space-lg);
    border: 0;
    border-top: 2px solid var(--color-contrast);
}