:root {
    --font-body: 'Be Vietnam Pro', Arial, sans-serif;
    --font-heading: 'Merriweather', Georgia, serif;
}

body {
    font-family: var(--font-body);
}

button,
input,
select,
textarea {
    font-family: var(--font-body);
}

.brand-name,
.hero-title,
.section-title,
.single-course-title,
main article > h1,
.course-entry-body h2,
.course-entry-body h3,
.course-entry-body h4 {
    font-family: var(--font-heading);
    font-weight: 700;
    font-optical-sizing: auto;
    line-height: 1.45;
    letter-spacing: 0;
}

.single-course-title,
main article > h1 {
    font-size: clamp(26px, 2.4vw, 34px) !important;
    margin-bottom: 20px;
}

.course-entry-body {
    font-family: var(--font-body);
    font-size: 18px !important;
    line-height: 1.85 !important;
    color: #334155;
}

.course-entry-body p {
    margin: 0 0 1.1em;
}

.course-entry-body h2 {
    font-size: clamp(23px, 2vw, 29px);
    margin: 1.5em 0 0.7em;
}

.course-entry-body h3 {
    font-size: clamp(20px, 1.7vw, 24px);
    margin: 1.4em 0 0.7em;
}

.course-entry-body h4 {
    font-size: 19px;
}

.course-entry-body :is(ul, ol) {
    padding-left: 1.45em;
    margin: 0 0 1.1em;
}

.course-entry-body ul {
    list-style: disc outside;
}

.course-entry-body ol {
    list-style: decimal outside;
}

.course-entry-body li {
    padding-left: 0.15em;
    margin: 0 0 0.65em;
}

.course-entry-body li::marker {
    color: #927334;
}

.course-entry-body li > :is(ul, ol) {
    margin-top: 0.6em;
    margin-bottom: 0;
}

.course-entry-body ul ul {
    list-style-type: circle;
}

@media (max-width: 768px) {
    .site-header .brand-text {
        gap: 4px;
        padding-block: 3px;
    }

    .site-header .brand-prefix {
        line-height: 1.5;
        margin-bottom: 0;
    }

    .site-header .brand-text .site-title {
        line-height: 1.5;
        padding-block: 1px;
        margin: 0;
        font-weight: 700;
    }

    .course-entry-body {
        font-size: 17px !important;
        line-height: 1.8 !important;
    }

    .single-course-title,
    main article > h1 {
        font-size: clamp(23px, 5.8vw, 28px) !important;
    }
}
