html, body {
    height: 100%;
    margin: 0;
    scroll-behavior: smooth;
}

body {
    font-family: "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background-color: var(--bcl-cream-100);
    color: var(--bcl-ink);
    display: flex;
    flex-direction: column;
}

main {
    flex: 1;
}

h1, h2, h3, h4, h5 {
    color: var(--bcl-ink);
}

h1, h2, .display-heading {
    font-family: "Fraunces", Georgia, serif;
    letter-spacing: 0;
    text-wrap: balance;
}

p {
    color: var(--bcl-ink);
    line-height: 1.7;
    text-wrap: pretty;
}

.text-muted, .small, .caption {
    color: var(--bcl-muted) !important;
}

.section-title {
    color: var(--bcl-forest-700);
}

.skip-link {
    position: absolute;
    left: -999px;
    top: 12px;
    z-index: 9999;
    background: var(--bcl-gold-500);
    color: var(--bcl-forest-950);
    padding: 0.6rem 1rem;
    border-radius: 999px;
}

.skip-link:focus {
    left: 12px;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid rgba(216, 162, 41, 0.65);
    outline-offset: 3px;
}