@font-face {
    font-family: "trajan-pro";
    src: url("trajan-pro.woff2") format("woff2");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root {
    --bg: #fdfcfa;
    --text: #0d0e0c;
    --accent: #53A200;
    --accent-bg: #f8fcef;
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg: #1f201e;
        --text: #fdfaf8;
        --accent: #fb8908;
        --accent-bg: #2f2922;
    }
}

.icon {
    display: inline-block;
    vertical-align: middle;
    width: 1em;
    height: 1em;

    path {
        fill: var(--text);
    }
}

header>img,
header>a>img,
h2 {
    margin-top: 2rem;
}

h1,
h2 {
    font-family: "trajan-pro";
}

h1 {
    font-size: 2.2rem;
}

h2 {
    font-size: 2rem;
}


@media (min-width: 720px) {
    .split {
        columns: 2;
        column-gap: 2rem;
    }
}

@view-transition {
    navigation: auto;
}