/* SCMS Starter — Typography */

body {
    font-family:  var(--font-primary);
    font-size:    var(--text-base);
    line-height:  var(--line-height-base);
    color:        var(--color-text);
    background:   var(--color-bg);
}

h1, h2, h3, h4, h5, h6 {
    font-family:    var(--font-primary);
    line-height:    var(--line-height-heading);
    color:          var(--color-text);
    margin-top:     0;
    margin-bottom:  0.5em;
}
h1 { font-size: var(--text-4xl); }
h2 { font-size: var(--text-3xl); }
h3 { font-size: var(--text-2xl); }
h4 { font-size: var(--text-xl); }
h5 { font-size: var(--text-lg); }
h6 { font-size: var(--text-md); }

p { margin-top: 0; margin-bottom: 1em; }

a {
    color:            var(--color-primary);
    text-decoration:  underline;
    transition:       color var(--transition-base);
}
a:hover { color: var(--color-primary-dark); }

strong, b { font-weight: 700; }
em, i     { font-style: italic; }

ul, ol { padding-left: 1.5rem; margin-bottom: 1em; }
li { margin-bottom: 0.25em; }

blockquote {
    border-left:  4px solid var(--color-primary);
    margin:       0 0 1em;
    padding:      0.5em 0 0.5em 1.5em;
    font-style:   italic;
    color:        var(--color-dark-grey);
}

/* Section title used across all blocks */
.section_title {
    margin-bottom: var(--space-lg);
    text-align:    center;
}
.section_title h2 {
    color: var(--color-primary);
}

/* h2 override helper */
.h2 { font-size: var(--text-3xl); }