/**
 * SRPC base typography
 *
 * Applies the scale in tokens.css. Kept separate so the tokens file stays a
 * pure declaration of values and this file holds the decisions about where
 * they land.
 */

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

body {
    font-size: var(--srpc-text-md);
    line-height: var(--srpc-leading-body);
    color: var(--srpc-ink);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--srpc-font-display);
    color: var(--srpc-navy);
    line-height: var(--srpc-leading-tight);
    letter-spacing: -0.015em;
    text-wrap: balance;
    margin-top: 0;
}

h1 { font-size: var(--srpc-text-3xl); font-weight: 700; }
h2 { font-size: var(--srpc-text-2xl); font-weight: 700; }
h3 { font-size: var(--srpc-text-xl);  font-weight: 600; line-height: var(--srpc-leading-snug); }
h4 { font-size: var(--srpc-text-lg);  font-weight: 600; line-height: var(--srpc-leading-snug); }
h5 { font-size: var(--srpc-text-md);  font-weight: 600; letter-spacing: 0; }

h6 {
    font-size: var(--srpc-text-sm);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--srpc-steel);
}

/* The Events Calendar overrides live in events-calendar.css — the plugin
   ships a whole visual system and fighting it needs a file of its own. */

/* Running text gets a comfortable measure. Scoped to the content area so it
   never constrains layout widgets or the sidebar. */
#content p,
#content li {
    max-width: var(--srpc-measure);
}

#content p {
    margin: 0 0 1.1em;
}

a {
    color: var(--srpc-orange-deep);
    text-underline-offset: 0.15em;
}

a:hover,
a:focus {
    color: var(--srpc-orange);
}

:focus-visible {
    outline: 3px solid var(--srpc-orange);
    outline-offset: 2px;
    border-radius: 2px;
}

strong, b { font-weight: 600; }

small {
    font-size: var(--srpc-text-sm);
    color: var(--srpc-steel);
}

hr {
    border: 0;
    border-top: 1px solid var(--srpc-rule);
    margin: 2rem 0;
}

blockquote {
    border-left: 3px solid var(--srpc-orange);
    margin: 1.5rem 0;
    padding: 0.2rem 0 0.2rem 1.1rem;
    color: var(--srpc-ink-soft);
}

/* Digits that sit in columns should line up. */
table { font-variant-numeric: tabular-nums; }