:root {
    color-scheme: light dark;
    --background: #fbf6ed;
    --surface: #fffdf8;
    --text: #29231e;
    --muted: #63584f;
    --accent: #813c28;
    --rule: #d8c8b9;
}

@media (prefers-color-scheme: dark) {
    :root {
        --background: #211c19;
        --surface: #2c2521;
        --text: #f4e9df;
        --muted: #c9b9aa;
        --accent: #ffb497;
        --rule: #675347;
    }
}

* { box-sizing: border-box; }
body {
    margin: 0;
    background: var(--background);
    color: var(--text);
    font: 1rem/1.8 system-ui, sans-serif;
    overflow-wrap: anywhere;
}
a { color: var(--accent); text-underline-offset: .2em; }
a:focus-visible { outline: .15rem solid var(--accent); outline-offset: .22rem; }
.wrap { width: min(44rem, 100% - 2.5rem); margin-inline: auto; }
.skip { position: absolute; inset-inline-start: 1rem; top: -8rem; padding: .5rem; background: var(--surface); }
.skip:focus { top: 1rem; }
header { border-bottom: 1px solid var(--rule); }
header .wrap { padding-block: .9rem; }
.brand { color: var(--text); font-weight: 750; text-decoration: none; }
nav ul { display: flex; flex-wrap: wrap; gap: .25rem 1rem; margin: .5rem 0 0; padding: 0; list-style: none; }
nav a { display: inline-block; padding-block: .25rem; }
nav [aria-current="page"] { font-weight: 700; }
main { padding-block: clamp(2rem, 6vw, 4rem); }
h1, h2 { line-height: 1.4; }
h1 { margin: 0 0 1rem; font-size: clamp(1.5rem, 5vw, 2.4rem); text-wrap: balance; }
h2 { margin: 2.2rem 0 .6rem; font-size: 1.25rem; }
p { margin: .75rem 0; }
li + li { margin-top: .35rem; }
nav li + li { margin-top: 0; }
.lead { color: var(--muted); }
.contact, .document-list a {
    display: block;
    padding: .8rem 1rem;
    background: var(--surface);
    border: 1px solid var(--rule);
    border-radius: .5rem;
}
.document-list { margin: 1.5rem 0 0; padding: 0; list-style: none; }
.document-list li + li { margin-top: .65rem; }
footer { border-top: 1px solid var(--rule); color: var(--muted); padding-block: .9rem; }