:root {
    color-scheme: light;
    --background: #f7f8f4;
    --surface-raised: #ffffff;
    --text-primary: #17211a;
    --text-muted: #5d6a61;
    --border-color: #dce2dc;
    --accent-background: #1d5b3a;
    --accent-foreground: #ffffff;
    --focus-background: #17211a;
    --focus-foreground: #ffffff;
    --error-background: #8c1d18;
    --error-foreground: #ffffff;
    --success-foreground: #176437;
    --shadow-color: rgb(23 33 26 / 18%);
    --brand-foreground: var(--text-primary);
    --brand-mark-background: var(--accent-background);
    --brand-mark-foreground: var(--accent-foreground);
    --navigation-foreground: var(--text-muted);
    --navigation-active-background: #e1eee6;
    --navigation-active-foreground: #174c31;
    --section-label-foreground: var(--success-foreground);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    background: var(--background);
    color: var(--text-primary);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    margin: 0;
}

a,
button,
summary {
    font: inherit;
}

a:focus-visible,
button:focus-visible,
summary:focus-visible {
    outline: 3px solid var(--text-primary);
    outline-offset: 3px;
}

h1:focus {
    outline: none;
}

.eyebrow {
    color: var(--success-foreground);
    font-size: .82rem;
    font-weight: 800;
    letter-spacing: .12em;
    margin: 0;
    text-transform: uppercase;
}

.button-link {
    align-items: center;
    background: transparent;
    border: 1px solid var(--border-color);
    border-radius: .8rem;
    color: var(--text-primary);
    cursor: pointer;
    display: inline-flex;
    font-weight: 750;
    justify-content: center;
    min-height: 2.75rem;
    padding: .7rem 1rem;
    text-decoration: none;
}

.button-link:hover {
    border-color: var(--text-primary);
}

.button-link--primary {
    background: var(--accent-background);
    border-color: var(--accent-background);
    color: var(--accent-foreground);
}

.not-found {
    max-width: 38rem;
}

.not-found h1 {
    font-size: clamp(2.2rem, 6vw, 4rem);
}