@font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: italic;
    font-weight: 300;
    src: url("/frontpage/fonts/lato-v24-latin-300italic.woff2") format("woff2")
}

@font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: normal;
    font-weight: 400;
    src: url("/frontpage/fonts/lato-v24-latin-regular.woff2") format("woff2")
}

@font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: italic;
    font-weight: 400;
    src: url("/frontpage/fonts/lato-v24-latin-italic.woff2") format("woff2")
}

@font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: normal;
    font-weight: 700;
    src: url("/frontpage/fonts/lato-v24-latin-700.woff2") format("woff2")
}

*,
*::before,
*::after {
    box-sizing: border-box
}

* {
    margin: 0;
    padding: 0;
    font: inherit;
    border: none
}

html {
    color-scheme: dark light;
    -webkit-text-size-adjust: 100%;
    hanging-punctuation: first last
}

input,
textarea {
    hanging-punctuation: none
}

body,
html {
    scrollbar-gutter: stable
}

img,
picture,
svg {
    display: block;
    height: auto
}

video {
    display: block;
    width: 100%;
    height: auto
}

@media(prefers-reduced-motion: no-preference) {
    :has(:target) {
        scroll-behavior: smooth;
        scroll-padding-top: 56px
    }
}

h1,
h2,
h3,
h4,
h5,
h6 {
    text-wrap: balance
}

p {
    text-wrap: pretty
}

strong,
b {
    font-weight: bold
}

em,
i,
dfn {
    font-style: italic
}

abbr[title] {
    text-decoration: underline;
    text-decoration-color: #b3b3b3;
    text-decoration-style: dotted;
    text-decoration-thickness: .06em;
    text-underline-offset: .25em;
    text-decoration-skip-ink: auto;
    cursor: help
}

q:lang(de) {
    quotes: "„" "“" "‚" "‘"
}

q:lang(en) {
    quotes: "“" "”" "‘" "’"
}

textarea {
    overflow: auto;
    resize: vertical
}

label,
input[type=button],
input[type=submit],
button {
    color: inherit;
    font: inherit;
    cursor: pointer
}

:focus {
    outline: 0;
    outline: none
}

:root {
    --gbdLogoBlue: hsl(204, 100%, 36%)
}

@media(prefers-reduced-motion: no-preference) {
    @view-transition {
        navigation: auto
    }
}

body {
    padding: min(5em, 10vw);
    font-size: clamp(1rem, calc(0.2vw + 1rem), 1.125rem);
    font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-style: normal;
    line-height: 1.38;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

h1 {
    color: var(--gbdLogoBlue);
    font-size: 1.4rem;
    font-weight: 700;
    margin-bottom: 1em
}

a {
    color: var(--gbdLogoBlue);
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    text-decoration: none;
    cursor: pointer;
    display: inline-block;
    position: relative;
    z-index: 1;
    transition: all 140ms ease-out
}

a::before {
    content: "";
    background: rgba(0, 134, 201, .3);
    display: block;
    position: absolute;
    z-index: -1;
    top: -1px;
    left: -5px;
    right: -5px;
    bottom: -3px;
    opacity: 0;
    transform: scale(0.8);
    border-radius: .2em;
    box-shadow: 0 4px 15px rgba(0, 93, 151, .2);
    transition: all 300ms cubic-bezier(0.57, 1.77, 0.55, 1)
}

a:hover,
a:focus-visible {
    outline: 0
}

a:hover::before,
a:focus-visible::before {
    opacity: 1;
    transform: scale(1)
}

a:active,
a:hover {
    outline: 0
}

a:focus-visible {
    outline: 2px solid var(--gbdLogoBlue);
    outline-offset: .3em;
    border-radius: .1em
}

ul {
    list-style-type: none;
    margin-bottom: 1.38em
}

ul:last-child {
    margin-bottom: 0
}

li {
    position: relative;
    letter-spacing: .01em;
    padding: 0 0 .6em 2.3em;
    break-inside: avoid;
    page-break-inside: avoid;
    column-break-inside: avoid;
}

li::before {
    content: "";
    background-color: transparent;
    background-image: url("/frontpage/bullet.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 1.4em;
    height: 1.4em;
    position: absolute;
    top: 0;
    left: .1em
}